import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:flutterflow_ui/flutterflow_ui.dart';
import 'package:vbvs_app/common/color/appConstants.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
import 'package:vbvs_app/common/util/MyUtils.dart';
import 'package:vbvs_app/component/tool/ClickableContainer.dart';
import 'package:vbvs_app/component/tool/CustomCard.dart';
import 'package:vbvs_app/controller/mh_controller/mh_language_controller.dart';
import 'package:vbvs_app/language/AppLanguage.dart';
import 'package:vbvs_app/pages/device_bind/componnet/FancyCircleCheckbox.dart';
import 'package:vbvs_app/pages/mh_page/homepage/controller/mht_home_controller.dart';

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

  @override
  State<LanguagePage> createState() => _LanguagePageState();
}

class _LanguagePageState extends State<LanguagePage> {
  MHLanguageController languageController = Get.find();
  MHTHomeController deviceController = Get.find();
  @override
  void initState() {
    // languageController.initLanuageList();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (context, bodySize) => GestureDetector(
        // onTap: () => FocusScope.of(context).unfocus(),,
        child: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('assets/images/new_background.png'), // 本地图片
              fit: BoxFit.fill, // 填满整个 Container
            ),
          ),
          child: Scaffold(
            backgroundColor: Colors.transparent, // 加上这一行
            appBar: AppBar(
              backgroundColor: Colors.transparent,
              automaticallyImplyLeading: false,
              iconTheme: IconThemeData(
                color: themeController.currentColor.sc3,
              ),
              titleSpacing: 0,
              // leading: returnIconButtom,
              title: Container(
                width: double.infinity,
                height: 180.rpx,
                child: Stack(
                  alignment: Alignment.center,
                  children: [
                    /// 居中标题
                    Text(
                      '选择语言'.tr,
                      style: TextStyle(
                        fontFamily: 'Readex Pro',
                        color: themeController.currentColor.sc3,
                        letterSpacing: 0,
                        fontSize: 30.rpx,
                      ),
                    ),
                    Positioned(
                      left: 0,
                      child: returnIconButtomNew(),
                    ),
                  ],
                ),
              ),
              actions: [],
              centerTitle: false,
            ),
            body: SafeArea(
              top: true,
              child: Padding(
                padding: EdgeInsetsDirectional.fromSTEB(30.rpx, 0, 30.rpx, 0),
                child: SingleChildScrollView(
                  child: Column(
                    mainAxisSize: MainAxisSize.max,
                    children: [
                      Padding(
                        padding: EdgeInsetsDirectional.fromSTEB(
                            0.rpx, 25.rpx, 0.rpx, 0),
                        child: Container(
                          width: double.infinity,
                          decoration: BoxDecoration(
                            color: Color(0XFF003058),
                            borderRadius: BorderRadius.circular(
                                AppConstants().normal_container_radius),
                          ),
                          child: Padding(
                            padding: EdgeInsetsDirectional.fromSTEB(
                                0.rpx, 0, 0.rpx, 0),
                            child: Column(
                              mainAxisSize: MainAxisSize.max,
                              children: [
                                Padding(
                                  padding: EdgeInsetsDirectional.fromSTEB(
                                      40.rpx, 20.rpx, 40.rpx, 20.rpx),
                                  child: Obx(() {
                                    return Column(
                                      children: languageController.languageList
                                          .map<Widget>((language) {
                                            return ClickableContainer(
                                              backgroundColor:
                                                  Colors.transparent, // 背景透明
                                              highlightColor: themeController
                                                  .currentColor.sc21, // 点击时的背景色
                                              padding: EdgeInsets.symmetric(
                                                  vertical: 10.rpx,
                                                  horizontal: 16.rpx),
                                              onTap: () async {
                                                // 点击事件逻辑
                                                for (var lang
                                                    in languageController
                                                        .languageList) {
                                                  lang.selected = (lang ==
                                                      language); // 根据选择更新状态
                                                }

                                                await AppLanguage()
                                                    .loadLanguage(
                                                        language.language_code,
                                                        project: "mht"); // 加载语言
                                                languageController
                                                    .updateAll(); // 更新操作
                                                languageController
                                                    .selectLanguage
                                                    .value = language;
                                                final list = deviceController
                                                    .personnelList.value;
                                                deviceController.getHomeSleeps(
                                                    list[0]["mac"], context);
                                              },
                                              child: Row(
                                                mainAxisSize: MainAxisSize.max,
                                                mainAxisAlignment:
                                                    MainAxisAlignment
                                                        .spaceBetween,
                                                children: [
                                                  Expanded(
                                                    child: Text(
                                                      language.language_name ??
                                                          '语言名称'.tr, // 显示语言名称
                                                      style: TextStyle(
                                                        fontFamily: 'Inter',
                                                        color: themeController
                                                            .currentColor.sc3,
                                                        fontSize: AppConstants()
                                                            .title_text_fontSize,
                                                        letterSpacing: 0.0,
                                                      ),
                                                      maxLines: 1,
                                                      overflow: TextOverflow
                                                          .ellipsis, // 省略号处理
                                                    ),
                                                  ),
                                                  FancyCircleCheckbox(
                                                    borderColor: themeController
                                                        .currentColor.sc3,
                                                    fillColor: themeController
                                                        .currentColor.sc2,
                                                    value: language.selected ??
                                                        false, // 根据 selected 状态显示选中或未选中
                                                    onChanged: (value) async {
                                                      // 保持原有的状态更改逻辑
                                                      for (var lang
                                                          in languageController
                                                              .languageList) {
                                                        lang.selected = (lang ==
                                                            language); // 更新选中状态
                                                      }

                                                      await AppLanguage()
                                                          .loadLanguage(
                                                              language
                                                                  .language_code,
                                                              project:
                                                                  "mht"); // 加载语言
                                                      languageController
                                                          .updateAll(); // 更新操作
                                                      languageController
                                                          .selectLanguage
                                                          .value = language;
                                                      final list =
                                                          deviceController
                                                              .personnelList
                                                              .value;
                                                      deviceController
                                                          .getHomeSleeps(
                                                              list[0]["mac"],
                                                              context);
                                                    },
                                                  ),
                                                ].divide(SizedBox(
                                                    width: 28.rpx)), // 为每个项添加间隔
                                              ),
                                            );
                                          })
                                          .toList()
                                          .divide(SizedBox(
                                            height: 30.rpx,
                                          )),
                                    );
                                  }),
                                ),
                                // ClickableContainer(
                                //   backgroundColor: Colors.transparent, // 容器背景色
                                //   highlightColor: themeController
                                //       .currentColor.sc21, // 点击时的背景色
                                //   padding: EdgeInsetsDirectional.fromSTEB(
                                //       40.rpx, 0.rpx, 40.rpx, 0.rpx),
                                //   onTap: () {},
                                //   child: Container(),
                                // ),
                              ]
                                  .divide(SizedBox(height: 0.rpx))
                                  .addToStart(SizedBox(height: 30.rpx))
                                  .addToEnd(SizedBox(height: 30.rpx)),
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}