import 'package:cp_offline_manage/common/colors.dart';
import 'package:cp_offline_manage/pages/login/login_logic.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'character_entry_logic.dart';

class Character_entryPage extends GetView<Character_entryLogic> {
  const Character_entryPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          _buildHeader(),
          GetBuilder<Character_entryLogic>(
            builder: (logic) {
              return _buildBody(context);
            },
          ),
          Obx(() {
            return Container(
              margin: EdgeInsets.only(bottom: 60),
              height: 50,
              width: double.infinity,
              color:
                  controller.isEnable.value ? Color(0xFFFF562F) : Colors.grey,
              child: TextButton(
                onPressed: controller.isEnable.value
                    ? () {
                        controller.jumpToLoginPage();
                      }
                    : null,
                child: Text(
                  '下一步',
                  style: TextStyle(
                      color: Colors.white,
                      fontWeight: FontWeight.bold,
                      fontSize: 16),
                ),
              ),
            );
          })
        ],
      ),
    );
  }

  // 头部
  Widget _buildHeader() {
    return Container(
      height: 180,
      color: ColorConfig.colorF0F0F0,
      child: Column(
        children: [
          Container(
            width: double.infinity, // 将 Container 的宽度设置为屏幕宽度
            margin: EdgeInsets.only(top: 80, left: 20),
            child: Text(
              "请选择您的身份",
              style: TextStyle(
                  color: Colors.black,
                  fontWeight: FontWeight.bold,
                  fontSize: 20),
              textAlign: TextAlign.left,
            ),
          ),
          Container(
            width: double.infinity, // 将 Container 的宽度设置为屏幕宽度
            margin: EdgeInsets.only(top: 15, left: 20),
            child: Text(
              "我们会对每种身份设定合理的权限",
              style: TextStyle(color: Colors.black, fontSize: 16),
              textAlign: TextAlign.left,
            ),
          ),
        ],
      ),
    );
  }

  // body
  Widget _buildBody(BuildContext context) {
    return Expanded(
        child: Container(
      alignment: Alignment.topLeft,
      margin: EdgeInsets.only(top: 20),
      child: Column(
        children: List.generate(controller.characterList.length, (index) {
          var item = controller.characterList[index];
          return _bodyItem(index, controller);
        }),
      ),
    ));
  }

  Widget _bodyItem(int index, Character_entryLogic logic) {
    var item = logic.characterList[index];
    return Container(
        color: ColorConfig.colorF0F0F0,
        alignment: Alignment.centerLeft,
        margin: EdgeInsets.symmetric(horizontal: 15),
        child: Column(
          children: [
            Container(
              child: Row(
                children: [
                  Expanded(
                      child: Column(
                    children: [
                      InkWell(
                        child: Container(
                          height: 80,
                          alignment: Alignment.centerLeft,
                          padding: EdgeInsets.only(
                            left: 20,
                          ),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Text(
                                item["title"].toString(),
                                style: TextStyle(
                                    color: Colors.black,
                                    fontWeight: FontWeight.bold,
                                    fontSize: 20),
                                textAlign: TextAlign.left,
                              ),
                              SizedBox(
                                height: 6,
                              ),
                              Text(
                                item["desc"].toString(),
                                style: TextStyle(
                                    color: Colors.black, fontSize: 15),
                                textAlign: TextAlign.left,
                              ),
                            ],
                          ),
                        ),
                        onTap: () {
                          controller.updateState(index);
                        },
                      ),
                    ],
                  )),
                  Container(
                      width: 40,
                      alignment: Alignment.center,
                      child: Image(
                        image: AssetImage("assets/images/home_icon/" +
                            (item["isSelected"] as bool
                                ? "icon_selected.png"
                                : "icon_unselected.png")),
                        width: 24,
                        height: 24,
                      )),
                ],
              ),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(5),
                border: Border.all(
                  width: 1,
                  color: item["isSelected"] as bool
                      ? Color(0xFFFF562F)
                      : Colors.transparent,
                ),
              ),
            ),
            Container(
              color: Color(0xFFFAFAFA),
              alignment: Alignment.centerLeft,
              height: 20,
            )
          ],
        ));
  }
}