import { Icon } from "@iconify/react"; import { Alert, Box, Button, Card, CardContent, Chip, Collapse, CircularProgress, Dialog, DialogActions, DialogContent, DialogTitle, Divider, FormControl, Grid, IconButton, InputAdornment, InputLabel, MenuItem, Pagination, Paper, Select, Skeleton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, TextField, Tooltip, Typography, useMediaQuery, useTheme, } from "@mui/material"; import { useCallback, useEffect, useMemo, useRef, useState } from "react"; import { useNavigate, useSearchParams } from "react-router-dom"; import { toast } from "sonner"; import { getEmpresaMonedas } from "../../../api/monedas.service"; import { getMediosPagoActivos } from "../../../api/pagos.service"; import { aprobarOrdenPagoProveedor, anularOrdenPagoProveedor, createOrdenPagoProveedor, ejecutarOrdenPagoProveedor, enviarAprobacionOrdenPagoProveedor, getConfigCompras, getCuentasPendientesProveedor, getOrdenPagoProveedorPdf, getPagoProveedorById, getPagosProveedor, getPagosProveedorDashboard, rechazarOrdenPagoProveedor, } from "../../../api/pagos-proveedor.service"; import { getReferenciales } from "../../../api/referenciales.service"; import { getProveedor } from "../../../api/proveedores.service"; import { getSucursales } from "../../../api/sucursales.service"; import { getTesCuentas } from "../../../api/tes.service"; import { ProveedorSelector } from "../ProveedoresDesign/ProveedorSelector"; import { ConfirmDialog } from "../../ui/ConfirmDialog"; import { BancoSelect, CotizacionHint, EmptyState, ListToolbar, ScreenGuia, RowActions } from "../../_standards"; import { fmtMoneda } from "../../_standards/enums/monedas"; import { describirOrdenAbierta, finPeriodoPagoActualISO } from "../../_standards/enums"; import { useAuthStore } from "../../../store/AuthStore"; import { fmtFechaCalendario } from "../../../utils/fecha"; import { MonedaInput } from "../../common/MonedaInput"; import { useCotizacionVigente } from "../../../hooks/useCotizacionVigente"; import { aFechaISO, rangoFiltroRapido } from "../../../utils/fecha"; // ── Guía ──────────────────────────────────────────────────────────── const GUIA_PASOS = [ { icon: "lucide:file-text", color: "#3b82f6", titulo: "1. Seleccioná las cuentas a pagar", desc: "Elegí el proveedor y marcá las facturas pendientes que querés incluir en esta orden. Podés agrupar varias facturas en un solo pago.", }, { icon: "lucide:credit-card", color: "#f59e0b", titulo: "2. Definí el medio de pago por línea", desc: "Cada línea puede tener un medio de pago distinto (transferencia, cheque, efectivo). Esto determina cómo se registra en Tesorería.", }, { icon: "lucide:send", color: "#8b5cf6", titulo: "3. Enviá a aprobación (si aplica)", desc: "Según la configuración de tu empresa, la orden puede requerir aprobación antes de ejecutarse.", }, { icon: "lucide:landmark", color: "#22c55e", titulo: "4. Ejecutar el pago", desc: "Al ejecutar, se registra automáticamente el egreso en Tesorería (o el cheque emitido) y se contabiliza la cancelación de la deuda.", }, ]; const GUIA_NOTAS = [ { icon: "lucide:settings", text: "Para que el egreso se acredite al banco correcto, cada cuenta bancaria en Tesorería debe tener vinculada su cuenta contable (Tesorería → Cuentas → editar cuenta → campo \"Cuenta contable\").", }, { icon: "lucide:settings", text: "Para que los pagos con cheque generen un cheque emitido en Tesorería, configurá la regla \"Pago a proveedor\" para el medio de pago correspondiente (Tesorería → Configuración → Reglas).", }, { icon: "lucide:tag", text: "Los tipos de gasto pueden vincularse a una cuenta contable específica (Compras → Configuración → Tipos de gasto), de lo contrario se imputa a Gastos Generales.", }, ]; const parseNumber = (value, fallback = 0) => { const n = Number(value); return Number.isFinite(n) ? n : fallback; }; const toArray = (value) => (Array.isArray(value) ? value : value?.data || value?.items || []); const getMonedaOptionId = (moneda) => moneda?.moneda_id || moneda?.moneda?.id || moneda?.id || ""; const getMonedaCodigo = (moneda) => moneda?.moneda?.codigo || moneda?.codigo || ""; const getMonedaDescripcion = (moneda) => moneda?.moneda?.descripcion || moneda?.descripcion || ""; const normalizeEmpresaMonedaOption = (moneda) => { const id = getMonedaOptionId(moneda); const codigo = getMonedaCodigo(moneda); const descripcion = getMonedaDescripcion(moneda); const active = moneda?.active ?? moneda?.activo ?? moneda?.moneda?.active ?? true; return { ...moneda, id, moneda_id: id, codigo, descripcion, activo: active, moneda: moneda?.moneda || { id, codigo, descripcion, simbolo: moneda?.simbolo, posicion_simbolo: moneda?.posicion_simbolo, decimales_estandar: moneda?.decimales_estandar, }, }; }; const normalizeEmpresaMonedas = (monedas = []) => { const byId = new Map(); for (const moneda of monedas) { const normalized = normalizeEmpresaMonedaOption(moneda); if (!normalized.id || byId.has(normalized.id)) continue; byId.set(normalized.id, normalized); } return Array.from(byId.values()); }; const getStartOfWeek = (date) => { const d = new Date(date); const day = d.getDay(); const diff = day === 0 ? -6 : 1 - day; d.setDate(d.getDate() + diff); d.setHours(0, 0, 0, 0); return d; }; const formatCurrency = (value, symbol = "Gs.") => { const amount = parseNumber(value, 0); return `${symbol} ${amount.toLocaleString("es-PY", { minimumFractionDigits: 0, maximumFractionDigits: 2, })}`; }; const formatDate = (value) => { if (!value) return "-"; if (value instanceof Date) { if (Number.isNaN(value.getTime())) return "-"; return value.toLocaleDateString("es-PY", { day: "2-digit", month: "2-digit", year: "numeric", }); } if (typeof value === "string") { const match = value.match(/^(\d{4})-(\d{2})-(\d{2})/); if (match) return `${match[3]}/${match[2]}/${match[1]}`; const parsed = new Date(value); if (!Number.isNaN(parsed.getTime())) { return parsed.toLocaleDateString("es-PY", { day: "2-digit", month: "2-digit", year: "numeric", }); } } if (typeof value === "object") { if (value?.$date) return formatDate(value.$date); if (value?.$d) return formatDate(value.$d); if (typeof value?.toISOString === "function") { try { return formatDate(value.toISOString()); } catch { return "-"; } } } return "-"; }; const formatDateTime = (value) => { if (!value) return "-"; const parsed = value instanceof Date ? value : new Date(value); if (Number.isNaN(parsed.getTime())) return formatDate(value); return parsed.toLocaleString("es-PY", { day: "2-digit", month: "2-digit", year: "numeric", hour: "2-digit", minute: "2-digit", hour12: false, }); }; const formatCompraComprobante = (compra) => { if (!compra) return "S/N"; const establecimiento = String(compra.establecimiento || "").trim(); const punto = String(compra.punto_expedicion || "").trim(); const numero = String(compra.numero_factura || "").trim(); if (establecimiento && punto && numero) { return `${establecimiento.padStart(3, "0")}-${punto.padStart(3, "0")}-${numero.padStart(7, "0")}`; } return numero || "S/N"; }; const getCuentaDocumentoRef = (cuenta) => { const documentoRef = String(cuenta?.documento_ref || "").trim(); if (documentoRef) return documentoRef; return formatCompraComprobante(cuenta?.compra_cab); }; const getCuentaOrigenTipo = (cuenta) => { const normalized = normalizeText(cuenta?.origen_tipo || ""); if (normalized === "gasto") return "gasto"; return "compra"; }; const getCuentaOrigenLabel = (cuenta) => (getCuentaOrigenTipo(cuenta) === "gasto" ? "Gasto" : "Compra"); const normalizeText = (value = "") => String(value) .normalize("NFD") .replace(/[\u0300-\u036f]/g, "") .toLowerCase(); const normalizeOrdenEstado = (value, anulado = false) => { if (anulado) { return { key: "ANULADA", label: "Anulada", color: "warning" }; } const raw = String(value || "").toUpperCase(); if (raw === "PAGADO" || raw === "APLICADO") { return { key: "PAGADO", label: "Pagada", color: "success" }; } if (raw === "PENDIENTE_APROBACION") { return { key: "PENDIENTE_APROBACION", label: "Pend. aprobación", color: "warning" }; } if (raw === "RECHAZADA") { return { key: "RECHAZADA", label: "Rechazada", color: "error" }; } if (raw === "PENDIENTE") { return { key: "PENDIENTE", label: "Aprobada", color: "info" }; } if (raw === "BORRADOR") { return { key: "BORRADOR", label: "Borrador", color: "default" }; } return { key: raw || "BORRADOR", label: raw || "Borrador", color: "default" }; }; const ORDER_FIELD_INPUT_SX = { "& .MuiOutlinedInput-root": { minHeight: 42, borderRadius: "8px", backgroundColor: "rgba(255,255,255,0.03)", }, "& .MuiInputBase-input": { fontSize: "0.95rem", }, }; const isMedioCheque = (medio) => { if (!medio) return false; const codigo = Number(medio.codigo); const descripcion = normalizeText(medio.descripcion || medio.nombre); if (descripcion.includes("cheque")) return true; return codigo === 2; }; const isMedioTarjeta = (medio) => { if (!medio) return false; const codigo = Number(medio.codigo); const descripcion = normalizeText(medio.descripcion || medio.nombre); if (descripcion.includes("tarjeta")) return true; return codigo === 3 || codigo === 4; }; const isMedioTransferencia = (medio) => { if (!medio) return false; const codigo = Number(medio.codigo); const descripcion = normalizeText(medio.descripcion || medio.nombre); if (descripcion.includes("transferencia")) return true; return codigo === 5 || codigo === 7; }; const isMedioDeposito = (medio) => { if (!medio) return false; const descripcion = normalizeText(medio.descripcion || medio.nombre); return descripcion.includes("deposito") || descripcion.includes("deposito bancario"); }; const getDatosMedioCompleto = (config, medio) => { if (!medio) return true; if (isMedioCheque(medio)) { return !!( config.cuenta_bancaria_id && config.numero_cheque?.trim() && config.banco_emisor?.trim() && config.titular_cheque?.trim() && config.fecha_emision_cheque ); } if (isMedioTarjeta(medio)) { return !!(config.tarjeta_id && String(config.numero_tarjeta || "").length === 4); } if (isMedioTransferencia(medio) || isMedioDeposito(medio)) { return !!config.cuenta_bancaria_id; } return true; }; const getDatosMedioResumen = (config, medio, cuentasBancarias, tarjetas) => { if (isMedioCheque(medio)) { if (!config.numero_cheque) return null; return `Cheque N°${config.numero_cheque}${config.banco_emisor ? ` — ${config.banco_emisor}` : ""}`; } if (isMedioTarjeta(medio)) { const t = tarjetas.find((x) => x.id === config.tarjeta_id); if (!t) return null; return `${t.descripcion}${config.numero_tarjeta ? ` ****${config.numero_tarjeta}` : ""}`; } if (isMedioTransferencia(medio) || isMedioDeposito(medio)) { const cb = cuentasBancarias.find((c) => c.id === config.cuenta_bancaria_id); return cb ? cb.nombre : null; } return null; }; const emptyOrderForm = { sucursal_id: "", proveedor_id: "", sesion_caja_id: "", moneda_id: "", cotizacion: 1, fecha_pago: aFechaISO(new Date()), medio_pago_id: "", referencia: "", observaciones: "", }; export function ComprasPagosTab({ sucursalesProp = null, monedasProp = null, mediosPagoProp = null, }) { const theme = useTheme(); const isMobile = useMediaQuery(theme.breakpoints.down("sm")); const [loadingList, setLoadingList] = useState(false); const [loadingDashboard, setLoadingDashboard] = useState(false); const [loadingPendientes, setLoadingPendientes] = useState(false); const [saving, setSaving] = useState(false); const [pagos, setPagos] = useState([]); const [totalPagos, setTotalPagos] = useState(0); const [dashboard, setDashboard] = useState({ total: 0, pagadas: 0, anuladas: 0, monto_total: 0, }); const [configCompras, setConfigCompras] = useState({ aplicar_pago_al_guardar: true, requiere_aprobacion: false, permite_pago_sin_aprobacion: true, usar_workflow: false, workflow_obligatorio: false, }); const [page, setPage] = useState(1); const [limit, setLimit] = useState(20); const [estadoFilter, setEstadoFilter] = useState(""); const [searchText, setSearchText] = useState(""); // El chip arranca en "Esta semana": las fechas se inicializan con él, porque // marcarlo sin setear el rango dejaba la lista mostrando todo. const [fechaDesde, setFechaDesde] = useState(() => rangoFiltroRapido("semana").desde); const [fechaHasta, setFechaHasta] = useState(() => rangoFiltroRapido("semana").hasta); const [filtroRapido, setFiltroRapido] = useState("semana"); const [showFilters, setShowFilters] = useState(false); const [showForm, setShowForm] = useState(false); const [orderForm, setOrderForm] = useState(emptyOrderForm); const [selectedProveedor, setSelectedProveedor] = useState(null); // Plan de pagos semanal → «Generar orden»: llega ?proveedor=&cuotas= y el // formulario se abre con ese proveedor y solo esas cuotas marcadas. const [searchParams, setSearchParams] = useSearchParams(); const cuotasPrefillRef = useRef(null); // Con el submódulo Plan de pagos, la orden marca por defecto solo lo programado hasta el // fin del período en curso; sin él, se comporta como siempre (todas las pendientes). const planPagosActivo = useAuthStore((st) => st.hasPermission("COMPRAS", "CMP_PP_PLAN_PAGOS_VER")); const [cuentasPendientes, setCuentasPendientes] = useState([]); const [selectedCuentaIds, setSelectedCuentaIds] = useState([]); const [cuentasPagoConfig, setCuentasPagoConfig] = useState({}); const [anularConfirmOpen, setAnularConfirmOpen] = useState(false); const [pendingAnularOrden, setPendingAnularOrden] = useState(null); const [anulandoOrden, setAnulandoOrden] = useState(false); const [saveConfirmOpen, setSaveConfirmOpen] = useState(false); const [pendingCreateOrder, setPendingCreateOrder] = useState(null); // Mensaje del warning de tesoreria — string vacío = cerrado. const [tesoreriaWarningOpen, setTesoreriaWarningOpen] = useState(""); const navigate = useNavigate(); const [detalleOpen, setDetalleOpen] = useState(false); const [detalleLoading, setDetalleLoading] = useState(false); const [detalleOrden, setDetalleOrden] = useState(null); const [pdfLoadingId, setPdfLoadingId] = useState(null); const [pdfPreview, setPdfPreview] = useState(null); const [executingOrderId, setExecutingOrderId] = useState(null); const [workflowActionId, setWorkflowActionId] = useState(null); const [workflowConfirmOpen, setWorkflowConfirmOpen] = useState(false); const [workflowConfirmType, setWorkflowConfirmType] = useState(null); const [pendingWorkflowOrden, setPendingWorkflowOrden] = useState(null); const [sucursales, setSucursales] = useState([]); const [monedas, setMonedas] = useState([]); const [mediosPago, setMediosPago] = useState([]); const [tarjetas, setTarjetas] = useState([]); const [cuentasBancarias, setCuentasBancarias] = useState([]); const [datosMedioDialog, setDatosMedioDialog] = useState({ open: false, cuentaId: null }); const filtrosActivos = useMemo( () => [searchText, estadoFilter, fechaDesde, fechaHasta].filter(Boolean).length, [searchText, estadoFilter, fechaDesde, fechaHasta], ); const totalPages = useMemo( () => Math.max(1, Math.ceil(parseNumber(totalPagos, 0) / parseNumber(limit, 20))), [totalPagos, limit], ); // Totales de OP visibles agrupados por moneda (evita mezclar PYG con USD en el KPI). const montoAplicadoPorMoneda = useMemo(() => { const acc = {}; for (const p of pagos) { const code = p?.moneda?.codigo || "PYG"; acc[code] = (acc[code] || 0) + parseNumber(p?.monto_total, 0); } return acc; }, [pagos]); const totalSeleccionado = useMemo(() => { const selected = new Set(selectedCuentaIds); const permitePagoParcial = Boolean(configCompras.permitir_pago_parcial); return cuentasPendientes .filter((c) => selected.has(c.id)) .reduce((acc, c) => { const saldo = parseNumber(c.saldo_pendiente, 0); if (!permitePagoParcial) return acc + saldo; const montoConfigurado = parseNumber(cuentasPagoConfig[c.id]?.monto, saldo); const montoValido = Math.max(0, Math.min(saldo, montoConfigurado)); return acc + montoValido; }, 0); }, [cuentasPendientes, selectedCuentaIds, cuentasPagoConfig, configCompras.permitir_pago_parcial]); const cuentasById = useMemo(() => { const map = new Map(); cuentasPendientes.forEach((cuenta) => { map.set(cuenta.id, cuenta); }); return map; }, [cuentasPendientes]); const cuentasLibres = useMemo(() => cuentasPendientes.filter((c) => !c.orden_abierta), [cuentasPendientes]); const initCuentaPagoConfig = useCallback( () => ({ medio_pago_id: orderForm.medio_pago_id || mediosPago?.[0]?.id || "", referencia: orderForm.referencia || "", // cheque numero_cheque: "", banco_emisor: "", titular_cheque: "", fecha_emision_cheque: aFechaISO(new Date()), fecha_vencimiento_cheque: "", // transferencia / depósito cuenta_bancaria_id: "", numero_operacion: "", // tarjeta tarjeta_id: "", numero_tarjeta: "", monto: "", }), [orderForm.medio_pago_id, orderForm.referencia, mediosPago], ); useEffect( () => () => { if (pdfPreview?.url) { window.URL.revokeObjectURL(pdfPreview.url); } }, [pdfPreview], ); const updateCuentaPagoConfig = (cuentaId, field, value) => { setCuentasPagoConfig((prev) => { const current = { ...(prev[cuentaId] || initCuentaPagoConfig(cuentaId)), [field]: value, }; if (field === "medio_pago_id") { const medio = mediosPago.find((m) => m.id === value); const cheque = isMedioCheque(medio); const tarjeta = isMedioTarjeta(medio); const transferencia = isMedioTransferencia(medio); const deposito = isMedioDeposito(medio); if (!cheque) { current.numero_cheque = ""; current.banco_emisor = ""; current.titular_cheque = ""; current.fecha_emision_cheque = aFechaISO(new Date()); current.fecha_vencimiento_cheque = ""; } if (!tarjeta) { current.tarjeta_id = ""; current.numero_tarjeta = ""; } // cuenta_bancaria_id se usa para cheque (cartera), transferencia y depósito if (!cheque && !transferencia && !deposito) { current.cuenta_bancaria_id = ""; } // numero_operacion: para cheque = N° Cuenta del cheque; para transferencia = nro. op. if (!cheque && !transferencia) { current.numero_operacion = ""; } } return { ...prev, [cuentaId]: current, }; }); // Abrir el dialog automáticamente cuando se elige un medio que requiere datos. if (field === "medio_pago_id") { const medio = mediosPago.find((m) => m.id === value); if ( isMedioCheque(medio) || isMedioTarjeta(medio) || isMedioTransferencia(medio) || isMedioDeposito(medio) ) { setDatosMedioDialog({ open: true, cuentaId }); } } }; const loadLookups = useCallback(async () => { // Cuentas bancarias: siempre se cargan. Los bancos los trae BancoSelect. try { const cuentasResp = await getTesCuentas({ activo: true, limit: 200 }); setCuentasBancarias( Array.isArray(cuentasResp?.data) ? cuentasResp.data : Array.isArray(cuentasResp) ? cuentasResp : [] ); } catch { setCuentasBancarias([]); } if (Array.isArray(sucursalesProp) && Array.isArray(monedasProp) && Array.isArray(mediosPagoProp)) { setSucursales(sucursalesProp); setMonedas(normalizeEmpresaMonedas(monedasProp)); setMediosPago(mediosPagoProp); setTarjetas([]); return; } try { const [empresaMonedasResp, mediosResp, sucursalesResp, refsResp] = await Promise.all([ getEmpresaMonedas(), getMediosPagoActivos(), getSucursales(1, 200), getReferenciales(), ]); setMonedas(normalizeEmpresaMonedas(toArray(empresaMonedasResp))); setMediosPago(Array.isArray(mediosResp?.data) ? mediosResp.data : Array.isArray(mediosResp) ? mediosResp : []); setSucursales(toArray(sucursalesResp)); setTarjetas(Array.isArray(refsResp?.tarjeta) ? refsResp.tarjeta : []); } catch (error) { console.error(error); toast.error("No se pudieron cargar datos auxiliares de pagos"); } }, [sucursalesProp, monedasProp, mediosPagoProp]); const loadPagos = useCallback(async () => { try { setLoadingList(true); const resp = await getPagosProveedor({ page, limit, estado: estadoFilter || undefined, fecha_desde: fechaDesde || undefined, fecha_hasta: fechaHasta || undefined, busqueda: searchText || undefined, }); setPagos(resp?.items || []); setTotalPagos(resp?.total || 0); } catch (error) { console.error(error); toast.error("No se pudo cargar el listado de pagos"); } finally { setLoadingList(false); } }, [page, limit, estadoFilter, fechaDesde, fechaHasta, searchText]); const loadDashboard = useCallback(async () => { try { setLoadingDashboard(true); const resp = await getPagosProveedorDashboard({ fecha_desde: fechaDesde || undefined, fecha_hasta: fechaHasta || undefined, }); setDashboard({ total: parseNumber(resp?.total, 0), pagadas: parseNumber(resp?.pagadas ?? resp?.aplicadas, 0), anuladas: parseNumber(resp?.anuladas, 0), monto_total: parseNumber(resp?.monto_total, 0), }); } catch (error) { console.error(error); setDashboard({ total: 0, pagadas: 0, anuladas: 0, monto_total: 0 }); } finally { setLoadingDashboard(false); } }, [fechaDesde, fechaHasta]); const loadConfigCompras = useCallback(async () => { try { const config = await getConfigCompras(); setConfigCompras((prev) => ({ ...prev, ...(config || {}), })); } catch (error) { console.error(error); } }, []); useEffect(() => { loadLookups(); }, [loadLookups]); useEffect(() => { loadConfigCompras(); }, [loadConfigCompras]); useEffect(() => { const today = new Date(); const start = getStartOfWeek(today); setFechaDesde(aFechaISO(start)); setFechaHasta(aFechaISO(today)); }, []); useEffect(() => { loadPagos(); loadDashboard(); }, [loadPagos, loadDashboard]); useEffect(() => { if (!showForm) return; if (!selectedProveedor?.id) { setCuentasPendientes([]); setSelectedCuentaIds([]); return; } const run = async () => { try { setLoadingPendientes(true); const resp = await getCuentasPendientesProveedor(selectedProveedor.id); const items = resp?.items || []; setCuentasPendientes(items); // La preselección vale solo para el proveedor que vino del plan; no se consume // acá porque el efecto puede correr dos veces (StrictMode) y la perderíamos. const prefill = cuotasPrefillRef.current?.proveedorId === selectedProveedor.id ? cuotasPrefillRef.current.ids : null; // Las que ya están en otra orden sin ejecutar no se pueden marcar (el backend lo rechaza). const libres = items.filter((item) => !item.orden_abierta); const finPeriodo = finPeriodoPagoActualISO(configCompras); const elegidas = prefill ? libres.filter((item) => prefill.includes(item.id)) : planPagosActivo ? libres.filter((item) => item.fecha_pago_programada && String(item.fecha_pago_programada).slice(0, 10) <= finPeriodo) : libres; if (prefill && elegidas.length < prefill.length) { toast.info("Algunas cuotas del plan ya no están pendientes o ya están en otra orden de pago, y no se incluyeron"); } setSelectedCuentaIds(elegidas.map((item) => item.id)); } catch (error) { console.error(error); setCuentasPendientes([]); setSelectedCuentaIds([]); toast.error("No se pudieron cargar las cuentas pendientes del proveedor"); } finally { setLoadingPendientes(false); } }; run(); // eslint-disable-next-line react-hooks/exhaustive-deps }, [showForm, selectedProveedor]); useEffect(() => { if (!showForm) return; const monedaDefault = monedas.find((m) => m.es_principal && m.activo !== false) || monedas?.[0]; setOrderForm((prev) => ({ ...prev, sucursal_id: prev.sucursal_id || sucursales?.[0]?.id || "", moneda_id: prev.moneda_id || monedaDefault?.id || "", medio_pago_id: prev.medio_pago_id || mediosPago?.[0]?.id || "", })); }, [showForm, sucursales, monedas, mediosPago]); useEffect(() => { if (!showForm || selectedCuentaIds.length === 0) return; setCuentasPagoConfig((prev) => { const next = { ...prev }; let changed = false; selectedCuentaIds.forEach((cuentaId) => { const cuenta = cuentasById.get(cuentaId); const saldo = parseNumber(cuenta?.saldo_pendiente, 0); if (!next[cuentaId]) { next[cuentaId] = { ...initCuentaPagoConfig(cuentaId), monto: saldo, }; changed = true; return; } if (next[cuentaId].monto === "" || next[cuentaId].monto === undefined || next[cuentaId].monto === null) { next[cuentaId] = { ...next[cuentaId], monto: saldo, }; changed = true; } }); return changed ? next : prev; }); }, [showForm, selectedCuentaIds, initCuentaPagoConfig, cuentasById]); const aplicarFiltroRapido = (tipo) => { const { desde, hasta } = rangoFiltroRapido(tipo); setFiltroRapido(tipo); setPage(1); setFechaDesde(desde); setFechaHasta(hasta); }; const limpiarFiltros = () => { setSearchText(""); setEstadoFilter(""); setFechaDesde(""); setFechaHasta(""); setFiltroRapido(""); setPage(1); }; const openPdfFromBlob = (blob, filename = "orden-pago.pdf") => { if (!blob) return; const url = window.URL.createObjectURL(blob); setPdfPreview((prev) => { if (prev?.url) { window.URL.revokeObjectURL(prev.url); } return { url, filename }; }); }; const closePdfPreview = () => { setPdfPreview((prev) => { if (prev?.url) { window.URL.revokeObjectURL(prev.url); } return null; }); }; const handleDownloadPdfPreview = () => { if (!pdfPreview?.url) return; const link = document.createElement("a"); link.href = pdfPreview.url; link.download = pdfPreview.filename || "orden-pago.pdf"; link.click(); }; const handleViewPdf = async (orden) => { const id = orden?.id; if (!id) return; try { setPdfLoadingId(id); const blob = await getOrdenPagoProveedorPdf(id); openPdfFromBlob(blob, `orden-pago-${orden?.numero_orden_pago || "sin-numero"}.pdf`); } catch (error) { console.error(error); toast.error("No se pudo generar el PDF de la orden"); } finally { setPdfLoadingId(null); } }; const handleViewDetails = async (id) => { if (!id) return; try { setDetalleLoading(true); setDetalleOpen(true); const data = await getPagoProveedorById(id); setDetalleOrden(data || null); } catch (error) { console.error(error); setDetalleOpen(false); toast.error(error?.response?.data?.message || "No se pudo cargar el detalle de la orden"); } finally { setDetalleLoading(false); } }; const closeDetalle = () => { if (detalleLoading) return; setDetalleOpen(false); setDetalleOrden(null); }; const requestWorkflowConfirm = (orden, type) => { if (!orden?.id) return; setPendingWorkflowOrden(orden); setWorkflowConfirmType(type); setWorkflowConfirmOpen(true); }; const closeWorkflowConfirm = () => { if (!workflowConfirmOpen) return; setWorkflowConfirmOpen(false); setWorkflowConfirmType(null); setPendingWorkflowOrden(null); }; const handleConfirmWorkflowAction = async () => { const orden = pendingWorkflowOrden; const type = workflowConfirmType; closeWorkflowConfirm(); if (!orden?.id || !type) return; if (type === "aprobar") { await handleAprobarOrden(orden); return; } if (type === "ejecutar") { await handleEjecutarOrden(orden); } }; const requestAnularOrden = (orden) => { if (!orden?.id) return; setPendingAnularOrden(orden); setAnularConfirmOpen(true); }; const closeAnularConfirm = () => { if (anulandoOrden) return; setAnularConfirmOpen(false); setPendingAnularOrden(null); }; const handleConfirmAnularOrden = async () => { if (!pendingAnularOrden?.id) return; const loadingToastId = toast.loading("Anulando orden de pago..."); try { setAnulandoOrden(true); const response = await anularOrdenPagoProveedor(pendingAnularOrden.id, "Anulación manual"); toast.dismiss(loadingToastId); toast.success(response?.message || "Orden anulada correctamente"); await Promise.all([loadPagos(), loadDashboard()]); setAnularConfirmOpen(false); setPendingAnularOrden(null); } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo anular la orden"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); } finally { setAnulandoOrden(false); } }; const resetOrderForm = () => { const monedaDefault = monedas.find((m) => m.es_principal && m.activo !== false) || monedas?.[0]; setOrderForm({ ...emptyOrderForm, sucursal_id: sucursales?.[0]?.id || "", moneda_id: monedaDefault?.id || "", medio_pago_id: mediosPago?.[0]?.id || "", }); setSelectedProveedor(null); setCuentasPendientes([]); setSelectedCuentaIds([]); setCuentasPagoConfig({}); cuotasPrefillRef.current = null; }; const handleOpenForm = () => { resetOrderForm(); setShowForm(true); }; useEffect(() => { const proveedorId = searchParams.get("proveedor"); if (!proveedorId) return; const cuotas = (searchParams.get("cuotas") || "").split(",").filter(Boolean); const fechaPago = /^\d{4}-\d{2}-\d{2}$/.test(searchParams.get("fecha") || "") ? searchParams.get("fecha") : null; const limpio = new URLSearchParams(searchParams); limpio.delete("proveedor"); limpio.delete("cuotas"); limpio.delete("fecha"); setSearchParams(limpio, { replace: true }); getProveedor(proveedorId) .then((resp) => { const proveedor = resp?.data ?? resp; // el endpoint responde { message, data } resetOrderForm(); cuotasPrefillRef.current = cuotas.length ? { proveedorId: proveedor?.id, ids: cuotas } : null; setSelectedProveedor(proveedor); // Desde el plan, la fecha de pago es la del período elegido. setOrderForm((prev) => ({ ...prev, proveedor_id: proveedor?.id || "", ...(fechaPago ? { fecha_pago: fechaPago } : {}) })); setShowForm(true); }) .catch(() => toast.error("No se pudo cargar el proveedor del plan de pagos")); // eslint-disable-next-line react-hooks/exhaustive-deps }, [searchParams]); const handleCloseForm = () => { resetOrderForm(); setSaveConfirmOpen(false); setPendingCreateOrder(null); setShowForm(false); }; const toggleCuenta = (cuentaId) => { const cuenta = cuentasById.get(cuentaId); if (cuenta?.orden_abierta) return; const saldo = parseNumber(cuenta?.saldo_pendiente, 0); const cuentaMonedaId = cuenta?.moneda?.id || cuenta?.moneda_id || null; setSelectedCuentaIds((prev) => { const exists = prev.includes(cuentaId); if (exists) return prev.filter((id) => id !== cuentaId); // Al agregar: bloquear mezcla de monedas para no cerrar CxP USD con Gs. if (prev.length > 0 && cuentaMonedaId) { const anyOther = prev .map((id) => cuentasById.get(id)) .find((c) => (c?.moneda?.id || c?.moneda_id) && (c?.moneda?.id || c?.moneda_id) !== cuentaMonedaId); if (anyOther) { toast.warning( "No se pueden pagar cuentas en distinta moneda en la misma OP. Emití una OP por moneda.", ); return prev; } } return [...prev, cuentaId]; }); setCuentasPagoConfig((prev) => ({ ...prev, [cuentaId]: prev[cuentaId] || { ...initCuentaPagoConfig(cuentaId), monto: saldo, }, })); }; // FASE 3 — Detección de inconsistencia de monedas en la selección de CxPs. // La OP debe pagar cuentas de una sola moneda; si el usuario mezcló, mostramos // banner + bloqueamos el submit para no cerrar CxP USD con Gs. const monedasEnSeleccion = useMemo(() => { const codigos = new Set(); for (const id of selectedCuentaIds) { const c = cuentasById.get(id); const code = c?.moneda?.codigo || c?.moneda_id || null; if (code) codigos.add(code); } return Array.from(codigos); }, [selectedCuentaIds, cuentasById]); const hayMonedasMezcladas = monedasEnSeleccion.length > 1; const monedaFormCodigo = useMemo( () => monedas.find((m) => m.id === orderForm.moneda_id)?.codigo || null, [monedas, orderForm.moneda_id], ); const monedaSeleccionCodigo = useMemo(() => { if (selectedCuentaIds.length === 0) return null; const c = cuentasById.get(selectedCuentaIds[0]); return c?.moneda?.codigo || null; }, [selectedCuentaIds, cuentasById]); const monedaFormDesalineada = !hayMonedasMezcladas && monedaSeleccionCodigo && monedaFormCodigo && monedaFormCodigo !== monedaSeleccionCodigo; // FASE 3 — cotización vigente (contabilidad → facturación → fallback). const [cotizacionTocada, setCotizacionTocada] = useState(false); const monedaSeleccionadaCodigo = useMemo( () => monedas.find((m) => m.id === orderForm.moneda_id)?.codigo || null, [monedas, orderForm.moneda_id], ); const { data: cotizacionVigente } = useCotizacionVigente( monedaSeleccionadaCodigo, orderForm.fecha_pago, ); useEffect(() => { if (!showForm) return; if (cotizacionTocada) return; if (!cotizacionVigente?.tasa) return; const actual = Number(orderForm.cotizacion) || 0; if (Math.abs(actual - cotizacionVigente.tasa) < 1e-6) return; setOrderForm((prev) => ({ ...prev, cotizacion: cotizacionVigente.tasa })); }, [cotizacionVigente?.tasa, showForm, cotizacionTocada, orderForm.cotizacion]); // Al cambiar de moneda, resetear el flag para que la nueva cotización se auto-cargue. useEffect(() => { setCotizacionTocada(false); }, [orderForm.moneda_id]); // Auto-alinear la moneda de la OP con la moneda de las CxPs seleccionadas. // Cualquier cambio en la selección re-sincroniza (agregar/quitar/toggle all). useEffect(() => { if (!showForm || selectedCuentaIds.length === 0) return; const monedasSel = new Set( selectedCuentaIds .map((id) => { const c = cuentasById.get(id); return c?.moneda?.id || c?.moneda_id || null; }) .filter(Boolean), ); if (monedasSel.size === 1) { const monedaCxp = Array.from(monedasSel)[0]; if (monedaCxp && orderForm.moneda_id !== monedaCxp) { setOrderForm((f) => ({ ...f, moneda_id: monedaCxp })); } } }, [selectedCuentaIds, cuentasById, showForm, orderForm.moneda_id]); const toggleAllCuentas = () => { if (cuentasLibres.length > 0 && selectedCuentaIds.length === cuentasLibres.length) { setSelectedCuentaIds([]); return; } // Solo seleccionar CxP en la misma moneda que la primera pendiente (y no las que // ya están en otra orden de pago sin ejecutar). const primeraMoneda = cuentasLibres[0]?.moneda?.id || cuentasLibres[0]?.moneda_id || null; const mismasMoneda = cuentasLibres.filter( (c) => (c?.moneda?.id || c?.moneda_id || null) === primeraMoneda, ); if (mismasMoneda.length < cuentasLibres.length) { toast.warning( "Se seleccionaron sólo las cuentas en la moneda mayoritaria. Para el resto emití OPs separadas.", ); } const allIds = mismasMoneda.map((cuenta) => cuenta.id); if (primeraMoneda && orderForm.moneda_id !== primeraMoneda) { setOrderForm((f) => ({ ...f, moneda_id: primeraMoneda })); } setSelectedCuentaIds(allIds); setCuentasPagoConfig((prev) => { const next = { ...prev }; allIds.forEach((cuentaId) => { const saldo = parseNumber(cuentasById.get(cuentaId)?.saldo_pendiente, 0); if (!next[cuentaId]) { next[cuentaId] = { ...initCuentaPagoConfig(cuentaId), monto: saldo, }; } }); return next; }); }; const buildCreateOrderPayload = () => { if (!selectedProveedor?.id || !orderForm.proveedor_id) { toast.error("Seleccioná un proveedor"); return null; } if (!orderForm.sucursal_id) { toast.error("Seleccioná una sucursal"); return null; } if (selectedCuentaIds.length === 0) { toast.error("Seleccioná al menos una cuenta por pagar"); return null; } const permitePagoParcial = Boolean(configCompras.permitir_pago_parcial); const detalles = selectedCuentaIds .map((cuentaId) => { const cuenta = cuentasById.get(cuentaId); if (!cuenta) return null; const saldo = parseNumber(cuenta.saldo_pendiente, 0); const configCuenta = cuentasPagoConfig[cuentaId] || {}; const montoInput = parseNumber(configCuenta.monto, saldo); const monto = permitePagoParcial ? montoInput : saldo; if (monto <= 0) { toast.error(`Ingresá un monto mayor a 0 para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } if (monto > saldo) { toast.error(`El monto no puede superar el saldo pendiente en ${getCuentaDocumentoRef(cuenta)}`); return null; } if (!permitePagoParcial && Math.abs(monto - saldo) > 0.0001) { toast.error( `La configuración actual exige pago exacto al saldo pendiente en ${getCuentaDocumentoRef(cuenta)}`, ); return null; } const medioPagoId = configCuenta.medio_pago_id || orderForm.medio_pago_id || ""; const medio = mediosPago.find((m) => m.id === medioPagoId); const metaObservaciones = []; if (isMedioCheque(medio)) { if (!configCuenta.cuenta_bancaria_id) { toast.error(`Seleccioná la cuenta tesorería para el cheque en ${getCuentaDocumentoRef(cuenta)}`); return null; } if (!configCuenta.numero_cheque?.trim()) { toast.error(`Ingresá número de cheque para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } if (!configCuenta.banco_emisor?.trim()) { toast.error(`Ingresá banco emisor para el cheque en ${getCuentaDocumentoRef(cuenta)}`); return null; } if (!configCuenta.titular_cheque?.trim()) { toast.error(`Ingresá el titular del cheque en ${getCuentaDocumentoRef(cuenta)}`); return null; } if (!configCuenta.fecha_emision_cheque) { toast.error(`Ingresá la fecha de emisión del cheque en ${getCuentaDocumentoRef(cuenta)}`); return null; } metaObservaciones.push(`Cheque N° ${configCuenta.numero_cheque.trim()}`); if (configCuenta.banco_emisor) metaObservaciones.push(`Banco: ${configCuenta.banco_emisor}`); } if (isMedioTarjeta(medio)) { if (!configCuenta.tarjeta_id) { toast.error(`Seleccioná tarjeta para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } const tarjeta = tarjetas.find((t) => t.id === configCuenta.tarjeta_id); if (!configCuenta.numero_tarjeta || String(configCuenta.numero_tarjeta).length !== 4) { toast.error( `Ingresá los últimos 4 dígitos de la tarjeta para el documento ${getCuentaDocumentoRef(cuenta)}`, ); return null; } metaObservaciones.push( `Tarjeta ${tarjeta?.descripcion || "S/T"} ****${String(configCuenta.numero_tarjeta)}`, ); } if (isMedioTransferencia(medio) && !configCuenta.cuenta_bancaria_id) { toast.error(`Seleccioná la cuenta bancaria de origen para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } if (isMedioDeposito(medio) && !configCuenta.cuenta_bancaria_id) { toast.error(`Seleccioná la cuenta bancaria de destino para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } return { cuenta_pagar_id: cuenta.id, medio_pago_id: medioPagoId, monto, monto_moneda: monto, cotizacion: parseNumber(orderForm.cotizacion, 1), referencia: configCuenta.referencia || orderForm.referencia || undefined, observaciones: metaObservaciones.length > 0 ? metaObservaciones.join(" | ") : undefined, // datos específicos por medio numero_cheque: isMedioCheque(medio) ? configCuenta.numero_cheque?.trim() || undefined : undefined, banco_emisor: isMedioCheque(medio) ? configCuenta.banco_emisor?.trim() || undefined : undefined, titular_cheque: isMedioCheque(medio) ? configCuenta.titular_cheque?.trim() || undefined : undefined, fecha_emision_cheque: isMedioCheque(medio) ? configCuenta.fecha_emision_cheque || undefined : undefined, fecha_vencimiento_cheque: isMedioCheque(medio) ? configCuenta.fecha_vencimiento_cheque || undefined : undefined, cuenta_bancaria_id: (isMedioCheque(medio) || isMedioTransferencia(medio) || isMedioDeposito(medio)) ? configCuenta.cuenta_bancaria_id || undefined : undefined, // cheque: N° Cuenta del cheque (cuenta_bancaria_origen en tes_cheques) // transferencia: nro. operación/referencia bancaria numero_operacion: (isMedioCheque(medio) || isMedioTransferencia(medio)) ? configCuenta.numero_operacion?.trim() || undefined : undefined, }; }) .filter(Boolean); const detalleSinMedio = detalles.find((d) => !d.medio_pago_id); if (detalleSinMedio) { const cuenta = cuentasById.get(detalleSinMedio.cuenta_pagar_id); toast.error(`Seleccioná medio de pago para el documento ${getCuentaDocumentoRef(cuenta)}`); return null; } if (detalles.length !== selectedCuentaIds.length) { return null; } if (detalles.length === 0) { toast.error("No se pudieron preparar los detalles de la orden"); return null; } const payload = { sucursal_id: orderForm.sucursal_id, proveedor_id: orderForm.proveedor_id, sesion_caja_id: orderForm.sesion_caja_id || undefined, moneda_id: orderForm.moneda_id || undefined, cotizacion: parseNumber(orderForm.cotizacion, 1), fecha_pago: orderForm.fecha_pago || undefined, referencia: orderForm.referencia || undefined, observaciones: orderForm.observaciones || undefined, detalles, }; const monedaSel = monedas.find((m) => m.id === orderForm.moneda_id); return { payload, total: parseNumber(totalSeleccionado, 0), cantidadCuentas: detalles.length, proveedorNombre: selectedProveedor?.personas?.razon_social || "Sin nombre", cantidadMedios: new Set(detalles.map((d) => d.medio_pago_id)).size, monedaCodigo: monedaSel?.codigo || "PYG", monedaSimbolo: monedaSel?.simbolo || "Gs.", }; }; const handleRequestSubmit = () => { const prepared = buildCreateOrderPayload(); if (!prepared) return; setPendingCreateOrder(prepared); setSaveConfirmOpen(true); }; const closeSaveConfirm = () => { if (saving) return; setSaveConfirmOpen(false); setPendingCreateOrder(null); }; const handleConfirmSubmit = async () => { if (!pendingCreateOrder?.payload) return; const aplicaAlGuardar = Boolean(configCompras.aplicar_pago_al_guardar) && !requiereAprobacionOrden; const loadingToastId = toast.loading(aplicaAlGuardar ? "Guardando y ejecutando orden..." : "Guardando orden borrador..."); try { setSaving(true); const created = await createOrdenPagoProveedor(pendingCreateOrder.payload); toast.dismiss(loadingToastId); toast.success( created?.message || (aplicaAlGuardar ? "Pago aplicado correctamente" : "Orden de pago borrador registrada"), ); if (created?.tesoreria_warning) { setTesoreriaWarningOpen(created.tesoreria_warning); } if (created?.id) { try { const blob = await getOrdenPagoProveedorPdf(created.id); openPdfFromBlob(blob, `orden-pago-${created.numero_orden_pago || "sin-numero"}.pdf`); } catch (error) { console.error(error); toast.warning("La orden se guardó, pero no se pudo abrir el PDF automáticamente"); } } await Promise.all([loadPagos(), loadDashboard()]); setSaveConfirmOpen(false); setPendingCreateOrder(null); handleCloseForm(); } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo registrar la orden"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); } finally { setSaving(false); } }; const handleEjecutarOrden = async (orden) => { if (!orden?.id) return false; const loadingToastId = toast.loading("Ejecutando pago..."); try { setExecutingOrderId(orden.id); const response = await ejecutarOrdenPagoProveedor(orden.id); toast.dismiss(loadingToastId); toast.success(response?.message || "Pago ejecutado exitosamente"); if (response?.tesoreria_warning) { setTesoreriaWarningOpen(response.tesoreria_warning); } try { const blob = await getOrdenPagoProveedorPdf(orden.id); openPdfFromBlob(blob, `orden-pago-${orden.numero_orden_pago || "sin-numero"}.pdf`); } catch (error) { console.error(error); toast.warning("El pago se ejecutó, pero no se pudo abrir el PDF automáticamente"); } await Promise.all([loadPagos(), loadDashboard()]); return true; } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo ejecutar la orden"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); return false; } finally { setExecutingOrderId(null); } }; const handleEnviarAprobacionOrden = async (orden) => { if (!orden?.id) return; const loadingToastId = toast.loading("Enviando orden a aprobación..."); try { setWorkflowActionId(orden.id); const response = await enviarAprobacionOrdenPagoProveedor(orden.id); toast.dismiss(loadingToastId); toast.success(response?.message || "Orden enviada a aprobación"); await Promise.all([loadPagos(), loadDashboard()]); } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo enviar la orden a aprobación"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); } finally { setWorkflowActionId(null); } }; const handleAprobarOrden = async (orden) => { if (!orden?.id) return false; const loadingToastId = toast.loading("Aprobando orden..."); try { setWorkflowActionId(orden.id); const response = await aprobarOrdenPagoProveedor(orden.id); toast.dismiss(loadingToastId); toast.success(response?.message || "Orden aprobada"); await Promise.all([loadPagos(), loadDashboard()]); return true; } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo aprobar la orden"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); return false; } finally { setWorkflowActionId(null); } }; const handleRechazarOrden = async (orden) => { if (!orden?.id) return; const motivo = window.prompt("Motivo de rechazo de la orden de pago:", "Falta respaldo documental"); if (motivo === null) return; const motivoNormalizado = String(motivo || "").trim(); if (!motivoNormalizado) { toast.warning("Debes indicar un motivo para rechazar la orden"); return; } const loadingToastId = toast.loading("Rechazando orden..."); try { setWorkflowActionId(orden.id); const response = await rechazarOrdenPagoProveedor(orden.id, motivoNormalizado); toast.dismiss(loadingToastId); toast.success(response?.message || "Orden rechazada"); await Promise.all([loadPagos(), loadDashboard()]); } catch (error) { toast.dismiss(loadingToastId); console.error(error); const message = error?.response?.data?.message || "No se pudo rechazar la orden"; if (error?.response?.status === 400) toast.warning(message); else toast.error(message); } finally { setWorkflowActionId(null); } }; const handleProveedorChange = (proveedor) => { cuotasPrefillRef.current = null; setSelectedProveedor(proveedor || null); setOrderForm((prev) => ({ ...prev, proveedor_id: proveedor?.id || "", })); setCuentasPagoConfig({}); }; const requiereAprobacionOrden = Boolean( configCompras.workflow_obligatorio || ((configCompras.requiere_aprobacion || configCompras.usar_workflow) && !configCompras.permite_pago_sin_aprobacion), ); const aplicaPagoAlGuardar = Boolean(configCompras.aplicar_pago_al_guardar) && !requiereAprobacionOrden; // Dialog de datos adicionales del medio de pago (compartido entre vistas) const datosMedioDialogNode = datosMedioDialog.open && (() => { const dId = datosMedioDialog.cuentaId; const dCuenta = cuentasById.get(dId); const dConfig = cuentasPagoConfig[dId] || initCuentaPagoConfig(); const dMedio = mediosPago.find((m) => m.id === dConfig.medio_pago_id); const dEsCheque = isMedioCheque(dMedio); const dEsTarjeta = isMedioTarjeta(dMedio); const dEsTransferencia = isMedioTransferencia(dMedio); const dEsDeposito = isMedioDeposito(dMedio); const upd = (field, val) => updateCuentaPagoConfig(dId, field, val); const cerrar = () => setDatosMedioDialog({ open: false, cuentaId: null }); return ( Datos del medio de pago {getCuentaDocumentoRef(dCuenta)} — {dMedio?.descripcion || dMedio?.nombre || ""} {dEsCheque && (<> upd("cuenta_bancaria_id", e.target.value)} sx={{ gridColumn: "1/-1" }} helperText="Cartera donde queda registrado el cheque emitido" > {cuentasBancarias.map((cb) => ( {cb.nombre} ))} upd("numero_cheque", e.target.value.replace(/[^\d]/g, "").slice(0, 30))} inputProps={{ maxLength: 30 }} helperText="Ej: 0012345" /> upd("banco_emisor", v)} helperText="Seleccioná o escribí" /> upd("titular_cheque", e.target.value)} inputProps={{ maxLength: 150 }} helperText="Nombre del firmante" /> upd("numero_operacion", e.target.value)} inputProps={{ maxLength: 50 }} helperText="Opcional" /> upd("fecha_emision_cheque", e.target.value)} InputLabelProps={{ shrink: true }} /> upd("fecha_vencimiento_cheque", e.target.value)} InputLabelProps={{ shrink: true }} helperText="Si es futura → diferido" /> )} {dEsTarjeta && (<> upd("tarjeta_id", e.target.value)} sx={{ gridColumn: "1/-1" }} > {tarjetas.map((t) => ( {t.descripcion} ))} upd("numero_tarjeta", e.target.value.replace(/[^\d]/g, "").slice(0, 4))} inputProps={{ maxLength: 4 }} helperText="Ej: 1234" sx={{ gridColumn: "1/-1" }} /> )} {(dEsTransferencia || dEsDeposito) && (<> upd("cuenta_bancaria_id", e.target.value)} sx={{ gridColumn: "1/-1" }} helperText={dEsDeposito ? "Cuenta donde se deposita el pago" : "Cuenta desde donde se realiza la transferencia"} > {cuentasBancarias.map((cb) => ( {cb.nombre}{cb.numero_cuenta ? ` — ${cb.numero_cuenta}` : ""} ))} {dEsTransferencia && ( upd("numero_operacion", e.target.value)} inputProps={{ maxLength: 100 }} helperText="Ej: TRF-123456" sx={{ gridColumn: "1/-1" }} /> )} )} ); })(); if (showForm) { return ( Nueva Orden de Pago setOrderForm((prev) => ({ ...prev, sucursal_id: e.target.value }))} fullWidth size="small" sx={ORDER_FIELD_INPUT_SX} > Seleccionar {sucursales.map((sucursal) => ( {sucursal.descripcion || sucursal.punto_establecimiento || "Sucursal"} ))} setOrderForm((prev) => ({ ...prev, fecha_pago: e.target.value }))} fullWidth size="small" sx={ORDER_FIELD_INPUT_SX} /> setOrderForm((prev) => ({ ...prev, moneda_id: e.target.value }))} fullWidth size="small" sx={ORDER_FIELD_INPUT_SX} > Seleccionar {monedas.map((moneda) => ( {moneda.codigo} - {moneda.descripcion} {moneda.es_principal ? " ★" : ""} ))} { const value = e.target.value; setOrderForm((prev) => ({ ...prev, medio_pago_id: value })); setCuentasPagoConfig((prev) => { const next = { ...prev }; selectedCuentaIds.forEach((cuentaId) => { const current = next[cuentaId] || initCuentaPagoConfig(cuentaId); if (!current.medio_pago_id) { next[cuentaId] = { ...current, medio_pago_id: value }; } }); return next; }); }} fullWidth size="small" sx={ORDER_FIELD_INPUT_SX} > Seleccionar {mediosPago.map((medio) => ( {medio.descripcion || medio.nombre} ))} { setCotizacionTocada(true); setOrderForm((prev) => ({ ...prev, cotizacion: e.target.value })); }} fullWidth size="small" inputProps={{ min: 0, step: "0.000001" }} sx={ORDER_FIELD_INPUT_SX} disabled={monedaSeleccionadaCodigo === "PYG"} /> {monedaSeleccionadaCodigo && monedaSeleccionadaCodigo !== "PYG" && ( )} setOrderForm((prev) => ({ ...prev, referencia: e.target.value }))} fullWidth size="small" inputProps={{ maxLength: 100 }} sx={ORDER_FIELD_INPUT_SX} /> setOrderForm((prev) => ({ ...prev, observaciones: e.target.value }))} fullWidth multiline minRows={2} size="small" sx={ORDER_FIELD_INPUT_SX} /> Cuentas por pagar seleccionables {planPagosActivo && cuentasPendientes.length > 0 && ( Vienen marcadas las cuotas programadas en el plan de pagos hasta el {fmtFechaCalendario(finPeriodoPagoActualISO(configCompras))}. Las demás se marcan a mano. )} {hayMonedasMezcladas && ( } sx={{ mb: 1.5 }} > Monedas mezcladas: seleccionaste cuentas en{" "} {monedasEnSeleccion.join(" y ")}. Una orden de pago sólo puede cerrar cuentas de una misma moneda. Emití una orden por moneda o desmarcá las de otra moneda para continuar. )} {monedaFormDesalineada && ( } sx={{ mb: 1.5 }} > La moneda del formulario ({monedaFormCodigo}) no coincide con la moneda de las cuentas seleccionadas ({monedaSeleccionCodigo}). Se va a auto-corregir al guardar; si querés controlar manualmente, ajustá el campo{" "} MONEDA arriba. )} {loadingPendientes ? ( ) : cuentasPendientes.length === 0 ? ( {selectedProveedor?.id ? "El proveedor no tiene cuentas pendientes" : "Seleccioná un proveedor para cargar cuentas pendientes"} ) : ( 0 && selectedCuentaIds.length === cuentasLibres.length} onChange={toggleAllCuentas} /> Documento Origen Cuota Vencimiento {planPagosActivo && Programada para} Medio de pago Datos del medio Referencia Saldo pendiente Monto a pagar {cuentasPendientes.map((cuenta) => { const moneda = cuenta.moneda?.simbolo || "Gs."; const saldo = parseNumber(cuenta.saldo_pendiente, 0); const checked = selectedCuentaIds.includes(cuenta.id); const pagoConfig = cuentasPagoConfig[cuenta.id] || initCuentaPagoConfig(cuenta.id); const permitePagoParcial = Boolean(configCompras.permitir_pago_parcial); const montoConfigurado = parseNumber(pagoConfig.monto, saldo); const montoValido = Math.max(0, Math.min(saldo, montoConfigurado)); const medioSeleccionado = mediosPago.find( (medio) => medio.id === pagoConfig.medio_pago_id, ); const mostrarCheque = isMedioCheque(medioSeleccionado); const mostrarTarjeta = isMedioTarjeta(medioSeleccionado); const mostrarTransferencia = isMedioTransferencia(medioSeleccionado); const mostrarDeposito = isMedioDeposito(medioSeleccionado); return ( toggleCuenta(cuenta.id)} aria-label={`Incluir ${getCuentaDocumentoRef(cuenta)}`} /> {getCuentaDocumentoRef(cuenta)} {cuenta.orden_abierta && ( )} {cuenta.numero_cuota || 1} {formatDate(cuenta.fecha_vencimiento)} {planPagosActivo && ( {cuenta.fecha_pago_programada ? fmtFechaCalendario(cuenta.fecha_pago_programada) : "Sin programar"} )} updateCuentaPagoConfig(cuenta.id, "medio_pago_id", e.target.value) } > Seleccionar {mediosPago.map((medio) => ( {medio.descripcion || medio.nombre} ))} {(mostrarCheque || mostrarTarjeta || mostrarTransferencia || mostrarDeposito) ? (() => { const completo = getDatosMedioCompleto(pagoConfig, medioSeleccionado); const resumen = getDatosMedioResumen(pagoConfig, medioSeleccionado, cuentasBancarias, tarjetas); return ( {resumen && ( {resumen} )} ); })() : ( — )} updateCuentaPagoConfig(cuenta.id, "referencia", e.target.value) } inputProps={{ maxLength: 100 }} placeholder="Referencia" /> {formatCurrency(cuenta.saldo_pendiente, moneda)} { const bounded = Math.max(0, Math.min(saldo, parseNumber(num, 0))); updateCuentaPagoConfig(cuenta.id, "monto", bounded); }} sx={{ minWidth: 140 }} InputProps={{ startAdornment: ( {moneda} ), }} /> ); })}
)} {!configCompras.permitir_pago_parcial && ( Pago parcial desactivado en configuración: cada línea se pagará por el saldo completo pendiente. )} Total selección: {fmtMoneda(totalSeleccionado, monedas.find((m) => m.id === orderForm.moneda_id)?.codigo || "PYG")} button": { flex: { xs: 1, sm: "none" }, }, }} > Se registrará una orden para el proveedor {pendingCreateOrder?.proveedorNombre || "-"}. Modo actual:{" "} {aplicaPagoAlGuardar ? "Aplicar pago al guardar" : requiereAprobacionOrden ? "Guardar borrador y enviar a aprobación" : "Guardar como borrador"} Cuentas seleccionadas: {pendingCreateOrder?.cantidadCuentas || 0} Medios de pago utilizados: {pendingCreateOrder?.cantidadMedios || 0} Total a aplicar: {fmtMoneda(pendingCreateOrder?.total || 0, pendingCreateOrder?.monedaCodigo || "PYG")} )} confirmText={aplicaPagoAlGuardar ? "Sí, guardar y ejecutar" : "Sí, guardar borrador"} cancelText="Revisar" confirmColor="primary" /> Vista previa de Comprobante PDF {pdfPreview?.url && (