// acquisition-maintenance.jsx — Checklist operacional, presets e helpers
window.NA = window.NA || {};
const MAINT_LOCAL_KEY = "nau_maint_items_v1";

const EXTRA_TO_MAINT_CATEGORY = {
  mecanica: "mecanica",
  funilaria: "pintura",
  eletrica: "eletrica",
  ipva: "documentacao",
  multas: "documentacao",
  cartorio: "documentacao",
  comissao: "outros",
  gasolina: "outros",
  pedagio: "outros",
  alimentacao: "outros",
};

const MAINTENANCE_PRESETS = {
  car: [
    { label: "Higienização interna", category: "higienizacao" },
    { label: "Revisão mecânica", category: "mecanica" },
    { label: "Funilaria / pintura", category: "pintura" },
    { label: "Elétrica", category: "eletrica" },
    { label: "Retirada rastreador proprietário", category: "rastreador" },
    { label: "Instalar nosso rastreador", category: "rastreador" },
  ],
  moto: [
    { label: "Revisão mecânica", category: "mecanica" },
    { label: "Funilaria / pintura", category: "pintura" },
    { label: "Elétrica", category: "eletrica" },
    { label: "Instalar nosso rastreador", category: "rastreador" },
  ],
  jet: [
    { label: "Revisão motor", category: "mecanica" },
    { label: "Casco / pintura", category: "pintura" },
    { label: "Elétrica / bateria", category: "eletrica" },
  ],
};

const MAINT_FILTER_TABS = [
  { key: "all", view: "maintenance" },
  { key: "pending", view: "maintenance_pending" },
  { key: "ready", view: "maintenance_ready" },
  { key: "stock", view: "stock" },
];

const MAINT_FILTER_LABELS = {
  pt: { all: "Todos", pending: "Com pendências", ready: "Prontos p/ venda", stock: "Estoque" },
  en: { all: "All", pending: "With pending", ready: "Ready to sell", stock: "Stock" },
};

function normalizeMaintenanceItem(row) {
  if (!row) return null;
  return {
    id: row.id,
    acquisitionId: row.acquisition_id || row.acquisitionId,
    label: row.label,
    category: row.category || "geral",
    done: !!row.done,
    doneAt: row.done_at || row.doneAt || null,
    sortOrder: Number(row.sort_order ?? row.sortOrder ?? 0),
    source: row.source || "manual",
    createdAt: row.created_at || row.createdAt,
    updatedAt: row.updated_at || row.updatedAt,
  };
}

function vehicleMaintenanceFlags(vehicle) {
  return {
    maintenanceReady: !!(vehicle?.maintenanceReady),
    trackerOwnerRemoved: !!(vehicle?.trackerOwnerRemoved),
    trackerOursInstalled: !!(vehicle?.trackerOursInstalled),
    trackerStatus: vehicle?.trackerStatus || "inactive",
  };
}

function computeMaintenanceProgress(items = [], flags = {}) {
  const list = items || [];
  const total = list.length;
  const done = list.filter(i => i.done).length;
  const pct = total > 0 ? Math.round((done / total) * 100) : (flags.maintenanceReady ? 100 : 0);
  const pendingLabels = list.filter(i => !i.done).map(i => i.label);
  const allItemsDone = total === 0 || done >= total;
  const trackerOk = !flags.trackerOwnerRemoved && !flags.trackerOursInstalled
    || (flags.trackerOwnerRemoved && flags.trackerOursInstalled);
  const isReadyCandidate = allItemsDone && trackerOk;
  return { total, done, pct, pendingLabels, allItemsDone, trackerOk, isReadyCandidate };
}

function hasMaintenancePending(vehicle, items = []) {
  if (!vehicle || vehicle.status === "sold") return false;
  const flags = vehicleMaintenanceFlags(vehicle);
  const prog = computeMaintenanceProgress(items, flags);
  if (prog.total > 0 && prog.done < prog.total) return true;
  if (flags.trackerOwnerRemoved && !flags.trackerOursInstalled) return true;
  if (flags.trackerOursInstalled && flags.trackerStatus !== "active") return true;
  return false;
}

function countMaintenanceAlerts(vehicles, itemsByAcq = {}) {
  const set = new Set();
  (vehicles || []).forEach(v => {
    const items = itemsByAcq[v.id] || [];
    if (hasMaintenancePending(v, items)) set.add(v.id);
  });
  return set.size;
}

