Administrator/dashboard-completo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualizar frontend/src/pages/Cobranza.jsx

Browse Source
This commit is contained in:
Administrator
2026-08-26 11:18:39 -05:00
parent 5b96e4cb59
commit d444c8051b
1 changed files with 17 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/pages/Cobranza.jsx
View File

@@ -417,15 +417,16 @@ function Row({ k, v, bold, color }) {
); );
} }
function TarjetasResumen({ r }) { function TarjetasResumen({ r, retiro }) {
const rt = retiro || { sAnt:0, sMes:0, sTot:0 };
const cards = [ const cards = [
["⚠ MES ANTERIOR","#d97706",r.cAnt,r.obAnt], ["⚠ MES ANTERIOR","#d97706",r.cAnt,r.obAnt, rt.sAnt],
["📅 MES EN CURSO","#059669",r.cMes,r.obMes], ["📅 MES EN CURSO","#059669",r.cMes,r.obMes, rt.sMes],
["💰 CARTERA TOTAL","#7c3aed",r.cTot,r.obTot], ["💰 CARTERA TOTAL","#7c3aed",r.cTot,r.obTot, rt.sTot],
]; ];
return ( return (
<div style={{display:"grid",gridTemplateColumns:"repeat(3,1fr)",gap:14}}> <div style={{display:"grid",gridTemplateColumns:"repeat(3,1fr)",gap:14}}>
{cards.map(([titulo,color,cta,cob]) => { {cards.map(([titulo,color,cta,cob,saldoRetiro]) => {
const ratio = cta>0 ? (cob/cta*100) : 0; const ratio = cta>0 ? (cob/cta*100) : 0;
const c = colorSemaforo(ratio); const c = colorSemaforo(ratio);
const saldo = cta - cob; const saldo = cta - cob;
@@ -436,6 +437,7 @@ function TarjetasResumen({ r }) {
<Row k="Cta x Cobrar" v={`S/ ${cta.toLocaleString("es-PE",{maximumFractionDigits:0})}`} /> <Row k="Cta x Cobrar" v={`S/ ${cta.toLocaleString("es-PE",{maximumFractionDigits:0})}`} />
<Row k="Cobrado" v={`S/ ${cob.toLocaleString("es-PE",{maximumFractionDigits:0})}`} /> <Row k="Cobrado" v={`S/ ${cob.toLocaleString("es-PE",{maximumFractionDigits:0})}`} />
<Row k="Saldo" v={`S/ ${saldo.toLocaleString("es-PE",{maximumFractionDigits:0})}`} bold color={saldo>0?"#dc2626":"#10b981"} /> <Row k="Saldo" v={`S/ ${saldo.toLocaleString("es-PE",{maximumFractionDigits:0})}`} bold color={saldo>0?"#dc2626":"#10b981"} />
<Row k="Saldo por Retirar" v={`S/ ${(saldoRetiro||0).toLocaleString("es-PE",{maximumFractionDigits:0})}`} color="#dc2626" />
{cta>0 && ( {cta>0 && (
<div style={{marginTop:8}}> <div style={{marginTop:8}}>
<div style={{display:"flex",justifyContent:"space-between",marginBottom:4}}> <div style={{display:"flex",justifyContent:"space-between",marginBottom:4}}>
@@ -675,14 +677,19 @@ function ModalEstadoCuenta({ grupo, ano, mes, sectorista, agrupacion, onClose })
return { total, pagaron, deben }; return { total, pagaron, deben };
}, [filas]); }, [filas]);
// POR RETIRAR: cantidad de alumnos marcados y suma de su saldo // POR RETIRAR: cantidad de alumnos marcados y saldos por cartera (ANT, MES, TOTAL)
const retiro = useMemo(() => { const retiro = useMemo(() => {
let cant=0, saldo=0; let cant=0, saldo=0, sAnt=0, sMes=0;
filas.forEach((f) => { filas.forEach((f) => {
if (String(f[0]).toUpperCase() === "TOTAL") return; if (String(f[0]).toUpperCase() === "TOTAL") return;
if (porRetirar.has(String(f[0]))) { cant++; saldo += toMonto(f[13]); } if (porRetirar.has(String(f[0]))) {
cant++;
saldo += toMonto(f[13]);
sAnt += (toMonto(f[4]) - toMonto(f[5])); // CTA ANT - COB ANT
sMes += (toMonto(f[7]) - toMonto(f[8])); // CTA MES - COB MES
}
}); });
return { cant, saldo }; return { cant, saldo, sAnt, sMes, sTot: sAnt + sMes };
}, [filas, porRetirar]); }, [filas, porRetirar]);
return ( return (
@@ -691,7 +698,7 @@ function ModalEstadoCuenta({ grupo, ano, mes, sectorista, agrupacion, onClose })
filas.length === 0 ? <div style={{color:"#94a3b8",padding:20,textAlign:"center"}}>Sin datos.</div> : filas.length === 0 ? <div style={{color:"#94a3b8",padding:20,textAlign:"center"}}>Sin datos.</div> :
<> <>
<div style={{marginBottom:16}}> <div style={{marginBottom:16}}>
<TarjetasResumen r={resumen} /> <TarjetasResumen r={resumen} retiro={retiro} />
</div> </div>
{/* Etiquetas de conteo de alumnos */} {/* Etiquetas de conteo de alumnos */}
<div style={{display:"flex",gap:10,marginBottom:14,flexWrap:"wrap",alignItems:"center"}}> <div style={{display:"flex",gap:10,marginBottom:14,flexWrap:"wrap",alignItems:"center"}}>