import { Icon } from "@iconify/react"; import { Accordion, AccordionDetails, AccordionSummary, Alert, Autocomplete, Box, Button, Checkbox, Chip, CircularProgress, Dialog, DialogActions, DialogContent, DialogTitle, Divider, FormControlLabel, IconButton, MenuItem, Paper, Step, StepLabel, Stepper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TextField, Tooltip, Typography, } from "@mui/material"; import { Fragment, useEffect, useMemo, useRef, useState } from "react"; import { toast } from "sonner"; import { getCliente, searchClientes } from "../../../api/clientes.service"; import { useComprasCompensablesQuery, useCreateReciboMultiMutation, useFacturasPendientesQuery, useGastosDisponiblesQuery, useNcDisponiblesQuery, usePreviewReciboMultiMutation, useRecibosConfigQuery, useSaldosFavorQuery, } from "../../../tanstack/RecibosMultiStack"; import { MonedaInput } from "../../common/MonedaInput"; import { BancoSelect } from "../../_standards"; import { RetencionFormModal } from "./RetencionFormModal"; import { usePermission } from "../../../hooks/usePermission"; import { useMediosPagoEmpresaQuery } from "../../../tanstack/PagosStack"; import { useTesCuentasQuery } from "../../../tanstack/TesoreriaStack"; import { hoyISO } from "../../../utils/fecha"; // ─── Helpers ────────────────────────────────────────────────────────────────── const fmtGs = (v) => `Gs. ${Number(v || 0).toLocaleString("es-PY", { maximumFractionDigits: 0 })}`; const fmtFecha = (str) => { if (!str) return "—"; try { return new Date(str).toLocaleDateString("es-PY", { day: "2-digit", month: "2-digit", year: "numeric" }); } catch { return str; } }; const STEPS = ["Cliente y facturas", "NC y retenciones", "Medios de pago", "Confirmación"]; // Simula la imputación FIFO del backend: dado un monto y las cuotas ordenadas // por antigüedad, devuelve cuánto se aplica a cada cuota. function calcularImputacionFIFO(cuotas = [], importe) { const total = Number(importe) || 0; if (!cuotas.length || total <= 0) return {}; const orden = [...cuotas].sort((a, b) => { const fa = new Date(a.fecha_vencimiento ?? 0).getTime(); const fb = new Date(b.fecha_vencimiento ?? 0).getTime(); if (fa !== fb) return fa - fb; return (a.nro_cuota ?? 0) - (b.nro_cuota ?? 0); }); let restante = total; const out = {}; for (const c of orden) { if (restante <= 0) break; const saldo = Number(c.saldo_pendiente) || 0; if (saldo <= 0) continue; const aplicar = Math.min(saldo, restante); out[c.id] = aplicar; restante -= aplicar; } return out; } // Mapeo SIFEN código → tipo interno del wizard // SIFEN: 1=Efectivo, 2=Cheque, 3=Tarjeta crédito, 4=Tarjeta débito, 5=Transferencia, // 6=Giro, 7=Billetera electrónica, 8=Tarjeta empresarial, 9=Vale, // 10=Retención, 11=Pago por anticipo, 12=Valor fiscal, 13=Valor comercial const SIFEN_A_TIPO = { 1: "EFECTIVO", 2: "CHEQUE", 3: "TARJETA", 4: "TARJETA", 5: "TRANSFERENCIA", 7: "TRANSFERENCIA", 8: "TARJETA", }; const TIPO_LABELS = { EFECTIVO: "Efectivo", TRANSFERENCIA: "Transferencia", CHEQUE: "Cheque", TARJETA: "Tarjeta", DEPOSITO: "Depósito bancario", SALDO_FAVOR: "Saldo a favor del cliente", }; // Internos: siempre visibles (no dependen de SIFEN) const TIPOS_INTERNOS = ["DEPOSITO", "SALDO_FAVOR"]; // ─── Paso 1: Cliente + Facturas ─────────────────────────────────────────────── function StepClienteFacturas({ clienteId, setClienteId, clienteOpts, setClienteOpts, selFacturas, setSelFacturas, importesParciales, setImportesParciales }) { const timerRef = useRef(null); const { data: facturas = [], isLoading: loadingFact } = useFacturasPendientesQuery(clienteId); const [expandidas, setExpandidas] = useState({}); const toggleExpand = (id) => setExpandidas((p) => ({ ...p, [id]: !p[id] })); const handleInputChange = (v) => { clearTimeout(timerRef.current); timerRef.current = setTimeout(() => { if (!v) return; searchClientes(v, 20) .then((r) => setClienteOpts(r?.data ?? r ?? [])) .catch(() => {}); }, 300); }; const toggleFactura = (f) => { setSelFacturas((prev) => prev.find((x) => x.id === f.id) ? prev.filter((x) => x.id !== f.id) : [...prev, f] ); setImportesParciales((prev) => { const next = { ...prev }; if (next[f.id]) delete next[f.id]; return next; }); }; const setParcial = (facturaId, val) => setImportesParciales((prev) => ({ ...prev, [facturaId]: val })); return ( } sx={{ "& .MuiAlert-message": { fontSize: "0.8125rem" } }}> Cómo funciona este paso: tildá las facturas a cobrar. Opcionalmente ingresá un importe parcial para cobrar menos que el saldo total — si lo dejás vacío, se cobra todo el saldo.
En facturas a crédito, el importe se imputa FIFO: primero a la cuota más vencida y desborda a las siguientes. Expandí la factura (▸) para ver en vivo qué cuotas se van a pagar. { const p = o?.personas ?? {}; const nombre = p.razon_social ?? o?.nombre_fantasia ?? o?.razon_social ?? ""; const ruc = p.ruc ? (p.dv ? `${p.ruc}-${p.dv}` : `${p.ruc}`) : null; const doc = !ruc && p.nro_documento ? p.nro_documento : null; const id = ruc ? `RUC ${ruc}` : doc ? `CI ${doc}` : null; return id ? `${nombre} — ${id}` : nombre; }} renderOption={(props, o) => { const p = o?.personas ?? {}; const nombre = p.razon_social ?? o?.nombre_fantasia ?? o?.razon_social ?? "—"; const ruc = p.ruc ? (p.dv ? `${p.ruc}-${p.dv}` : `${p.ruc}`) : null; const doc = p.nro_documento; return (
  • {nombre} {ruc ? `RUC ${ruc}` : doc ? `CI ${doc}` : "Sin identificación"}
    • ); }} isOptionEqualToValue={(o, v) => String(o.id) === String(v?.id ?? v)} onChange={(_, opt) => { setClienteId(opt?.id ?? null); setSelFacturas([]); setImportesParciales({}); }} onInputChange={(_, v, reason) => { if (reason === "input") handleInputChange(v); }} filterOptions={(x) => x} size="small" fullWidth renderInput={(params) => ( )} /> {clienteId && ( <> Facturas con saldo pendiente {loadingFact && } {!loadingFact && facturas.length === 0 && ( Este cliente no tiene facturas con saldo pendiente. )} {facturas.length > 0 && ( Factura Fecha emisión Fecha venc. Total Saldo Importe parcial {facturas.map((f) => { const sel = !!selFacturas.find((x) => x.id === f.id); const tieneCuotas = Array.isArray(f.cuotas) && f.cuotas.length > 0; const esCredito = String(f.condicion_codigo) === "2" || tieneCuotas; const exp = !!expandidas[f.id]; return ( toggleFactura(f)}> e.stopPropagation()}> {esCredito && tieneCuotas && ( toggleExpand(f.id)} aria-label={exp ? "Colapsar cuotas" : "Ver cuotas"}> )} toggleFactura(f)} onClick={(e) => e.stopPropagation()} /> {f.numero} {esCredito ? ( ) : f.cobro_diferido ? ( ) : ( )} {fmtFecha(f.fecha_emision ?? f.fecha)} {fmtFecha(f.fecha_vencimiento)} {fmtGs(f.total_factura)} {fmtGs(f.saldo_pendiente)} e.stopPropagation()}> {sel && ( setParcial(f.id, v)} placeholder={String(f.saldo_pendiente)} helperText={ importesParciales[f.id] ? `Imputa ${fmtGs(importesParciales[f.id])} FIFO` : `Vacío = cobra todo (${fmtGs(f.saldo_pendiente)})` } sx={{ width: 180 }} /> )} {esCredito && exp && tieneCuotas && (() => { const importeParcial = importesParciales[f.id]; const montoEfectivo = sel ? (Number(importeParcial) > 0 ? Number(importeParcial) : Number(f.saldo_pendiente)) : 0; const imputaciones = montoEfectivo > 0 ? calcularImputacionFIFO(f.cuotas, montoEfectivo) : {}; const totalImputado = Object.values(imputaciones).reduce((s, v) => s + v, 0); return ( Cuotas {sel && `— preview FIFO con ${fmtGs(montoEfectivo)}`} {sel && montoEfectivo > 0 && ( )}
    Nº Vencimiento Monto cuota Saldo cuota {sel && A imputar} Estado {f.cuotas.map((c) => { const vencida = c.fecha_vencimiento && new Date(c.fecha_vencimiento) < new Date() && Number(c.saldo_pendiente) > 0; const aImputar = imputaciones[c.id] ?? 0; const seCobra = aImputar > 0; const cubre = seCobra && aImputar >= Number(c.saldo_pendiente); return ( {c.nro_cuota} {fmtFecha(c.fecha_vencimiento)} {vencida && } {fmtGs(c.monto_cuota)} {fmtGs(c.saldo_pendiente)} {sel && ( {seCobra ? ( {fmtGs(aImputar)} {cubre && } ) : "—"} )} ); })}
    ); })()} ); })}     )} )}     ); } // ─── Paso 2: NC + Retenciones ───────────────────────────────────────────────── function StepNcRetenciones({ clienteId, selFacturas, selNcs, setSelNcs, retenciones, setRetenciones, facturasCompraAplicadas, setFacturasCompraAplicadas, gastosAplicados, setGastosAplicados, canNcFlexible, canRetencion, canGastos, esAgenteRetencion = false }) { const { data: ncs = [] } = useNcDisponiblesQuery(clienteId); const { data: saldosFavor = [] } = useSaldosFavorQuery(clienteId); const { data: comprasCompensables = [] } = useComprasCompensablesQuery(clienteId); const { data: gastosDisponibles = [], isLoading: loadingGastos } = useGastosDisponiblesQuery( { cliente_id: clienteId }, { enabled: canGastos && !!clienteId }, ); // "Todos, pero priorizado": el backend marca es_del_cliente y ordena arriba los del // mismo RUC del cliente. Este toggle permite además filtrar solo esos. const [soloGastosCliente, setSoloGastosCliente] = useState(false); const hayGastosDelCliente = gastosDisponibles.some((g) => g.es_del_cliente); const gastosMostrados = soloGastosCliente ? gastosDisponibles.filter((g) => g.es_del_cliente) : gastosDisponibles; const [retencionFactura, setRetencionFactura] = useState(null); // factura para la que se agrega ret. const toggleNc = (nc) => setSelNcs((prev) => prev.find((x) => x.id === nc.id) ? prev.filter((x) => x.id !== nc.id) : [...prev, nc] ); const addRetencion = (data) => { setRetenciones((prev) => [ ...prev.filter((r) => r.factura_id !== retencionFactura.id || r._key !== data._key), { ...data, factura_id: retencionFactura.id, _key: Date.now() }, ]); setRetencionFactura(null); }; const removeRetencion = (key) => setRetenciones((prev) => prev.filter((r) => r._key !== key)); const totalNcSel = selNcs.reduce((s, nc) => s + Number(nc.saldo_disponible ?? 0), 0); const totalRetSel = retenciones.reduce((s, r) => s + Number(r.monto ?? 0), 0); const toggleCompra = (compra) => { setFacturasCompraAplicadas((prev) => { const existe = prev.find((x) => x.compra_cab_id === compra.id); if (existe) return prev.filter((x) => x.compra_cab_id !== compra.id); return [...prev, { compra_cab_id: compra.id, monto: Number(compra.saldo_pendiente) || 0, _compra: compra }]; }); }; const setCompraMonto = (compraId, val) => setFacturasCompraAplicadas((prev) => prev.map((x) => (x.compra_cab_id === compraId ? { ...x, monto: val } : x)) ); const totalComprasSel = facturasCompraAplicadas.reduce((s, c) => s + Number(c.monto ?? 0), 0); const toggleGasto = (g) => { setGastosAplicados((prev) => { const existe = prev.find((x) => x.gasto_id === g.gasto_id); if (existe) return prev.filter((x) => x.gasto_id !== g.gasto_id); return [...prev, { gasto_id: g.gasto_id, monto_aplicado: Number(g.saldo_pendiente) || 0, _gasto: g }]; }); }; const setGastoMonto = (id, val) => setGastosAplicados((prev) => prev.map((x) => (x.gasto_id === id ? { ...x, monto_aplicado: val } : x)) ); const totalGastosSel = gastosAplicados.reduce((s, g) => s + Number(g.monto_aplicado ?? 0), 0); return ( } sx={{ "& .MuiAlert-message": { fontSize: "0.8125rem" } }}> Cómo funciona este paso: es opcional. Acá podés:
  • Notas de crédito y saldos a favor — descuentan del total a cobrar como si fueran un pago.
  • Retenciones IVA / Renta — certificados que el cliente te entrega; reducen lo que cobrás en efectivo y se cargan al Libro de Retenciones automáticamente.
    • {canGastos &&
  • Gastos documentados — comisiones bancarias, fletes u otros con CxP pendiente; se descuentan del cobro y la CxP queda cancelada automáticamente.
    • }     Si el cliente no entrega ni NC ni retenciones, dejá todo vacío y avanzá.     } sx={{ minHeight: 36, "& .MuiAccordionSummary-content": { my: 0.5 } }} > Detalles contables y guía de retenciones Contable: NC modo ESTRICTO (aplicada a su factura origen) no genera línea en el asiento — la NC al emitirse ya descargó CxC. NC modo FLEXIBLE (a otra factura del cliente) sí genera línea contra cuenta puente. ¿Cuándo cargar retención? Solo cuando el cliente es agente de retención designado por SET y te entrega el comprobante de retención (físico o electrónico) al momento de pagar. Vos no decidís retener — lo hace el cliente.
  • Efecto: cobrás menos en efectivo, pero la factura queda totalmente saldada (la parte retenida cuenta como pago vía SET).
  • Destino: queda en el Libro de Retenciones Recibidas. Te sirve como crédito de IVA (DJ mensual) y pago a cuenta de Renta (cierre anual).
  • Datos requeridos: tipo (IVA/Renta), monto, número de comprobante, timbrado y fecha.
  • Si no trae comprobante: no cargues nada — no es opcional ni a criterio del cobrador.
    •      {/* Notas de crédito */} {(() => { const selFacturaIds = new Set(selFacturas.map((f) => f.id)); const ncsVisibles = ncs.filter((nc) => { const modo = (nc.rec_modo_aplicacion || "ESTRICTO").toUpperCase(); if (modo === "ESTRICTO") return nc.factura_cab_id && selFacturaIds.has(nc.factura_cab_id); return canNcFlexible; }); if (!canNcFlexible && ncsVisibles.length === 0) return null; return ( Notas de crédito disponibles {canNcFlexible && ( )} {ncsVisibles.length === 0 && saldosFavor.length === 0 && ( No hay NC ni saldos a favor disponibles para este cliente. )} {ncsVisibles.length > 0 && ( Nota de crédito Fecha Factura vinculada Modo Saldo disponible {ncsVisibles.map((nc) => { const sel = !!selNcs.find((x) => x.id === nc.id); const modo = (nc.rec_modo_aplicacion || "ESTRICTO").toUpperCase(); return ( toggleNc(nc)}> {nc.numero} {fmtFecha(nc.fecha)} {nc.factura_numero || ( — sin factura origen — )} {fmtGs(nc.saldo_disponible)} ); })}
    )} {totalNcSel > 0 && ( Total NC a aplicar: {fmtGs(totalNcSel)} )}     ); })()} {/* Retenciones recibidas */} {canRetencion && ( t.palette.mode === "dark" ? "rgba(255, 167, 38, 0.08)" : "rgba(255, 167, 38, 0.12)", } : undefined } > Retenciones recibidas por factura {esAgenteRetencion && ( } label="Cliente agente de retención" /> )} {esAgenteRetencion && retenciones.length === 0 && ( Este cliente está marcado como agente de retención. Si te entregó comprobante(s) al pagar, cargalos acá antes de continuar. )} {selFacturas.length === 0 && ( Seleccioná al menos una factura en el paso anterior. )} {selFacturas.map((f) => { const rets = retenciones.filter((r) => r.factura_id === f.id); return ( {f.numero} Saldo: {fmtGs(f.saldo_pendiente)} {rets.map((r) => ( {r.numero_comprobante} {fmtGs(r.monto)} removeRetencion(r._key)}> ))} ); })} {totalRetSel > 0 && ( Total retenciones: {fmtGs(totalRetSel)} )} )} {clienteId && ( <> Facturas por acuerdo comercial } label="Compensación" /> Facturas que el cliente le emitió a la empresa (mismo titular como proveedor). El monto se compensa contra la deuda del cliente — FIFO sobre las cuotas pendientes de la compra. {comprasCompensables.length === 0 ? ( Este cliente no tiene facturas de compra (mismo RUC como proveedor) con saldo pendiente para compensar. ) : ( Factura Fecha Total Saldo Monto a compensar {comprasCompensables.map((c) => { const aplicada = facturasCompraAplicadas.find((x) => x.compra_cab_id === c.id); const sel = !!aplicada; return ( toggleCompra(c)}> e.stopPropagation()}> toggleCompra(c)} /> {c.numero} {fmtFecha(c.fecha_emision)} {fmtGs(c.total)} {fmtGs(c.saldo_pendiente)} e.stopPropagation()}> {sel && ( setCompraMonto(c.id, v)} sx={{ width: 180 }} helperText={`Máx: ${fmtGs(c.saldo_pendiente)}`} /> )} ); })}
    )} {totalComprasSel > 0 && ( Total a compensar: {fmtGs(totalComprasSel)} )}     )} {canGastos && ( <> Gastos documentados } label="Descuento del cobro" /> {hayGastosDelCliente && ( setSoloGastosCliente(e.target.checked)} /> } label={Solo del cliente (mismo RUC)} /> )} Gastos con CxP pendiente (comisiones bancarias, fletes, etc.) descontados del monto a cobrar. El sistema cancela la CxP automáticamente al confirmar. {loadingGastos ? ( ) : gastosDisponibles.length === 0 ? ( No hay gastos con CxP pendiente disponibles. ) : ( Proveedor Factura Fecha CxP disponible Monto a descontar {gastosMostrados.length === 0 ? ( No hay gastos del mismo RUC del cliente. Desmarcá el filtro para ver todos. ) : gastosMostrados.map((g) => { const aplicado = gastosAplicados.find((x) => x.gasto_id === g.gasto_id); const sel = !!aplicado; return ( toggleGasto(g)}> e.stopPropagation()}> toggleGasto(g)} /> {g.proveedor_razon_social} {g.es_del_cliente && ( } label="Mismo RUC del cliente" /> )} {g.numero_documento} {fmtFecha(g.fecha_emision)} {fmtGs(g.saldo_pendiente)} e.stopPropagation()}> {sel && ( setGastoMonto(g.gasto_id, v)} sx={{ width: 160 }} helperText={`Máx: ${fmtGs(g.saldo_pendiente)}`} /> )} ); })}
    )} {totalGastosSel > 0 && ( Total gastos a descontar: {fmtGs(totalGastosSel)} )}     )} setRetencionFactura(null)} />     ); } // ─── Paso 3: Medios de pago ─────────────────────────────────────────────────── function StepMediosPago({ mediosPago, setMediosPago, totalAPagar, totalFacturas = 0, totalNcSel = 0, totalRetSel = 0, totalComprasSel = 0, totalGastosSel = 0 }) { const totalMedios = mediosPago.reduce((s, m) => s + Number(m.monto || 0), 0); const totalCubierto = totalMedios + totalNcSel + totalRetSel; const diferencia = totalAPagar - totalMedios; const { data: mediosEmpresa = [] } = useMediosPagoEmpresaQuery(); const { data: cuentasData } = useTesCuentasQuery(); const cuentasTes = (Array.isArray(cuentasData) ? cuentasData : (cuentasData?.data || [])) .filter((c) => c.activo !== false); const tiposDisponibles = useMemo(() => { const activos = new Set(); for (const m of mediosEmpresa) { if (m.activo && SIFEN_A_TIPO[m.codigo]) activos.add(SIFEN_A_TIPO[m.codigo]); } const orden = ["EFECTIVO", "TRANSFERENCIA", "CHEQUE", "TARJETA", "DEPOSITO", "SALDO_FAVOR"]; return orden .filter((t) => activos.has(t) || TIPOS_INTERNOS.includes(t)) .map((value) => ({ value, label: TIPO_LABELS[value] })); }, [mediosEmpresa]); const tipoDefault = tiposDisponibles[0]?.value ?? "EFECTIVO"; const addMedio = () => setMediosPago((prev) => { const cubierto = prev.reduce((s, m) => s + Number(m.monto || 0), 0); const falta = Math.max(0, Math.round(totalAPagar - cubierto)); return [ ...prev, { _key: Date.now(), tipo: tipoDefault, monto: falta > 0 ? falta : "", referencia: "" }, ]; }); useEffect(() => { if (mediosPago.length === 0 && totalAPagar > 0 && tipoDefault) { setMediosPago([ { _key: Date.now(), tipo: tipoDefault, monto: Math.round(totalAPagar), referencia: "" }, ]); } // eslint-disable-next-line react-hooks/exhaustive-deps }, [totalAPagar, tipoDefault]); const updateMedio = (key, field, val) => setMediosPago((prev) => prev.map((m) => (m._key === key ? { ...m, [field]: val } : m))); const removeMedio = (key) => setMediosPago((prev) => prev.filter((m) => m._key !== key)); return ( } sx={{ "& .MuiAlert-message": { fontSize: "0.8125rem" } }}> Cómo funciona este paso: agregá uno o varios medios para cubrir el total a pagar (lo que falta después de aplicar NC, saldos a favor y retenciones).
  • Combinable: ej. parte en efectivo + parte en transferencia.
  • Cheques requieren número y banco; quedan registrados en Tesorería como pendientes hasta depositarse.
  • Sobrante: si pagás de más, el excedente queda como saldo a favor del cliente para futuros recibos.
    •  El indicador "Balanceado ✓" debe quedar en verde antes de confirmar.     Medios de pago {mediosPago.length === 0 && ( Agregá al menos un medio de pago. )} {mediosPago.map((m) => ( updateMedio(m._key, "tipo", e.target.value)} size="small" sx={{ width: 200 }} > {tiposDisponibles.map((t) => ( {t.label} ))} updateMedio(m._key, "monto", v)} size="small" sx={{ width: 180 }} helperText={m.tipo === "EFECTIVO" && diferencia > 0 ? `Sugerido: ${fmtGs(diferencia)}` : undefined} /> {m.tipo !== "EFECTIVO" && m.tipo !== "SALDO_FAVOR" && ( updateMedio(m._key, "cuenta_tesoreria_id", e.target.value)} size="small" sx={{ width: 200 }} required helperText={m.tipo === "CHEQUE" ? "Cartera destino" : "Cuenta de ingreso"} > {cuentasTes.map((c) => ( {c.nombre} ))} )} updateMedio(m._key, "referencia", e.target.value)} size="small" sx={{ flex: 1 }} helperText={m.tipo === "TRANSFERENCIA" ? "Ej: nro. transferencia" : ""} /> removeMedio(m._key)} sx={{ mt: 0.5 }}> {m.tipo === "CHEQUE" && ( updateMedio(m._key, "cheque_numero", e.target.value)} size="small" required helperText="Ej: 0012345" /> updateMedio(m._key, "cheque_banco", v)} helperText="Seleccioná o escribí" /> updateMedio(m._key, "cheque_titular", e.target.value)} size="small" required helperText="Nombre del firmante" /> updateMedio(m._key, "cheque_cuenta", e.target.value)} size="small" helperText="Opcional" /> updateMedio(m._key, "cheque_fecha_emision", e.target.value)} size="small" required InputLabelProps={{ shrink: true }} /> updateMedio(m._key, "cheque_fecha_vencimiento", e.target.value)} size="small" InputLabelProps={{ shrink: true }} helperText="Si es futura → diferido" /> )} ))} {totalFacturas > 0 && ( Total facturas: {fmtGs(totalFacturas)} )} {totalNcSel > 0 && ( − Notas de Crédito: {fmtGs(totalNcSel)} )} {totalRetSel > 0 && ( − Retenciones: {fmtGs(totalRetSel)} )} {totalComprasSel > 0 && ( − Facturas acuerdo comercial: {fmtGs(totalComprasSel)} )} {totalGastosSel > 0 && ( − Gastos documentados: {fmtGs(totalGastosSel)} )} Total a cobrar (medios de pago): {fmtGs(totalAPagar)} Cubierto por medios: = totalAPagar ? "success.main" : "warning.main"}> {fmtGs(totalMedios)} {(totalNcSel > 0 || totalRetSel > 0) && ( Total cubierto (medios + NC{totalRetSel > 0 ? " + retenciones" : ""}): {fmtGs(totalCubierto)} )} {Math.abs(diferencia) > 0 && ( 0 ? "error.main" : "success.main"}> {diferencia > 0 ? "Faltante:" : "Vuelto / saldo a favor:"} 0 ? "error.main" : "success.main"}> {fmtGs(Math.abs(diferencia))} )}     ); } // ─── Paso 4: Confirmación ───────────────────────────────────────────────────── function StepConfirmacion({ preview, isLoadingPreview, fechaEmision, setFechaEmision }) { if (isLoadingPreview) { return ( ); } if (!preview) { return No se pudo generar la vista previa. Revisá los pasos anteriores.; } return ( setFechaEmision(e.target.value)} InputLabelProps={{ shrink: true }} sx={{ maxWidth: 240 }} helperText="Por defecto, hoy. Modificá si necesitás registrar el recibo con otra fecha." /> } sx={{ "& .MuiAlert-message": { fontSize: "0.8125rem" } }}> Último paso — revisá antes de confirmar:
  • La imputación FIFO mostrada se aplicará exactamente así a las facturas y cuotas.
  • Las retenciones quedarán en el Libro de Retenciones del mes del recibo.
  • Si hay diferencia positiva, se registra como saldo a favor del cliente.
  • Para revertir hay que anular el recibo — bloqueado si algún cheque ya fue depositado.
    •      {/* Resumen imputación */} Imputación FIFO Factura Saldo anterior Imputado Saldo nuevo {(preview.facturas ?? []).map((f) => ( {f.factura_numero || "Sin número"} {fmtGs(f.saldo_anterior)} {fmtGs(f.monto_imputado)} {fmtGs(f.saldo_nuevo)} ))}
    {/* Totales */} {[ { label: "Total imputado", value: preview.total_imputado, color: "primary.main" }, preview.total_nc > 0 && { label: "NC aplicadas", value: -preview.total_nc, color: "success.main" }, preview.total_retenciones > 0 && { label: "Retenciones", value: -preview.total_retenciones, color: "warning.main" }, preview.total_intereses > 0 && { label: "Intereses", value: preview.total_intereses }, { label: "Total a cobrar", value: preview.total_cobrado, color: "text.primary", bold: true }, ].filter(Boolean).map((row) => ( {row.label} {fmtGs(row.value)} ))} {preview.genera_saldo_favor > 0 && ( Se generará un saldo a favor de {fmtGs(preview.genera_saldo_favor)} para este cliente. )}     ); } // ─── Wizard ─────────────────────────────────────────────────────────────────── // `initialClienteId` (opcional) preselecciona el cliente al abrir, útil cuando // el wizard se invoca desde el worklist de Cartera Inteligente para registrar // el cobro directamente sin que el usuario tenga que buscar el cliente. // eslint-disable-next-line react/prop-types export function NuevoReciboMultiWizard({ open, onClose, initialClienteId = null }) { const { can } = usePermission("COBRANZAS"); const { data: recibosConfig } = useRecibosConfigQuery(); const canGastos = can("COB_REC_GASTOS") && recibosConfig?.permitir_gastos_en_recibo === true; const [step, setStep] = useState(0); // Step 1 const [clienteId, setClienteId] = useState(initialClienteId); const [clienteOpts, setClienteOpts] = useState([]); const [selFacturas, setSelFacturas] = useState([]); const [importesParciales, setImportesParciales] = useState({}); // Aplica el initialClienteId cada vez que el wizard se abre y precarga el // cliente en clienteOpts para que el Autocomplete muestre su nombre desde // el primer render. useEffect(() => { if (!open || !initialClienteId) return; if (!clienteId) setClienteId(initialClienteId); // Cargar cliente para que aparezca en el Autocomplete (sin texto del usuario). getCliente(initialClienteId) .then((c) => { if (!c) return; setClienteOpts((prev) => (prev.find((x) => x.id === c.id) ? prev : [c, ...prev])); }) .catch(() => {}); // eslint-disable-next-line react-hooks/exhaustive-deps }, [open, initialClienteId]); // Step 2 const [selNcs, setSelNcs] = useState([]); const [retenciones, setRetenciones] = useState([]); const [facturasCompraAplicadas, setFacturasCompraAplicadas] = useState([]); const [gastosAplicados, setGastosAplicados] = useState([]); // Step 3 const [mediosPago, setMediosPago] = useState([]); // Step 4: preview + fecha de emisión editable const [preview, setPreview] = useState(null); const [fechaEmision, setFechaEmision] = useState(() => hoyISO()); const previewMutation = usePreviewReciboMultiMutation(); const createMutation = useCreateReciboMultiMutation(); const toNum = (v) => { const n = Number(v); if (!Number.isFinite(n)) return 0; return Math.round(n * 100) / 100; // máx 2 decimales (constraint del DTO) }; // Mapeo de tipos internos del wizard → enum DTO backend const TIPO_A_MEDIO_DTO = { EFECTIVO: "EFECTIVO", TRANSFERENCIA: "TRANSFERENCIA", CHEQUE: "CHEQUE", TARJETA: "TARJETA", DEPOSITO: "TRANSFERENCIA", // backend no tiene DEPOSITO, se loguea como TRANSFERENCIA SALDO_FAVOR: "SALDO_FAVOR", }; const buildPayload = () => ({ cliente_id: clienteId, fecha_emision: fechaEmision || undefined, facturas: selFacturas.map((f) => ({ factura_id: f.id, monto_pagado: toNum(importesParciales[f.id] || f.saldo_pendiente), })), nc_aplicadas: selNcs.map((nc) => { const facturasIds = selFacturas.map((f) => f.id); const esFlexible = nc.rec_modo_aplicacion === "FLEXIBLE"; // ESTRICTO: solo a su factura origen. FLEXIBLE: a cualquier factura del recibo, // priorizando la origen si está incluida, sino la primera. const destino = esFlexible ? (facturasIds.includes(nc.factura_cab_id) ? nc.factura_cab_id : selFacturas[0]?.id) : (nc.factura_cab_id ?? selFacturas[0]?.id); return { nota_credito_id: nc.id, factura_id_destino: destino, monto: toNum(nc.saldo_disponible), }; }), retenciones: retenciones.map(({ _key, factura_id, ...r }) => ({ ...r, factura_ref: factura_id })), facturas_compra_aplicadas: facturasCompraAplicadas.map(({ compra_cab_id, monto, observacion }) => ({ compra_cab_id, monto: toNum(monto), ...(observacion ? { observacion } : {}), })), gastos: gastosAplicados.map(({ gasto_id, monto_aplicado, observacion }) => ({ gasto_id, monto_aplicado: toNum(monto_aplicado), ...(observacion ? { observacion } : {}), })), medios_pago: mediosPago.map(({ _key, tipo, cheque_numero, cheque_banco, cheque_titular, cheque_cuenta, cheque_fecha_emision, cheque_fecha_vencimiento, ...m }) => ({ ...m, medio: TIPO_A_MEDIO_DTO[tipo] ?? "OTRO", monto: toNum(m.monto), ...(tipo === "CHEQUE" && cheque_numero ? { cheque: { numero_cheque: cheque_numero, banco_emisor: cheque_banco, titular: cheque_titular, cuenta_bancaria_origen: cheque_cuenta || undefined, fecha_emision: cheque_fecha_emision, fecha_vencimiento: cheque_fecha_vencimiento || undefined, }, } : {}), })), }); const totalNcSel = selNcs.reduce((s, nc) => s + Number(nc.saldo_disponible ?? 0), 0); const totalRetSel = retenciones.reduce((s, r) => s + Number(r.monto ?? 0), 0); const totalComprasSel = facturasCompraAplicadas.reduce((s, c) => s + Number(c.monto ?? 0), 0); const totalGastosSel = gastosAplicados.reduce((s, g) => s + Number(g.monto_aplicado ?? 0), 0); const totalFacturas = selFacturas.reduce((s, f) => { const parcial = importesParciales[f.id]; return s + Number(parcial || f.saldo_pendiente); }, 0); const totalAPagar = Math.max(0, totalFacturas - totalNcSel - totalRetSel - totalComprasSel - totalGastosSel); const canGoNext = useMemo(() => { if (step === 0) return !!clienteId && selFacturas.length > 0; if (step === 1) return true; // NC y retenciones son opcionales if (step === 2) return mediosPago.length > 0 && mediosPago.every((m) => { if (!(Number(m.monto) > 0)) return false; if (m.tipo !== "EFECTIVO" && m.tipo !== "SALDO_FAVOR" && !m.cuenta_tesoreria_id) return false; if (m.tipo === "CHEQUE") { return !!m.cheque_numero && !!m.cheque_banco && !!m.cheque_titular && !!m.cheque_fecha_emision; } return true; }); return true; }, [step, clienteId, selFacturas, mediosPago]); const handleNext = async () => { if (step === 2) { // Generar preview antes de paso 4 try { const result = await previewMutation.mutateAsync(buildPayload()); setPreview(result); } catch { toast.error("Error al calcular el preview. Revisá los datos."); return; } } setStep((s) => s + 1); }; const handleConfirm = () => { createMutation.mutate(buildPayload(), { onSuccess: () => { toast.success("Recibo creado correctamente"); onClose(true); }, }); }; const handleClose = () => { if (createMutation.isPending) return; setStep(0); setClienteId(null); setClienteOpts([]); setSelFacturas([]); setImportesParciales({}); setSelNcs([]); setRetenciones([]); setFacturasCompraAplicadas([]); setGastosAplicados([]); setMediosPago([]); setPreview(null); setFechaEmision(hoyISO()); onClose(); }; return ( Nuevo recibo multi-factura {STEPS.map((label) => ( {label} ))} {step === 0 && ( )} {step === 1 && ( c.id === clienteId)?.es_agente_retencion} /> )} {step === 2 && ( )} {step === 3 && ( )} {step > 0 && ( )} {step < STEPS.length - 1 ? ( ) : ( )} ); }