"use client";

import Link from "next/link";
import useSWR from "swr";
import type { Desa, Paginated, Penduduk } from "@/lib/types";
import { fetcher } from "@/lib/api";
import { cetakHtml, escapeHtml, kopDesa } from "@/lib/cetak";
import { Badge } from "@/components/ui/badge";
import {
  SimpleCrud,
  type CrudColumn,
  type CrudField,
  type CrudRow,
} from "@/components/admin/simple-crud";

interface PendudukRingkas {
  nik: string;
  nama: string;
  jenisKelamin: string;
  tanggalLahir: string | null;
  alamat: string | null;
  telepon: string | null;
}

function warga(row: CrudRow): PendudukRingkas {
  return (row.penduduk ?? {}) as PendudukRingkas;
}

function usia(tanggalLahir: string | null | undefined) {
  if (!tanggalLahir) return "-";
  const lahir = new Date(tanggalLahir);
  if (Number.isNaN(lahir.getTime())) return "-";
  const now = new Date();
  let tahun = now.getFullYear() - lahir.getFullYear();
  const bulan = now.getMonth() - lahir.getMonth();
  if (bulan < 0 || (bulan === 0 && now.getDate() < lahir.getDate())) tahun -= 1;
  return `${tahun} th`;
}

const FIELDS: CrudField[] = [
  {
    name: "pendudukId",
    label: "Warga",
    type: "select",
    optionsKey: "penduduk",
    required: true,
    full: true,
  },
  { name: "asalPemudik", label: "Asal Pemudik" },
  { name: "tanggalTiba", label: "Tanggal Tiba", type: "date" },
  { name: "tujuanPemudik", label: "Tujuan Pemudik" },
  { name: "kontak", label: "Kontak" },
  {
    name: "status",
    label: "Status",
    type: "select",
    options: [
      { value: "Pemudik", label: "Pemudik" },
      { value: "Dalam Pemantauan", label: "Dalam Pemantauan" },
      { value: "Selesai", label: "Selesai" },
    ],
    defaultValue: "Pemudik",
  },
  { name: "wajibPantau", label: "Wajib Pantau", type: "checkbox" },
  { name: "keluhan", label: "Keluhan", type: "textarea", full: true },
];

const COLUMNS: CrudColumn[] = [
  { name: "nik", label: "NIK", render: (row) => warga(row).nik ?? "-" },
  { name: "nama", label: "Nama", render: (row) => warga(row).nama ?? "-" },
  { name: "usia", label: "Usia", render: (row) => usia(warga(row).tanggalLahir) },
  { name: "jk", label: "JK", render: (row) => warga(row).jenisKelamin ?? "-" },
  {
    name: "alamat",
    label: "Alamat",
    hideOnMobile: true,
    render: (row) => warga(row).alamat ?? "-",
  },
  {
    name: "pantau",
    label: "Pantau Warga",
    render: (row) => (
      <Link
        href={`/admin/kesehatan/pemantauan?pendudukId=${String(row.pendudukId)}`}
        className="font-medium text-primary hover:underline"
      >
        Pantau
      </Link>
    ),
  },
  { name: "asalPemudik", label: "Asal Pemudik" },
  { name: "tanggalTiba", label: "Tanggal Tiba", hideOnMobile: true },
  { name: "tujuanPemudik", label: "Tujuan Pemudik", hideOnMobile: true },
  { name: "kontak", label: "Kontak", hideOnMobile: true },
  {
    name: "status",
    label: "Status",
    render: (row) => (
      <Badge variant={row.status === "Selesai" ? "success" : "secondary"}>
        {String(row.status ?? "-")}
      </Badge>
    ),
  },
  { name: "keluhan", label: "Keluhan", hideOnMobile: true },
  {
    name: "wajibPantau",
    label: "Wajib Pantau",
    render: (row) =>
      row.wajibPantau ? <Badge variant="success">Ya</Badge> : <Badge variant="secondary">Tidak</Badge>,
  },
];

