import 'package:cc_ui_kit/cc_ui_kit.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:maibu_satabot_v2/core/router/route_paths.dart';
import 'package:maibu_satabot_v2/core/theme/AppTheme.dart';

class RegisterPage extends StatefulWidget {
  const RegisterPage({super.key});

  @override
  State<RegisterPage> createState() => _RegisterPageState();
}

class _RegisterPageState extends State<RegisterPage> {
  final _userCtrl = TextEditingController();
  final _pwdCtrl = TextEditingController();
  final _confirmPwdCtrl = TextEditingController();
  bool _isAgreed = false;
  bool _obscurePwd = true;
  bool _obscureConfirmPwd = true;

  @override
  void dispose() {
    _userCtrl.dispose();
    _pwdCtrl.dispose();
    _confirmPwdCtrl.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: context.appColors.pageBackground,
      appBar: AppBar(
        backgroundColor: context.appColors.pageBackground,
        elevation: 0,
        leading: IconButton(
          icon: Icon(Icons.arrow_back, color: context.appColors.textPrimary),
          onPressed: () => context.go(RoutePaths.login),
        ),
      ),
      body: SingleChildScrollView(
        padding: const EdgeInsets.symmetric(horizontal: 30.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const SizedBox(height: 40),
            Text(
              "账号注册",
              style: TextStyle(
                fontSize: 28,
                fontWeight: FontWeight.bold,
                color: context.appColors.textPrimary,
              ),
            ),
            const SizedBox(height: 12),
            Text(
              "请填写以下信息完成注册",
              style: TextStyle(fontSize: 15, color: context.appColors.textTertiary),
            ),
            const SizedBox(height: 40),

            _buildInputLabel("用户名"),
            TextField(
              controller: _userCtrl,
              style: TextStyle(fontSize: 14, color: context.appColors.textPrimary),
              cursorColor: context.appColors.textPrimary,
              decoration: _inputDecoration(hint: "请设置用户名"),
            ),

            const SizedBox(height: 24),

            _buildInputLabel("密码"),
            TextField(
              controller: _pwdCtrl,
              obscureText: _obscurePwd,
              style: TextStyle(fontSize: 14, color: context.appColors.textPrimary),
              cursorColor: context.appColors.textPrimary,
              decoration: _inputDecoration(
                hint: "请设置密码",
                suffixIcon: IconButton(
                  icon: Icon(
                    _obscurePwd
                        ? Icons.visibility_off_outlined
                        : Icons.visibility_outlined,
                    color: context.appColors.textTertiary,
                    size: 20,
                  ),
                  onPressed: () => setState(() => _obscurePwd = !_obscurePwd),
                ),
              ),
            ),

            const SizedBox(height: 24),

            _buildInputLabel("确认密码"),
            TextField(
              controller: _confirmPwdCtrl,
              obscureText: _obscureConfirmPwd,
              style: TextStyle(fontSize: 14, color: context.appColors.textPrimary),
              cursorColor: context.appColors.textPrimary,
              decoration: _inputDecoration(
                hint: "请再次输入密码",
                suffixIcon: IconButton(
                  icon: Icon(
                    _obscureConfirmPwd
                        ? Icons.visibility_off_outlined
                        : Icons.visibility_outlined,
                    color: context.appColors.textTertiary,
                    size: 20,
                  ),
                  onPressed: () => setState(
                        () => _obscureConfirmPwd = !_obscureConfirmPwd,
                  ),
                ),
              ),
            ),

            const SizedBox(height: 20),

            _buildProtocolSection(),

            const SizedBox(height: 40),

            SizedBox(
              width: double.infinity,
              child: CCPrimaryButton(
                onPressed: _isAgreed ? _handleRegister : null,
                text: '注 册',
              ),
            ),

            const SizedBox(height: 24),

            Center(
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    "已有账号？",
                    style: TextStyle(fontSize: 14, color: context.appColors.textTertiary),
                  ),
                  GestureDetector(
                    onTap: () => context.go(RoutePaths.login),
                    child: Text(
                      "立即登录",
                      style: TextStyle(
                        fontSize: 14,
                        color: context.appColors.textPrimary,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ],
              ),
            ),

            const SizedBox(height: 20),
          ],
        ),
      ),
    );
  }

  void _handleRegister() {
    if (_userCtrl.text.isEmpty || _pwdCtrl.text.isEmpty) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('请填写完整信息')),
      );
      return;
    }

    if (_pwdCtrl.text != _confirmPwdCtrl.text) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('两次输入的密码不一致')),
      );
      return;
    }

    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(content: Text('注册功能开发中...')),
    );
  }

  Widget _buildInputLabel(String label) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 8.0),
      child: Text(
        label,
        style: TextStyle(
          fontSize: 14,
          fontWeight: FontWeight.w600,
          color: context.appColors.textSecondary,
        ),
      ),
    );
  }

  InputDecoration _inputDecoration({required String hint, Widget? suffixIcon}) {
    return InputDecoration(
      hintText: hint,
      hintStyle: TextStyle(color: context.appColors.textTertiary, fontSize: 14),
      filled: true,
      fillColor: context.appColors.fillBackground,
      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
      enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(8),
        borderSide: BorderSide(color: context.appColors.divider),
      ),
      focusedBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(8),
        borderSide: BorderSide(color: context.appColors.primary, width: 1),
      ),
      suffixIcon: suffixIcon,
    );
  }

  Widget _buildProtocolSection() {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        SizedBox(
          height: 24,
          width: 24,
          child: Checkbox(
            value: _isAgreed,
            activeColor: context.appColors.primary,
            checkColor: Colors.white,
            side: BorderSide(color: context.appColors.divider),
            onChanged: (val) => setState(() => _isAgreed = val!),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(4),
            ),
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: Wrap(
            children: [
              Text(
                "我已阅读并同意 ",
                style: TextStyle(fontSize: 13, color: context.appColors.textTertiary),
              ),
              _protocolText("《用户协议》", () => _showProtocolDetail("用户协议")),
              Text(" 和 ", style: TextStyle(fontSize: 13, color: context.appColors.textTertiary)),
              _protocolText("《隐私政策》", () => _showProtocolDetail("隐私政策")),
            ],
          ),
        ),
      ],
    );
  }

  Widget _protocolText(String text, VoidCallback onTap) {
    return GestureDetector(
      onTap: onTap,
      child: Text(
        text,
        style: TextStyle(
          fontSize: 13,
          color: context.appColors.textPrimary,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }

  void _showProtocolDetail(String title) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      backgroundColor: context.appColors.cardBackground,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
      ),
      builder: (context) => Container(
        padding: const EdgeInsets.all(24),
        height: MediaQuery.of(context).size.height * 0.7,
        child: Column(
          children: [
            Text(
              title,
              style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: context.appColors.textPrimary),
            ),
            Divider(height: 32, color: context.appColors.divider),
            Expanded(
              child: SingleChildScrollView(
                child: Text(
                  "此处放置您的${title}详细内容...\n" * 20,
                  style: TextStyle(color: context.appColors.textSecondary, height: 1.5),
                ),
              ),
            ),
            const SizedBox(height: 16),
            SizedBox(
              width: double.infinity,
              child: CCPrimaryButton(
                onPressed: () => Navigator.pop(context),
                text: "我已了解",
              ),
            ),
          ],
        ),
      ),
    );
  }
}