/* ================================================================
   Khronus — Notas Fiscais (Scania)
   Emite -> sobe o PDF -> prazo de pagamento (padrão +40 dias) ->
   tarefa automática no Google Agenda (Tarefas) via worker khronus-nf.
   ================================================================ */
const { useState, useEffect, useRef } = React;

const NF_WORKER_URL = 'https://khronus-nf.blindagem-fmn.workers.dev';
const PRAZO_PADRAO_DIAS = 40;

/* ── Datas ─────────────────────────────────────────────────────── */
function hojeISO() {
  const d = new Date();
  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
}
function addDiasISO(isoDate, dias) {
  const [y, m, d] = isoDate.split('-').map(Number);
  const dt = new Date(y, m - 1, d);
  dt.setDate(dt.getDate() + dias);
  return `${dt.getFullYear()}-${String(dt.getMonth() + 1).padStart(2, '0')}-${String(dt.getDate()).padStart(2, '0')}`;
}
function fmtDataBR(iso) {
  if (!iso) return '—';
  const [y, m, d] = iso.split('-');
  return `${d}/${m}/${y}`;
}

/* ── Tenta extrair o número da NF a partir do texto do PDF ────────
   Heurística, não é garantida: sempre deixamos o campo editável para
   o usuário conferir antes de salvar. */
async function extrairNumeroNF(file) {
  try {
    if (!window.pdfjsLib) return '';
    const buf = await file.arrayBuffer();
    const pdf = await window.pdfjsLib.getDocument({ data: buf }).promise;
    let texto = '';
    const paginas = Math.min(pdf.numPages, 2);
    for (let p = 1; p <= paginas; p++) {
      const page = await pdf.getPage(p);
      const content = await page.getTextContent();
      texto += ' ' + content.items.map(i => i.str).join(' ');
    }
    const padroes = [
      /n[úu]mero\s*(?:da\s*)?(?:nf-?e|nfs-?e|nota\s*fiscal)?\s*[:\-]?\s*(\d{3,15})/i,
      /nf-?e?\s*n[ºo°]\s*[:\-]?\s*(\d{3,15})/i,
      /n[ºo°]\s*[:\-]?\s*(\d{3,15})/i,
    ];
    for (const re of padroes) {
      const m = texto.match(re);
      if (m) return m[1].replace(/^0+(?=\d)/, '');
    }
  } catch (e) {
    console.warn('Não consegui ler o PDF automaticamente:', e);
  }
  return '';
}

/* ── Campo de formulário padrão ───────────────────────────────────*/
function Campo({ label, children }) {
  return (
    <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
      <span style={{ fontSize: 10, fontFamily: 'Roboto, sans-serif', fontWeight: 700,
        letterSpacing: '0.1em', textTransform: 'uppercase', color: 'var(--text-3)' }}>{label}</span>
      {children}
    </div>
  );
}
const inputStyle = {
  width: '100%', boxSizing: 'border-box', padding: '9px 12px', borderRadius: 8,
  background: 'var(--app-surface-2)', border: '1px solid var(--app-border)',
  color: 'var(--text-1)', fontFamily: 'Roboto, sans-serif', fontSize: 13, outline: 'none',
};

