feat(policies): full CRUD + child editors + insurance lookups (plan phase 3)

Policy header, all five child collections, and the insurance reference
catalogs become create/edit/delete-able on the RBAC foundation.

API:
- Policy gains archivedAt (soft-delete); list/browser default to
  archivedAt=null with ?includeArchived opt-in.
- PoliciesService: header create/update/archive/restore (customer FK
  validated for a clean 404); add/update/remove for installments,
  vehicles, drivers, beneficiaries, claims — each scoped to its policy so
  one policy's id can't touch another's rows; lookups CRUD for providers,
  policy types, adjusters.
- PoliciesController write routes: header create/update need STAFF+
  (policy:create/update), archive/restore need MANAGER+ (policy:delete),
  every child route needs policy:update. New LookupsController at /lookups
  (read open; mutate needs lookup:manage / MANAGER+). Mutations audited.
- DTOs (policy header, children, lookups); dates coerced; shared coerce.ts.

Web:
- Generic ChildCollection editor (config-driven add/edit/remove table),
  reused by both the policy detail child editors and the catalogs screen.
- PolicyForm (header) with type/provider selects and a debounced
  CustomerPicker; /polizas/nuevo (accepts ?customerId prefill) and
  /polizas/[id]/editar. Policy detail: gated action bar (Editar/Archivar)
  + "Administrar detalles" child editors for all five collections.
- /catalogos admin screen (aseguradoras/tipos/ajustadores), nav-gated on
  lookup:manage. "Nueva póliza" buttons on the list and on the customer
  detail (prefilled). api.ts + types for all of the above.

Verified against dev: policy create (dates coerced, archivedAt null),
installment/vehicle add, VIEWER child-add 403, cross-policy child guard
404, lookups CRUD with VIEWER 403 / MANAGER 201, archive drops from the
default list and includeArchived surfaces it. Both apps compile clean.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

apps/web/src/components/PolicyForm.tsx