export default function PendataanKesehatanPage() {
  const { data: penduduk } = useSWR<Paginated<Penduduk>>("/penduduk?limit=200", fetcher);
  const { data: desa } = useSWR<Desa>("/desa", fetcher);
  const daftar = penduduk?.data ?? [];

  function cetak(rows: CrudRow[]) {
    const isi = `
      ${kopDesa(desa, "Daftar Pemudik Saat Pandemi Covid-19")}
      <table>
        <thead><tr><th>No</th><th>NIK</th><th>Nama</th><th>Usia</th><th>JK</th><th>Alamat</th><th>Asal Pemudik</th><th>Tanggal Tiba</th><th>Tujuan Pemudik</th><th>Kontak</th><th>Status</th><th>Keluhan</th><th>Wajib Pantau</th></tr></thead>
        <tbody>
          ${rows
            .map((row, index) => {
              const w = warga(row);
              return `<tr><td class="num">${index + 1}</td><td>${escapeHtml(w.nik ?? "-")}</td><td>${escapeHtml(w.nama ?? "-")}</td><td>${usia(w.tanggalLahir)}</td><td>${escapeHtml(w.jenisKelamin ?? "-")}</td><td>${escapeHtml(w.alamat ?? "-")}</td><td>${escapeHtml(row.asalPemudik ?? "-")}</td><td>${escapeHtml(String(row.tanggalTiba ?? "").slice(0, 10) || "-")}</td><td>${escapeHtml(row.tujuanPemudik ?? "-")}</td><td>${escapeHtml(row.kontak ?? "-")}</td><td>${escapeHtml(row.status ?? "-")}</td><td>${escapeHtml(row.keluhan ?? "-")}</td><td>${row.wajibPantau ? "Ya" : "Tidak"}</td></tr>`;
            })
            .join("")}
        </tbody>
      </table>
      <div class="ttd">
        <div>
          <div>${escapeHtml((desa?.kecamatan ?? "Cipari").toUpperCase())}, ${new Date().toLocaleDateString("id-ID", { day: "2-digit", month: "long", year: "numeric" })}</div>
          <div>Kepala Desa ${escapeHtml((desa?.nama ?? "Mulyadadi").replace(/^Desa\s+/i, ""))}</div>
          <div class="ruang"></div>
          <div><strong>${escapeHtml(desa?.kepalaDesa ?? "-")}</strong></div>
        </div>
      </div>
    `;
    return { judul: "Daftar Pemudik Covid-19", isi };
  }

  return (
    <SimpleCrud
      title="Daftar Pemudik Saat Pandemi Covid-19"
      description="Pendataan warga pemudik, asal kedatangan, dan kewajiban pemantauan isolasi mandiri."
      entity="pemudik-covid"
      fields={FIELDS}
      columns={COLUMNS}
      searchFields={["asalPemudik", "tujuanPemudik", "kontak", "status"]}
      searchPlaceholder="Cari asal, tujuan, atau kontak…"
      createLabel="Tambah Warga Pemudik"
      showNo
      selectable
      actionOnLeft
      canWrite
      options={{
        penduduk: daftar.map((item) => ({
          value: String(item.id),
          label: `${item.nama} — ${item.nik}`,
        })),
      }}
      ekspor={{
        fileName: "daftar-pemudik-covid",
        header: [
          "NIK",
          "Nama",
          "Usia",
          "JK",
          "Alamat",
          "Pantau Warga",
          "Asal Pemudik",
          "Tanggal Tiba",
          "Tujuan Pemudik",
          "Kontak",
          "Status",
          "Keluhan",
          "Wajib Pantau",
        ],
        values: (row) => [
          warga(row).nik ?? "",
          warga(row).nama ?? "",
          usia(warga(row).tanggalLahir),
          warga(row).jenisKelamin ?? "",
          warga(row).alamat ?? "",
          "Pantau",
          String(row.asalPemudik ?? ""),
          String(row.tanggalTiba ?? "").slice(0, 10),
          String(row.tujuanPemudik ?? ""),
          String(row.kontak ?? ""),
          String(row.status ?? ""),
          String(row.keluhan ?? ""),
          row.wajibPantau ? "Ya" : "Tidak",
        ],
      }}
      cetak={cetak}
    />
  );
}