import 'package:siro_admin/constant/theme.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:siro_admin/controller/admin/dashboard_v2_controller.dart';
import 'package:flutter_staggered_animations/flutter_staggered_animations.dart';
import 'package:siro_admin/views/widgets/glass_container.dart';

class DashboardV2Widget extends StatelessWidget {
  const DashboardV2Widget({super.key});

  @override
  Widget build(BuildContext context) {
    final cs = Theme.of(context).colorScheme;

    return GetBuilder<DashboardV2Controller>(
      init: DashboardV2Controller(),
      builder: (ctrl) {
        if (ctrl.isLoading) {
          return SliverToBoxAdapter(
            child: SizedBox(
              height: 150,
              child: Center(
                child: CircularProgressIndicator(color: cs.primary),
              ),
            ),
          );
        }

        return SliverToBoxAdapter(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              _buildSectionTitle('مركز العمليات الحي (Real-time)', cs),
              _buildRealtimeStats(ctrl.realtimeData, cs),
              const SizedBox(height: 20),
              if (ctrl.smartAlerts.isNotEmpty) ...[
                _buildSectionTitle(
                    'التنبيهات الذكية (${ctrl.smartAlerts.length})', cs),
                _buildSmartAlerts(ctrl.smartAlerts, cs),
                const SizedBox(height: 10),
              ]
            ],
          ),
        );
      },
    );
  }

  Widget _buildSectionTitle(String title, ColorScheme cs) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(20, 8, 20, 10),
      child: Row(
        children: [
          Container(
            width: 3,
            height: 14,
            decoration: BoxDecoration(
              color: cs.error,
              borderRadius: BorderRadius.circular(2),
            ),
          ),
          const SizedBox(width: 8),
          Text(
            title,
            style: TextStyle(
              color: cs.onSurfaceVariant,
              fontSize: 12,
              fontWeight: FontWeight.bold,
              letterSpacing: 0.5,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildRealtimeStats(Map<String, dynamic> data, ColorScheme cs) {
    final stats = [
      {
        'title': 'رحلات نشطة',
        'value': data['active_rides']?.toString() ?? '0',
        'icon': Icons.directions_car_rounded,
        'color': cs.tertiary,
      },
      {
        'title': 'سائقون أونلاين',
        'value': data['online_drivers']?.toString() ?? '0',
        'icon': Icons.wifi_tethering,
        'color': cs.success,
      },
      {
        'title': 'إيرادات اليوم',
        'value': '${data['revenue_today'] ?? 0}',
        'icon': Icons.monetization_on_rounded,
        'color': cs.warning,
      },
      {
        'title': 'إيرادات الأمس',
        'value': '${data['revenue_yesterday'] ?? 0}',
        'icon': Icons.history_rounded,
        'color': cs.onSurfaceVariant,
      },
      {
        'title': 'شكاوى مفتوحة',
        'value': data['new_complaints']?.toString() ?? '0',
        'icon': Icons.warning_rounded,
        'color': cs.error,
      },
      {
        'title': 'رخص تنتهي قريبًا',
        'value': data['expiring_licenses']?.toString() ?? '0',
        'icon': Icons.sd_card_alert_rounded,
        'color': const Color(0xFFF97316),
      },
    ];

    return SizedBox(
      height: 110,
      child: ListView.builder(
        padding: const EdgeInsets.symmetric(horizontal: 16),
        scrollDirection: Axis.horizontal,
        itemCount: stats.length,
        itemBuilder: (ctx, i) {
          final stat = stats[i];
          return Padding(
            padding: const EdgeInsets.only(right: 10),
            child: _buildStatCard(stat, cs),
          );
        },
      ),
    );
  }

  Widget _buildStatCard(Map<String, dynamic> stat, ColorScheme cs) {
    final color = stat['color'] as Color;
    return GlassContainer(
      width: 150,
      padding: const EdgeInsets.all(16),
      borderRadius: 16,
      gradientColors: [
        color.withValues(alpha: 0.15),
        color.withValues(alpha: 0.05),
      ],
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Row(
            children: [
              Container(
                padding: const EdgeInsets.all(6),
                decoration: BoxDecoration(
                  color: color.withValues(alpha: 0.15),
                  borderRadius: BorderRadius.circular(8),
                ),
                child: Icon(stat['icon'] as IconData, color: color, size: 16),
              ),
              const Spacer(),
              if (stat['title'] == 'رحلات نشطة' ||
                  stat['title'] == 'سائقون أونلاين')
                Container(
                    width: 8,
                    height: 8,
                    decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        color: color,
                        boxShadow: [
                          BoxShadow(
                            color: color.withValues(alpha: 0.5),
                            blurRadius: 4,
                            spreadRadius: 1,
                          )
                        ])),
            ],
          ),
          const Spacer(),
          Text(
            stat['value'].toString(),
            style: TextStyle(
              color: cs.onSurface,
              fontSize: 20,
              fontWeight: FontWeight.bold,
            ),
          ),
          const SizedBox(height: 2),
          Text(
            stat['title'].toString(),
            style: TextStyle(
              color: cs.onSurfaceVariant,
              fontSize: 10,
              fontWeight: FontWeight.w500,
            ),
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
          ),
        ],
      ),
    );
  }

  Widget _buildSmartAlerts(List<dynamic> alerts, ColorScheme cs) {
    return ListView.builder(
      padding: const EdgeInsets.symmetric(horizontal: 16),
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      itemCount: alerts.length > 5 ? 5 : alerts.length,
      itemBuilder: (context, index) {
        final alert = alerts[index];
        return AnimationConfiguration.staggeredList(
          position: index,
          duration: const Duration(milliseconds: 300),
          child: SlideAnimation(
            verticalOffset: 20.0,
            child: FadeInAnimation(
              child: _buildAlertItem(alert, cs),
            ),
          ),
        );
      },
    );
  }

  Widget _buildAlertItem(Map<String, dynamic> alert, ColorScheme cs) {
    Color getSeverityColor(String severity) {
      switch (severity) {
        case 'high':
          return cs.error;
        case 'medium':
          return cs.warning;
        case 'warning':
          return const Color(0xFFF97316);
        default:
          return cs.tertiary;
      }
    }

    IconData getAlertIcon(String type) {
      switch (type) {
        case 'complaint':
          return Icons.report_problem_rounded;
        case 'ride':
          return Icons.directions_car_rounded;
        case 'license':
          return Icons.badge_rounded;
        default:
          return Icons.notifications_active_rounded;
      }
    }

    final color = getSeverityColor(alert['severity']);
    final icon = getAlertIcon(alert['type']);

    return Container(
      margin: const EdgeInsets.only(bottom: 10),
      padding: const EdgeInsets.all(12),
      decoration: BoxDecoration(
        color: cs.surfaceContainerHighest,
        borderRadius: BorderRadius.circular(12),
        border: Border.all(color: color.withValues(alpha: 0.4)),
        boxShadow: [
          BoxShadow(
            color: color.withValues(alpha: 0.05),
            blurRadius: 5,
            offset: const Offset(0, 2),
          )
        ],
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            padding: const EdgeInsets.all(10),
            decoration: BoxDecoration(
              color: color.withValues(alpha: 0.1),
              borderRadius: BorderRadius.circular(10),
            ),
            child: Icon(icon, color: color, size: 20),
          ),
          const SizedBox(width: 12),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  alert['title'] ?? '',
                  style: TextStyle(
                    color: cs.onSurface,
                    fontSize: 13,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 4),
                Text(
                  alert['description'] ?? '',
                  style: TextStyle(
                    color: cs.onSurfaceVariant,
                    fontSize: 11,
                  ),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
              ],
            ),
          ),
          const SizedBox(width: 8),
          Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              Text(
                alert['date'] != null
                    ? alert['date'].toString().split(' ')[0]
                    : '',
                style: TextStyle(
                  color: cs.onSurfaceVariant,
                  fontSize: 10,
                ),
              ),
              const SizedBox(height: 10),
              Icon(Icons.arrow_forward_ios_rounded,
                  color: cs.onSurfaceVariant, size: 12),
            ],
          ),
        ],
      ),
    );
  }
}