import 'dart:io';

import 'package:appframe/bloc/setting/setting_cubit.dart';
import 'package:appframe/config/constant.dart';
import 'package:appframe/config/env_config.dart';
import 'package:appframe/config/routes.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

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

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => SettingCubit(),
      child: BlocBuilder<SettingCubit, SettingState>(
        builder: (context, state) {
          final settingCubit = context.read<SettingCubit>();

          var customerService = Platform.isAndroid || state.wechatInstalled
              ? [
                  Card(
                    margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(6),
                    ),
                    child: Column(
                      children: [
                        ListTile(
                          leading: const Icon(Icons.headset_mic, size: 20),
                          title: const Text('在线客服', style: TextStyle(fontSize: 14)),
                          onTap: () {
                            settingCubit.goCs();
                          },
                          contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                          trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                          dense: true,
                          visualDensity: VisualDensity.compact,
                        ),
                      ],
                    ),
                  ),
                  const SizedBox(height: 8),
                ]
              : [];

          return Scaffold(
            appBar: AppBar(
              title: const Text('设置', style: TextStyle(color: Colors.white, fontSize: 18)),
              centerTitle: true,
              backgroundColor: const Color(0xFF7691FA),
              iconTheme: const IconThemeData(color: Colors.white),
            ),
            body: Column(
              children: [
                Expanded(
                  child: SingleChildScrollView(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: [
                        const SizedBox(height: 16),
                        Card(
                          margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(6),
                          ),
                          child: Column(
                            children: [
                              ListTile(
                                leading: const Icon(Icons.lock, size: 20),
                                title: const Text('账号与安全', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  router.push('/account');
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                            ],
                          ),
                        ),
                        const SizedBox(height: 8),
                        Card(
                          margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(6),
                          ),
                          child: Column(
                            children: [
                              ListTile(
                                leading: const Icon(Icons.book_outlined, size: 20),
                                title: const Text('版本记录', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  router.push(
                                    '/link',
                                    extra: {'url': 'https://bxr.banxiaoer.net/apps/versions.html', 'title': '版本记录'},
                                  );
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                              const Divider(height: 1, thickness: 0.5, indent: 16, endIndent: 16),
                              ListTile(
                                leading: const Icon(Icons.book_outlined, size: 20),
                                title: const Text('用户协议', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  router.push(
                                    '/link',
                                    extra: {
                                      'url': 'https://bxr.banxiaoer.net/apps/useragreement.html',
                                      'title': '用户协议'
                                    },
                                  );
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                              const Divider(height: 1, thickness: 0.5, indent: 16, endIndent: 16),
                              ListTile(
                                leading: const Icon(Icons.book_outlined, size: 20),
                                title: const Text('隐私设置', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  router.push(
                                    '/link',
                                    extra: {
                                      'url': 'https://bxr.banxiaoer.net/apps/privacysettings.html',
                                      'title': '隐私设置'
                                    },
                                  );
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                              const Divider(height: 1, thickness: 0.5, indent: 16, endIndent: 16),
                              ListTile(
                                leading: const Icon(Icons.book_outlined, size: 20),
                                title: const Text('关于', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  router.push(
                                    '/link',
                                    extra: {'url': 'https://bxr.banxiaoer.net/apps/produce.html', 'title': '关于'},
                                  );
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                trailing: const Icon(Icons.arrow_forward_ios, size: 14),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                            ],
                          ),
                        ),
                        const SizedBox(height: 8),
                        ...customerService,
                        Card(
                          margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(6),
                          ),
                          child: Column(
                            children: [
                              ListTile(
                                leading: const Icon(Icons.cleaning_services, size: 20),
                                title: const Text('清理缓存', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  _showClearCacheDialog(context, settingCubit);
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                              const Divider(height: 1, thickness: 0.5, indent: 16, endIndent: 16),
                              ListTile(
                                leading: const Icon(Icons.logout, size: 20),
                                title: const Text('退出登录', style: TextStyle(fontSize: 14)),
                                onTap: () {
                                  settingCubit.logout();
                                },
                                contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                dense: true,
                                visualDensity: VisualDensity.compact,
                              ),
                            ],
                          ),
                        ),
                        const SizedBox(height: 8),
                        EnvConfig.isDev()
                            ? Card(
                                margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 2),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(6),
                                ),
                                child: Column(
                                  children: [
                                    ListTile(
                                      leading: const Icon(Icons.timeline, size: 20),
                                      title: const Text('切换日志模式', style: TextStyle(fontSize: 14)),
                                      onTap: () {
                                        settingCubit.handleToggleDebug();
                                      },
                                      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                                      dense: true,
                                      visualDensity: VisualDensity.compact,
                                    ),
                                  ],
                                ),
                              )
                            : const SizedBox(),
                      ],
                    ),
                  ),
                ),
                const Divider(),
                Container(
                  width: double.infinity,
                  padding: const EdgeInsets.all(16),
                  child: Center(
                    child: Column(
                      children: [
                        if (EnvConfig.isDev()) ...[
                          const Text(
                            '开发版',
                            style: TextStyle(
                              color: Colors.grey,
                              fontSize: 14,
                            ),
                          ),
                          const SizedBox(height: 4),
                        ],
                        const Text(
                          'V1.0',
                          style: TextStyle(
                            color: Colors.grey,
                            fontSize: 12,
                          ),
                        ),
                        const SizedBox(height: 8),
                        const Text(
                          '粤ICP备2025475184号-15A',
                          style: TextStyle(color: Colors.grey, fontSize: 12),
                        ),
                        const SizedBox(height: 8),
                        const Text(
                          'Copyright © 中山班小二科技有限公司',
                          style: TextStyle(color: Colors.grey, fontSize: 12),
                        ),
                        const SizedBox(height: 8),
                        Text(
                          '${Constant.appVersion}-${state.h5Version}',
                          style: const TextStyle(
                            color: Colors.grey,
                            fontSize: 12,
                          ),
                        ),
                        const SizedBox(height: 10),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          );
        },
      ),
    );
  }

  void _showClearCacheDialog(BuildContext context, SettingCubit settingCubit) {
    showDialog(
      context: context,
      builder: (BuildContext ctx) {
        return AlertDialog(
          title: const Text('清理缓存'),
          content: const Text('清理缓存后将需要重新登录，是否继续？'),
          actions: <Widget>[
            TextButton(
              child: const Text('取消'),
              onPressed: () {
                Navigator.of(ctx).pop();
              },
            ),
            TextButton(
              child: const Text('确认'),
              onPressed: () {
                Navigator.of(ctx).pop();
                settingCubit.clearStorage();
                settingCubit.logout();
              },
            ),
          ],
        );
      },
    );
  }
}