/* ── Modal de registro / edição de NF ──────────────────────────────*/
function NFModal({ item, onClose, onSaved }) {
  const [form, setForm] = useState(() => item || {
    numero_nf: '', cliente: 'Scania', resumo_servico: '', responsavel_cliente: '',
    valor: '', data_emissao: hojeISO(), prazo_pagamento: addDiasISO(hojeISO(), PRAZO_PADRAO_DIAS),
    pdf_url: '', observacoes: '',
  });
  const [file, setFile] = useState(null);
  const [extraindo, setExtraindo] = useState(false);
  const [salvando, setSalvando] = useState(false);
  const [erro, setErro] = useState('');
  const fileRef = useRef(null);

  const set = (campo, valor) => setForm(f => ({ ...f, [campo]: valor }));

  async function handleFile(f) {
    if (!f) return;
    setFile(f);
    setExtraindo(true);
    const numero = await extrairNumeroNF(f);
    setExtraindo(false);
    if (numero) set('numero_nf', numero);
  }

  function handleDataEmissao(v) {
    set('data_emissao', v);
    // só empurra o prazo automaticamente se ainda não foi editado à mão
    if (!form._prazoEditadoManual) set('prazo_pagamento', addDiasISO(v, PRAZO_PADRAO_DIAS));
  }

  async function handleSalvar() {
    if (!form.numero_nf.trim()) { setErro('Informe o número da NF.'); return; }
    if (!form.data_emissao || !form.prazo_pagamento) { setErro('Preencha emissão e prazo de pagamento.'); return; }
    setSalvando(true); setErro('');
    try {
      let pdf_url = form.pdf_url || '';
      if (file) {
        const fd = new FormData();
        fd.append('file', file, `${form.numero_nf}.pdf`);
        fd.append('numero', form.numero_nf.trim());
        const upRes = await fetch(`${NF_WORKER_URL}/upload-nf`, { method: 'POST', body: fd });
        const upData = await upRes.json();
        if (!upRes.ok) throw new Error(upData.error || 'Falha no upload do PDF.');
        pdf_url = upData.pdf_url;
      }

      const payload = {
        numero_nf: form.numero_nf.trim(),
        cliente: form.cliente || 'Scania',
        resumo_servico: form.resumo_servico || null,
        responsavel_cliente: form.responsavel_cliente || null,
        valor: form.valor ? Number(form.valor) : null,
        data_emissao: form.data_emissao,
        prazo_pagamento: form.prazo_pagamento,
        pdf_url: pdf_url || null,
        observacoes: form.observacoes || null,
      };

      let row;
      if (item?.id) {
        const { data, error } = await window.db.from('crm_invoices').update(payload).eq('id', item.id).select().single();
        if (error) throw error;
        row = data;
      } else {
        const { data, error } = await window.db.from('crm_invoices').insert(payload).select().single();
        if (error) throw error;
        row = data;

        // Cria a tarefa no Google Agenda (Tarefas). Se falhar (ex.: OAuth
        // ainda não configurado), a NF já está salva — só avisa, não bloqueia.
        try {
          const taskRes = await fetch(`${NF_WORKER_URL}/criar-tarefa`, {
            method: 'POST', headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(payload),
          });
          const taskData = await taskRes.json();
          if (taskRes.ok && taskData.task_id) {
            await window.db.from('crm_invoices')
              .update({ google_task_id: taskData.task_id, google_tasklist_id: taskData.tasklist_id })
              .eq('id', row.id);
          }
        } catch (e) {
          console.warn('Não consegui criar a tarefa no Google Agenda:', e);
        }
      }

      onSaved(row);
    } catch (e) {
      setErro(e.message || String(e));
    } finally {
      setSalvando(false);
    }
  }

  return (
    <div style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,.55)', zIndex: 1000,
      display: 'flex', alignItems: 'center', justifyContent: 'center', padding: 20 }}
      onClick={onClose}>
      <div style={{ width: '100%', maxWidth: 480, maxHeight: '88vh', overflowY: 'auto',
        background: 'var(--app-surface)', border: '1px solid var(--app-border)',
        borderRadius: 14, padding: 22, display: 'flex', flexDirection: 'column', gap: 14 }}
        onClick={e => e.stopPropagation()}>

        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
          <span style={{ fontFamily: 'Roboto, sans-serif', fontWeight: 900, fontSize: 15, color: 'var(--text-1)' }}>
            {item?.id ? 'Editar NF' : 'Nova NF'}
          </span>
          <button onClick={onClose} style={{ background: 'none', border: 'none', cursor: 'pointer', color: 'var(--text-3)' }}>
            <LucideIcon icon="x" size={18} />
          </button>
        </div>

        <Campo label="PDF da nota">
          <input ref={fileRef} type="file" accept="application/pdf" style={{ display: 'none' }}
            onChange={e => handleFile(e.target.files[0])} />
          <button onClick={() => fileRef.current.click()}
            style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '10px 12px', borderRadius: 8,
              background: 'var(--app-surface-2)', border: '1px dashed var(--app-border)',
              color: 'var(--text-2)', fontFamily: 'Roboto, sans-serif', fontSize: 12.5, cursor: 'pointer', width: '100%' }}>
            <LucideIcon icon="file-up" size={15} />
            {extraindo ? 'Lendo o PDF…' : file ? file.name : (form.pdf_url ? 'PDF já anexado — trocar arquivo' : 'Selecionar PDF da NF')}
          </button>
        </Campo>

        <Campo label="Número da NF">
          <input style={inputStyle} value={form.numero_nf} placeholder="Ex.: 1234"
            onChange={e => set('numero_nf', e.target.value)} />
        </Campo>

        <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 12 }}>
          <Campo label="Data de emissão">
            <input type="date" style={inputStyle} value={form.data_emissao}
              onChange={e => handleDataEmissao(e.target.value)} />
          </Campo>
          <Campo label="Prazo de pagamento">
            <input type="date" style={inputStyle} value={form.prazo_pagamento}
              onChange={e => { set('_prazoEditadoManual', true); set('prazo_pagamento', e.target.value); }} />
          </Campo>
        </div>

        <Campo label="Resumo do serviço">
          <textarea rows={3} style={{ ...inputStyle, resize: 'vertical', lineHeight: 1.5 }}
            value={form.resumo_servico} placeholder="O que foi entregue / prestado nessa NF"
            onChange={e => set('resumo_servico', e.target.value)} />
        </Campo>

        <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 12 }}>
          <Campo label="Responsável na Scania">
            <input style={inputStyle} value={form.responsavel_cliente} placeholder="Nome do contato"
              onChange={e => set('responsavel_cliente', e.target.value)} />
          </Campo>
          <Campo label="Valor (opcional)">
            <input type="number" step="0.01" style={inputStyle} value={form.valor} placeholder="0,00"
              onChange={e => set('valor', e.target.value)} />
          </Campo>
        </div>

        {erro && (
          <div style={{ padding: '8px 12px', borderRadius: 8, background: 'rgba(248,113,113,.1)',
            border: '1px solid rgba(248,113,113,.25)', color: 'var(--clr-neg)', fontSize: 12 }}>{erro}</div>
        )}

        <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 4 }}>
          <Btn variant="ghost" onClick={onClose}>Cancelar</Btn>
          <Btn variant="primary" onClick={handleSalvar} disabled={salvando} icon={salvando ? undefined : 'check'}>
            {salvando ? 'Salvando…' : 'Salvar NF'}
          </Btn>
        </div>
      </div>
    </div>
  );
}

