import { Icon } from "@iconify/react"; import { Box, Button, Card, Chip, CircularProgress, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, FormControl, InputLabel, MenuItem, Paper, Select, Skeleton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography, } from "@mui/material"; import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; import { useEffect, useMemo, useState } from "react"; import { toast } from "sonner"; import { getEmpresaMonedas } from "../../../api/monedas.service"; import { generarComisionesExistentes, getResumenComisiones, getVendedoresCobradores, } from "../../../api/vendedores-cobradores.service"; import { usePermission } from "../../../hooks/usePermission"; import { EmptyState, ScreenGuia } from "../../_standards"; import { SearchableSelect } from "../../ui/SearchableSelect"; import { ComisionesDetalleDialog } from "./ComisionesDetalleDialog"; import { ComisionesPdfModal } from "./ComisionesPdfModal"; const tipoChip = { vendedor: { label: "Vendedor", color: "primary" }, cobrador: { label: "Cobrador", color: "secondary" }, ambos: { label: "Ambos", color: "success" }, }; const estadoChip = { pendiente: { label: "Pendiente", color: "warning" }, liquidada: { label: "Liquidada", color: "success" }, }; export const ComisionesPanel = () => { const [periodo, setPeriodo] = useState("mes_actual"); const [vendedorId, setVendedorId] = useState("todos"); const [filterMoneda, setFilterMoneda] = useState(""); const [dialogOpen, setDialogOpen] = useState(false); // Resultado detallado del último "Generar comisiones históricas" — string vacío = cerrado. const [resultadoGenerar, setResultadoGenerar] = useState(null); const [detalleVC, setDetalleVC] = useState(null); const [pdfTipo, setPdfTipo] = useState(null); const queryClient = useQueryClient(); const { can: canCobranzas } = usePermission("COBRANZAS"); const canGenerar = canCobranzas("COB_COM_COMISION_GENERAR"); const { desde, hasta, fechaDesdeStr, fechaHastaStr } = useMemo(() => { const hoy = new Date(); let desdeDate, hastaDate; switch (periodo) { case "mes_actual": desdeDate = new Date(hoy.getFullYear(), hoy.getMonth(), 1); hastaDate = new Date(hoy.getFullYear(), hoy.getMonth() + 1, 0); break; case "mes_anterior": desdeDate = new Date(hoy.getFullYear(), hoy.getMonth() - 1, 1); hastaDate = new Date(hoy.getFullYear(), hoy.getMonth(), 0); break; case "trimestre": { const trimestre = Math.floor(hoy.getMonth() / 3); desdeDate = new Date(hoy.getFullYear(), trimestre * 3, 1); hastaDate = new Date(hoy.getFullYear(), trimestre * 3 + 3, 0); break; } case "anio": desdeDate = new Date(hoy.getFullYear(), 0, 1); hastaDate = new Date(hoy.getFullYear(), 11, 31); break; default: desdeDate = new Date(hoy.getFullYear(), hoy.getMonth(), 1); hastaDate = hoy; } const formatDate = (d) => d.toISOString().split("T")[0]; return { desde: desdeDate, hasta: hastaDate, fechaDesdeStr: formatDate(desdeDate), fechaHastaStr: formatDate(hastaDate), }; }, [periodo]); const { data: monedasData } = useQuery({ queryKey: ["empresa-monedas"], queryFn: getEmpresaMonedas, }); const monedas = monedasData || []; const { data: vcActivos } = useQuery({ queryKey: ["vendedores-cobradores-activos-filtro"], queryFn: () => getVendedoresCobradores({ active: true }), }); const vendedoresCobradoresFiltro = useMemo( () => (Array.isArray(vcActivos) ? vcActivos : vcActivos?.data || []).map((v) => ({ id: v.id, nombre: `${v.nombre ?? ""} ${v.apellido ?? ""}`.trim() || v.codigo || "Sin nombre", })), [vcActivos], ); useEffect(() => { if (monedas.length > 0 && !filterMoneda) { const principal = monedas.find((m) => m.es_principal); if (principal) setFilterMoneda(principal.moneda?.id || principal.id); else if (monedas[0]) setFilterMoneda(monedas[0].moneda?.id || monedas[0].id); } }, [monedas, filterMoneda]); const { data: comisionesData, isLoading } = useQuery({ queryKey: ["resumen-comisiones", fechaDesdeStr, fechaHastaStr, filterMoneda], queryFn: () => getResumenComisiones({ fechaDesde: fechaDesdeStr, fechaHasta: fechaHastaStr, monedaId: filterMoneda || undefined, }), }); const { mutate: generarComisiones, isPending: generando } = useMutation({ mutationFn: generarComisionesExistentes, onSuccess: (data) => { const generadas = Number(data?.comisionesGeneradas ?? 0); if (generadas > 0) { toast.success(`${generadas} comisión(es) generada(s) correctamente`); } else { // Sin generación → abrir diálogo con detalle en vez de toast que desaparece. setResultadoGenerar({ comisionesGeneradas: generadas, detalles: Array.isArray(data?.detalles) ? data.detalles : [], mensaje: data?.mensaje || "No se generó ninguna comisión", }); } queryClient.invalidateQueries({ queryKey: ["resumen-comisiones"] }); setDialogOpen(false); }, onError: () => toast.error("Error al generar comisiones"), }); const comisionesResumen = useMemo(() => { if (!comisionesData) return []; return comisionesData.map((c) => ({ ...c, nombre: `${c.nombre} ${c.apellido || ""}`.trim(), })); }, [comisionesData]); const comisionesFiltradas = vendedorId === "todos" ? comisionesResumen : comisionesResumen.filter((c) => c.id === vendedorId); const totales = comisionesFiltradas.reduce( (acc, c) => ({ ventas: acc.ventas + (c.ventas || 0), cobranzas: acc.cobranzas + (c.cobranzas || 0), comisiones: acc.comisiones + (c.comision_generada || 0), }), { ventas: 0, cobranzas: 0, comisiones: 0 }, ); const monedaActual = comisionesFiltradas[0]?.moneda || { codigo: "PYG", simbolo: "Gs." }; const formatCurrency = (value, moneda = null) => { const mon = moneda || monedaActual; const codigo = mon?.codigo || "PYG"; const simbolo = mon?.simbolo || "Gs."; const formattedValue = new Intl.NumberFormat("es-PY", { minimumFractionDigits: codigo === "PYG" ? 0 : 2, maximumFractionDigits: codigo === "PYG" ? 0 : 2, }).format(value || 0); return `${simbolo} ${formattedValue}`; }; return ( Comisiones Resumen de comisiones generadas por período {canGenerar && ( )} Período setVendedorId(id || "todos")} label="Vendedor/Cobrador" placeholder="Buscar..." clearable={false} getOptionLabel={(o) => o?.nombre || ""} /> Moneda {desde.toLocaleDateString()} — {hasta.toLocaleDateString()} Vendedor/Cobrador Tipo Ventas Cobranzas % Comisión Comisión Generada Estado {isLoading ? ( Array.from({ length: 3 }).map((_, i) => ( {Array.from({ length: 7 }).map((__, j) => ( ))} )) ) : comisionesFiltradas.length === 0 ? ( { const el = document.querySelector('[aria-expanded]'); el?.scrollIntoView({ behavior: "smooth", block: "start" }); }} /> ) : ( comisionesFiltradas.map((c) => { const tipo = tipoChip[c.tipo] || tipoChip.ambos; const estado = estadoChip[c.estado] || estadoChip.pendiente; return ( setDetalleVC(c)} > {c.nombre} {c.tipo === "vendedor" || c.tipo === "ambos" ? formatCurrency(c.ventas) : "-"} {c.tipo === "cobrador" || c.tipo === "ambos" ? formatCurrency(c.cobranzas) : "-"} {c.comision_porcentaje > 0 ? `${c.comision_porcentaje}%` : "-"} {formatCurrency(c.comision_generada)} ); }) )}
Nota: Las comisiones se calculan automáticamente basándose en las ventas y cobranzas registradas. Para liquidarlas, usá el módulo de Liquidaciones. setPdfTipo(null)} tipo={pdfTipo || "resumen"} fechaDesde={fechaDesdeStr} fechaHasta={fechaHastaStr} monedaId={filterMoneda || undefined} /> setDetalleVC(null)} vendedorCobrador={detalleVC} fechaDesde={fechaDesdeStr} fechaHasta={fechaHastaStr} monedaId={filterMoneda || undefined} /> setDialogOpen(false)} maxWidth="sm" fullWidth> Generar comisiones históricas Se generarán comisiones de venta para todas las facturas que ya tienen vendedor asignado pero aún no tienen comisión registrada. Las que ya tienen comisión{" "} no se duplicarán. {/* Diálogo de diagnóstico cuando "Generar comisiones históricas" devuelve 0. Reemplaza al toast que desaparecía sin dejar rastro. Muestra los motivos agrupados que devuelve el backend en `detalles`. */} setResultadoGenerar(null)} maxWidth="md" fullWidth > No se generó ninguna comisión El proceso terminó sin generar comisiones. Revisá los motivos por factura para entender qué falta configurar. {/* Si el backend devolvió un mensaje explícito (ej. "Módulo COMISIONES no activo"), mostrarlo con destaque — antes lo tragaba silenciosamente. */} {resultadoGenerar?.mensaje && resultadoGenerar.mensaje !== "No se generó ninguna comisión" && ( {resultadoGenerar.mensaje} )} {resultadoGenerar && resultadoGenerar.detalles.length === 0 ? ( Ninguna asignación de factura se procesó. Causas típicas: Módulo COMISIONES desactivado en la suscripción de la empresa (revisar Configuración → Suscripción → Módulos contratados). Hay facturas sin vendedor asignado (se emitieron sin elegir vendedor). Todas las facturas ya tienen comisión previa liquidada (no hay nada para generar). Cómo verificar: revisá primero que el módulo COMISIONES esté activo. Luego que las facturas hayan sido emitidas con vendedor asignado (dropdown "Vendedor" al facturar). Si todo es correcto, contactá soporte con el mensaje exacto que aparece arriba. ) : ( <> {resultadoGenerar?.detalles?.length ?? 0} factura(s) analizada(s): {resultadoGenerar && (() => { const motivos = {}; for (const linea of resultadoGenerar.detalles) { const match = String(linea).match(/:\s*(.+)$/); const motivo = match ? match[1].trim() : String(linea); motivos[motivo] = (motivos[motivo] || 0) + 1; } const explicacion = { "sin vendedor asignado": "La factura tiene una asignación pero sin vendedor (probablemente sólo se asignó cobrador). Ir a Finanzas → Asignación y elegir el vendedor.", "ya tiene comisión": "Ya existe una comisión previa para esta factura+vendedor. Es idempotente por diseño.", "sin comisión": "El vendedor no tiene cargado un porcentaje de comisión mayor a 0. Editá el vendedor y cargá el porcentaje.", "monto base 0": "La factura no tiene totales calculados o su total es 0. Revisar la factura origen.", }; return ( {Object.entries(motivos).map(([motivo, cantidad]) => ( {motivo} {explicacion[motivo] || "Ver logs del backend para más detalle."} ))} ); })()} )} ); }; function KpiCard({ icon, color, label, value, loading }) { return ( {label} {loading ? ( ) : ( {value} )} ); } export default ComisionesPanel;