@@ -0,0 +1,292 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { useRouter } from "next/navigation";
+import { CustomerPicker } from "@/components/CustomerPicker";
+import { createPolicy, getLookups, updatePolicy } from "@/lib/api";
+import type {
+  Currency,
+  LookupsResponse,
+  PolicyDetail,
+  PolicyInput,
+} from "@/lib/types";
+
+function toDateInput(v: string | null | undefined): string {
+  if (!v) return "";
+  const d = new Date(v);
+  return isNaN(d.getTime()) ? "" : d.toISOString().slice(0, 10);
+}
+function numOrUndef(v: string): number | undefined {
+  const t = v.trim();
+  if (t === "") return undefined;
+  const n = Number(t);
+  return isNaN(n) ? undefined : n;
+}
+function s(v: string): string | undefined {
+  const t = v.trim();
+  return t === "" ? undefined : t;
+}
+
+type V = {
+  policyNumber: string;
+  policyTypeId: string;
+  insuranceProviderId: string;
+  agentName: string;
+  policyDate: string;
+  policyFrom: string;
+  policyTo: string;
+  netPremium: string;
+  policyFee: string;
+  brokerFee: string;
+  commission: string;
+  currency: Currency;
+  liquidated: boolean;
+  liquidationNumber: string;
+  liquidationDate: string;
+  endorsement: boolean;
+  observations: string;
+  notes: string;
+};
+
+function initial(p?: PolicyDetail): V {
+  return {
+    policyNumber: p?.policyNumber ?? "",
+    policyTypeId: p?.policyType?.id ?? "",
+    insuranceProviderId: p?.insuranceProvider?.id ?? "",
+    agentName: p?.agentName ?? "",
+    policyDate: toDateInput(p?.policyDate),
+    policyFrom: toDateInput(p?.policyFrom),
+    policyTo: toDateInput(p?.policyTo),
+    netPremium: p?.netPremium != null ? String(p.netPremium) : "",
+    policyFee: p?.policyFee != null ? String(p.policyFee) : "",
+    brokerFee: p?.brokerFee != null ? String(p.brokerFee) : "",
+    commission: p?.commission != null ? String(p.commission) : "",
+    currency: (p?.currency as Currency) ?? "MXN",
+    liquidated: p?.liquidated ?? false,
+    liquidationNumber: p?.liquidationNumber ?? "",
+    liquidationDate: toDateInput(p?.liquidationDate),
+    endorsement: p?.endorsement ?? false,
+    observations: p?.observations ?? "",
+    notes: p?.notes ?? "",
+  };
+}
+
+export function PolicyForm({
+  policy,
+  fixedCustomerId,
+  fixedCustomerName,
+}: {
+  policy?: PolicyDetail;
+  fixedCustomerId?: string;
+  fixedCustomerName?: string;
+}) {
+  const router = useRouter();
+  const editing = !!policy;
+  const [v, setV] = useState<V>(() => initial(policy));
+  const [lookups, setLookups] = useState<LookupsResponse | null>(null);
+  const [customerId, setCustomerId] = useState(
+    policy?.customer.id ?? fixedCustomerId ?? "",
+  );
+  const [customerName, setCustomerName] = useState(
+    policy?.customer.name ?? fixedCustomerName ?? "",
+  );
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    getLookups().then(setLookups).catch(() => setLookups(null));
+  }, []);
+
+  function set<K extends keyof V>(k: K, val: V[K]) {
+    setV((p) => ({ ...p, [k]: val }));
+  }
+
+  async function submit(e: React.FormEvent) {
+    e.preventDefault();
+    if (!customerId) {
+      setError("Seleccione un cliente.");
+      return;
+    }
+    setSaving(true);
+    setError(null);
+    const base = {
+      policyNumber: v.policyNumber.trim(),
+      policyTypeId: s(v.policyTypeId),
+      insuranceProviderId: s(v.insuranceProviderId),
+      agentName: s(v.agentName),
+      policyDate: s(v.policyDate),
+      policyFrom: s(v.policyFrom),
+      policyTo: s(v.policyTo),
+      netPremium: numOrUndef(v.netPremium),
+      policyFee: numOrUndef(v.policyFee),
+      brokerFee: numOrUndef(v.brokerFee),
+      commission: numOrUndef(v.commission),
+      currency: v.currency,
+      liquidated: v.liquidated,
+      liquidationNumber: s(v.liquidationNumber),
+      liquidationDate: s(v.liquidationDate),
+      endorsement: v.endorsement,
+      observations: s(v.observations),
+      notes: s(v.notes),
+    };
+    try {
+      if (editing) {
+        const saved = await updatePolicy(policy!.id, base);
+        router.push(`/polizas/${saved.id}`);
+      } else {
+        const payload: PolicyInput = { ...base, customerId };
+        const saved = await createPolicy(payload);
+        router.push(`/polizas/${saved.id}`);
+      }
+    } catch (e2) {
+      setError((e2 as Error)?.message ?? "No se pudo guardar la póliza.");
+      setSaving(false);
+    }
+  }
+
+  return (
+    <form onSubmit={submit}>
+      {error && <div className="state-box state-error">{error}</div>}
+
+      <div className="card" style={{ padding: 20, marginBottom: 16 }}>
+        <h2 className="section-title" style={{ marginBottom: 14 }}>Datos de la póliza</h2>
+        <div className="form-grid">
+          <label className="field">
+            <span className="field-label">Cliente *</span>
+            {editing ? (
+              <input className="input" value={customerName} disabled />
+            ) : (
+              <CustomerPicker
+                value={customerId}
+                valueName={customerName}
+                onPick={(id, name) => {
+                  setCustomerId(id);
+                  setCustomerName(name);
+                }}
+              />
+            )}
+          </label>
+          <label className="field">
+            <span className="field-label">Número de póliza *</span>
+            <input className="input" required value={v.policyNumber}
+              onChange={(e) => set("policyNumber", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Tipo</span>
+            <select className="select" value={v.policyTypeId}
+              onChange={(e) => set("policyTypeId", e.target.value)}>
+              <option value="">—</option>
+              {lookups?.types.map((t) => (
+                <option key={t.id} value={t.id}>{t.name}</option>
+              ))}
+            </select>
+          </label>
+          <label className="field">
+            <span className="field-label">Aseguradora</span>
+            <select className="select" value={v.insuranceProviderId}
+              onChange={(e) => set("insuranceProviderId", e.target.value)}>
+              <option value="">—</option>
+              {lookups?.providers.map((p) => (
+                <option key={p.id} value={p.id}>{p.name}</option>
+              ))}
+            </select>
+          </label>
+          <label className="field">
+            <span className="field-label">Agente</span>
+            <input className="input" value={v.agentName}
+              onChange={(e) => set("agentName", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Moneda</span>
+            <select className="select" value={v.currency}
+              onChange={(e) => set("currency", e.target.value as Currency)}>
+              <option value="MXN">MXN</option>
+              <option value="USD">USD</option>
+            </select>
+          </label>
+        </div>
+      </div>
+
+      <div className="card" style={{ padding: 20, marginBottom: 16 }}>
+        <h2 className="section-title" style={{ marginBottom: 14 }}>Vigencia y prima</h2>
+        <div className="form-grid">
+          <label className="field">
+            <span className="field-label">Emisión</span>
+            <input className="input" type="date" value={v.policyDate}
+              onChange={(e) => set("policyDate", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Desde</span>
+            <input className="input" type="date" value={v.policyFrom}
+              onChange={(e) => set("policyFrom", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Hasta</span>
+            <input className="input" type="date" value={v.policyTo}
+              onChange={(e) => set("policyTo", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Prima neta</span>
+            <input className="input" type="number" step="0.01" value={v.netPremium}
+              onChange={(e) => set("netPremium", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Derecho de póliza</span>
+            <input className="input" type="number" step="0.01" value={v.policyFee}
+              onChange={(e) => set("policyFee", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Comisión</span>
+            <input className="input" type="number" step="0.01" value={v.commission}
+              onChange={(e) => set("commission", e.target.value)} />
+          </label>
+        </div>
+      </div>
+
+      <div className="card" style={{ padding: 20, marginBottom: 16 }}>
+        <h2 className="section-title" style={{ marginBottom: 14 }}>Liquidación</h2>
+        <div className="form-grid">
+          <label className="field">
+            <span className="field-label">Liquidada</span>
+            <input type="checkbox" checked={v.liquidated}
+              onChange={(e) => set("liquidated", e.target.checked)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Endoso</span>
+            <input type="checkbox" checked={v.endorsement}
+              onChange={(e) => set("endorsement", e.target.checked)} />
+          </label>
+          <label className="field">
+            <span className="field-label">No. liquidación</span>
+            <input className="input" value={v.liquidationNumber}
+              onChange={(e) => set("liquidationNumber", e.target.value)} />
+          </label>
+          <label className="field">
+            <span className="field-label">Fecha liquidación</span>
+            <input className="input" type="date" value={v.liquidationDate}
+              onChange={(e) => set("liquidationDate", e.target.value)} />
+          </label>
+        </div>
+        <label className="field" style={{ marginTop: 14 }}>
+          <span className="field-label">Observaciones</span>
+          <textarea className="input" rows={2} value={v.observations}
+            onChange={(e) => set("observations", e.target.value)} />
+        </label>
+        <label className="field" style={{ marginTop: 12 }}>
+          <span className="field-label">Notas</span>
+          <textarea className="input" rows={2} value={v.notes}
+            onChange={(e) => set("notes", e.target.value)} />
+        </label>
+      </div>
+
+      <div className="form-actions">
+        <button type="submit" className="btn btn-primary" disabled={saving}>
+          {saving ? "Guardando…" : editing ? "Guardar cambios" : "Crear póliza"}
+        </button>
+        <button type="button" className="btn btn-outline" onClick={() => router.back()}>
+          Cancelar
+        </button>
+      </div>
+    </form>
+  );
+}