unionflow-server-api/unionflow-mobile-apps/lib/features/members/presentation/widgets/membres_stats_card.dart

import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';
import '../../../../shared/theme/app_theme.dart';

/// Card pour afficher les statistiques des membres
class MembresStatsCard extends StatelessWidget {
  const MembresStatsCard({
    super.key,
    required this.stats,
  });

  final Map<String, dynamic> stats;

  @override
  Widget build(BuildContext context) {
    final nombreMembresActifs = stats['nombreMembresActifs'] as int? ?? 0;
    final nombreMembresInactifs = stats['nombreMembresInactifs'] as int? ?? 0;
    final nombreMembresSuspendus = stats['nombreMembresSuspendus'] as int? ?? 0;
    final total = nombreMembresActifs + nombreMembresInactifs + nombreMembresSuspendus;

    return Card(
      elevation: 4,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(16),
      ),
      child: Padding(
        padding: const EdgeInsets.all(20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // Header
            Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: AppTheme.primaryColor.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Icon(
                    Icons.analytics,
                    color: AppTheme.primaryColor,
                    size: 24,
                  ),
                ),
                const SizedBox(width: 12),
                const Expanded(
                  child: Text(
                    'Statistiques des membres',
                    style: TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.w600,
                      color: AppTheme.textPrimary,
                    ),
                  ),
                ),
              ],
            ),
            
            const SizedBox(height: 20),
            
            // Statistiques principales
            Row(
              children: [
                Expanded(
                  child: _buildStatItem(
                    title: 'Total',
                    value: total.toString(),
                    color: AppTheme.primaryColor,
                    icon: Icons.people,
                  ),
                ),
                const SizedBox(width: 16),
                Expanded(
                  child: _buildStatItem(
                    title: 'Actifs',
                    value: nombreMembresActifs.toString(),
                    color: AppTheme.successColor,
                    icon: Icons.check_circle,
                  ),
                ),
              ],
            ),
            
            const SizedBox(height: 12),
            
            Row(
              children: [
                Expanded(
                  child: _buildStatItem(
                    title: 'Inactifs',
                    value: nombreMembresInactifs.toString(),
                    color: AppTheme.warningColor,
                    icon: Icons.pause_circle,
                  ),
                ),
                const SizedBox(width: 16),
                Expanded(
                  child: _buildStatItem(
                    title: 'Suspendus',
                    value: nombreMembresSuspendus.toString(),
                    color: AppTheme.errorColor,
                    icon: Icons.block,
                  ),
                ),
              ],
            ),
            
            if (total > 0) ...[
              const SizedBox(height: 24),
              
              // Graphique en secteurs
              SizedBox(
                height: 200,
                child: PieChart(
                  PieChartData(
                    sections: [
                      if (nombreMembresActifs > 0)
                        PieChartSectionData(
                          value: nombreMembresActifs.toDouble(),
                          title: '${(nombreMembresActifs / total * 100).round()}%',
                          color: AppTheme.successColor,
                          radius: 60,
                          titleStyle: const TextStyle(
                            fontSize: 12,
                            fontWeight: FontWeight.w600,
                            color: Colors.white,
                          ),
                        ),
                      if (nombreMembresInactifs > 0)
                        PieChartSectionData(
                          value: nombreMembresInactifs.toDouble(),
                          title: '${(nombreMembresInactifs / total * 100).round()}%',
                          color: AppTheme.warningColor,
                          radius: 60,
                          titleStyle: const TextStyle(
                            fontSize: 12,
                            fontWeight: FontWeight.w600,
                            color: Colors.white,
                          ),
                        ),
                      if (nombreMembresSuspendus > 0)
                        PieChartSectionData(
                          value: nombreMembresSuspendus.toDouble(),
                          title: '${(nombreMembresSuspendus / total * 100).round()}%',
                          color: AppTheme.errorColor,
                          radius: 60,
                          titleStyle: const TextStyle(
                            fontSize: 12,
                            fontWeight: FontWeight.w600,
                            color: Colors.white,
                          ),
                        ),
                    ],
                    centerSpaceRadius: 40,
                    sectionsSpace: 2,
                  ),
                ),
              ),
              
              const SizedBox(height: 16),
              
              // Légende
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  if (nombreMembresActifs > 0)
                    _buildLegendItem('Actifs', AppTheme.successColor),
                  if (nombreMembresInactifs > 0)
                    _buildLegendItem('Inactifs', AppTheme.warningColor),
                  if (nombreMembresSuspendus > 0)
                    _buildLegendItem('Suspendus', AppTheme.errorColor),
                ],
              ),
            ],
          ],
        ),
      ),
    );
  }

  /// Widget pour une statistique individuelle
  Widget _buildStatItem({
    required String title,
    required String value,
    required Color color,
    required IconData icon,
  }) {
    return Container(
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(12),
        border: Border.all(
          color: color.withOpacity(0.3),
          width: 1,
        ),
      ),
      child: Column(
        children: [
          Icon(
            icon,
            color: color,
            size: 24,
          ),
          const SizedBox(height: 8),
          Text(
            value,
            style: TextStyle(
              fontSize: 20,
              fontWeight: FontWeight.w700,
              color: color,
            ),
          ),
          const SizedBox(height: 4),
          Text(
            title,
            style: TextStyle(
              fontSize: 12,
              fontWeight: FontWeight.w500,
              color: color,
            ),
          ),
        ],
      ),
    );
  }

  /// Widget pour un élément de légende
  Widget _buildLegendItem(String label, Color color) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        Container(
          width: 12,
          height: 12,
          decoration: BoxDecoration(
            color: color,
            shape: BoxShape.circle,
          ),
        ),
        const SizedBox(width: 6),
        Text(
          label,
          style: const TextStyle(
            fontSize: 12,
            color: AppTheme.textSecondary,
          ),
        ),
      ],
    );
  }
}