function computeMaintenanceKpis(vehicles, itemsByAcq = {}) {
  const active = (vehicles || []).filter(v => v.status !== "sold");
  const cutoff = new Date();
  cutoff.setDate(cutoff.getDate() - 7);
  let inMaintenance = 0;
  let ready = 0;
  let trackerPending = 0;
  let completed7d = 0;

  active.forEach(v => {
    const items = itemsByAcq[v.id] || [];
    const flags = vehicleMaintenanceFlags(v);
    const prog = computeMaintenanceProgress(items, flags);
    if (hasMaintenancePending(v, items)) inMaintenance++;
    if (flags.maintenanceReady || (prog.isReadyCandidate && prog.pct === 100)) ready++;
    if ((flags.trackerOwnerRemoved && !flags.trackerOursInstalled)
      || (flags.trackerOursInstalled && flags.trackerStatus !== "active")) trackerPending++;
    items.forEach(it => {
      if (it.done && it.doneAt && new Date(it.doneAt) >= cutoff) completed7d++;
    });
  });

  return { inMaintenance, ready, trackerPending, completed7d, active: active.length };
}

function extrasToMaintenanceItems(extras) {
  if (!extras || typeof extras !== "object") return [];
  return Object.entries(extras)
    .filter(([, amount]) => Number(amount) > 0)
    .map(([key, amount]) => ({
      label: key.charAt(0).toUpperCase() + key.slice(1),
      category: EXTRA_TO_MAINT_CATEGORY[key] || "outros",
      source: "analysis",
      meta: { extraKey: key, amount: Number(amount) },
    }));
}

function loadLocalMaintenanceMap() {
  try {
    return JSON.parse(localStorage.getItem(MAINT_LOCAL_KEY) || "{}");
  } catch (e) {
    return {};
  }
}

function saveLocalMaintenanceMap(map) {
  try {
    localStorage.setItem(MAINT_LOCAL_KEY, JSON.stringify(map));
  } catch (e) {}
}

function CheckPillMaint({ checked, onClick, label, disabled, saving }) {
  const NA = window.NA;
  return (
    <div onClick={disabled || saving ? undefined : onClick}
      onKeyDown={(e) => { if (!disabled && !saving && (e.key === "Enter" || e.key === " ")) { e.preventDefault(); onClick && onClick(); } }}
      role="button" tabIndex={0} className="row gap-8" style={{
        padding: "8px 12px",
        border: "1px solid " + (checked ? "var(--color-success-border)" : "var(--color-border)"),
        borderRadius: 6,
        cursor: disabled || saving ? "not-allowed" : "pointer",
        opacity: disabled || saving ? 0.65 : 1,
        background: checked ? "var(--color-success-bg)" : "transparent",
        color: checked ? "var(--green-7)" : "var(--fg1)",
        fontSize: 13,
      }}>
      <NA.Icon name={checked ? "check-circle-2" : "circle"} size={14} />
      <span>{label}{saving ? " …" : ""}</span>
    </div>
  );
}

function MaintenanceFlags({ vehicle, lang, canEdit, saving, onChange }) {
  const flags = vehicleMaintenanceFlags(vehicle);
  return (
    <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 8, marginBottom: 8 }}>
      <CheckPillMaint
        checked={flags.trackerOwnerRemoved}
        disabled={!canEdit}
        saving={saving === "trackerOwnerRemoved"}
        onClick={() => onChange && onChange({ trackerOwnerRemoved: !flags.trackerOwnerRemoved })}
        label={lang === "pt" ? "Retirada do rastreador (proprietário)" : "Remove owner's tracker"}
      />
      <CheckPillMaint
        checked={flags.trackerOursInstalled}
        disabled={!canEdit}
        saving={saving === "trackerOursInstalled"}
        onClick={() => onChange && onChange({
          trackerOursInstalled: !flags.trackerOursInstalled,
          trackerStatus: !flags.trackerOursInstalled ? "active" : vehicle.trackerStatus,
        })}
        label={lang === "pt" ? "Colocar nosso rastreador" : "Install our tracker"}
      />
      <CheckPillMaint
        checked={flags.maintenanceReady}
        disabled={!canEdit}
        saving={saving === "maintenanceReady"}
        onClick={() => onChange && onChange({ maintenanceReady: !flags.maintenanceReady })}
        label={lang === "pt" ? "Pronto para venda" : "Ready to sell"}
      />
    </div>
  );
}

