import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';

import '../../core/theme/app_theme.dart';
import '../../providers/auth_provider.dart';
import '../../providers/notification_provider.dart';

/// 我的页（首页 Tab4）：
/// 游客 → 登录引导；已登录 → 资料卡 + 功能入口（作品/收藏/历史/钱包/会员/消息）
class MineScreen extends ConsumerStatefulWidget {
  const MineScreen({super.key});

  @override
  ConsumerState<MineScreen> createState() => _MineScreenState();
}

class _MineScreenState extends ConsumerState<MineScreen> {
  @override
  void initState() {
    super.initState();
    // 进入我的页刷新未读消息数（角标）
    Future.microtask(
      () => ref.read(unreadCountProvider.notifier).refresh(),
    );
  }

  @override
  Widget build(BuildContext context) {
    final auth = ref.watch(authProvider);
    if (!auth.isLoggedIn) return const _GuestGuide();

    final unread = ref.watch(unreadCountProvider);
    final user = auth.user!;
    return SafeArea(
      child: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          // 资料卡（点击进入编辑资料）
          GestureDetector(
            onTap: () => context.push('/profile/edit'),
            behavior: HitTestBehavior.opaque,
            child: Row(
            children: [
              CircleAvatar(
                radius: 32,
                backgroundColor: AppColors.surface,
                backgroundImage: user.avatarUrl.isNotEmpty
                    ? CachedNetworkImageProvider(user.avatarUrl)
                    : null,
                child: user.avatarUrl.isEmpty
                    ? Text(
                        user.nickname.isNotEmpty
                            ? user.nickname.characters.first
                            : '友',
                        style: const TextStyle(fontSize: 22),
                      )
                    : null,
              ),
              const SizedBox(width: 12),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Row(
                      children: [
                        Flexible(
                          child: Text(
                            user.nickname,
                            overflow: TextOverflow.ellipsis,
                            style: const TextStyle(
                              fontSize: 18,
                              fontWeight: FontWeight.w700,
                            ),
                          ),
                        ),
                        if (user.isMember) ...[
                          const SizedBox(width: 6),
                          Container(
                            padding: const EdgeInsets.symmetric(
                              horizontal: 6,
                              vertical: 2,
                            ),
                            decoration: BoxDecoration(
                              gradient: AppColors.goldGradient,
                              borderRadius: BorderRadius.circular(4),
                            ),
                            child: const Text(
                              '会员',
                              style: TextStyle(
                                color: Colors.black,
                                fontSize: 10,
                                fontWeight: FontWeight.w700,
                              ),
                            ),
                          ),
                        ],
                      ],
                    ),
                    const SizedBox(height: 4),
                    Text(
                      '积分 ${user.points}',
                      style: const TextStyle(
                        color: AppColors.gold,
                        fontSize: 13,
                      ),
                    ),
                  ],
                ),
              ),
              const Icon(Icons.arrow_forward_ios,
                  size: 14, color: AppColors.textWeak),
              ],
            ),
          ),
          const SizedBox(height: 24),

          // 功能入口
          _Entry(
            icon: Icons.edit_outlined,
            label: '编辑资料',
            onTap: () => context.push('/profile/edit'),
          ),
          _Entry(
            icon: Icons.add_circle_outline,
            label: '发布作品',
            onTap: () => context.push('/upload'),
          ),
          _Entry(
            icon: Icons.video_library_outlined,
            label: '我的作品',
            onTap: () => context.push('/mine/works'),
          ),
          _Entry(
            icon: Icons.star_outline,
            label: '我的收藏',
            onTap: () => context.push('/mine/favorites'),
          ),
          _Entry(
            icon: Icons.history,
            label: '观看历史',
            onTap: () => context.push('/mine/history'),
          ),
          _Entry(
            icon: Icons.account_balance_wallet_outlined,
            label: '钱包',
            onTap: () => context.push('/wallet'),
          ),
          _Entry(
            icon: Icons.workspace_premium_outlined,
            label: '会员中心',
            onTap: () => context.push('/membership'),
          ),
          _Entry(
            icon: Icons.card_giftcard,
            label: '邀请好友',
            onTap: () => context.push('/invite'),
          ),
          _Entry(
            icon: Icons.savings_outlined,
            label: '收益资产',
            onTap: () => context.push('/assets'),
          ),
          _Entry(
            icon: Icons.notifications_none,
            label: '消息通知',
            badge: unread,
            onTap: () => context
                .push('/notifications')
                .then((_) => ref.read(unreadCountProvider.notifier).refresh()),
          ),
          _Entry(
            icon: Icons.settings_outlined,
            label: '设置',
            onTap: () => context.push('/settings'),
          ),
        ],
      ),
    );
  }
}

/// 游客引导
class _GuestGuide extends StatelessWidget {
  const _GuestGuide();

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          const Icon(Icons.person_outline,
              size: 64, color: AppColors.textWeak),
          const SizedBox(height: 12),
          const Text('登录后查看个人中心',
              style: TextStyle(color: AppColors.textSecondary)),
          const SizedBox(height: 16),
          ElevatedButton(
            onPressed: () => context.go('/login'),
            style: ElevatedButton.styleFrom(
              minimumSize: const Size(160, 44),
            ),
            child: const Text('去登录 / 注册'),
          ),
        ],
      ),
    );
  }
}

class _Entry extends StatelessWidget {
  const _Entry({
    required this.icon,
    required this.label,
    required this.onTap,
    this.badge = 0,
  });

  final IconData icon;
  final String label;
  final VoidCallback onTap;

  /// 未读角标数，0 不显示
  final int badge;

  @override
  Widget build(BuildContext context) {
    return ListTile(
      contentPadding: EdgeInsets.zero,
      leading: Icon(icon, color: AppColors.textSecondary),
      title: Text(label),
      trailing: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          if (badge > 0)
            Container(
              padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
              decoration: BoxDecoration(
                color: AppColors.primary,
                borderRadius: BorderRadius.circular(9),
              ),
              child: Text(
                badge > 99 ? '99+' : '$badge',
                style: const TextStyle(color: Colors.white, fontSize: 11),
              ),
            ),
          const SizedBox(width: 4),
          const Icon(Icons.arrow_forward_ios,
              size: 14, color: AppColors.textWeak),
        ],
      ),
      onTap: onTap,
    );
  }
}