import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../../providers/auth_provider.dart';
import '../../providers/bill_provider.dart';
import '../../providers/family_provider.dart';
import '../../models/bill.dart';
import '../../models/family.dart';
import '../../theme/colors.dart';
import '../../widgets/glass_card.dart';
import '../../widgets/category_icon.dart';
import '../../widgets/stat_card.dart';

class HomeScreen extends ConsumerStatefulWidget {
  const HomeScreen({super.key});

  @override
  ConsumerState<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends ConsumerState<HomeScreen> {
  int _selectedTab = 0;

  @override
  void initState() {
    super.initState();
    Future.microtask(() {
      ref.read(billProvider.notifier).loadBills();
      ref.read(familyProvider.notifier).loadFamilies();
    });
  }

  String _getCurrentMonth() {
    final now = DateTime.now();
    final months = ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月'];
    return '${now.year}年${months[now.month - 1]}';
  }

  List<StatCardData> _calculateMonthlyStats(List<Bill> bills) {
    final now = DateTime.now();
    final currentMonth = now.month;
    final currentYear = now.year;

    double totalExpense = 0;
    double totalIncome = 0;

    for (final bill in bills) {
      try {
        final billDate = DateTime.parse(bill.date);
        if (billDate.month == currentMonth && billDate.year == currentYear) {
          if (bill.isExpense) {
            totalExpense += bill.amount;
          } else {
            totalIncome += bill.amount;
          }
        }
      } catch (_) {}
    }

    final balance = totalIncome - totalExpense;

    return [
      StatCardData(label: '本月支出', value: '¥${totalExpense.toStringAsFixed(0)}', color: AppColors.expense),
      StatCardData(label: '本月收入', value: '¥${totalIncome.toStringAsFixed(0)}', color: AppColors.income),
      StatCardData(label: '本月结余', value: '¥${balance.toStringAsFixed(0)}', color: AppColors.brand),
    ];
  }

  @override
  Widget build(BuildContext context) {
    final authState = ref.watch(authProvider);
    final billsAsync = ref.watch(billProvider);
    final familiesAsync = ref.watch(familyProvider);

    final user = authState.user;
    final nickname = user?.nickname ?? '用户';
    final firstLetter = nickname.isNotEmpty ? nickname[0] : 'U';

    final personalBills = billsAsync.valueOrNull ?? [];
    final stats = _calculateMonthlyStats(personalBills);

    return Scaffold(
      backgroundColor: AppColors.pageBg,
      body: Column(
        children: [
          // OrangeHeader
          Container(
            padding: EdgeInsets.only(
              top: MediaQuery.of(context).padding.top + 16,
              left: 20,
              right: 20,
              bottom: 20,
            ),
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                begin: Alignment.topLeft,
                end: Alignment.bottomRight,
                colors: [AppColors.brand, AppColors.brandLight],
              ),
            ),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                // User info row
                Row(
                  children: [
                    // Avatar with first letter
                    Container(
                      width: 56,
                      height: 56,
                      decoration: BoxDecoration(
                        color: Colors.white.withOpacity(0.2),
                        shape: BoxShape.circle,
                        border: Border.all(color: Colors.white.withOpacity(0.5), width: 2),
                      ),
                      child: Center(
                        child: Text(
                          firstLetter,
                          style: const TextStyle(
                            fontSize: 24,
                            fontWeight: FontWeight.bold,
                            color: Colors.white,
                          ),
                        ),
                      ),
                    ),
                    const SizedBox(width: 14),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          '你好，$nickname',
                          style: const TextStyle(
                            fontSize: 22,
                            fontWeight: FontWeight.bold,
                            color: Colors.white,
                          ),
                        ),
                        const SizedBox(height: 4),
                        Text(
                          _getCurrentMonth(),
                          style: TextStyle(
                            fontSize: 14,
                            color: Colors.white.withOpacity(0.85),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
                const SizedBox(height: 20),
                // 3 StatCards
                Row(
                  children: [
                    Expanded(child: StatCard(label: stats[0].label, value: stats[0].value, color: stats[0].color)),
                    const SizedBox(width: 10),
                    Expanded(child: StatCard(label: stats[1].label, value: stats[1].value, color: stats[1].color)),
                    const SizedBox(width: 10),
                    Expanded(child: StatCard(label: stats[2].label, value: stats[2].value, color: stats[2].color)),
                  ],
                ),
              ],
            ),
          ),

          // TabSwitcher
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(16),
              child: BackdropFilter(
                filter: ImageFilter.blur(sigmaX: 30, sigmaY: 30),
                child: Container(
                  height: 50,
                  decoration: BoxDecoration(
                    color: Colors.white.withOpacity(0.7),
                    borderRadius: BorderRadius.circular(16),
                    border: Border.all(color: Colors.white.withOpacity(0.8)),
                  ),
                  child: Row(
                    children: [
                      Expanded(
                        child: _TabButton(
                          label: '个人账本',
                          isSelected: _selectedTab == 0,
                          onTap: () => setState(() => _selectedTab = 0),
                        ),
                      ),
                      Expanded(
                        child: _TabButton(
                          label: '家庭账本',
                          isSelected: _selectedTab == 1,
                          onTap: () => setState(() => _selectedTab = 1),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),

          // Tab content
          Expanded(
            child: _selectedTab == 0
                ? _PersonalTab(bills: personalBills)
                : _FamilyTab(familiesAsync: familiesAsync, bills: personalBills),
          ),
        ],
      ),
    );
  }
}

class StatCardData {
  final String label;
  final String value;
  final Color color;
  StatCardData({required this.label, required this.value, required this.color});
}

class _TabButton extends StatelessWidget {
  final String label;
  final bool isSelected;
  final VoidCallback onTap;

  const _TabButton({
    required this.label,
    required this.isSelected,
    required this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: AnimatedContainer(
        duration: const Duration(milliseconds: 200),
        margin: const EdgeInsets.all(4),
        decoration: BoxDecoration(
          gradient: isSelected
              ? const LinearGradient(colors: [AppColors.brand, AppColors.brandLight])
              : null,
          borderRadius: BorderRadius.circular(12),
        ),
        child: Center(
          child: Text(
            label,
            style: TextStyle(
              fontSize: 15,
              fontWeight: isSelected ? FontWeight.w600 : FontWeight.w500,
              color: isSelected ? Colors.white : AppColors.textSecondary,
            ),
          ),
        ),
      ),
    );
  }
}

class _PersonalTab extends StatelessWidget {
  final List<Bill> bills;

  const _PersonalTab({required this.bills});

  @override
  Widget build(BuildContext context) {
    if (bills.isEmpty) {
      return Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(Icons.receipt_long_outlined, size: 64, color: AppColors.textSecondary.withOpacity(0.5)),
            const SizedBox(height: 16),
            Text(
              '暂无账单记录',
              style: TextStyle(fontSize: 16, color: AppColors.textSecondary.withOpacity(0.7)),
            ),
          ],
        ),
      );
    }

    // Sort by date descending
    final sortedBills = List<Bill>.from(bills)
      ..sort((a, b) => b.date.compareTo(a.date));

    return ListView.builder(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      itemCount: sortedBills.length,
      itemBuilder: (context, index) {
        final bill = sortedBills[index];
        return Padding(
          padding: const EdgeInsets.only(bottom: 12),
          child: GlassCard(
            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
            child: Row(
              children: [
                CategoryIcon(emoji: bill.emoji, category: bill.category),
                const SizedBox(width: 12),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        bill.category,
                        style: const TextStyle(
                          fontSize: 15,
                          fontWeight: FontWeight.w600,
                          color: AppColors.textPrimary,
                        ),
                      ),
                      if (bill.note.isNotEmpty)
                        Text(
                          bill.note,
                          style: TextStyle(
                            fontSize: 13,
                            color: AppColors.textSecondary.withOpacity(0.8),
                          ),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                    ],
                  ),
                ),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.end,
                  children: [
                    Text(
                      '${bill.isExpense ? '-' : '+'}¥${bill.amount.toStringAsFixed(2)}',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                        color: bill.isExpense ? AppColors.expense : AppColors.income,
                      ),
                    ),
                    Text(
                      bill.time,
                      style: TextStyle(
                        fontSize: 12,
                        color: AppColors.textSecondary.withOpacity(0.7),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}

class _FamilyTab extends StatelessWidget {
  final AsyncValue<List<Family>> familiesAsync;
  final List<Bill> bills;

  const _FamilyTab({required this.familiesAsync, required this.bills});

  @override
  Widget build(BuildContext context) {
    return familiesAsync.when(
      loading: () => const Center(child: CircularProgressIndicator(color: AppColors.brand)),
      error: (e, _) => Center(child: Text('加载失败: $e')),
      data: (families) {
        if (families.isEmpty) {
          return Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Icon(Icons.family_restroom_outlined, size: 64, color: AppColors.textSecondary.withOpacity(0.5)),
                const SizedBox(height: 16),
                Text(
                  '暂无家庭',
                  style: TextStyle(fontSize: 16, color: AppColors.textSecondary.withOpacity(0.7)),
                ),
                const SizedBox(height: 8),
                Text(
                  '创建或加入家庭后即可查看',
                  style: TextStyle(fontSize: 14, color: AppColors.textSecondary.withOpacity(0.5)),
                ),
              ],
            ),
          );
        }

        // Filter family bills
        final familyBills = bills.where((b) => b.familyId != null).toList();
        final sortedFamilyBills = List<Bill>.from(familyBills)
          ..sort((a, b) => b.date.compareTo(a.date));

        // Calculate member rankings (mock data based on members)
        final family = families.first;
        final memberStats = <Map<String, dynamic>>[];
        for (final member in family.members) {
          double total = 0;
          for (final bill in familyBills) {
            if (bill.userId == member.userId) {
              total += bill.amount;
            }
          }
          memberStats.add({'member': member, 'total': total});
        }
        memberStats.sort((a, b) => (b['total'] as double).compareTo(a['total'] as double));

        return ListView(
          padding: const EdgeInsets.symmetric(horizontal: 20),
          children: [
            // Family bills section
            if (familyBills.isNotEmpty) ...[
              const Padding(
                padding: EdgeInsets.only(bottom: 12),
                child: Text(
                  '家庭账单',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: AppColors.textPrimary,
                  ),
                ),
              ),
              ...sortedFamilyBills.take(5).map((bill) => Padding(
                padding: const EdgeInsets.only(bottom: 12),
                child: GlassCard(
                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
                  child: Row(
                    children: [
                      CategoryIcon(emoji: bill.emoji, category: bill.category),
                      const SizedBox(width: 12),
                      Expanded(
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              bill.category,
                              style: const TextStyle(
                                fontSize: 15,
                                fontWeight: FontWeight.w600,
                                color: AppColors.textPrimary,
                              ),
                            ),
                            if (bill.note.isNotEmpty)
                              Text(
                                bill.note,
                                style: TextStyle(
                                  fontSize: 13,
                                  color: AppColors.textSecondary.withOpacity(0.8),
                                ),
                                maxLines: 1,
                                overflow: TextOverflow.ellipsis,
                              ),
                          ],
                        ),
                      ),
                      Text(
                        '${bill.isExpense ? '-' : '+'}¥${bill.amount.toStringAsFixed(2)}',
                        style: TextStyle(
                          fontSize: 16,
                          fontWeight: FontWeight.bold,
                          color: bill.isExpense ? AppColors.expense : AppColors.income,
                        ),
                      ),
                    ],
                  ),
                ),
              )),
              const SizedBox(height: 16),
            ],

            // Member rankings section
            if (memberStats.isNotEmpty) ...[
              const Padding(
                padding: EdgeInsets.only(bottom: 12),
                child: Text(
                  '成员排行',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: AppColors.textPrimary,
                  ),
                ),
              ),
              ...memberStats.asMap().entries().map((entry) {
                final idx = entry.key;
                final data = entry.value;
                final member = data['member'] as FamilyMember;
                final total = data['total'] as double;
                final medals = ['🥇', '🥈', '🥉'];

                return Padding(
                  padding: const EdgeInsets.only(bottom: 10),
                  child: GlassCard(
                    padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
                    child: Row(
                      children: [
                        Container(
                          width: 28,
                          height: 28,
                          decoration: BoxDecoration(
                            color: idx < 3 ? AppColors.brand.withOpacity(0.1) : AppColors.textSecondary.withOpacity(0.1),
                            shape: BoxShape.circle,
                          ),
                          child: Center(
                            child: Text(
                              idx < 3 ? medals[idx] : '${idx + 1}',
                              style: const TextStyle(fontSize: 14),
                            ),
                          ),
                        ),
                        const SizedBox(width: 12),
                        Expanded(
                          child: Text(
                            member.nickname,
                            style: const TextStyle(
                              fontSize: 15,
                              fontWeight: FontWeight.w600,
                              color: AppColors.textPrimary,
                            ),
                          ),
                        ),
                        Text(
                          '¥${total.toStringAsFixed(0)}',
                          style: const TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.bold,
                            color: AppColors.brand,
                          ),
                        ),
                      ],
                    ),
                  ),
                );
              }),
            ],
          ],
        );
      },
    );
  }
}