function MaintenanceChecklist({
  acquisitionId, items = [], lang = "pt", compact = false,
  canEdit = true, savingId = null, onToggle, onDelete, onAdd,
}) {
  const NA = window.NA;
  const [draft, setDraft] = React.useState("");
  const prog = computeMaintenanceProgress(items);

  if (compact) {
    return (
      <div className="row gap-4" style={{ flexWrap: "wrap" }}>
        <span className="mono fs-11">{prog.done}/{prog.total || 0}</span>
        {prog.pct >= 100 && <span className="chip fs-10 text-success">✓</span>}
        {prog.pendingLabels.slice(0, 2).map(l => (
          <span key={l} className="chip fs-10">{l}</span>
        ))}
      </div>
    );
  }

  return (
    <div className="col gap-8">
      <div className="row jcsb fs-12 text-muted">
        <span>{prog.done}/{prog.total || 0} {lang === "pt" ? "concluídos" : "done"}</span>
        <NA.Progress value={prog.pct} style={{ width: 96 }} />
      </div>
      {items.length === 0 && (
        <div className="hint">{lang === "pt" ? "Nenhum item de manutenção." : "No maintenance items."}</div>
      )}
      <div className="col gap-4">
        {items.map(it => (
          <div key={it.id} className="row" style={{
            padding: "6px 10px",
            border: "1px solid var(--color-border-secondary)",
            borderRadius: 4,
            background: it.done ? "var(--color-success-bg)" : "transparent",
          }}>
            <input type="checkbox" checked={!!it.done} disabled={!canEdit || savingId === it.id}
              onChange={() => onToggle && onToggle(it)}
              style={{ accentColor: "var(--color-primary)" }} />
            <span className="fs-13" style={{
              flex: 1,
              textDecoration: it.done ? "line-through" : "none",
              color: it.done ? "var(--fg3)" : "var(--fg1)",
            }}>{it.label}</span>
            {canEdit && (
              <button type="button" className="icon-btn-sq" disabled={savingId === it.id}
                onClick={() => onDelete && onDelete(it)}
                style={{ width: 22, height: 22, border: "none", background: "transparent", color: "var(--fg3)" }}>
                <NA.Icon name="trash-2" size={12} />
              </button>
            )}
          </div>
        ))}
      </div>
      {canEdit && (
        <div className="row gap-8 mt-4">
          <input className="input" value={draft} onChange={e => setDraft(e.target.value)}
            placeholder={lang === "pt" ? "Adicionar item (ex.: troca de óleo)" : "Add item (e.g. oil change)"}
            onKeyDown={e => {
              if (e.key === "Enter" && draft.trim()) {
                onAdd && onAdd(draft.trim());
                setDraft("");
              }
            }} />
          <button type="button" className="icon-btn-sq" onClick={() => {
            if (!draft.trim()) return;
            onAdd && onAdd(draft.trim());
            setDraft("");
          }}><NA.Icon name="plus" size={14} /></button>
        </div>
      )}
    </div>
  );
}

