// financial-aid.jsx — Поворотна фінансова допомога (ПФД) для ТОВ.
// Облік внесків від учасника / стороннього ТОВ + контроль строків повернення.
// Рух коштів — у «Грошах» (cash_ops: loan_in при отриманні, loan_out при поверненні).

const LENDER_TYPE = { participant: "Учасник / засновник", company: "Стороннє ТОВ" };

function AidForm({ accounts, editing, onSave, onCancel }) {
  const val = (id) => id === null ? "cash" : id;
  const toId = (v) => v === "cash" ? null : v;
  const today = window.SYS_DATE;
  const isEdit = !!editing;
  // Строк = 12 календарних місяців від дати отримання: пізніше сума рахується доходом.
  const plus12 = (ds) => { try { const d = new Date((ds || today) + "T00:00:00"); d.setMonth(d.getMonth() + 12); return d.toISOString().slice(0, 10); } catch (e) { return ds || today; } };
  const [f, setF] = React.useState(editing
    ? { lenderType: editing.lenderType || "participant", lender: editing.lender || "", amount: String(editing.amount || ""), account: val(editing.account || null), dateIn: editing.dateIn || today, dueDate: editing.dueDate || plus12(editing.dateIn || today), note: editing.note || "" }
    : { lenderType: "participant", lender: "", amount: "", account: val(accounts[0] ? accounts[0].id : null), dateIn: today, dueDate: plus12(today), note: "" });
  const [busy, setBusy] = React.useState(false);
  const set = (k, v) => setF(p => ({ ...p, [k]: v }));
  const num = parseFloat(String(f.amount).replace(/\s/g, "").replace(",", ".")) || 0;
  const canSave = f.lender.trim() && num > 0 && f.dateIn && f.dueDate;
  const save = async () => {
    if (!canSave || busy) return;
    setBusy(true);
    const ok = await onSave({ lenderType: f.lenderType, lender: f.lender.trim(), amount: Math.round(num), account: toId(f.account), dateIn: f.dateIn, dueDate: f.dueDate, note: f.note.trim() || null });
    setBusy(false);
    if (ok !== false) onCancel();
  };
  return (
    <div className="cash-addform">
      <div className="cash-addform-grid">
        <div className="cp-row"><label className="cp-label">Хто дав</label>
          <div className="nt-seg">
            <button type="button" className={`nt-seg-item ${f.lenderType === "participant" ? "is-active" : ""}`} onClick={() => set("lenderType", "participant")}>Учасник</button>
            <button type="button" className={`nt-seg-item ${f.lenderType === "company" ? "is-active" : ""}`} onClick={() => set("lenderType", "company")}>Стороннє ТОВ</button>
          </div>
        </div>
        <div className="cp-row"><label className="cp-label">Назва / ПІБ <span className="cp-required">*</span></label>
          <input className="cp-input" value={f.lender} onChange={e => set("lender", e.target.value)} placeholder={f.lenderType === "participant" ? "напр. Підкапка М.І." : "напр. ТОВ «Партнер»"} /></div>
        <div className="cp-row"><label className="cp-label">Сума, ₴ <span className="cp-required">*</span></label>
          <input className="cp-input" value={f.amount} onChange={e => set("amount", e.target.value)} inputMode="numeric" placeholder="напр. 200000" /></div>
        <div className="cp-row"><label className="cp-label">Рахунок-отримувач</label>
          <select className="cp-input" value={f.account} onChange={e => set("account", e.target.value)}>
            {accounts.map(a => <option key={a.id || "cash"} value={val(a.id)}>{a.label}{a.entity === "tov" ? " (ТОВ)" : a.entity === "fop" ? " (ФОП)" : ""}</option>)}
          </select></div>
        <div className="cp-row"><label className="cp-label">Дата отримання</label>
          <input className="cp-input" type="date" value={f.dateIn} onChange={e => setF(p => ({ ...p, dateIn: e.target.value, dueDate: plus12(e.target.value) }))} /></div>
        <div className="cp-row"><label className="cp-label">Строк повернення <span className="cp-required">*</span></label>
          <input className="cp-input" type="date" value={f.dueDate} onChange={e => set("dueDate", e.target.value)} />
          <div style={{ fontSize: 11, color: "var(--ink-3)", marginTop: 2 }}>авто: 12 міс від дати отримання</div></div>
        <div className="cp-row cp-row-full"><label className="cp-label">Нотатка</label>
          <input className="cp-input" value={f.note} onChange={e => set("note", e.target.value)} placeholder="договір/призначення (необов'язково)" /></div>
      </div>
      <div className="auth-hint" style={{ padding: "0 0 8px" }}>{isEdit ? "Зміни синхронізуються з відповідним надходженням у «Грошах» (рахунок/сума/дата)." : "При збереженні на обраний рахунок одразу додасться надходження — баланс зросте."}</div>
      <div className="cash-addform-foot">
        <button className="btn" onClick={onCancel} disabled={busy}>Скасувати</button>
        <button className="btn btn-primary" onClick={save} disabled={!canSave || busy} style={!canSave || busy ? { opacity: 0.5 } : {}}>{busy ? "Збереження…" : isEdit ? "Зберегти зміни" : "Додати ПФД"}</button>
      </div>
    </div>
  );
}

