import 'package:flutter/material.dart';
import 'package:dating_touchme_app/generated/assets.dart';

class UserInfoPage extends StatefulWidget {
  const UserInfoPage({Key? key}) : super(key: key);

  @override
  State<UserInfoPage> createState() => _UserInfoPageState();
}

class _UserInfoPageState extends State<UserInfoPage> {
  String _gender = 'male'; // 默认选择男性
  String _nickname = '强壮的瘦子';
  String _birthday = '';
  String _education = '';
  String _invitationCode = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          // 背景图
          Positioned.fill(
            child: Image.asset(
              Assets.imagesBgInformation,
              fit: BoxFit.cover,
            ),
          ),
          // 内容区域
          SafeArea(
            child: SingleChildScrollView(
              padding: const EdgeInsets.symmetric(horizontal: 20.0),
              child: Column(
                children: [
                  // 标题
                  const SizedBox(height: 20),
                   Text(
                    '完善信息',
                    style: TextStyle(
                      fontSize: 24,
                      fontWeight: FontWeight.bold,
                      color: Color.fromRGBO(51, 51, 51, 1),
                    ),
                  ),
                  const SizedBox(height: 30),
                  
                  // 头像
                  Stack(
                    children: [
                      Container(
                        width: 85,
                        height: 85,
                        decoration: const BoxDecoration(
                          shape: BoxShape.circle,
                          color: Colors.grey,
                        ),
                        child: ClipOval(
                          // 这里可以替换为实际的头像图片
                          child: Image.asset(
                            Assets.imagesAvatarsExample,
                            fit: BoxFit.cover,
                          ),
                        ),
                      ),
                      Positioned(
                        bottom: 0,
                        right: 0,
                        child: Container(
                          width: 30,
                          height: 30,
                          decoration: const BoxDecoration(
                            shape: BoxShape.circle,
                            color: Colors.blue,
                          ),
                          child: Image.asset(
                              Assets.imagesBgEditAvatars,
                              width: 16,
                              height: 16,
                              color: Colors.white,
                            ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 30),
                  
                  // 性别选择
                  const Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '性别 (注册后不可修改)',
                      style: TextStyle(
                        fontSize: 16,
                        color: Color.fromRGBO(144, 144, 144, 1),
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  const SizedBox(height: 10),
                  Row(
                    children: [
                      GestureDetector(
                        onTap: () {
                          setState(() {
                            _gender = 'male';
                          });
                        },
                        child: Container(
                          padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(20),
                            color: _gender == 'male' ? Colors.black : Colors.grey[200],
                          ),
                          child: Row(
                            children: [
                              Image.asset(
                                Assets.imagesManIcon,
                                width: 20,
                                height: 20,
                                color: _gender == 'male' ? Colors.white : Colors.black,
                              ),
                              const SizedBox(width: 5),
                            ],
                          ),
                        ),
                      ),
                      const SizedBox(width: 20),
                      GestureDetector(
                        onTap: () {
                          setState(() {
                            _gender = 'female';
                          });
                        },
                        child: Container(
                          padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(20),
                            color: _gender == 'female' ? Colors.pink : Colors.grey[200],
                          ),
                          child: Row(
                            children: [
                              Image.asset(
                                Assets.imagesWomenIcon,
                                width: 20,
                                height: 20,
                                color: _gender == 'female' ? Colors.white : Colors.black,
                              ),
                              const SizedBox(width: 5),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                  const SizedBox(height: 30),
                  
                  // 昵称
                  const Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '昵称',
                      style: TextStyle(
                        fontSize: 16,
                        color: Colors.black,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  const SizedBox(height: 10),
                  Container(
                    padding: const EdgeInsets.symmetric(horizontal: 16),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(8),
                      color: Colors.white,
                    ),
                    child: Row(
                      children: [
                        Expanded(
                          child: TextField(
                            controller: TextEditingController(text: _nickname),
                            onChanged: (value) {
                              _nickname = value;
                            },
                            decoration: const InputDecoration(
                              border: InputBorder.none,
                            ),
                          ),
                        ),
                        TextButton(
                          onPressed: () {
                            // 随机昵称功能（不需要实现）
                          },
                          child: const Text(
                            '随机',
                            style: TextStyle(
                              color: Colors.grey,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                  const SizedBox(height: 30),
                  
                  // 出生日期
                  const Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '年龄',
                      style: TextStyle(
                        fontSize: 16,
                        color: Colors.black,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      // 打开日期选择器
                      _selectDate();
                    },
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(8),
                        color: Colors.white,
                      ),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            _birthday.isEmpty ? '请选择你的出生日期' : _birthday,
                            style: TextStyle(
                              color: _birthday.isEmpty ? Colors.grey : Colors.black,
                            ),
                          ),
                          const Icon(Icons.arrow_forward_ios, color: Colors.grey),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 30),
                  
                  // 学历
                  const Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '学历',
                      style: TextStyle(
                        fontSize: 16,
                        color: Colors.black,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  const SizedBox(height: 10),
                  GestureDetector(
                    onTap: () {
                      // 打开学历选择器
                      _selectEducation();
                    },
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(8),
                        color: Colors.white,
                      ),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text(
                            _education.isEmpty ? '请选择你的学历' : _education,
                            style: TextStyle(
                              color: _education.isEmpty ? Colors.grey : Colors.black,
                            ),
                          ),
                          const Icon(Icons.arrow_forward_ios, color: Colors.grey),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 30),
                  
                  // 邀请码
                  const Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '邀请码 (非必填)',
                      style: TextStyle(
                        fontSize: 16,
                        color: Colors.black,
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  const SizedBox(height: 10),
                  Container(
                    padding: const EdgeInsets.symmetric(horizontal: 16),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(8),
                      color: Colors.white,
                    ),
                    child: TextField(
                      onChanged: (value) {
                        _invitationCode = value;
                      },
                      decoration: const InputDecoration(
                        hintText: '请输入邀请码',
                        hintStyle: TextStyle(color: Colors.grey),
                        border: InputBorder.none,
                      ),
                    ),
                  ),
                  const SizedBox(height: 50),
                  
                  // 开始交友按钮
                  SizedBox(
                    width: double.infinity,
                    height: 50,
                    child: ElevatedButton(
                      onPressed: () {
                        // 提交用户信息
                        _submitUserInfo();
                      },
                      style: ElevatedButton.styleFrom(
                        backgroundColor: Colors.blue,
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(25),
                        ),
                      ),
                      child: const Text(
                        '开始交友',
                        style: TextStyle(
                          fontSize: 18,
                          color: Colors.white,
                        ),
                      ),
                    ),
                  ),
                  const SizedBox(height: 30),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  // 选择日期
  void _selectDate() {
    // 这里可以实现日期选择逻辑
    // 为了简单起见，我们先设置一个默认日期
    setState(() {
      _birthday = '1990-01-01';
    });
  }

  // 选择学历
  void _selectEducation() {
    // 这里可以实现学历选择逻辑
    // 为了简单起见，我们先设置一个默认学历
    setState(() {
      _education = '本科';
    });
  }

  // 提交用户信息
  void _submitUserInfo() {
    // 这里可以实现提交逻辑
    print('提交用户信息:');
    print('性别: $_gender');
    print('昵称: $_nickname');
    print('生日: $_birthday');
    print('学历: $_education');
    print('邀请码: $_invitationCode');
    
    // 可以添加验证逻辑
    if (_birthday.isEmpty || _education.isEmpty) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text('请完善所有必填信息')),
      );
      return;
    }
    
    // 提交成功后跳转到下一个页面
    ScaffoldMessenger.of(context).showSnackBar(
      const SnackBar(content: Text('信息提交成功')),
    );
  }
}