function MaintenanceDrawer({ open, vehicle, items, lang, setT, t, canEdit, onClose, onRefresh }) {
  const NA = window.NA;
  const [saving, setSaving] = React.useState(null);
  const [saveMsg, setSaveMsg] = React.useState("");
  const db = NA.db;

  if (!open || !vehicle) return null;

  const tr = t || (k => NA.t(k, lang));
  const prog = computeMaintenanceProgress(items, vehicleMaintenanceFlags(vehicle));

  const persistToggle = async (item) => {
    setSaving(item.id);
    setSaveMsg(lang === "pt" ? "Salvando…" : "Saving…");
    try {
      if (db?.toggleMaintenanceItem) await db.toggleMaintenanceItem(item.id, !item.done);
      await onRefresh && onRefresh();
      window.dispatchEvent(new Event("na:acquisitions-changed"));
      setSaveMsg(lang === "pt" ? "Salvo" : "Saved");
    } catch (err) {
      setSaveMsg(err.message || String(err));
    } finally {
      setSaving(null);
      setTimeout(() => setSaveMsg(""), 2000);
    }
  };

  const persistDelete = async (item) => {
    setSaving(item.id);
    try {
      if (db?.deleteMaintenanceItem) await db.deleteMaintenanceItem(item.id);
      await onRefresh && onRefresh();
      window.dispatchEvent(new Event("na:acquisitions-changed"));
    } catch (err) {
      alert(err.message);
    } finally {
      setSaving(null);
    }
  };

  const persistAdd = async (label) => {
    setSaving("add");
    try {
      if (db?.upsertMaintenanceItem) {
        await db.upsertMaintenanceItem({ acquisitionId: vehicle.id, label, category: "outros", source: "manual" });
      }
      await onRefresh && onRefresh();
      window.dispatchEvent(new Event("na:acquisitions-changed"));
    } catch (err) {
      alert(err.message);
    } finally {
      setSaving(null);
    }
  };

  const persistFlags = async (patch) => {
    const key = Object.keys(patch)[0];
    setSaving(key);
    try {
      if (db?.updateMaintenanceFlags) await db.updateMaintenanceFlags(vehicle.id, patch);
      await onRefresh && onRefresh();
      window.dispatchEvent(new Event("na:acquisitions-changed"));
      if (patch.maintenanceReady && prog.isReadyCandidate && vehicle.status !== "in_stock") {
        const goStock = confirm(lang === "pt"
          ? "Checklist completo. Mover veículo para Em estoque?"
          : "Checklist complete. Move vehicle to In stock?");
        if (goStock && db?.updateAcquisitionStatus) {
          await db.updateAcquisitionStatus(vehicle.id, "in_stock", { lang });
          window.dispatchEvent(new Event("na:acquisitions-changed"));
        }
      }
    } catch (err) {
      alert(err.message);
    } finally {
      setSaving(null);
    }
  };

  const recentDone = (items || []).filter(i => i.done && i.doneAt)
    .sort((a, b) => new Date(b.doneAt) - new Date(a.doneAt)).slice(0, 5);

  return (
    <div className="na-drawer-mask" onClick={onClose} role="presentation">
      <aside className="na-drawer-panel" style={{ maxWidth: 480, width: "min(480px, 96vw)" }}
        onClick={e => e.stopPropagation()} role="dialog" aria-modal="true">
        <div className="na-drawer-head">
          <div>
            <div className="row gap-8 mb-8">
              <span className="chip mono fw-600">{vehicle.plate}</span>
              <NA.StatusTag status={vehicle.status} lang={lang} />
            </div>
            <div className="fw-600 fs-16">{vehicle.brand} {vehicle.model}</div>
            <div className="text-faint fs-12">{vehicle.sellerName || vehicle.owner}</div>
          </div>
          <button type="button" className="icon-btn" onClick={onClose}><NA.Icon name="x" size={16} /></button>
        </div>
        <div className="na-drawer-body">
          {saveMsg && <div className="hint mb-8">{saveMsg}</div>}
          <MaintenanceFlags vehicle={vehicle} lang={lang} canEdit={canEdit} saving={saving} onChange={persistFlags} />
          <MaintenanceChecklist
            acquisitionId={vehicle.id}
            items={items}
            lang={lang}
            canEdit={canEdit}
            savingId={saving}
            onToggle={persistToggle}
            onDelete={persistDelete}
            onAdd={persistAdd}
          />
          {recentDone.length > 0 && (
            <div className="mt-16">
              <div className="fs-11 fw-600 text-faint mb-8">{lang === "pt" ? "CONCLUÍDOS RECENTES" : "RECENTLY DONE"}</div>
              {recentDone.map(it => (
                <div key={it.id} className="fs-12 text-muted mb-4">✓ {it.label}</div>
              ))}
            </div>
          )}
        </div>
        <div className="na-drawer-foot col gap-8">
          {setT && (
            <>
              <NA.Button kind="default" icon="receipt" onClick={() => {
                setT({ module: "acquisitions", acquisitionId: vehicle.id, acqTab: "costs" });
                onClose && onClose();
              }}>{lang === "pt" ? "Registrar custo de oficina" : "Register shop cost"}</NA.Button>
              <NA.Button kind="ghost" icon="archive" onClick={() => {
                setT({ module: "acquisitions", acquisitionId: vehicle.id });
                onClose && onClose();
              }}>{lang === "pt" ? "Abrir aquisição completa" : "Open full acquisition"}</NA.Button>
            </>
          )}
        </div>
      </aside>
    </div>
  );
}

const AcquisitionMaintenance = {
  MAINTENANCE_PRESETS,
  MAINT_FILTER_TABS,
  MAINT_FILTER_LABELS,
  EXTRA_TO_MAINT_CATEGORY,
  normalizeMaintenanceItem,
  vehicleMaintenanceFlags,
  computeMaintenanceProgress,
  hasMaintenancePending,
  countMaintenanceAlerts,
  computeMaintenanceKpis,
  extrasToMaintenanceItems,
  loadLocalMaintenanceMap,
  saveLocalMaintenanceMap,
  MaintenanceChecklist,
  MaintenanceFlags,
  MaintenanceDrawer,
  CheckPillMaint,
};

window.NA.AcquisitionMaintenance = AcquisitionMaintenance;
Object.assign(window.NA, {
  MaintenanceChecklist,
  MaintenanceFlags,
  MaintenanceDrawer,
});
