"use client";

import { CheckCircle2, Eye, FileCode2, FileText, FlaskConical, Loader2, Plus, Send, ShoppingBag, XCircle } from "lucide-react";
import Link from "next/link";

import { documentoFormatado, ListaDePendencias, MarcaDoModelo, mesPorExtenso, moeda } from "@/components/fiscal/comum";
import { Aviso } from "@/components/ui/aviso";
import type { Pendencia } from "@/lib/fiscal/montar";
import type { NotaNaTela } from "@/lib/fiscal/servidor/apresentacao";

import { NOME_DO_TIPO, totalDaLinha, type ContextoNaTela, type Formulario, type PlanoNaTela } from "./tipos";

export const STATUS_QUE_ENCERRAM = ["autorizada", "contingencia", "cancelada", "cancelando", "denegada"];

function Linha({ rotulo, valor, forte = false }: { rotulo: string; valor: string; forte?: boolean }) {
  return (
    <div className="flex items-baseline justify-between gap-3">
      <dt className={forte ? "text-sm font-bold text-[var(--ks-color-text-primary)]" : "text-sm text-[var(--ks-color-text-muted)]"}>{rotulo}</dt>
      <dd className={`ks-num ${forte ? "text-[28px] font-extrabold tracking-tight text-[var(--ks-color-text-primary)]" : "text-sm font-semibold text-[var(--ks-color-text-primary)]"}`}>
        {valor}
      </dd>
    </div>
  );
}

function SituacaoDaNota({ nota }: { nota: NotaNaTela }) {
  if (nota.status === "rascunho") {
    return (
      <div className="space-y-3 rounded-2xl bg-[var(--ks-color-bg-inset)] p-4">
        <div className="flex items-start gap-3">
          <span className="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-sky-500 to-indigo-600 text-white">
            <Eye size={17} />
          </span>
          <div className="min-w-0">
            <p className="text-sm font-bold text-[var(--ks-color-text-primary)]">Prévia pronta</p>
            <p className="text-xs leading-5 text-[var(--ks-color-text-muted)]">Confira o PDF. A prévia não vale como nota: para valer, emita.</p>
          </div>
        </div>
        <a href={`/api/fiscal/notas/${nota.id}/arquivo?tipo=pdf&previa=1`} target="_blank" rel="noopener noreferrer" className="ks-button ks-button-soft ks-button-sm">
          <FileText size={14} />
          Abrir a prévia
        </a>
      </div>
    );
  }

  if (nota.emAndamento) {
    return (
      <div className="flex items-start gap-3 rounded-2xl bg-[var(--ks-color-bg-inset)] p-4">
        <span className="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-violet-500 to-purple-600 text-white">
          <Loader2 size={17} className="animate-spin" />
        </span>
        <div className="min-w-0">
          <p className="text-sm font-bold text-[var(--ks-color-text-primary)]">
            {nota.status === "cancelando" ? "Cancelamento a caminho" : "Enviando para autorização"}
          </p>
          <p className="text-xs leading-5 text-[var(--ks-color-text-muted)]">
            A resposta costuma chegar em segundos. Pode sair desta tela: a nota continua sendo processada e aparece em Emissão de notas.
          </p>
        </div>
      </div>
    );
  }

  if (nota.status === "autorizada" || nota.status === "contingencia") {
    return (
      <div className="space-y-3 rounded-2xl bg-emerald-500/10 p-4">
        <div className="flex items-start gap-3">
          <span className="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-emerald-400 to-emerald-600 text-white shadow-[0_8px_18px_rgba(16,185,129,0.3)]">
            <CheckCircle2 size={18} />
          </span>
          <div className="min-w-0">
            <p className="text-sm font-bold text-emerald-800">{nota.status === "contingencia" ? "Nota emitida em contingência" : "Nota autorizada"}</p>
            <p className="text-xs leading-5 text-emerald-900/70">
              {nota.modeloNome}
              {nota.numero ? ` nº ${nota.numero}` : ""}
              {nota.serie ? ` · série ${nota.serie}` : ""}
              {nota.semValorFiscal ? " · teste, sem valor fiscal" : ""}
            </p>
          </div>
        </div>
        {nota.temArquivos ? (
          <div className="flex flex-wrap gap-2">
            <a href={`/api/fiscal/notas/${nota.id}/arquivo?tipo=pdf`} target="_blank" rel="noopener noreferrer" className="ks-button ks-button-primary ks-button-sm">
              <FileText size={14} />
              PDF da nota
            </a>
            <a href={`/api/fiscal/notas/${nota.id}/arquivo?tipo=xml&baixar=1`} target="_blank" rel="noopener noreferrer" className="ks-button ks-button-soft ks-button-sm">
              <FileCode2 size={14} />
              XML
            </a>
          </div>
        ) : null}
      </div>
    );
  }

  if (["rejeitada", "erro", "denegada"].includes(nota.status)) {
    return (
      <div className="space-y-2 rounded-2xl bg-rose-500/10 p-4">
        <div className="flex items-start gap-3">
          <span className="flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-rose-500 to-red-700 text-white shadow-[0_8px_18px_rgba(225,29,72,0.28)]">
            <XCircle size={18} />
          </span>
          <div className="min-w-0">
            <p className="text-sm font-bold text-rose-800">{nota.explicacao?.titulo ?? "A nota não foi autorizada"}</p>
            <p className="text-xs leading-5 text-rose-950/70">
              {nota.status === "denegada" ? "Esta nota não pode ser corrigida. Emita outra." : nota.explicacao?.dica ?? "Corrija e emita de novo."}
            </p>
          </div>
        </div>
        {nota.mensagem ? (
          <details className="pl-12">
            <summary className="cursor-pointer text-xs font-semibold text-rose-900/60">Ver a mensagem original</summary>
            <span className="mt-1 block break-words text-xs text-rose-950/60">
              {nota.mensagemCodigo ? `${nota.mensagemCodigo} · ` : ""}
              {nota.mensagem}
            </span>
          </details>
        ) : null}
      </div>
    );
  }

  if (nota.status === "cancelada") {
    return (
      <Aviso tom="neutro" titulo="Nota cancelada">
        {nota.modeloNome}
        {nota.numero ? ` nº ${nota.numero}` : ""} foi cancelada.
      </Aviso>
    );
  }
  return null;
}

