---
import AchizitiiLayout from '../layouts/AchizitiiLayout.astro';
import { getNationalStats } from '../lib/seap-queries.js';

export const prerender = false;

const national = await getNationalStats();
const fmt = (n: number | string | null | undefined) =>
  n == null ? '–' : new Intl.NumberFormat('ro-RO', { maximumFractionDigits: 0 }).format(Number(n));

const sections = [
  {
    href: '/azi',
    title: 'Azi în România',
    desc: 'Anunțuri publicate astăzi în SEAP / TED. Live feed actualizat continuu.',
    accent: 'state',
  },
  {
    href: '/cauta',
    title: 'Caută în 642K+ anunțuri',
    desc: 'Căutare avansată după CPV, județ, valoare, autoritate, furnizor.',
    accent: 'stamp',
  },
  {
    href: '/risc',
    title: 'Indicatori de risc',
    desc: 'Single-bidder, economii suspect, concentrare, termen scurt, supra-preț.',
    accent: 'signal',
  },
  {
    href: '/top-contracte',
    title: 'Top contracte',
    desc: 'Cele mai mari contracte încheiate, ordonate după valoare.',
    accent: 'stamp',
  },
  {
    href: '/top-firme',
    title: 'Top firme',
    desc: 'Furnizori clasați după valoare totală sau număr de contracte.',
    accent: 'stamp',
  },
  {
    href: '/fonduri-ue',
    title: 'Fonduri UE',
    desc: 'Contracte cofinanțate din fonduri europene — PNRR, Coeziune, etc.',
    accent: 'state',
  },
  {
    href: '/explorer',
    title: 'Explorer',
    desc: 'Vizualizări — top CPV, distribuție pe județe, treemap, sankey, bar race.',
    accent: 'stamp',
  },
];
---

<AchizitiiLayout
  title="Achiziții Publice — Hub date SEAP · vreaudigital.ro"
  description="Hub de explorare a datelor de achiziții publice din România. Caută, filtrează, vezi indicatori de risc."
>
  <main class="bg-page">
    <section class="max-w-content mx-auto px-4 py-12">
      <span class="label-meta">Hub date SEAP · TED · datagov</span>
      <h1 class="font-display text-5xl mt-3 max-w-3xl text-ink">
        Datele de <span class="text-stamp">achiziții publice</span> ale României, accesibile.
      </h1>
      <p class="text-base text-meta mt-4 max-w-2xl">
        642K+ anunțuri din SEAP, TED și data.gov. Cifre actualizate zilnic, indicatori de risc,
        explorare la nivel de UAT, CPV, autoritate sau furnizor.
      </p>

      <div class="flex gap-3 mt-6">
        <a href="/cauta" class="btn-brutal-primary">Caută acum</a>
        <a href="/harta" class="btn-brutal">Vezi harta</a>
      </div>
    </section>

    <section class="max-w-content mx-auto px-4 pb-6">
      <div class="grid grid-cols-2 md:grid-cols-4 gap-3">
        <div class="panel panel-tight">
          <div class="label-meta">Anunțuri totale</div>
          <div class="font-display text-2xl mt-1 text-ink">{fmt(national.total_all)}</div>
        </div>
        <div class="panel panel-tight">
          <div class="label-meta">Autorități</div>
          <div class="font-display text-2xl mt-1 text-ink">{fmt(national.total_authorities)}</div>
        </div>
        <div class="panel panel-tight">
          <div class="label-meta">Furnizori</div>
          <div class="font-display text-2xl mt-1 text-ink">{fmt(national.total_suppliers)}</div>
        </div>
        <div class="panel panel-tight">
          <div class="label-meta">Valoare totală</div>
          <div class="font-display text-2xl mt-1 text-stamp">
            {(Number(national.total_value) / 1e9).toFixed(0)} mld RON
          </div>
        </div>
      </div>
    </section>

    <section class="max-w-content mx-auto px-4 py-8">
      <span class="label-meta">Secțiuni</span>
      <div class="rule-meta" />
      <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3">
        {sections.map((s) => (
          <a href={s.href} class="panel hover:border-stamp transition-colors group">
            <div class={`label-meta text-${s.accent}`}>{s.accent === 'signal' ? 'risc' : s.accent === 'state' ? 'live' : 'date'}</div>
            <div class="font-display text-lg mt-1 text-ink group-hover:text-stamp transition-colors">{s.title}</div>
            <p class="text-sm text-meta mt-2 leading-relaxed">{s.desc}</p>
            <div class="text-stamp text-sm font-semibold mt-3">Deschide →</div>
          </a>
        ))}
      </div>
    </section>
  </main>
</AchizitiiLayout>
