/* Účtovníček — Partneri (adresár odberateľov a dodávateľov) */

function PagePartners({ go }) {
  const [search, setSearch] = React.useState('');
  const [openId, setOpenId] = React.useState(null);
  const [creating, setCreating] = React.useState(false);
  const [setToast, Toast] = useToast();
  const partners = uctStore.partners.list();
  const q = search.trim().toLowerCase();
  const filtered = partners.filter(p => !q || p.name.toLowerCase().includes(q) || (p.ico || '').includes(q) || (p.city || '').toLowerCase().includes(q));
  const invoicesOf = (id) => uctStore.invoices.all().filter(i => i.partnerId === id);

  return (
    <div className="page">
      <div className="page-head">
        <div>
          <h1>Partneri</h1>
          <div className="sub">{partners.length} {plural(partners.length, 'partner', 'partneri', 'partnerov')} · odberatelia aj dodávatelia na jednom mieste</div>
        </div>
        <div style={{display:'flex', gap:10}}>
          <div className="search-wrap">
            <Icon name="search" size={14} className="search-ic" />
            <input className="input" placeholder="Hľadať meno, IČO, mesto…" value={search} onChange={e => setSearch(e.target.value)} />
          </div>
          <button className="btn btn-brand" onClick={() => setCreating(true)}><Icon name="plus" /> Pridať partnera</button>
        </div>
      </div>

      <div className="card">
        <table className="tbl">
          <thead><tr><th>Názov</th><th>IČO</th><th>DIČ</th><th>Mesto</th><th>E-mail</th><th className="num">Faktúry</th><th></th></tr></thead>
          <tbody>
            {filtered.map(p => (
              <tr key={p.id} className="clickable" onClick={() => setOpenId(p.id)}>
                <td><strong>{p.name}</strong>{p.demo && <span className="badge gray" style={{marginLeft:8}}>ukážka</span>}</td>
                <td className="mono">{p.ico || '—'}</td>
                <td className="mono">{p.dic || '—'}</td>
                <td>{p.city || '—'}</td>
                <td className="muted">{p.email || '—'}</td>
                <td className="num">{invoicesOf(p.id).length || '—'}</td>
                <td><Icon name="chevronRight" /></td>
              </tr>
            ))}
            {filtered.length === 0 && <tr><td colSpan="7"><div className="empty"><Icon name="users" size={36} /><h4>{q ? 'Nič sa nenašlo' : 'Žiadni partneri'}</h4><div>{q ? 'Skús iné slovo.' : 'Pridaj prvého partnera - odberateľa alebo dodávateľa.'}</div></div></td></tr>}
          </tbody>
        </table>
      </div>

      {(openId || creating) && (
        <PartnerDrawer id={openId} onClose={() => { setOpenId(null); setCreating(false); }} setToast={setToast} go={go} />
      )}
      {Toast}
    </div>
  );
}

function blankPartner() {
  return { name: '', ico: '', dic: '', icDph: '', street: '', city: '', zip: '', country: 'Slovensko', email: '', phone: '', iban: '', note: '' };
}

/* Formulár partnera. onSaved(p) sa volá po uložení - používa ho aj faktúra pri rýchlom pridaní. */
function PartnerDrawer({ id, onClose, setToast, onSaved, go }) {
  const isNew = !id;
  const [p, setP] = React.useState(() => isNew ? blankPartner() : { ...uctStore.partners.get(id) });
  const [error, setError] = React.useState(null);
  const [saving, setSaving] = React.useState(false);
  const [askConfirm, ConfirmUI] = useConfirm();
  const set = (k) => (e) => setP({ ...p, [k]: e.target.value });
  const invs = isNew ? [] : uctStore.invoices.all().filter(i => i.partnerId === id);

  const save = async () => {
    if (!p.name.trim()) { setError('Vyplň názov partnera.'); return; }
    setSaving(true); setError(null);
    try {
      const saved = isNew ? await uctStore.partners.create(p) : await uctStore.partners.update(p);
      setToast && setToast(isNew ? 'Partner pridaný.' : 'Partner uložený.');
      onSaved ? onSaved(saved) : onClose();
    } catch (e) { setError(e.message); }
    setSaving(false);
  };
  const remove = async () => {
    if (!await askConfirm({ title: 'Vymazať partnera?', message: `${p.name} zmizne z adresára. Faktúry sa nemažú.`, confirmLabel: 'Vymazať', danger: true })) return;
    try { await uctStore.partners.remove(id); setToast && setToast('Partner vymazaný.'); onClose(); }
    catch (e) { setError(e.message); }
  };

  return (
    <Drawer title={isNew ? 'Nový partner' : p.name} sub={isNew ? 'Odberateľ alebo dodávateľ' : (p.ico ? `IČO ${p.ico}` : null)} onClose={onClose}
      footer={<>
        {!isNew && <button className="btn btn-ghost" style={{marginRight:'auto', color:'var(--danger)'}} onClick={remove}><Icon name="trash" /> Vymazať</button>}
        <button className="btn btn-ghost" onClick={onClose}>Zrušiť</button>
        <button className="btn btn-brand" disabled={saving} onClick={save}><Icon name="check" /> {isNew ? 'Pridať' : 'Uložiť'}</button>
      </>}>
      <ErrorNote error={error} onClose={() => setError(null)} />
      <div style={{display:'flex', flexDirection:'column', gap:14}}>
        <Field label="Názov / meno"><input className="input" autoFocus value={p.name} onChange={set('name')} placeholder="Firma s. r. o." /></Field>
        <div className="row r3">
          <Field label="IČO"><input className="input" value={p.ico} onChange={set('ico')} /></Field>
          <Field label="DIČ"><input className="input" value={p.dic} onChange={set('dic')} /></Field>
          <Field label="IČ DPH"><input className="input" value={p.icDph} onChange={set('icDph')} placeholder="SK…" /></Field>
        </div>
        <Field label="Ulica a číslo"><input className="input" value={p.street} onChange={set('street')} /></Field>
        <div className="row r3">
          <Field label="PSČ"><input className="input" value={p.zip} onChange={set('zip')} /></Field>
          <Field label="Mesto"><input className="input" value={p.city} onChange={set('city')} /></Field>
          <Field label="Štát"><input className="input" value={p.country} onChange={set('country')} /></Field>
        </div>
        <div className="row">
          <Field label="E-mail"><input className="input" value={p.email} onChange={set('email')} /></Field>
          <Field label="Telefón"><input className="input" value={p.phone} onChange={set('phone')} /></Field>
        </div>
        <Field label="IBAN" hint="Pri dodávateľovi: kam mu platíš."><input className="input mono" value={p.iban} onChange={set('iban')} /></Field>
        <Field label="Poznámka"><textarea className="textarea" rows={2} value={p.note} onChange={set('note')} /></Field>

        {!isNew && invs.length > 0 && (
          <div className="card" style={{marginTop:6}}>
            <div className="card-h"><div><h3>Faktúry partnera</h3><div className="desc">{invs.length} {plural(invs.length, 'faktúra', 'faktúry', 'faktúr')}</div></div></div>
            <table className="tbl">
              <tbody>
                {invs.slice(0, 8).map(i => (
                  <tr key={i.id} className="clickable" onClick={() => { onClose(); go && go('invoices:open:' + i.id); }}>
                    <td className="mono">{i.number}</td><td>{fmt.date(i.issueDate)}</td><td><StatusBadge inv={i} /></td><td className="num">{fmt.eur(i.total)}</td>
                  </tr>
                ))}
              </tbody>
            </table>
          </div>
        )}
      </div>
      {ConfirmUI}
    </Drawer>
  );
}