import 'package:appframe/bloc/setting/account_logoff_cubit.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';

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

  @override
  Widget build(BuildContext context) {
    final Map<String, dynamic>? extraData = GoRouterState.of(context).extra as Map<String, dynamic>?;
    var phone = extraData?['phone'] ?? '';

    return BlocProvider(
      create: (context) => AccountLogoffCubit(AccountLogoffState(phone: phone)),
      child: BlocConsumer<AccountLogoffCubit, AccountLogoffState>(
        builder: (context, state) {
          final accountLogoffCubit = context.read<AccountLogoffCubit>();
          return Scaffold(
            backgroundColor: Colors.white,
            appBar: AppBar(
              title: const Text(
                '用户注销',
                style: TextStyle(
                  color: Color(0xFF333333),
                  fontSize: 16,
                  fontWeight: FontWeight.bold,
                  height: 20 / 16,
                ),
              ),
              centerTitle: true,
              backgroundColor: Colors.white,
              iconTheme: const IconThemeData(color: Colors.black),
            ),
            body: SingleChildScrollView(
              child: Padding(
                padding: EdgeInsets.symmetric(horizontal: 30),
                child: Column(
                  children: [
                    SizedBox(height: 80),
                    Icon(
                      Icons.warning_rounded,
                      color: Color(0xFFFA7575),
                      size: 50,
                    ),
                    SizedBox(height: 20),
                    SizedBox(
                      width: 197,
                      child: Text.rich(
                        TextSpan(
                          children: [
                            TextSpan(
                              text: '注销后，您的所有数据将被',
                              style: TextStyle(
                                fontSize: 14,
                                letterSpacing: 0,
                                fontWeight: FontWeight.bold,
                                color: Color(0xFF333333),
                              ),
                            ),
                            TextSpan(
                              text: '永久删除且无法恢复',
                              style: TextStyle(
                                fontSize: 14,
                                letterSpacing: 0,
                                fontWeight: FontWeight.bold,
                                color: Color(0xFFFA7575),
                              ),
                            ),
                            TextSpan(
                              text: '，请谨慎操作！',
                              style: TextStyle(
                                fontSize: 14,
                                letterSpacing: 0,
                                fontWeight: FontWeight.bold,
                                color: Color(0xFF333333),
                              ),
                            ),
                          ],
                        ),
                        textAlign: TextAlign.center,
                      ),
                    ),
                    SizedBox(height: 40),
                    Row(
                      children: [
                        Expanded(
                          child: SizedBox(
                            height: 44,
                            child: ElevatedButton(
                              onPressed: state.isLoading
                                  ? null
                                  : () {
                                      _showLogoffConfirmDialog(context, accountLogoffCubit);
                                    },
                              style: ElevatedButton.styleFrom(
                                backgroundColor: Color(0xFFFA7575),
                                foregroundColor: Colors.white,
                                textStyle: TextStyle(fontSize: 19),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(23.5),
                                ),
                                disabledBackgroundColor: Color(0xFFCCCCCC),
                              ),
                              child: state.isLoading
                                  ? SizedBox(
                                      width: 20,
                                      height: 20,
                                      child: CircularProgressIndicator(
                                        strokeWidth: 2,
                                        valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
                                      ),
                                    )
                                  : Text(
                                      '确认注销',
                                      style: TextStyle(
                                        fontSize: 16,
                                        letterSpacing: 0,
                                        fontWeight: FontWeight.normal,
                                        color: Color(0xFFFFFFFF),
                                        height: 20 / 16,
                                      ),
                                    ),
                            ),
                          ),
                        ),
                        SizedBox(width: 6),
                        Expanded(
                          child: SizedBox(
                            height: 44,
                            child: OutlinedButton(
                              onPressed: () {
                                Navigator.of(context).pop();
                              },
                              style: OutlinedButton.styleFrom(
                                foregroundColor: Color(0xFFFA7575),
                                side: BorderSide(color: Color(0xFFFA7575)),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(23.5),
                                ),
                              ),
                              child: Text(
                                '取消',
                                style: TextStyle(
                                  fontSize: 16,
                                  letterSpacing: 0,
                                  fontWeight: FontWeight.normal,
                                  color: Color(0xFFFA7575),
                                  height: 20 / 16,
                                ),
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          );
        },
        listener: (context, state) {},
      ),
    );
  }

  void _showLogoffConfirmDialog(BuildContext context, AccountLogoffCubit accountLogoffCubit) {
    showDialog<void>(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext ctx) {
        return AlertDialog(
          shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.all(
              Radius.circular(5),
            ),
          ),
          title: const Text(
            '提示',
            style: TextStyle(
              fontSize: 17,
              color: Color(0xFF000000),
            ),
            textAlign: TextAlign.center,
          ),
          content: const Text.rich(
            TextSpan(
              children: [
                TextSpan(
                  text: '确认注销后，您的所有数据将被',
                  style: TextStyle(color: Color(0xFF666666), fontSize: 14),
                ),
                TextSpan(
                  text: '永久删除且无法恢复',
                  style: TextStyle(color: Color(0xFFFA7575), fontSize: 14),
                ),
                TextSpan(
                  text: '，请谨慎操作！',
                  style: TextStyle(color: Color(0xFF666666), fontSize: 14),
                ),
              ],
            ),
          ),
          actions: [
            Table(
              children: [
                TableRow(
                  children: [
                    TableCell(
                      child: TextButton(
                        onPressed: () {
                          Navigator.of(ctx).pop();
                        },
                        style: TextButton.styleFrom(
                          foregroundColor: const Color(0xFF333333),
                          textStyle: const TextStyle(fontSize: 17),
                          minimumSize: const Size.fromHeight(40),
                          padding: EdgeInsets.zero,
                          shape: const RoundedRectangleBorder(
                            borderRadius: BorderRadius.zero,
                          ),
                        ),
                        child: const Text('取消'),
                      ),
                    ),
                    TableCell(
                      child: TextButton(
                        onPressed: () {
                          Navigator.of(ctx).pop();
                          accountLogoffCubit.doLogoff();
                        },
                        style: TextButton.styleFrom(
                          foregroundColor: const Color(0xFF7691FA),
                          textStyle: const TextStyle(fontSize: 17),
                          minimumSize: const Size.fromHeight(40),
                          padding: EdgeInsets.zero,
                          shape: const RoundedRectangleBorder(
                            borderRadius: BorderRadius.zero,
                          ),
                        ),
                        child: const Text('确定'),
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ],
        );
      },
    );
  }
}