El Dashboard es la pantalla principal de GastosApp y el punto de partida para entender el estado financiero del negocio de un solo vistazo. Muestra los indicadores clave del año en curso, un widget de alertas para compromisos recurrentes urgentes, tarjetas mensuales agrupadas por año y tres gráficos interactivos que se actualizan al seleccionar cualquier tarjeta de mes. Úsalo cada vez que necesites saber cuánto se ha gastado, cuánto está pendiente de pago o cómo evoluciona el gasto a lo largo de los meses.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/Davidmallega/Gastos-App/llms.txt
Use this file to discover all available pages before exploring further.
StatCards
Las tarjetas de indicadores aparecen en la parte superior de la pantalla y reflejan siempre el año en curso. Cada una muestra un valor principal, un subtítulo descriptivo y un ícono de referencia visual.| Tarjeta | Descripción |
|---|---|
Total <año> | Suma neta de todos los documentos del año, descontando las Notas de Crédito. Si existen NC, el monto bruto aparece tachado encima del valor neto. |
Pagado <año> | Total de documentos marcados como pagados durante el año. |
| Pendiente hoy | Suma de documentos sin pagar cuya fecha es igual o anterior a hoy. Excluye los programados a futuro. |
| Programado | Suma de documentos sin pagar con fecha posterior a hoy (meses futuros). |
| Facturas SII | Cantidad de facturas y notas de crédito del año, con el total en el subtítulo. |
| Gastos Caja | Cantidad de gastos por caja del año, con el total en el subtítulo. |
| Notas de Crédito | Solo aparece si hay NC en el año. Muestra el monto total deducido y el número de NC registradas. |
Widget de Compromisos
El widget de compromisos solo se muestra si existen compromisos activos configurados en la aplicación. Su propósito es alertar sobre obligaciones periódicas que requieren atención inmediata sin necesidad de navegar al módulo de Compromisos. El widget prioriza y muestra hasta cinco compromisos en el siguiente orden de urgencia:- Vencidos — el día de vencimiento ya pasó sin que se registrara el gasto.
- Ingresado/Impago — el gasto fue ingresado en el período actual, pero aún no se ha marcado como pagado.
- Próximos — el vencimiento está a 5 días o menos (2 días para frecuencia semanal).
Tarjetas mensuales
Debajo de los KPIs y el widget, el Dashboard presenta un grid de tarjetas mensuales agrupadas por año, mostrando el año más reciente primero. Solo se incluyen en el grid los meses que tienen al menos un documento registrado, más el mes actual (aunque esté vacío). Las tarjetas muestran:- Nombre del mes y año.
- Monto total del mes (con el bruto tachado si hay NC aplicadas ese mes).
- Desglose de Pagado y Pendiente en colores verde y amarillo respectivamente.
- Conteo de documentos en el pie de la tarjeta.
Los meses con fecha futura (año o mes posterior al actual) se distinguen visualmente con un borde punteado y una etiqueta “PROG.” en azul. Esto los diferencia claramente de los meses cerrados o del mes en curso, que tienen borde sólido.
Gráficos
Los gráficos aparecen en la parte inferior del Dashboard y se relacionan con el mes seleccionado en el grid. Se renderizan con la librería Recharts e incluyen tooltips personalizados con valores en formato de pesos chilenos (CLP).Línea de evolución
Muestra la evolución de Total, Pagado y Pendiente a lo largo de los últimos 6 meses más los meses futuros que tengan documentos registrados. Es útil para identificar tendencias de gasto y anticipar compromisos futuros. El eje Y formatea los valores en miles ($Xk).
Torta por categoría
Muestra la distribución del gasto del mes seleccionado desglosado por categoría. El gráfico es de tipo donut (anillo) con un tooltip que muestra el monto exacto al pasar el cursor. Debajo del gráfico aparece una leyenda con los primeros cinco valores más altos.Barras por categoría
Complementa la torta con un gráfico de barras verticales para el mes seleccionado, facilitando la comparación de montos entre categorías. Se muestran hasta 10 categorías ordenadas de mayor a menor. Cada barra tiene un color distinto y el mismo tooltip del gráfico de línea.Acciones disponibles
| Acción | Descripción |
|---|---|
| Actualizar | Botón en el encabezado que fuerza la recarga del store desde localStorage. Útil si se hicieron cambios desde otra ventana. |
| Seleccionar mes | Clic en cualquier tarjeta mensual para filtrar los gráficos a ese período. |
| Ingresar compromiso | Desde el widget de compromisos, permite registrar el gasto del período directamente. |
| Ver todos → | Enlace en el widget que navega a la pantalla de Compromisos. |