export function Resumo({
  contexto,
  formulario,
  plano,
  conferindo,
  pendencias,
  mostrarPendencias,
  nota,
  enviando,
  erro,
  aoFecharErro,
  aoEmitir,
  aoPrevia,
  aoOutra,
  aoAbrirDetalhe,
  acaoDaPendencia,
}: {
  contexto: ContextoNaTela;
  formulario: Formulario;
  plano: PlanoNaTela | null;
  conferindo: boolean;
  pendencias: Pendencia[];
  mostrarPendencias: boolean;
  nota: NotaNaTela | null;
  enviando: "emitir" | "previa" | null;
  erro: string | null;
  aoFecharErro: () => void;
  aoEmitir: () => void;
  aoPrevia: () => void;
  aoOutra: () => void;
  aoAbrirDetalhe: () => void;
  acaoDaPendencia: (pendencia: Pendencia) => { rotulo: string; aoClicar: () => void } | null;
}) {
  const modelo = formulario.modelo;
  const tipo = modelo ? NOME_DO_TIPO[modelo] : null;
  const itens = formulario.linhas.length;
  const subtotal = Math.round(formulario.linhas.reduce((acc, linha) => acc + totalDaLinha(linha), 0) * 100) / 100;
  const frete = modelo === "nfe" ? formulario.frete : 0;
  const total = Math.round((subtotal - formulario.desconto + frete) * 100) / 100;
  const notaDoPlano = plano?.notas[0] ?? null;
  const totalDaNota = notaDoPlano && notaDoPlano.valor > 0 ? notaDoPlano.valor / 100 : null;
  const saldo = plano?.saldo ?? contexto.saldo;
  const ambienteDaNota = modelo ? contexto.emissor.ambientes?.[modelo] ?? null : null;
  const emTeste = contexto.ambiente === "sandbox" || (ambienteDaNota !== null && ambienteDaNota !== "producao");
  const gasta = notaDoPlano ? notaDoPlano.contaCredito : contexto.ambiente !== "producao" || ambienteDaNota === "producao";
  const bloqueios = pendencias.filter((p) => p.nivel === "bloqueio");
  const encerrada = Boolean(nota && (nota.emAndamento || STATUS_QUE_ENCERRAM.includes(nota.status)));
  const destinatario = formulario.semCliente
    ? formulario.documento
      ? `Consumidor · ${documentoFormatado(formulario.documento)}`
      : "Consumidor sem identificação"
    : formulario.cliente?.nome ?? null;

  return (
    <div className="space-y-4 rounded-3xl bg-[var(--ks-color-bg-elevated)] p-5 shadow-[0_10px_30px_rgba(26,26,43,0.06)] sm:p-6">
      <header className="flex items-start gap-3">
        {modelo ? <MarcaDoModelo modelo={modelo} /> : null}
        <div className="min-w-0 flex-1">
          <p className="text-[11px] font-bold uppercase tracking-[0.14em] text-[var(--ks-color-text-soft)]">Resumo</p>
          <h2 className="truncate text-lg font-extrabold tracking-tight text-[var(--ks-color-text-primary)]">
            {tipo ? `${tipo.titulo} · ${tipo.sigla}` : "Escolha o tipo de nota"}
          </h2>
          <p className="truncate text-[13px] text-[var(--ks-color-text-muted)]">{destinatario ?? "Falta escolher o cliente"}</p>
        </div>
        {modelo && emTeste ? (
          <span
            title="Enquanto estiver em teste, a nota sai sem valor fiscal."
            className="inline-flex shrink-0 items-center gap-1.5 rounded-full bg-gradient-to-r from-sky-500 to-indigo-600 px-2.5 py-1 text-[11px] font-bold text-white"
          >
            <FlaskConical size={12} />
            Teste
          </span>
        ) : null}
      </header>

      <dl className="space-y-2 border-t border-[var(--ks-color-border-subtle)] pt-4">
        <Linha rotulo={itens === 1 ? "1 item" : `${itens} itens`} valor={moeda(subtotal)} />
        {formulario.desconto > 0 ? <Linha rotulo="Desconto" valor={`− ${moeda(formulario.desconto)}`} /> : null}
        {frete > 0 ? <Linha rotulo="Frete" valor={moeda(frete)} /> : null}
        <div className="pt-1">
          <Linha rotulo="Total da nota" valor={moeda(totalDaNota !== null && Math.abs(totalDaNota - total) >= 0.01 ? totalDaNota : Math.max(0, total))} forte />
          {totalDaNota !== null && Math.abs(totalDaNota - total) >= 0.01 ? (
            <p className="text-right text-xs text-[var(--ks-color-text-muted)]">Inclui impostos que somam ao valor ({moeda(total)} sem eles).</p>
          ) : null}
        </div>
      </dl>

      <div className="flex items-center justify-between gap-3 rounded-2xl bg-[var(--ks-color-bg-inset)] px-4 py-3">
        <div className="min-w-0 text-xs leading-5 text-[var(--ks-color-text-muted)]">
          <span className="block font-semibold text-[var(--ks-color-text-primary)]">
            Pacote de {mesPorExtenso(saldo.competencia)}:{" "}
            <span className={`ks-num ${saldo.disponiveis <= 0 ? "text-rose-600" : ""}`}>
              {Math.max(0, saldo.disponiveis)} {saldo.disponiveis === 1 ? "nota disponível" : "notas disponíveis"}
            </span>
          </span>
          {gasta ? "Esta nota gasta 1 do pacote quando for autorizada." : "Nota de teste: não gasta o pacote."}
        </div>
        {gasta && saldo.disponiveis <= 0 ? (
          <Link href="/dashboard/assinatura#notas" className="ks-button ks-button-primary ks-button-sm shrink-0">
            <ShoppingBag size={14} />
            Comprar
          </Link>
        ) : null}
      </div>

      {nota ? <SituacaoDaNota nota={nota} /> : null}

      {erro ? (
        <Aviso tom="ruim" aoFechar={aoFecharErro}>
          {erro}
        </Aviso>
      ) : null}

      {mostrarPendencias && !encerrada && pendencias.length ? (
        <section>
          <h3 className="flex items-center gap-2 text-[11px] font-bold uppercase tracking-[0.14em] text-[var(--ks-color-text-soft)]">
            {bloqueios.length ? "Antes de emitir" : "Para conferir"}
            {conferindo ? <Loader2 size={12} className="animate-spin text-[var(--ks-color-primary)]" /> : null}
          </h3>
          <ListaDePendencias pendencias={pendencias} contexto={{ clienteId: formulario.cliente?.id ?? null, semPedido: true }} acao={acaoDaPendencia} />
        </section>
      ) : null}

      {encerrada ? (
        <div className="flex flex-col gap-2">
          <button type="button" onClick={aoOutra} className="ks-button ks-button-primary w-full" style={{ height: "3rem" }}>
            <Plus size={17} />
            Emitir outra nota
          </button>
          <div className="grid grid-cols-2 gap-2">
            <button type="button" onClick={aoAbrirDetalhe} className="ks-button ks-button-soft">
              Ver detalhes
            </button>
            <Link href="/dashboard/notas-fiscais" className="ks-button ks-button-soft">
              Ver a lista
            </Link>
          </div>
        </div>
      ) : (
        <div className="flex flex-col gap-2">
          <button
            type="button"
            onClick={aoEmitir}
            disabled={enviando !== null || !modelo}
            className="ks-button ks-button-primary w-full"
            style={{ height: "3rem", fontSize: "15px" }}
          >
            {enviando === "emitir" ? <Loader2 size={17} className="animate-spin" /> : <Send size={17} />}
            {nota && ["rejeitada", "erro"].includes(nota.status) ? "Emitir de novo" : "Emitir nota fiscal"}
          </button>
          <button type="button" onClick={aoPrevia} disabled={enviando !== null || !modelo} className="ks-button ks-button-soft w-full" title="Gera o PDF da nota sem emitir">
            {enviando === "previa" ? <Loader2 size={15} className="animate-spin" /> : <Eye size={15} />}
            Ver prévia antes
          </button>
        </div>
      )}
    </div>
  );
}