// procurement-prf.jsx — FORM 10 «Запит на закупівлю» (Purchase Request Form).
// Екран-форма, заповнюється з рядка Плану закупівель, редагується, експортується
// в .xlsx (SheetJS). Дані зберігаються у procurement.prf (персист через onSave).

(function () {
  const TYPE_UNIT = { Services: "people/days", Works: "service", Goods: "pcs" };

  // легкий парсер «(days, 70)» / «(15 pcs)» / «(1 service)» → {unit, qty}
  function parseUnitQty(title, type) {
    const m = String(title || "").match(/\(([^)]*)\)/);
    let unit = TYPE_UNIT[type] || "", qty = "";
    if (m) {
      const inside = m[1];
      const num = inside.match(/\d+(?:[.,]\d+)?/);
      if (num) qty = Number(num[0].replace(",", "."));
      const word = inside.replace(/[\d.,]/g, "").replace(/[,;]/g, " ").trim();
      if (word) unit = word;
    }
    return { unit, qty };
  }

  function blankItem(n) { return { id: "it-" + Math.random().toString(36).slice(2, 6), no: n, planLine: "", desc: "", unit: "", qty: "", projectCode: "", budgetLine: "" }; }

  // Побудувати початковий PRF із рядка плану + проєкту
  function seedPrf(row, project, planIndex) {
    const uq = parseUnitQty(row.title, row.type);
    return {
      deliveryDate: row.needDate || "",
      address: "",
      office: "ГО «Екоклуб»",
      committee: "",
      responsible: "",
      criteriaRef: "",
      criteria: [],
      items: [{
        ...blankItem(1),
        planLine: String(planIndex != null ? planIndex + 1 : ""),
        desc: row.title || "",
        unit: uq.unit, qty: uq.qty,
        projectCode: project.code || "",
        budgetLine: row.budgetLine || "",
      }],
      sign: { requestor: { name: "", position: "" }, authorizer: { name: "", position: "" }, procurement: { name: "", position: "" } },
    };
  }

  // ── експорт у .xlsx (спільний рендерер ExcelJS) ──
  function exportXlsx(prf, row, project) {
    if (!window.ProcXlsx) { alert("Модуль Excel не завантажився. Онови сторінку."); return; }
    const x = window.ProcXlsx;
    const critText = (prf.criteria || []).map(c => `${c.name} — ${c.weight}%`).join("; ");
    const itemCols = [
      { header: "S.No", width: 6 }, { header: "Line № in Plan / № рядка", width: 16 },
      { header: "Description / Опис", width: 40 }, { header: "Unit / Од.", width: 12 },
      { header: "Qty / К-сть", width: 10 }, { header: "Project code / Код проєкту", width: 18 },
      { header: "Budget line / Бюдж. лінія", width: 18 },
    ];
    const itemRows = (prf.items || []).map((it, i) => [i + 1, it.planLine, it.desc, it.unit, it.qty, it.projectCode, it.budgetLine]);
    const signCols = [{ header: "", width: 26 }, { header: "Full name / ПІБ", width: 26 }, { header: "Position / Посада", width: 24 }, { header: "Signature / Підпис", width: 20 }];
    const signRows = [
      ["Requestor / Замовник", prf.sign.requestor.name, prf.sign.requestor.position, ""],
      ["Authorizer / Затверджувач", prf.sign.authorizer.name, prf.sign.authorizer.position, ""],
      ["Procurement / Закупівлі", prf.sign.procurement.name, prf.sign.procurement.position, ""],
    ];
    const blocks = [
      x.title("PURCHASE REQUEST FORM / ЗАПИТ НА ЗАКУПІВЛЮ (Форма 10)"), x.gap(),
      x.field("Requested delivery date / Дата потреби", prf.deliveryDate || ""),
      x.field("Requested delivery address / Адреса постачання", prf.address || ""),
      x.field("Office / Офіс", prf.office || ""),
      x.field("Evaluation committee members / Члени комітету оцінки", prf.committee || ""),
      x.field("Suggested evaluation criteria (weight) / Критерії оцінки", critText),
      x.field("Responsible / Budget holder / Відповідальний", prf.responsible || ""), x.gap(),
      x.table(itemCols, itemRows), x.gap(),
      x.section("SIGNATURES / ПІДПИСИ"),
      x.table(signCols, signRows),
    ];
    const safe = (project.code || "DOVIRA").replace(/[^\wА-Яа-яІЇЄґ.-]+/g, "_");
    x.save(`FORM10_PRF_${safe}_${(prf.items[0] && prf.items[0].planLine) || ""}.xlsx`, "PRF", blocks);
  }

  function PrfEditor({ row, planIndex, project, role, onSave, onClose }) {
    const canEdit = role === "director"; // тільки директор (рішення: доступ лише директорці)
    const [prf, setPrf] = React.useState(() => row.prf ? JSON.parse(JSON.stringify(row.prf)) : seedPrf(row, project, planIndex));
    const up = (patch) => setPrf(p => ({ ...p, ...patch }));
    const upItem = (id, patch) => setPrf(p => ({ ...p, items: p.items.map(it => it.id === id ? { ...it, ...patch } : it) }));
    const addItem = () => setPrf(p => ({ ...p, items: [...p.items, blankItem(p.items.length + 1)] }));
    const rmItem = (id) => setPrf(p => ({ ...p, items: p.items.filter(it => it.id !== id) }));
    const upSign = (who, patch) => setPrf(p => ({ ...p, sign: { ...p.sign, [who]: { ...p.sign[who], ...patch } } }));

    // бібліотека критеріїв (фільтр за типом закупівлі)
    const allCrit = window.DATA.PROCUREMENT_CRITERIA || [];
    const critOpts = allCrit.filter(t => !t.kind || t.kind === row.type);
    const applyCriteria = (id) => {
      const t = allCrit.find(x => x.id === id);
      up({ criteriaRef: id, criteria: t ? (t.criteria || []).map(c => ({ name: c.name, weight: c.weight })) : [] });
    };

    React.useEffect(() => {
      const onKey = (e) => { if (e.key === "Escape") onClose(); };
      window.addEventListener("keydown", onKey);
      return () => window.removeEventListener("keydown", onKey);
    }, [onClose]);

    const save = () => { onSave(prf); };

    return (
      <div className="pc-overlay">
        <div className="pc-panel" style={{ maxWidth: 880 }}>
          <div className="pc-panel-head">
            <div>
              <div className="pc-panel-title">FORM 10 · Запит на закупівлю (PRF)</div>
              <div className="pc-panel-sub">{row.title}</div>
            </div>
            <button className="drawer-close" onClick={onClose}><window.Icon.X /></button>
          </div>

          <div className="pc-panel-body">
            <div className="prf-grid">
              <label className="pc-lbl">Дата потреби
                <input className="cp-input" type="date" value={prf.deliveryDate} onChange={e => up({ deliveryDate: e.target.value })} disabled={!canEdit} />
              </label>
              <label className="pc-lbl">Офіс
                <input className="cp-input" value={prf.office} onChange={e => up({ office: e.target.value })} disabled={!canEdit} />
              </label>
              <label className="pc-lbl prf-full">Адреса постачання
                <input className="cp-input" value={prf.address} placeholder="місто, адреса доставки/надання послуг" onChange={e => up({ address: e.target.value })} disabled={!canEdit} />
              </label>
              <label className="pc-lbl prf-full">Члени комітету оцінки
                <input className="cp-input" value={prf.committee} placeholder="ПІБ через кому (за потреби)" onChange={e => up({ committee: e.target.value })} disabled={!canEdit} />
              </label>
              <label className="pc-lbl">Відповідальний / Budget holder
                <input className="cp-input" value={prf.responsible} onChange={e => up({ responsible: e.target.value })} disabled={!canEdit} />
              </label>
              <label className="pc-lbl">Критерії оцінки (шаблон)
                <select className="cp-input" value={prf.criteriaRef} onChange={e => applyCriteria(e.target.value)} disabled={!canEdit}>
                  <option value="">— не обрано —</option>
                  {critOpts.map(t => <option key={t.id} value={t.id}>{t.name}</option>)}
                </select>
              </label>
            </div>
            {prf.criteria.length > 0 && (
              <div className="prf-crit-chips">
                {prf.criteria.map((c, i) => <span key={i} className="pc-chip">{c.name} · {c.weight}%</span>)}
              </div>
            )}

            <div className="section-head" style={{ marginTop: 18 }}><h2 className="section-h2">Позиції закупівлі</h2></div>
            <table className="data-table" style={{ fontSize: 12.5 }}>
              <thead><tr><th style={{ width: 30 }}>№</th><th style={{ width: 70 }}>№ плану</th><th>Опис</th><th style={{ width: 90 }}>Од.</th><th style={{ width: 70 }}>К-сть</th><th style={{ width: 110 }}>Код проєкту</th><th style={{ width: 120 }}>Бюдж. лінія</th>{canEdit && <th style={{ width: 30 }}></th>}</tr></thead>
              <tbody>
                {prf.items.map((it, i) => (
                  <tr key={it.id}>
                    <td className="td-mono" style={{ color: "var(--ink-3)" }}>{i + 1}</td>
                    <td><input className="proc-in" value={it.planLine} onChange={e => upItem(it.id, { planLine: e.target.value })} disabled={!canEdit} /></td>
                    <td><input className="proc-in" value={it.desc} onChange={e => upItem(it.id, { desc: e.target.value })} disabled={!canEdit} /></td>
                    <td><input className="proc-in" value={it.unit} onChange={e => upItem(it.id, { unit: e.target.value })} disabled={!canEdit} /></td>
                    <td><input className="proc-in num-col" type="number" value={it.qty} onChange={e => upItem(it.id, { qty: e.target.value === "" ? "" : Number(e.target.value) })} disabled={!canEdit} /></td>
                    <td><input className="proc-in" value={it.projectCode} onChange={e => upItem(it.id, { projectCode: e.target.value })} disabled={!canEdit} /></td>
                    <td><input className="proc-in" value={it.budgetLine} onChange={e => upItem(it.id, { budgetLine: e.target.value })} disabled={!canEdit} /></td>
                    {canEdit && <td><button className="prj-row-del" title="Прибрати" onClick={() => rmItem(it.id)}><window.Icon.X /></button></td>}
                  </tr>
                ))}
              </tbody>
            </table>
            {canEdit && <button className="btn btn-sm" style={{ marginTop: 8 }} onClick={addItem}><window.Icon.Plus /> Позиція</button>}

            <div className="section-head" style={{ marginTop: 18 }}><h2 className="section-h2">Підписи</h2></div>
            <div className="prf-signs">
              {[["requestor", "Замовник (Requestor)"], ["authorizer", "Затверджувач (Authorizer)"], ["procurement", "Закупівлі (Procurement)"]].map(([who, lbl]) => (
                <div key={who} className="prf-sign">
                  <div className="prf-sign-lbl">{lbl}</div>
                  <input className="cp-input" placeholder="ПІБ" value={prf.sign[who].name} onChange={e => upSign(who, { name: e.target.value })} disabled={!canEdit} />
                  <input className="cp-input" placeholder="Посада" value={prf.sign[who].position} onChange={e => upSign(who, { position: e.target.value })} disabled={!canEdit} />
                </div>
              ))}
            </div>
          </div>

          <div className="pc-ed-foot" style={{ padding: "12px 22px" }}>
            <div style={{ flex: 1 }}></div>
            <button className="btn btn-ghost" onClick={() => exportXlsx(prf, row, project)}>Завантажити Excel</button>
            <button className="btn btn-ghost" onClick={onClose}>Закрити</button>
            {canEdit && <button className="btn btn-primary" onClick={save}>Зберегти</button>}
          </div>
        </div>
      </div>
    );
  }

  window.ProcurementPRF = PrfEditor;
})();