function FinancialAidPage({ role }) {
  const live = !!(window.API && window.API.mode === "live");
  const m = window.formatMoney;
  const today = window.SYS_DATE;
  const canEdit = role === "director" || role === "accountant";
  const [aids, setAids] = React.useState(live ? [] : (window.DATA.FINANCIAL_AID || []));
  const [accounts, setAccounts] = React.useState([]);
  const [adding, setAdding] = React.useState(false);
  const [editingAid, setEditingAid] = React.useState(null);
  const [busy, setBusy] = React.useState(false);

  const reload = React.useCallback(() => {
    if (!live) return Promise.resolve();
    return Promise.all([
      window.API.list("financial-aid").then(r => setAids(r || [])).catch(() => {}),
      window.API.list("cash-accounts").then(r => setAccounts(r || [])).catch(() => {}),
    ]);
  }, [live]);
  React.useEffect(() => { reload(); }, [reload]);

  const accountList = [{ id: null, label: "Готівка", entity: "cash" }, ...accounts];
  const acctLabel = (id) => (accountList.find(a => (a.id || null) === (id || null)) || {}).label || "—";
  const daysLeft = (due) => { if (!due) return null; try { return Math.round((new Date(due + "T00:00:00") - new Date(today + "T00:00:00")) / 86400000); } catch (e) { return null; } };
  const statusOf = (a) => {
    if (a.status === "returned") return { key: "returned", label: "повернено", cls: "tone-neutral" };
    const d = daysLeft(a.dueDate);
    if (d != null && d < 0) return { key: "overdue", label: `прострочено ${-d} дн`, cls: "tone-warn" };
    if (d != null && d <= 14) return { key: "soon", label: `${d} дн до повернення`, cls: "tone-amber" };
    return { key: "active", label: "активна", cls: "tone-live" };
  };

  const active = aids.filter(a => a.status !== "returned");
  const totalActive = active.reduce((s, a) => s + (a.amount || 0), 0);
  const overdue = active.filter(a => statusOf(a).key === "overdue");
  const totalOverdue = overdue.reduce((s, a) => s + (a.amount || 0), 0);
  const returned = aids.filter(a => a.status === "returned");

  const sorted = [...aids].sort((a, b) => {
    if ((a.status === "returned") !== (b.status === "returned")) return a.status === "returned" ? 1 : -1;
    return (a.dueDate || "").localeCompare(b.dueDate || "");
  });

  const addAid = async (data) => {
    if (live) {
      try {
        const created = await window.API.post("/financial-aid", { ...data, status: "active" });
        await window.API.post("/cash-ops", { date: data.dateIn, type: "in", category: "loan_in", amount: data.amount, counterparty: data.lender, note: "Поворотна фін. допомога" + (data.note ? " · " + data.note : ""), account: data.account || null, ref: "fa:" + created.id + ":in" });
        await reload();
      } catch (e) { alert("Не вдалося додати ПФД: " + (e.message || e)); return false; }
    } else {
      setAids(prev => [{ ...data, id: "fa-" + Math.random().toString(36).slice(2, 7), status: "active" }, ...prev]);
    }
    return true;
  };

  // Редагування ПФД: оновлюємо запис реєстру + синхронізуємо прив'язане надходження в «Грошах»
  // (нога fa:<id>:in) і, якщо вже повернено, видаток (fa:<id>:out).
  const editAid = async (data) => {
    const id = editingAid.id;
    if (live) {
      try {
        await window.API.patch("/financial-aid/" + id, data);
        const ops = await window.API.list("cash-ops").catch(() => []);
        const inLeg = (ops || []).find(o => o.ref === "fa:" + id + ":in");
        const outLeg = (ops || []).find(o => o.ref === "fa:" + id + ":out");
        if (inLeg) await window.API.patch("/cash-ops/" + inLeg.id, { date: data.dateIn, amount: data.amount, counterparty: data.lender, account: data.account || null, note: "Поворотна фін. допомога" + (data.note ? " · " + data.note : "") });
        if (outLeg) await window.API.patch("/cash-ops/" + outLeg.id, { amount: data.amount, counterparty: data.lender, account: data.account || null });
        await reload();
      } catch (e) { alert("Не вдалося зберегти зміни: " + (e.message || e)); return false; }
    } else {
      setAids(prev => prev.map(x => x.id === id ? { ...x, ...data } : x));
    }
    return true;
  };

  const returnAid = async (a) => {
    if (!confirm(`Повернути ПФД ${m(a.amount)} ₴ (${a.lender})? Створиться видаток з рахунку «${acctLabel(a.account)}».`)) return;
    setBusy(true);
    if (live) {
      try {
        await window.API.post("/cash-ops", { date: today, type: "out", category: "loan_out", amount: a.amount, counterparty: a.lender, note: "Повернення фін. допомоги", account: a.account || null, ref: "fa:" + a.id + ":out" });
        await window.API.patch("/financial-aid/" + a.id, { status: "returned", returnDate: today });
        await reload();
      } catch (e) { alert("Помилка повернення: " + (e.message || e)); }
    } else {
      setAids(prev => prev.map(x => x.id === a.id ? { ...x, status: "returned", returnDate: today } : x));
    }
    setBusy(false);
  };

  if (!window.canSeeCash || !window.canSeeCash(role)) {
    return (
      <div className="page"><div className="cash-locked">
        <div className="cash-locked-ic"><window.Ico name="lock" size={26} /></div>
        <h2>Доступ обмежено</h2><p>Фінанси бачать лише директор і бухгалтер.</p>
      </div></div>
    );
  }

  return (
    <div className="page">
      <div className="page-head">
        <h1 className="page-h1">Поворотна фінансова допомога</h1>
        <div className="page-sub">
          <span>ПФД для ТОВ</span>
          <span className="dot"></span>
          <span>{active.length} активних</span>
          {overdue.length > 0 && <><span className="dot"></span><span style={{ color: "var(--late)" }}>{overdue.length} прострочено</span></>}
        </div>
      </div>

      <div className="kpi-row" style={{ gridTemplateColumns: "repeat(3, 1fr)" }}>
        <div className="kpi">
          <div className="kpi-label">Непогашено (активні)</div>
          <div className="kpi-value">{m(totalActive)} <span style={{ fontSize: 14, color: "var(--ink-3)" }}>₴</span></div>
          <div className="kpi-sub">{active.length} внесків</div>
        </div>
        <div className={`kpi ${overdue.length > 0 ? "is-warn" : ""}`}>
          <div className="kpi-label">Прострочено</div>
          <div className="kpi-value" style={{ color: overdue.length ? "var(--late)" : undefined }}>{m(totalOverdue)} <span style={{ fontSize: 14, color: "var(--ink-3)" }}>₴</span></div>
          <div className="kpi-sub">{overdue.length} потребують повернення</div>
        </div>
        <div className="kpi">
          <div className="kpi-label">Повернено</div>
          <div className="kpi-value" style={{ color: "var(--c-green-deep)" }}>{returned.length}</div>
          <div className="kpi-sub">закритих внесків</div>
        </div>
      </div>

      <div className="toolbar">
        <div className="hint-box" style={{ flex: 1, margin: 0 }}>
          ПФД треба повернути протягом <b>12 календарних місяців</b> від отримання — інакше сума рахується в дохід ТОВ. Бейдж «прострочено» підсвічує те, що пора повертати.
        </div>
        {canEdit && (
          <button className="btn btn-primary" style={{ marginLeft: "auto", whiteSpace: "nowrap" }} onClick={() => setAdding(v => !v)}>
            <window.Icon.Plus /> Додати ПФД
          </button>
        )}
      </div>

      {adding && <AidForm accounts={accountList} onSave={addAid} onCancel={() => setAdding(false)} />}
      {editingAid && <AidForm editing={editingAid} accounts={accountList} onSave={editAid} onCancel={() => setEditingAid(null)} />}

      <table className="data-table">
        <thead>
          <tr>
            <th>Позикодавець</th>
            <th>Тип</th>
            <th>Рахунок</th>
            <th className="num-col">Сума</th>
            <th>Отримано</th>
            <th>Строк повернення</th>
            <th>Статус</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          {sorted.length === 0 && (
            <tr><td colSpan={8} style={{ textAlign: "center", padding: "28px 0", color: "var(--ink-3)" }}>Ще немає записів. Натисніть «Додати ПФД».</td></tr>
          )}
          {sorted.map(a => {
            const st = statusOf(a);
            return (
              <tr key={a.id} className={st.key === "overdue" ? "row-overdue" : ""}>
                <td><div className="cell-name">{a.lender}</div>{a.note && <div className="cell-sub">{a.note}</div>}</td>
                <td style={{ fontSize: 12.5, color: "var(--ink-2)" }}>{LENDER_TYPE[a.lenderType] || a.lenderType}</td>
                <td style={{ fontSize: 12.5, color: "var(--ink-2)" }}>{acctLabel(a.account)}</td>
                <td className="num-col num-bold">{m(a.amount)} ₴</td>
                <td className="td-mono" style={{ fontSize: 12 }}>{window.formatDate(a.dateIn)}</td>
                <td className="td-mono" style={{ fontSize: 12 }}>
                  {window.formatDate(a.dueDate)}
                  {a.status === "returned" && a.returnDate && <div style={{ fontSize: 11, color: "var(--c-green-deep)" }}>повернено {window.formatDate(a.returnDate)}</div>}
                </td>
                <td><span className={`status-tag ${st.cls}`}>{st.label}</span></td>
                <td>
                  <div style={{ display: "flex", gap: 4, justifyContent: "flex-end", alignItems: "center" }}>
                    {canEdit && a.status !== "returned" && (
                      <button className="btn btn-ghost" style={{ padding: "4px 8px", fontSize: 12, color: "var(--accent)" }} disabled={busy}
                              onClick={() => returnAid(a)} title="Провести повернення (видаток з рахунку)">
                        Повернути ↩
                      </button>
                    )}
                    {canEdit && (
                      <button className="btn btn-ghost btn-sm" style={{ padding: "4px 6px" }} disabled={busy}
                              onClick={() => { setEditingAid(a); setAdding(false); }} title="Редагувати ПФД">
                        <window.Ico name="pencil" size={13} />
                      </button>
                    )}
                  </div>
                </td>
              </tr>
            );
          })}
        </tbody>
      </table>
    </div>
  );
}

window.FinancialAidPage = FinancialAidPage;