Clean project: remove test files, debug logs, and add documentation
This commit is contained in:
dahoud
@@ -0,0 +1,359 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'common/section_header.dart';
|
||||
import 'common/stat_card.dart';
|
||||
|
||||
/// Section des statistiques rapides du dashboard
|
||||
///
|
||||
/// Widget réutilisable pour afficher les KPIs et métriques principales
|
||||
/// avec différents layouts et styles selon le contexte.
|
||||
class QuickStatsSection extends StatelessWidget {
|
||||
/// Titre de la section
|
||||
final String title;
|
||||
|
||||
/// Sous-titre optionnel
|
||||
final String? subtitle;
|
||||
|
||||
/// Liste des statistiques à afficher
|
||||
final List<QuickStat> stats;
|
||||
|
||||
/// Layout des cartes (grid, row, column)
|
||||
final StatsLayout layout;
|
||||
|
||||
/// Nombre de colonnes pour le layout grid
|
||||
final int gridColumns;
|
||||
|
||||
/// Style des cartes de statistiques
|
||||
final StatCardStyle cardStyle;
|
||||
|
||||
/// Taille des cartes
|
||||
final StatCardSize cardSize;
|
||||
|
||||
/// Callback lors du tap sur une statistique
|
||||
final Function(QuickStat)? onStatTap;
|
||||
|
||||
/// Afficher ou non l'en-tête de section
|
||||
final bool showHeader;
|
||||
|
||||
const QuickStatsSection({
|
||||
super.key,
|
||||
required this.title,
|
||||
this.subtitle,
|
||||
required this.stats,
|
||||
this.layout = StatsLayout.grid,
|
||||
this.gridColumns = 2,
|
||||
this.cardStyle = StatCardStyle.elevated,
|
||||
this.cardSize = StatCardSize.compact,
|
||||
this.onStatTap,
|
||||
this.showHeader = true,
|
||||
});
|
||||
|
||||
/// Constructeur pour les KPIs système (Super Admin)
|
||||
const QuickStatsSection.systemKPIs({
|
||||
super.key,
|
||||
this.onStatTap,
|
||||
}) : title = 'Métriques Système',
|
||||
subtitle = null,
|
||||
stats = const [
|
||||
QuickStat(
|
||||
title: 'Organisations',
|
||||
value: '247',
|
||||
subtitle: '+12 ce mois',
|
||||
icon: Icons.business,
|
||||
color: Color(0xFF0984E3),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Utilisateurs',
|
||||
value: '15,847',
|
||||
subtitle: '+1,234 ce mois',
|
||||
icon: Icons.people,
|
||||
color: Color(0xFF00B894),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Uptime',
|
||||
value: '99.97%',
|
||||
subtitle: '30 derniers jours',
|
||||
icon: Icons.trending_up,
|
||||
color: Color(0xFF00CEC9),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Temps Réponse',
|
||||
value: '1.2s',
|
||||
subtitle: 'Moyenne 24h',
|
||||
icon: Icons.speed,
|
||||
color: Color(0xFFE17055),
|
||||
),
|
||||
],
|
||||
layout = StatsLayout.grid,
|
||||
gridColumns = 2,
|
||||
cardStyle = StatCardStyle.elevated,
|
||||
cardSize = StatCardSize.compact,
|
||||
showHeader = true;
|
||||
|
||||
/// Constructeur pour les statistiques d'organisation
|
||||
const QuickStatsSection.organizationStats({
|
||||
super.key,
|
||||
this.onStatTap,
|
||||
}) : title = 'Vue d\'ensemble',
|
||||
subtitle = null,
|
||||
stats = const [
|
||||
QuickStat(
|
||||
title: 'Membres',
|
||||
value: '156',
|
||||
subtitle: '+12 ce mois',
|
||||
icon: Icons.people,
|
||||
color: Color(0xFF00B894),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Événements',
|
||||
value: '23',
|
||||
subtitle: '8 à venir',
|
||||
icon: Icons.event,
|
||||
color: Color(0xFFE17055),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Projets',
|
||||
value: '8',
|
||||
subtitle: '3 actifs',
|
||||
icon: Icons.work,
|
||||
color: Color(0xFF0984E3),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Taux engagement',
|
||||
value: '78%',
|
||||
subtitle: '+5% ce mois',
|
||||
icon: Icons.trending_up,
|
||||
color: Color(0xFF6C5CE7),
|
||||
),
|
||||
],
|
||||
layout = StatsLayout.grid,
|
||||
gridColumns = 2,
|
||||
cardStyle = StatCardStyle.elevated,
|
||||
cardSize = StatCardSize.compact,
|
||||
showHeader = true;
|
||||
|
||||
/// Constructeur pour les métriques de performance
|
||||
const QuickStatsSection.performanceMetrics({
|
||||
super.key,
|
||||
this.onStatTap,
|
||||
}) : title = 'Performance',
|
||||
subtitle = 'Métriques temps réel',
|
||||
stats = const [
|
||||
QuickStat(
|
||||
title: 'CPU',
|
||||
value: '23%',
|
||||
subtitle: 'Normal',
|
||||
icon: Icons.memory,
|
||||
color: Color(0xFF00B894),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'RAM',
|
||||
value: '67%',
|
||||
subtitle: 'Élevé',
|
||||
icon: Icons.storage,
|
||||
color: Color(0xFFE17055),
|
||||
),
|
||||
QuickStat(
|
||||
title: 'Réseau',
|
||||
value: '12 MB/s',
|
||||
subtitle: 'Stable',
|
||||
icon: Icons.network_check,
|
||||
color: Color(0xFF0984E3),
|
||||
),
|
||||
],
|
||||
layout = StatsLayout.row,
|
||||
gridColumns = 3,
|
||||
cardStyle = StatCardStyle.outlined,
|
||||
cardSize = StatCardSize.normal,
|
||||
showHeader = true;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
if (showHeader) ...[
|
||||
SectionHeader.section(
|
||||
title: title,
|
||||
subtitle: subtitle,
|
||||
),
|
||||
],
|
||||
_buildStatsLayout(),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
/// Construction du layout des statistiques
|
||||
Widget _buildStatsLayout() {
|
||||
switch (layout) {
|
||||
case StatsLayout.grid:
|
||||
return _buildGridLayout();
|
||||
case StatsLayout.row:
|
||||
return _buildRowLayout();
|
||||
case StatsLayout.column:
|
||||
return _buildColumnLayout();
|
||||
case StatsLayout.wrap:
|
||||
return _buildWrapLayout();
|
||||
}
|
||||
}
|
||||
|
||||
/// Layout en grille
|
||||
Widget _buildGridLayout() {
|
||||
return GridView.builder(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: gridColumns,
|
||||
crossAxisSpacing: 8,
|
||||
mainAxisSpacing: 8,
|
||||
childAspectRatio: _getChildAspectRatio(),
|
||||
),
|
||||
itemCount: stats.length,
|
||||
itemBuilder: (context, index) => _buildStatCard(stats[index]),
|
||||
);
|
||||
}
|
||||
|
||||
/// Layout en ligne
|
||||
Widget _buildRowLayout() {
|
||||
return Row(
|
||||
children: stats.map((stat) => Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 4),
|
||||
child: _buildStatCard(stat),
|
||||
),
|
||||
)).toList(),
|
||||
);
|
||||
}
|
||||
|
||||
/// Layout en colonne
|
||||
Widget _buildColumnLayout() {
|
||||
return Column(
|
||||
children: stats.map((stat) => Padding(
|
||||
padding: const EdgeInsets.only(bottom: 8),
|
||||
child: _buildStatCard(stat),
|
||||
)).toList(),
|
||||
);
|
||||
}
|
||||
|
||||
/// Layout wrap (adaptatif)
|
||||
Widget _buildWrapLayout() {
|
||||
return LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
return Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 8,
|
||||
children: stats.map((stat) => SizedBox(
|
||||
width: (constraints.maxWidth - 8) / 2, // 2 colonnes avec espacement
|
||||
child: _buildStatCard(stat),
|
||||
)).toList(),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/// Construction d'une carte de statistique
|
||||
Widget _buildStatCard(QuickStat stat) {
|
||||
return StatCard(
|
||||
title: stat.title,
|
||||
value: stat.value,
|
||||
subtitle: stat.subtitle,
|
||||
icon: stat.icon,
|
||||
color: stat.color,
|
||||
size: cardSize,
|
||||
style: cardStyle,
|
||||
onTap: onStatTap != null ? () => onStatTap!(stat) : null,
|
||||
);
|
||||
}
|
||||
|
||||
/// Ratio d'aspect selon la taille des cartes
|
||||
double _getChildAspectRatio() {
|
||||
switch (cardSize) {
|
||||
case StatCardSize.compact:
|
||||
return 1.4;
|
||||
case StatCardSize.normal:
|
||||
return 1.2;
|
||||
case StatCardSize.large:
|
||||
return 1.0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Modèle de données pour une statistique rapide
|
||||
class QuickStat {
|
||||
final String title;
|
||||
final String value;
|
||||
final String subtitle;
|
||||
final IconData icon;
|
||||
final Color color;
|
||||
final Map<String, dynamic>? metadata;
|
||||
|
||||
const QuickStat({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
required this.color,
|
||||
this.metadata,
|
||||
});
|
||||
|
||||
/// Constructeur pour une métrique système
|
||||
const QuickStat.system({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = const Color(0xFF6C5CE7),
|
||||
metadata = null;
|
||||
|
||||
/// Constructeur pour une métrique utilisateur
|
||||
const QuickStat.user({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = const Color(0xFF00B894),
|
||||
metadata = null;
|
||||
|
||||
/// Constructeur pour une métrique d'organisation
|
||||
const QuickStat.organization({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = const Color(0xFF0984E3),
|
||||
metadata = null;
|
||||
|
||||
/// Constructeur pour une métrique d'événement
|
||||
const QuickStat.event({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = const Color(0xFFE17055),
|
||||
metadata = null;
|
||||
|
||||
/// Constructeur pour une alerte
|
||||
const QuickStat.alert({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = Colors.orange,
|
||||
metadata = null;
|
||||
|
||||
/// Constructeur pour une erreur
|
||||
const QuickStat.error({
|
||||
required this.title,
|
||||
required this.value,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
}) : color = Colors.red,
|
||||
metadata = null;
|
||||
}
|
||||
|
||||
/// Types de layout pour les statistiques
|
||||
enum StatsLayout {
|
||||
grid,
|
||||
row,
|
||||
column,
|
||||
wrap,
|
||||
}
|
||||
Reference in New Issue
Block a user