refactor(frontend): modernise la mise en page du tableau de bord

- ligne d'état « Actualisé à HH:mm:ss · N sites suivis » avec un point animé,
  figé sous prefers-reduced-motion
- indicateurs en cartes : libellé en capitales, grand nombre en chiffres
  tabulaires, filet supérieur, ombre au survol ; la barre de charge moyenne
  passe au jaune à 70 % et au rouge à 90 %, avec un texte d'aide
- grille à deux colonnes : graphique de charge et prévisions à gauche, flux
  d'alertes en colonne collante à droite, une colonne sous 900 px
- prévisions présentées en tableau (site, prévision, échéance, lien détail)
- liens de navigation de l'en-tête restylés en pastilles, par SCSS seulement :
  le bloc HTML de navigation est inchangé octet pour octet
- styles de tableau sortis dans _tables.scss (.ev-table, .ev-table-card), la
  liste des sites les adopte au lieu de sa copie locale
This commit is contained in:
Johan LEROY
2026-09-21 14:35:30 +02:00
parent c2bd1317ed
commit 6785d06a9a
8 changed files with 374 additions and 145 deletions
@@ -30,6 +30,11 @@ const TON_PAR_STATUT_PREDICTION: Record<PredictionStatus, BadgeTone> = {
error: 'danger',
};
const SEUIL_CHARGE_SOUTENUE = 70;
const SEUIL_CHARGE_CRITIQUE = 90;
export type LoadTone = 'success' | 'warning' | 'danger';
@Component({
selector: 'app-dashboard',
standalone: true,
@@ -97,6 +102,24 @@ export class Dashboard implements OnInit {
return TON_PAR_STATUT_PREDICTION[status];
}
loadTone(percent: number): LoadTone {
if (percent >= SEUIL_CHARGE_CRITIQUE) {
return 'danger';
}
return percent >= SEUIL_CHARGE_SOUTENUE ? 'warning' : 'success';
}
loadHint(percent: number): string {
switch (this.loadTone(percent)) {
case 'danger':
return 'Proche de la capacité du parc';
case 'warning':
return 'Charge soutenue';
default:
return 'Marge confortable';
}
}
onLogout(): void {
this.auth.logout().subscribe({
next: () => this.router.navigate(['/login']),