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

/// Widget pour afficher les statistiques des cotisations
class CotisationsStatsCard extends StatelessWidget {
  final Map<String, dynamic> statistics;

  const CotisationsStatsCard({
    super.key,
    required this.statistics,
  });

  @override
  Widget build(BuildContext context) {
    final currencyFormat = NumberFormat.currency(
      locale: 'fr_FR',
      symbol: 'FCFA',
      decimalDigits: 0,
    );

    final totalCotisations = statistics['totalCotisations'] as int? ?? 0;
    final cotisationsPayees = statistics['cotisationsPayees'] as int? ?? 0;
    final cotisationsEnRetard = statistics['cotisationsEnRetard'] as int? ?? 0;
    final tauxPaiement = statistics['tauxPaiement'] as double? ?? 0.0;

    return Card(
      elevation: 2,
      margin: EdgeInsets.zero,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12),
      ),
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            // Titre
            Row(
              children: [
                Container(
                  width: 32,
                  height: 32,
                  decoration: BoxDecoration(
                    color: AppTheme.accentColor.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(16),
                  ),
                  child: const Icon(
                    Icons.analytics,
                    size: 18,
                    color: AppTheme.accentColor,
                  ),
                ),
                const SizedBox(width: 12),
                const Text(
                  'Statistiques des cotisations',
                  style: TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.w600,
                    color: AppTheme.textPrimary,
                  ),
                ),
              ],
            ),
            
            const SizedBox(height: 16),
            
            // Grille des statistiques
            Row(
              children: [
                // Total des cotisations
                Expanded(
                  child: _buildStatItem(
                    icon: Icons.receipt_long,
                    label: 'Total',
                    value: totalCotisations.toString(),
                    color: AppTheme.primaryColor,
                  ),
                ),
                
                const SizedBox(width: 12),
                
                // Cotisations payées
                Expanded(
                  child: _buildStatItem(
                    icon: Icons.check_circle,
                    label: 'Payées',
                    value: cotisationsPayees.toString(),
                    color: AppTheme.successColor,
                  ),
                ),
              ],
            ),
            
            const SizedBox(height: 12),
            
            Row(
              children: [
                // Cotisations en retard
                Expanded(
                  child: _buildStatItem(
                    icon: Icons.warning,
                    label: 'En retard',
                    value: cotisationsEnRetard.toString(),
                    color: AppTheme.errorColor,
                  ),
                ),
                
                const SizedBox(width: 12),
                
                // Taux de paiement
                Expanded(
                  child: _buildStatItem(
                    icon: Icons.trending_up,
                    label: 'Taux paiement',
                    value: '${tauxPaiement.toStringAsFixed(1)}%',
                    color: tauxPaiement >= 80 
                        ? AppTheme.successColor 
                        : tauxPaiement >= 60 
                            ? AppTheme.warningColor 
                            : AppTheme.errorColor,
                  ),
                ),
              ],
            ),
            
            const SizedBox(height: 16),
            
            // Barre de progression globale
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    const Text(
                      'Progression globale',
                      style: TextStyle(
                        fontSize: 14,
                        fontWeight: FontWeight.w500,
                        color: AppTheme.textSecondary,
                      ),
                    ),
                    Text(
                      '${tauxPaiement.toStringAsFixed(1)}%',
                      style: const TextStyle(
                        fontSize: 14,
                        fontWeight: FontWeight.w600,
                        color: AppTheme.textPrimary,
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                LinearProgressIndicator(
                  value: tauxPaiement / 100,
                  backgroundColor: AppTheme.borderColor,
                  valueColor: AlwaysStoppedAnimation<Color>(
                    tauxPaiement >= 80 
                        ? AppTheme.successColor 
                        : tauxPaiement >= 60 
                            ? AppTheme.warningColor 
                            : AppTheme.errorColor,
                  ),
                ),
              ],
            ),
            
            // Montants si disponibles
            if (statistics.containsKey('montantTotal') || 
                statistics.containsKey('montantPaye')) ...[
              const SizedBox(height: 16),
              const Divider(),
              const SizedBox(height: 16),
              
              Row(
                children: [
                  if (statistics.containsKey('montantTotal')) ...[
                    Expanded(
                      child: _buildMoneyStatItem(
                        label: 'Montant total',
                        value: currencyFormat.format(
                          (statistics['montantTotal'] as num?)?.toDouble() ?? 0.0
                        ),
                        color: AppTheme.textPrimary,
                      ),
                    ),
                  ],
                  
                  if (statistics.containsKey('montantTotal') && 
                      statistics.containsKey('montantPaye'))
                    const SizedBox(width: 12),
                  
                  if (statistics.containsKey('montantPaye')) ...[
                    Expanded(
                      child: _buildMoneyStatItem(
                        label: 'Montant payé',
                        value: currencyFormat.format(
                          (statistics['montantPaye'] as num?)?.toDouble() ?? 0.0
                        ),
                        color: AppTheme.successColor,
                      ),
                    ),
                  ],
                ],
              ),
            ],
          ],
        ),
      ),
    );
  }

  Widget _buildStatItem({
    required IconData icon,
    required String label,
    required String value,
    required Color color,
  }) {
    return Container(
      padding: const EdgeInsets.all(12),
      decoration: BoxDecoration(
        color: color.withOpacity(0.1),
        borderRadius: BorderRadius.circular(8),
      ),
      child: Column(
        children: [
          Icon(
            icon,
            size: 24,
            color: color,
          ),
          const SizedBox(height: 8),
          Text(
            value,
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
              color: color,
            ),
          ),
          const SizedBox(height: 4),
          Text(
            label,
            style: const TextStyle(
              fontSize: 12,
              color: AppTheme.textSecondary,
            ),
            textAlign: TextAlign.center,
          ),
        ],
      ),
    );
  }

  Widget _buildMoneyStatItem({
    required String label,
    required String value,
    required Color color,
  }) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          label,
          style: const TextStyle(
            fontSize: 12,
            color: AppTheme.textSecondary,
          ),
        ),
        const SizedBox(height: 4),
        Text(
          value,
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.bold,
            color: color,
          ),
        ),
      ],
    );
  }
}