80 lines
3.0 KiB
Svelte
80 lines
3.0 KiB
Svelte
<script lang="ts">
|
|
import type { PageData } from './$types';
|
|
let { data }: { data: PageData } = $props();
|
|
|
|
function scoreClass(prefix: 'seo' | 'geo', n: number) {
|
|
if (n >= 75) return `${prefix}-good`;
|
|
if (n >= 50) return `${prefix}-warn`;
|
|
return `${prefix}-bad`;
|
|
}
|
|
</script>
|
|
|
|
<svelte:head><title>Dashboard — Admin</title></svelte:head>
|
|
|
|
<header class="page-head">
|
|
<p class="kicker">Dashboard</p>
|
|
<h1>Panoramica</h1>
|
|
<p>Contenuti, richieste e salute SEO/GEO della landing page in un colpo d'occhio.</p>
|
|
</header>
|
|
|
|
<div class="grid-4">
|
|
<div class="stat">
|
|
<div class="stat-label">Copy slot</div>
|
|
<div class="stat-value">{data.totalSlots}</div>
|
|
</div>
|
|
<div class="stat">
|
|
<div class="stat-label">Immagini</div>
|
|
<div class="stat-value">{data.totalImages}</div>
|
|
</div>
|
|
<div class="stat">
|
|
<div class="stat-label">Richieste totali</div>
|
|
<div class="stat-value">{data.totalSubmissions}</div>
|
|
</div>
|
|
<div class="stat">
|
|
<div class="stat-label">Regione GEO</div>
|
|
<div class="stat-value" style="font-size:22px;">{data.seo.geoRegion}</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid-2" style="margin-top:18px;">
|
|
<div class="card">
|
|
<h2>Salute SEO</h2>
|
|
<p>Media dei punteggi SEO sui testi principali: lunghezza, leggibilità, keyword primarie.</p>
|
|
<div class="score-row">
|
|
<span class="score-chip {scoreClass('seo', data.scores.seo)}">SEO {data.scores.seo}/100</span>
|
|
<a class="btn btn-ghost btn-sm" href="/admin/copy">Modifica testi</a>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<h2>Salute GEO</h2>
|
|
<p>Media dei punteggi GEO (Generative Engine Optimization): citabilità, entità, dati concreti.</p>
|
|
<div class="score-row">
|
|
<span class="score-chip {scoreClass('geo', data.scores.geo)}">GEO {data.scores.geo}/100</span>
|
|
<a class="btn btn-ghost btn-sm" href="/admin/copy">Analizza e migliora</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card" style="margin-top:18px;">
|
|
<h2>Ultime richieste</h2>
|
|
{#if data.recentSubmissions.length === 0}
|
|
<p>Nessuna richiesta ricevuta al momento.</p>
|
|
{:else}
|
|
<div style="display:flex;flex-direction:column;gap:10px;margin-top:12px;">
|
|
{#each data.recentSubmissions as s}
|
|
<div style="display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);">
|
|
<div>
|
|
<strong style="color:var(--accent-dark);">{s.name}</strong>
|
|
<span style="color:var(--accent);font-size:11px;margin-left:8px;text-transform:uppercase;letter-spacing:0.1em;">{s.dog || '—'}</span>
|
|
<p style="color:var(--text-muted);font-size:13px;margin-top:4px;">{s.message.slice(0, 140)}{s.message.length > 140 ? '…' : ''}</p>
|
|
</div>
|
|
<time style="color:var(--text-muted);font-size:11px;letter-spacing:0.06em;">{new Date(s.createdAt).toLocaleDateString('it-IT')}</time>
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
<div style="margin-top:12px;">
|
|
<a class="btn btn-ghost btn-sm" href="/admin/submissions">Vedi tutte</a>
|
|
</div>
|
|
{/if}
|
|
</div>
|