"use client";

import { useCallback, useEffect, useState } from "react";
const AUDIT_LABELS: Record<string, string> = {
  seller_profile_submitted: "Vendedor enviou cadastro",
  seller_profile_approved: "Admin aprovou vendedor",
  seller_profile_rejected: "Admin rejeitou vendedor",
  seller_profile_updated: "Vendedor atualizou cadastro",
  payout_created: "Repasse criado",
  payout_approved: "Admin aprovou repasse",
  payout_paid: "Admin confirmou PIX ao vendedor",
  payout_rejected: "Admin rejeitou repasse",
};

type Tab = "vendedores" | "repasses" | "registros";

function brl(cents: number) {
  return (cents / 100).toLocaleString("pt-BR", { style: "currency", currency: "BRL" });
}

function fmt(iso: string) {
  try {
    return new Date(iso).toLocaleString("pt-BR");
  } catch {
    return iso;
  }
}

export default function AdminOperationsPanel({ onToast }: { onToast: (m: string) => void }) {
  const [tab, setTab] = useState<Tab>("vendedores");
  const [profiles, setProfiles] = useState<
    {
      userId: string;
      userName?: string;
      userEmail?: string;
      status: string;
      cpfCnpj: string;
      pixKey: string;
      pixKeyType: string;
      documentIdPath: string;
      documentAddressPath: string;
      submittedAt: string | null;
    }[]
  >([]);
  const [payouts, setPayouts] = useState<
    {
      id: string;
      saleId: string;
      sellerName?: string;
      buyerName?: string;
      productName?: string;
      amountCents: number;
      status: string;
      sellerPixKey: string;
      sellerPixKeyType: string;
      paymentMethod?: string;
      createdAt: string;
    }[]
  >([]);
  const [logs, setLogs] = useState<
    { id: string; actorName: string | null; action: string; entityType: string; entityId: string; createdAt: string }[]
  >([]);
  const [loading, setLoading] = useState(false);

  const load = useCallback(async () => {
    setLoading(true);
    try {
      if (tab === "vendedores") {
        const res = await fetch("/api/admin/seller-profiles?status=pending");
        const data = await res.json();
        if (!res.ok) throw new Error(data.error);
        setProfiles(data.profiles || []);
      } else if (tab === "repasses") {
        const res = await fetch("/api/admin/payouts?status=pending");
        const data = await res.json();
        if (!res.ok) throw new Error(data.error);
        setPayouts(data.payouts || []);
      } else {
        const res = await fetch("/api/admin/audit-logs?limit=80");
        const data = await res.json();
        if (!res.ok) throw new Error(data.error);
        setLogs(data.logs || []);
      }
    } catch (e) {
      onToast(e instanceof Error ? e.message : "Erro ao carregar");
    } finally {
      setLoading(false);
    }
  }, [tab, onToast]);

  useEffect(() => {
    load();
  }, [load]);

  async function reviewSeller(userId: string, decision: "approved" | "rejected") {
    let rejectionReason: string | undefined;
    if (decision === "rejected") {
      rejectionReason = prompt("Motivo da recusa:") || "Documentação incompleta";
    }
    try {
      const res = await fetch("/api/admin/seller-profiles", {
        method: "PATCH",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ userId, decision, rejectionReason }),
      });
      const data = await res.json();
      if (!res.ok) throw new Error(data.error);
      onToast(decision === "approved" ? "Vendedor aprovado" : "Cadastro recusado");
      load();
    } catch (e) {
      onToast(e instanceof Error ? e.message : "Erro");
    }
  }

  async function updatePayout(payoutId: string, status: "approved" | "paid" | "rejected") {
    const adminNotes = status === "rejected" ? prompt("Motivo:") || undefined : undefined;
    try {
      const res = await fetch("/api/admin/payouts", {
        method: "PATCH",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ payoutId, status, adminNotes }),
      });
      const data = await res.json();
      if (!res.ok) throw new Error(data.error);
      onToast(status === "paid" ? "Repasse marcado como pago" : "Repasse atualizado");
      load();
    } catch (e) {
      onToast(e instanceof Error ? e.message : "Erro");
    }
  }

  return (
    <>
      <div className="admin-tabs">
        {(["vendedores", "repasses", "registros"] as Tab[]).map((t) => (
          <button key={t} type="button" className={tab === t ? "on" : ""} onClick={() => setTab(t)}>
            {t === "vendedores" ? "Aprovar vendedores" : t === "repasses" ? "Repasses Pix" : "Registros"}
          </button>
        ))}
      </div>

      {loading ? <p style={{ padding: 20, color: "var(--mut)" }}>Carregando…</p> : null}

      {tab === "vendedores" && !loading ? (
        <div className="panel">
          <div className="ph"><h3>Cadastros pendentes</h3></div>
          {profiles.length === 0 ? (
            <p style={{ color: "var(--mut)" }}>Nenhum cadastro pendente.</p>
          ) : (
            profiles.map((p) => (
              <div key={p.userId} className="admin-review-card">
                <div>
                  <b>{p.userName}</b> — {p.userEmail}
                  <div style={{ fontSize: ".85rem", color: "var(--mut)", marginTop: 6 }}>
                    CPF/CNPJ: {p.cpfCnpj} · Pix ({p.pixKeyType}): {p.pixKey}
                  </div>
                  <div style={{ marginTop: 8, display: "flex", gap: 12, fontSize: ".85rem" }}>
                    {p.documentIdPath ? (
                      <a href={`/api/seller/documents?path=${encodeURIComponent(p.documentIdPath)}`} target="_blank" rel="noreferrer">Ver RG/CNH</a>
                    ) : null}
                    {p.documentAddressPath ? (
                      <a href={`/api/seller/documents?path=${encodeURIComponent(p.documentAddressPath)}`} target="_blank" rel="noreferrer">Ver comprovante</a>
                    ) : null}
                  </div>
                </div>
                <div className="users-acts">
                  <button type="button" className="b lime sm" onClick={() => reviewSeller(p.userId, "approved")}>Aprovar</button>
                  <button type="button" className="b ghost sm danger" onClick={() => reviewSeller(p.userId, "rejected")}>Recusar</button>
                </div>
              </div>
            ))
          )}
        </div>
      ) : null}

      {tab === "repasses" && !loading ? (
        <div className="panel">
          <div className="ph"><h3>Repasses pendentes ao vendedor</h3></div>
          <p style={{ color: "var(--mut)", fontSize: ".88rem", marginBottom: 16 }}>
            O cliente já pagou na plataforma. Aprove e envie o Pix manualmente para a chave do vendedor, depois marque como pago.
          </p>
          {payouts.length === 0 ? (
            <p style={{ color: "var(--mut)" }}>Nenhum repasse pendente.</p>
          ) : (
            <table className="tbl">
              <thead>
                <tr>
                  <th>Vendedor</th>
                  <th>Cliente</th>
                  <th>Produto</th>
                  <th>Valor</th>
                  <th>Pix vendedor</th>
                  <th>Ações</th>
                </tr>
              </thead>
              <tbody>
                {payouts.map((p) => (
                  <tr key={p.id}>
                    <td>{p.sellerName}</td>
                    <td>{p.buyerName}</td>
                    <td>{p.productName}</td>
                    <td>{brl(p.amountCents)}</td>
                    <td><code style={{ fontSize: ".78rem" }}>{p.sellerPixKey}</code></td>
                    <td>
                      <div className="users-acts">
                        <button type="button" className="b ghost sm" onClick={() => updatePayout(p.id, "approved")}>Aprovar</button>
                        <button type="button" className="b lime sm" onClick={() => updatePayout(p.id, "paid")}>Pix enviado</button>
                        <button type="button" className="b ghost sm danger" onClick={() => updatePayout(p.id, "rejected")}>Recusar</button>
                      </div>
                    </td>
                  </tr>
                ))}
              </tbody>
            </table>
          )}
        </div>
      ) : null}

      {tab === "registros" && !loading ? (
        <div className="panel">
          <div className="ph"><h3>Histórico de ações</h3></div>
          <table className="tbl">
            <thead>
              <tr><th>Quando</th><th>Quem</th><th>Ação</th><th>Referência</th></tr>
            </thead>
            <tbody>
              {logs.map((l) => (
                <tr key={l.id}>
                  <td style={{ color: "var(--mut)", fontSize: ".85rem" }}>{fmt(l.createdAt)}</td>
                  <td>{l.actorName || "Sistema"}</td>
                  <td>{AUDIT_LABELS[l.action] || l.action}</td>
                  <td>{l.entityType} #{l.entityId}</td>
                </tr>
              ))}
            </tbody>
          </table>
        </div>
      ) : null}
    </>
  );
}