Add solde footers + per-année small multiples to /dashboard/compte

1. "Entrées sur-versées" and "Versements sans entrée liée" tables get a
   solde footer, same convention as "Reste à verser" above them --
   reuses the totalSurVerse/totalNonLies computeds already backing the
   summary cards, no new computation.

2. "Répartition de l'activité par type" and "Top clients" keep their
   all-time chart, now followed by a small-multiples grid of the same
   chart per année. The type breakdown reuses
   total_par_type_par_compte_par_annee, a new field on
   DashboardStatsController::stats() built from the same répartition-
   level rows already fetched for total_par_type_par_compte (no extra
   query, just one more level of grouping in the PHP aggregation). Top
   clients per année is computed client-side from the same
   entreesDuCompte already used for the all-time version, capped to top
   5 (not 10) to keep the grid readable.

HBarChart gains a `compact` prop (narrower fixed columns, smaller text)
for use inside the small-multiples cards -- the all-time charts above
keep the full-width layout unchanged.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-06 20:41:11 +02:00
co-authored by Claude Sonnet 5
parent ec2af0ea7e
commit 11250bea77
4 changed files with 113 additions and 1 deletions
@@ -275,6 +275,48 @@ html.gin--dark-mode #figli-dashboard-app {
white-space: nowrap;
}
/* Compact variant -- same chart, narrower fixed columns and smaller
text so it fits inside a small-multiples grid card (see
.figli-year-hbar-grid below) instead of the full-width layout. */
#figli-dashboard-app .figli-hbar-chart.is-compact {
gap: 0.3rem;
}
#figli-dashboard-app .figli-hbar-chart.is-compact .figli-hbar-row {
grid-template-columns: 5.5rem 1fr 3.5rem;
gap: 0.4rem;
}
#figli-dashboard-app .figli-hbar-chart.is-compact .figli-hbar-label {
font-size: 0.72rem;
}
#figli-dashboard-app .figli-hbar-chart.is-compact .figli-hbar-track {
height: 0.65rem;
}
#figli-dashboard-app .figli-hbar-chart.is-compact .figli-hbar-value {
font-size: 0.7rem;
}
/* --- Year small multiples (par année, next to the all-time chart) --- */
#figli-dashboard-app .figli-year-hbar-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
gap: 0.75rem;
margin-top: 1.25rem;
padding-top: 1.25rem;
border-top: 1px solid var(--figli-border);
}
#figli-dashboard-app .figli-year-hbar-card {
background: var(--figli-bg-alt);
border: 1px solid var(--figli-border);
border-radius: 6px;
padding: 0.65rem 0.75rem;
}
#figli-dashboard-app .figli-year-hbar-title {
font-size: 0.78rem;
font-weight: 700;
color: var(--figli-text-light);
margin-bottom: 0.5rem;
}
/* --- Vertical bar chart (CA par année) --- */
#figli-dashboard-app .figli-vbar-chart {
display: flex;