/* ── Tela principal ────────────────────────────────────────────────*/
function NotasFiscaisScreen() {
  const [items, setItems] = useState([]);
  const [loading, setLoading] = useState(true);
  const [filtro, setFiltro] = useState('todas');
  const [modal, setModal] = useState(null);

  useEffect(() => { load(); }, []);
  async function load() {
    setLoading(true);
    const { data } = await window.db.from('crm_invoices').select('*').order('data_emissao', { ascending: false });
    setItems(data || []);
    setLoading(false);
  }

  function statusDe(nf) {
    if (nf.status === 'pago') return 'pago';
    if (nf.prazo_pagamento && nf.prazo_pagamento < hojeISO()) return 'atrasado';
    return 'aguardando';
  }

  async function marcarPago(nf) {
    await window.db.from('crm_invoices')
      .update({ status: 'pago', data_pagamento: hojeISO() })
      .eq('id', nf.id);
    if (nf.google_task_id) {
      try {
        await fetch(`${NF_WORKER_URL}/completar-tarefa`, {
          method: 'POST', headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({ task_id: nf.google_task_id, tasklist_id: nf.google_tasklist_id }),
        });
      } catch (e) { console.warn('Não consegui completar a tarefa no Google Agenda:', e); }
    }
    load();
  }

  const filtrados = items.filter(nf => filtro === 'todas' ? true : statusDe(nf) === filtro);
  const kpi = {
    aguardando: items.filter(nf => statusDe(nf) === 'aguardando').reduce((s, n) => s + Number(n.valor || 0), 0),
    atrasadas: items.filter(nf => statusDe(nf) === 'atrasado').length,
    pagoMes: items.filter(nf => nf.status === 'pago' && (nf.data_pagamento || '').slice(0, 7) === hojeISO().slice(0, 7))
      .reduce((s, n) => s + Number(n.valor || 0), 0),
  };

  const STATUS_BADGE = {
    aguardando: { tone: 'info', label: 'Aguardando' },
    atrasado:   { tone: 'danger', label: 'Atrasado' },
    pago:       { tone: 'success', label: 'Pago' },
  };
  const FILTROS = [
    { id: 'todas', label: 'Todas' },
    { id: 'aguardando', label: 'Aguardando' },
    { id: 'atrasado', label: 'Atrasadas' },
    { id: 'pago', label: 'Pagas' },
  ];

  return (
    <div style={{ display: 'flex', flexDirection: 'column', flex: 1, minHeight: 0, overflow: 'hidden' }}>
      <TopBar title="Notas Fiscais"
        actions={<Btn variant="primary" icon="plus" onClick={() => setModal({ item: null })}>Nova NF</Btn>} />

      <div style={{ flex: 1, overflowY: 'auto', padding: '18px 24px', display: 'flex', flexDirection: 'column', gap: 16 }}>
        <div style={{ display: 'flex', gap: 12 }}>
          <CardKPI label="Aguardando pagamento" value={fmtBRL(kpi.aguardando)} icon="clock" />
          <CardKPI label="Notas atrasadas" value={kpi.atrasadas} icon="alert-triangle" accent={kpi.atrasadas > 0} />
          <CardKPI label="Pago este mês" value={fmtBRL(kpi.pagoMes)} icon="check-circle-2" />
        </div>

        <div style={{ display: 'flex', gap: 6 }}>
          {FILTROS.map(f => (
            <button key={f.id} onClick={() => setFiltro(f.id)}
              style={{
                padding: '6px 14px', borderRadius: 999, cursor: 'pointer',
                background: filtro === f.id ? 'rgba(234,170,65,.15)' : 'var(--app-surface-2)',
                border: `1px solid ${filtro === f.id ? 'rgba(234,170,65,.3)' : 'var(--app-border)'}`,
                color: filtro === f.id ? 'var(--fmn-gold)' : 'var(--text-2)',
                fontFamily: 'Roboto, sans-serif', fontWeight: 700, fontSize: 11.5,
              }}>{f.label}</button>
          ))}
        </div>

        <SectionCard noPad>
          {loading ? (
            <div style={{ padding: 24, textAlign: 'center', color: 'var(--text-3)', fontSize: 13 }}>Carregando…</div>
          ) : filtrados.length === 0 ? (
            <div style={{ padding: 24, textAlign: 'center', color: 'var(--text-3)', fontSize: 13 }}>Nenhuma NF aqui ainda.</div>
          ) : (
            <table style={{ width: '100%', borderCollapse: 'collapse' }}>
              <thead>
                <tr style={{ borderBottom: '1px solid var(--app-border)' }}>
                  {['NF', 'Resumo', 'Responsável', 'Emissão', 'Prazo', 'Valor', 'Status', ''].map(h => (
                    <th key={h} style={{ textAlign: 'left', padding: '10px 14px', fontSize: 10.5,
                      fontFamily: 'Roboto, sans-serif', fontWeight: 700, letterSpacing: '0.08em',
                      textTransform: 'uppercase', color: 'var(--text-3)' }}>{h}</th>
                  ))}
                </tr>
              </thead>
              <tbody>
                {filtrados.map(nf => {
                  const st = statusDe(nf);
                  const badge = STATUS_BADGE[st];
                  return (
                    <tr key={nf.id} style={{ borderBottom: '1px solid var(--app-border)', cursor: 'pointer' }}
                      onClick={() => setModal({ item: nf })}>
                      <td style={{ padding: '10px 14px', fontSize: 12.5, color: 'var(--text-1)', fontWeight: 700 }}>{nf.numero_nf}</td>
                      <td style={{ padding: '10px 14px', fontSize: 12, color: 'var(--text-2)', maxWidth: 220,
                        overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{nf.resumo_servico || '—'}</td>
                      <td style={{ padding: '10px 14px', fontSize: 12, color: 'var(--text-2)' }}>{nf.responsavel_cliente || '—'}</td>
                      <td style={{ padding: '10px 14px', fontSize: 12, color: 'var(--text-2)' }}>{fmtDataBR(nf.data_emissao)}</td>
                      <td style={{ padding: '10px 14px', fontSize: 12, color: 'var(--text-2)' }}>{fmtDataBR(nf.prazo_pagamento)}</td>
                      <td style={{ padding: '10px 14px', fontSize: 12, color: 'var(--text-2)' }}>{nf.valor ? fmtBRL(nf.valor) : '—'}</td>
                      <td style={{ padding: '10px 14px' }}><Badge tone={badge.tone}>{badge.label}</Badge></td>
                      <td style={{ padding: '10px 14px', textAlign: 'right' }} onClick={e => e.stopPropagation()}>
                        <div style={{ display: 'flex', gap: 6, justifyContent: 'flex-end' }}>
                          {nf.pdf_url && (
                            <a href={nf.pdf_url} target="_blank" rel="noreferrer"
                              style={{ color: 'var(--text-3)', display: 'flex' }} title="Abrir PDF">
                              <LucideIcon icon="file-text" size={15} />
                            </a>
                          )}
                          {st !== 'pago' && (
                            <Btn variant="ghost" size="sm" onClick={() => marcarPago(nf)}>Marcar pago</Btn>
                          )}
                        </div>
                      </td>
                    </tr>
                  );
                })}
              </tbody>
            </table>
          )}
        </SectionCard>
      </div>

      {modal && (
        <NFModal item={modal.item} onClose={() => setModal(null)}
          onSaved={() => { setModal(null); load(); }} />
      )}
    </div>
  );
}

Object.assign(window, { NotasFiscaisScreen });