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

Actualizar dominios a dashboardapi y dashboardv1

Browse Source
This commit is contained in:
Administrator
2026-08-29 12:21:21 -05:00
parent 191b5bb1ba
commit 54581c21ab
77 changed files with 7679 additions and 11728 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
frontend/src/pages/SaldoPendiente.jsx
View File

@@ -1,96 +0,0 @@
// src/pages/SaldoPendiente.jsx
import { useState, useEffect, useMemo } from "react";
import { api } from "../lib/api";
import { Loader, ErrorBox, Filters, Select } from "../components/UI";
const CUOTAS = ["1° Cuota","2° Cuota","3° Cuota","4° Cuota","5° Cuota"];
function toNum(v){ const n=parseFloat(String(v).replace("S/","").replace(/,/g,"").trim()); return isNaN(n)?0:n; }
function fmt(v){ const n=toNum(v); return "S/ " + n.toLocaleString("es-PE",{maximumFractionDigits:0}); }
export default function SaldoPendiente() {
const [tipoCuota, setTipoCuota] = useState("1° Cuota");
const [datos, setDatos] = useState([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState(null);
const [vendedor, setVendedor] = useState("TODOS");
useEffect(() => {
let activo = true;
setLoading(true); setError(null);
api.saldoPendiente(tipoCuota)
.then((res)=>{ if(activo){setDatos(res.datos||[]);setLoading(false);} })
.catch((e)=>{ if(activo){setError(e.message);setLoading(false);} });
return ()=>{activo=false;};
}, [tipoCuota]);
const colSaldo = `SALDO ${tipoCuota.toUpperCase()}`;
const vendedores = useMemo(() => {
const set = new Set(datos.map((d)=>String(d.VENDEDOR||"").trim()).filter(Boolean));
return ["TODOS", ...Array.from(set).sort()];
}, [datos]);
const filtrados = useMemo(() => {
let arr = datos.filter((d)=>toNum(d[colSaldo])>0.01);
if (vendedor!=="TODOS") arr = arr.filter((d)=>String(d.VENDEDOR||"").trim().toUpperCase()===vendedor.toUpperCase());
return arr;
}, [datos, vendedor, colSaldo]);
const totalSaldo = useMemo(()=>filtrados.reduce((s,d)=>s+toNum(d[colSaldo]),0),[filtrados,colSaldo]);
const totalMat = useMemo(()=>filtrados.reduce((s,d)=>s+toNum(d["SALDO MAT."]),0),[filtrados]);
const COLS = ["MATRÍCULA","VENDEDOR","ALUMNO","PROGRAMA","F. INICIO","F. MATR.","SALDO MAT.",colSaldo,"VENCIMIENTO","INV. NETA"];
const KEYS = ["MATRICULA","VENDEDOR","ALUMNO","PROGRAMA","FECHA INICIO","FECHA MATR.","SALDO MAT.",colSaldo,"VENCIMIENTO","INV. NETA"];
return (
<div>
<h1 className="page-title">⏳ Saldo Pendiente</h1>
<Filters>
<Select label="Tipo de cuota" value={tipoCuota} options={CUOTAS} onChange={setTipoCuota} />
<Select label="Vendedor" value={vendedor} options={vendedores} onChange={setVendedor} />
</Filters>
{loading ? <Loader text="Calculando saldos..." /> :
error ? <ErrorBox msg={error} /> :
<>
<div className="kpis" style={{gridTemplateColumns:"repeat(3,1fr)"}}>
<div className="kpi"><div className="ico">👥</div><div className="label">Alumnos con Saldo</div><div className="value">{filtrados.length}</div></div>
<div className="kpi"><div className="ico">⏳</div><div className="label">Saldo {tipoCuota}</div><div className="value" style={{fontSize:20}}>{fmt(totalSaldo)}</div></div>
<div className="kpi"><div className="ico">📋</div><div className="label">Saldo Matrícula</div><div className="value" style={{fontSize:20}}>{fmt(totalMat)}</div></div>
</div>
<div className="table-wrap" style={{marginTop:16}}>
<table style={{minWidth:1100}}>
<thead><tr>{COLS.map((c)=><th key={c}>{c}</th>)}</tr></thead>
<tbody>
{filtrados.map((d,i)=>(
<tr key={i}>
{KEYS.map((k,j)=>{
const isMonto = k.includes("SALDO")||k.includes("INV");
return (
<td key={j} className={k==="ALUMNO"||k==="PROGRAMA"?"col-name":""}
style={{textAlign:isMonto?"right":(k==="ALUMNO"||k==="PROGRAMA"?"left":"center"),
fontWeight:k===colSaldo?700:undefined,
color:k===colSaldo?"#dc2626":undefined}}>
{isMonto ? fmt(d[k]) : (d[k] ?? "")}
</td>
);
})}
</tr>
))}
{filtrados.length>0 && (
<tr className="total-row">
<td colSpan={6} style={{textAlign:"left"}}>TOTAL GENERAL ({filtrados.length})</td>
<td style={{textAlign:"right"}}>{fmt(totalMat)}</td>
<td style={{textAlign:"right"}}>{fmt(totalSaldo)}</td>
<td>—</td><td>—</td>
</tr>
)}
</tbody>
</table>
</div>
</>}
</div>
);
}