feature-next-arch/lib/features/auth/presentation/pages/login_page.dart

import 'package:cc_ui_kit/cc_ui_kit.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:go_router/go_router.dart';

import '../../../../core/router/route_paths.dart';
import '../bloc/login_cubit.dart';
import '../bloc/login_state.dart';

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

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  final _userCtrl = TextEditingController();
  final _pwdCtrl = TextEditingController();
  bool _isAgreed = false; // 协议勾选状态
  bool _obscurePwd = true; // 密码可见性

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      // 保持 AppBar 简洁或直接去掉
      appBar: AppBar(backgroundColor: Colors.white, elevation: 0),
      body: BlocListener<LoginCubit, LoginState>(
        listener: (context, state) {
          if (state is LoginSuccess) {
            context.go(RoutePaths.home);
          } else if (state is LoginFailure) {
            // 可以在这里弹出简洁的黑白提示框
            ScaffoldMessenger.of(
              context,
            ).showSnackBar(SnackBar(content: Text('登录失败，${state.message}')));
          }
        },
        child: SingleChildScrollView(
          padding: const EdgeInsets.symmetric(horizontal: 30.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const SizedBox(height: 40),
              const Text(
                "账号登录",
                style: TextStyle(
                  fontSize: 28,
                  fontWeight: FontWeight.bold,
                  color: Colors.black,
                ),
              ),
              const SizedBox(height: 12),
              const Text(
                "请填写以下信息以验证身份",
                style: TextStyle(fontSize: 15, color: Colors.grey),
              ),
              const SizedBox(height: 40),

              // 账号输入框
              _buildInputLabel("账号"),
              TextField(
                controller: _userCtrl,
                cursorColor: Colors.black,
                decoration: _inputDecoration(hint: "请输入用户名"),
              ),

              const SizedBox(height: 24),

              // 密码输入框
              _buildInputLabel("密码"),
              TextField(
                controller: _pwdCtrl,
                obscureText: _obscurePwd,
                cursorColor: Colors.black,
                decoration: _inputDecoration(
                  hint: "请输入密码",
                  suffixIcon: IconButton(
                    icon: Icon(
                      _obscurePwd
                          ? Icons.visibility_off_outlined
                          : Icons.visibility_outlined,
                      color: Colors.grey,
                      size: 20,
                    ),
                    onPressed: () => setState(() => _obscurePwd = !_obscurePwd),
                  ),
                ),
              ),

              const SizedBox(height: 20),

              // 协议勾选区域
              _buildProtocolSection(),

              const SizedBox(height: 40),

              // 登录按钮 (使用你的 CCPrimaryButton 并增加状态控制)
              SizedBox(
                width: double.infinity,
                child: BlocBuilder<LoginCubit, LoginState>(
                  builder: (context, state) {
                    bool isLoading = state is LoginLoading; // 假设你有 Loading 状态

                    return CCPrimaryButton(
                      onPressed: () {
                        if (!_isAgreed) {
                          // 如果没有勾选协议，弹出提示
                          ScaffoldMessenger.of(context).showSnackBar(
                            const SnackBar(content: Text('请先阅读并同意用户协议')),
                          );
                          return;
                        }
                        if (state is! LoginLoading) {
                          _handleLogin();
                        }
                      },
                      text: state is LoginLoading ? '登录中...' : '登 录',
                    );
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  // 执行登录逻辑
  void _handleLogin() {
    context.read<LoginCubit>().login(_userCtrl.text, _pwdCtrl.text, 2);
  }

  // 辅助组件：输入框标签
  Widget _buildInputLabel(String label) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 8.0),
      child: Text(
        label,
        style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600),
      ),
    );
  }

  // 辅助组件：输入框装饰
  InputDecoration _inputDecoration({required String hint, Widget? suffixIcon}) {
    return InputDecoration(
      hintText: hint,
      hintStyle: TextStyle(color: Colors.grey.shade400, fontSize: 14),
      filled: true,
      fillColor: Colors.grey.shade50,
      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
      enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(8),
        borderSide: BorderSide(color: Colors.grey.shade200),
      ),
      focusedBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(8),
        borderSide: const BorderSide(color: Colors.black, width: 1),
      ),
      suffixIcon: suffixIcon,
    );
  }

  // 辅助组件：协议勾选
  Widget _buildProtocolSection() {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        SizedBox(
          height: 24,
          width: 24,
          child: Checkbox(
            value: _isAgreed,
            activeColor: Colors.black,
            onChanged: (val) => setState(() => _isAgreed = val!),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(4),
            ),
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: Wrap(
            children: [
              const Text(
                "我已阅读并同意 ",
                style: TextStyle(fontSize: 13, color: Colors.grey),
              ),
              _protocolText("《用户协议》", () => _showProtocolDetail("用户协议")),
              const Text(
                " 和 ",
                style: TextStyle(fontSize: 13, color: Colors.grey),
              ),
              _protocolText("《隐私政策》", () => _showProtocolDetail("隐私政策")),
            ],
          ),
        ),
      ],
    );
  }

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

  void _showProtocolDetail(String title) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      backgroundColor: Colors.white,
      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: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
            ),
            const Divider(height: 32),
            Expanded(
              child: SingleChildScrollView(
                child: Text(
                  "此处放置您的${title}详细内容...\n" * 20,
                  style: const TextStyle(color: Colors.black87, height: 1.5),
                ),
              ),
            ),
            const SizedBox(height: 16),
            SizedBox(
              width: double.infinity,
              child: BlocBuilder<LoginCubit, LoginState>(
                builder: (context, state) {
                  return CCPrimaryButton(
                    onPressed: () => Navigator.pop(context),
                    text: "我已了解",
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}