/** داشبورد مدیریت: خلاصه فروش، نمودار ۱۴ روزه، پرفروش‌ها و هشدارها */
import Link from "next/link";
import { AdminHeader, Card, Empty } from "@/components/admin/ui";
import { faNumber, formatToman } from "@/lib/format";
import { salesReport } from "@/server/admin/reports";
import { ADMIN_SECTIONS } from "@/lib/admin-sections";
import { allowedSections, requireStaffPage } from "@/server/admin/guard";

export const metadata = { title: "داشبورد" };
export const dynamic = "force-dynamic";

const dayLabel = new Intl.DateTimeFormat("fa-IR-u-ca-persian", { day: "numeric", month: "short", timeZone: "Asia/Tehran" });

export default async function AdminDashboard({ searchParams }: { searchParams: Promise<{ denied?: string }> }) {
  const user = await requireStaffPage("/admin");
  const allowed = allowedSections(user);
  const denied = (await searchParams).denied === "1";
  // عضوی که به گزارش فروش دسترسی ندارد: فقط فهرست بخش‌های مجاز خودش
  if (!allowed.includes("dashboard")) {
    const mine = ADMIN_SECTIONS.filter((s) => allowed.includes(s.key));
    return (
      <>
        <AdminHeader title={`خوش آمدید${user.name ? `، ${user.name}` : ""}`} description="بخش‌هایی که به آن‌ها دسترسی دارید" />
        {denied && <p className="mb-4 rounded-xl bg-paper px-4 py-3 text-sm ring-1 ring-ink" role="alert">⚠ به آن بخش دسترسی ندارید. برای دسترسی با مدیر عامل هماهنگ کنید.</p>}
        {mine.length ? (
          <div className="grid grid-cols-2 gap-3 md:grid-cols-4">
            {mine.map((s) => <Link key={s.key} href={s.href} className="rounded-2xl bg-paper p-5 text-sm font-bold hover:ring-1 hover:ring-ink">{s.label}</Link>)}
          </div>
        ) : (
          <Empty>هنوز دسترسی به هیچ بخشی به شما داده نشده است.</Empty>
        )}
      </>
    );
  }
  const r = await salesReport(30);
  const max = Math.max(1, ...r.daily.map((d) => d.revenue));
  const stats = [
    { label: "فروش امروز", value: formatToman(r.todayRevenue), hint: `${faNumber(r.todayCount)} سفارش` },
    { label: "فروش ۳۰ روز", value: formatToman(r.revenue), hint: `${faNumber(r.orderCount)} سفارش` },
    { label: "میانگین هر سفارش", value: formatToman(r.avgOrder), hint: "۳۰ روز اخیر" },
    { label: "در انتظار آماده‌سازی", value: faNumber(r.toProcess), hint: "سفارش پرداخت‌شده", href: "/admin/orders?status=PAID" },
  ];

  return (
    <>
      <AdminHeader title="داشبورد" description="گزارش فروش بر اساس سفارش‌های پرداخت‌شده" />
      {denied && <p className="mb-4 rounded-xl bg-paper px-4 py-3 text-sm ring-1 ring-ink" role="alert">⚠ به آن بخش دسترسی ندارید. برای دسترسی با مدیر عامل هماهنگ کنید.</p>}
      <div className="grid grid-cols-2 gap-3 lg:grid-cols-4">
        {stats.map((s) => {
          const body = (
            <>
              <p className="text-xs text-muted">{s.label}</p>
              <p className="mt-2 text-base font-extrabold break-words sm:text-lg md:text-xl">{s.value}</p>
              <p className="mt-1 text-[11px] text-muted">{s.hint}</p>
            </>
          );
          return s.href ? (
            <Link key={s.label} href={s.href} className="rounded-2xl bg-paper p-4 ring-ink hover:ring-1">{body}</Link>
          ) : (
            <div key={s.label} className="rounded-2xl bg-paper p-4">{body}</div>
          );
        })}
      </div>

      <div className="mt-4 grid gap-4 lg:grid-cols-3">
        <Card title="فروش ۱۴ روز اخیر" className="lg:col-span-2">
          <div className="flex h-48 items-end gap-1.5" role="img" aria-label="نمودار فروش روزانه">
            {r.daily.map((d) => (
              <div key={d.date.toISOString()} className="group flex h-full min-w-0 flex-1 flex-col items-center justify-end gap-1">
                <span className="hidden text-[10px] text-muted group-hover:block">{faNumber(Math.round(d.revenue / 1000))}k</span>
                <div className="w-full rounded-t bg-ink transition-all" style={{ height: `${Math.max(2, (d.revenue / max) * 100)}%`, opacity: d.revenue ? 1 : 0.15 }} title={`${formatToman(d.revenue)} · ${faNumber(d.count)} سفارش`} />
                <span className="hidden max-w-full truncate text-[9px] text-muted sm:block">{dayLabel.format(d.date)}</span>
              </div>
            ))}
          </div>
        </Card>

        <Card title="پرفروش‌ها (۳۰ روز)">
          {r.topProducts.length ? (
            <ol className="space-y-3 text-sm">
              {r.topProducts.map((p, i) => (
                <li key={p.name} className="flex items-center gap-3">
                  <span className="grid size-6 shrink-0 place-items-center rounded-full bg-mist text-xs">{faNumber(i + 1)}</span>
                  <span className="min-w-0 flex-1 truncate">{p.name}</span>
                  <span className="text-xs text-muted">{faNumber(p.qty)} عدد</span>
                </li>
              ))}
            </ol>
          ) : (
            <Empty>هنوز فروشی ثبت نشده</Empty>
          )}
        </Card>
      </div>

      <div className="mt-4 grid gap-4 lg:grid-cols-2">
        <Card title="موجودی رو به اتمام">
          {r.lowStock.length ? (
            <ul className="divide-y divide-line text-sm">
              {r.lowStock.map((v) => (
                <li key={v.id} className="flex items-center justify-between gap-3 py-2.5">
                  <Link href={`/admin/products/${v.product.id}`} className="min-w-0 truncate hover:underline">
                    {v.product.name}
                    <span className="text-xs text-muted"> · {[v.colorName, v.size].filter(Boolean).join(" · ")}</span>
                  </Link>
                  <span className={`text-xs font-bold ${v.stock === 0 ? "text-muted line-through" : ""}`}>{v.stock === 0 ? "ناموجود" : `${faNumber(v.stock)} عدد`}</span>
                </li>
              ))}
            </ul>
          ) : (
            <Empty>موجودی همه کالاها کافی است</Empty>
          )}
          <Link href="/admin/inventory?low=1" className="mt-3 inline-block text-xs underline">مدیریت موجودی</Link>
        </Card>
        <Card title="کارهای در انتظار">
          <ul className="space-y-3 text-sm">
            <li className="flex justify-between"><span>سفارش‌های آماده‌سازی‌نشده</span><Link href="/admin/orders?status=PAID" className="font-bold underline">{faNumber(r.toProcess)}</Link></li>
            <li className="flex justify-between"><span>نظرات در انتظار تأیید</span><Link href="/admin/reviews" className="font-bold underline">{faNumber(r.pendingReviews)}</Link></li>
          </ul>
        </Card>
      </div>
    </>
  );
}
