import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../auth/presentation/bloc/auth_bloc.dart';
import '../../../auth/presentation/bloc/auth_event.dart';
import '../../../auth/presentation/bloc/auth_state.dart';
import '../widgets/account_section_card.dart';
import '../widgets/account_surface_scaffold.dart';

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

  @override
  Widget build(BuildContext context) {
    return AccountSurfaceScaffold(
      title: '我的账户',
      subtitle: '管理资料信息与账户安全',
      onBack: () => context.pop(),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          _buildProfileHero(context),
          const SizedBox(height: AppSpacing.lg),
          _buildMenuCard(context),
          const SizedBox(height: AppSpacing.lg),
          _buildSecurityCard(context),
        ],
      ),
    );
  }

  Widget _buildProfileHero(BuildContext context) {
    final authState = context.watch<AuthBloc>().state;
    final email = authState is AuthAuthenticated ? authState.user.email : '';
    final identity = email.isEmpty ? '当前登录账户' : email;
    final badge = email.isEmpty ? 'A' : email.characters.first.toUpperCase();

    return AccountSectionCard(
      title: '账户概览',
      description: '查看当前账户状态与基础身份信息',
      backgroundColor: AppColors.surfaceInfoLight,
      borderColor: AppColors.borderQuaternary,
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Container(
            width: 56,
            height: 56,
            decoration: BoxDecoration(
              color: AppColors.white,
              borderRadius: BorderRadius.circular(AppRadius.full),
              border: Border.all(color: AppColors.borderQuaternary),
            ),
            child: Center(
              child: Text(
                badge,
                style: const TextStyle(
                  fontSize: 22,
                  fontWeight: FontWeight.w700,
                  color: AppColors.blue600,
                ),
              ),
            ),
          ),
          const SizedBox(width: AppSpacing.md),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  identity,
                  style: const TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.w700,
                    color: AppColors.slate900,
                  ),
                  overflow: TextOverflow.ellipsis,
                ),
                const SizedBox(height: AppSpacing.xs),
                const Text(
                  '账户状态正常，可安全管理资料与密码',
                  style: TextStyle(
                    fontSize: 13,
                    fontWeight: FontWeight.w500,
                    color: AppColors.slate500,
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildMenuCard(BuildContext context) {
    return AccountSectionCard(
      title: '账户信息',
      description: '编辑公开资料和登录信息',
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          _buildMenuItem(
            icon: Icons.edit,
            title: '编辑资料',
            onTap: () => context.push('/edit-profile'),
          ),
          _buildDivider(),
          _buildMenuItem(
            icon: Icons.lock,
            title: '修改密码',
            onTap: () => context.push('/change-password'),
          ),
        ],
      ),
    );
  }

  Widget _buildSecurityCard(BuildContext context) {
    return AccountSectionCard(
      title: '安全与会话',
      description: '若为公共设备，请及时退出登录',
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Container(
            padding: const EdgeInsets.symmetric(
              horizontal: AppSpacing.md,
              vertical: AppSpacing.sm,
            ),
            decoration: BoxDecoration(
              color: AppColors.surfaceSecondary,
              borderRadius: BorderRadius.circular(AppRadius.md),
              border: Border.all(color: AppColors.borderSecondary),
            ),
            child: const Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Icon(
                  Icons.shield_outlined,
                  size: 16,
                  color: AppColors.slate500,
                ),
                SizedBox(width: AppSpacing.xs),
                Expanded(
                  child: Text(
                    '退出后需要重新登录才能继续使用。',
                    style: TextStyle(
                      fontSize: 12,
                      color: AppColors.slate500,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
              ],
            ),
          ),
          const SizedBox(height: AppSpacing.md),
          _buildLogoutButton(context),
        ],
      ),
    );
  }

  Widget _buildMenuItem({
    required IconData icon,
    required String title,
    required VoidCallback onTap,
  }) {
    return GestureDetector(
      onTap: onTap,
      behavior: HitTestBehavior.opaque,
      child: Container(
        height: AppSpacing.xxl,
        padding: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Icon(icon, size: 20, color: AppColors.slate500),
                const SizedBox(width: AppSpacing.md),
                Text(
                  title,
                  style: const TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.w500,
                    color: AppColors.slate900,
                  ),
                ),
              ],
            ),
            const Icon(
              Icons.chevron_right,
              size: 18,
              color: AppColors.slate400,
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildDivider() {
    return Container(
      height: 1,
      margin: const EdgeInsets.symmetric(horizontal: AppSpacing.md),
      color: AppColors.borderTertiary,
    );
  }

  Widget _buildLogoutButton(BuildContext context) {
    return GestureDetector(
      onTap: () => _showLogoutDialog(context),
      child: Container(
        width: double.infinity,
        height: 52,
        decoration: BoxDecoration(
          color: AppColors.white,
          borderRadius: BorderRadius.circular(AppRadius.lg),
          border: Border.all(color: AppColors.feedbackErrorBorder),
        ),
        child: const Center(
          child: Text(
            '退出登录',
            style: TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w600,
              color: AppColors.feedbackErrorText,
            ),
          ),
        ),
      ),
    );
  }

  void _showLogoutDialog(BuildContext context) {
    showDialog(
      context: context,
      builder: (dialogContext) => AlertDialog(
        title: const Text('退出登录'),
        content: const Text('确定要退出当前账户吗？'),
        actions: [
          TextButton(
            onPressed: () => Navigator.of(dialogContext).pop(),
            child: const Text('取消'),
          ),
          TextButton(
            onPressed: () async {
              Navigator.of(dialogContext).pop();
              final authBloc = context.read<AuthBloc>();
              authBloc.add(AuthLoggedOut());
              await authBloc.stream.firstWhere(
                (state) => state is AuthUnauthenticated,
              );
              if (context.mounted) {
                context.go('/');
              }
            },
            child: const Text(
              '退出',
              style: TextStyle(color: AppColors.feedbackErrorText),
            ),
          ),
        ],
      ),
    );
  }
}