import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_svg/svg.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/controller/main_bottom/global_controller.dart';
import 'package:vbvs_app/controller/theme_controller/ThemeController.dart';
import 'package:vbvs_app/controller/user_info_controller.dart';
import 'dart:ui' as ui;

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

  @override
  State<NewMinePage> createState() => _MinePageState();
}

class _MinePageState extends State<NewMinePage> {
  GlobalController globalController = Get.find();
  UserInfoController userInfoController = Get.find();
  ThemeController themeController = Get.find();
  final GlobalKey _textKey = GlobalKey();

  double _textHalfWidth = 0;
  @override
  void initState() {
    super.initState();

    final login = userInfoController.model.login;
    String text;

    if (login == 0) {
      text = '未命名'.tr;
    } else {
      final nickname = userInfoController.model.user?.nick_name;
      text = (nickname != null && nickname.isNotEmpty) ? nickname : '未命名'.tr;
    }

    // _calculateTextHalfWidth(text);
  }

  void _calculateTextHalfWidth(String text) {
    final textSpan = TextSpan(
      text: text,
      style: TextStyle(
        fontSize: 30.rpx,
        height: 1,
      ),
    );
    final textPainter = TextPainter(
      text: textSpan,
      textDirection: ui.TextDirection.ltr,
    );
    textPainter.layout(); // 计算文本宽度
    setState(() {
      _textHalfWidth = textPainter.width / 2;
    });
  }
  @override
  Widget build(BuildContext context) {
    SystemChrome.setSystemUIOverlayStyle(const SystemUiOverlayStyle(
      statusBarColor: Colors.transparent, // 这里设置你希望的颜色
      statusBarIconBrightness: Brightness.light, // 状态栏图标的亮度
    ));
    int login = userInfoController.model.login!;
    return LayoutBuilder(
      builder: (context, bodySize) => GestureDetector(
        onTap: () => FocusScope.of(context).unfocus(),
        child: Container(
          decoration: const BoxDecoration(
            image: DecorationImage(
              image: AssetImage('assets/images/new_background.png'), // 本地图片
              fit: BoxFit.fill, // 填满整个 Container
            ),
          ),
          child: Scaffold(
            backgroundColor: Colors.transparent,
            appBar: AppBar(
              backgroundColor: Colors.transparent,
              iconTheme: const IconThemeData(color: Colors.white),
              automaticallyImplyLeading: false,
              titleSpacing: 0,
              actions: [
                ClickableContainer(
                    backgroundColor: Colors.transparent,
                    highlightColor: Colors.transparent,
                    padding: EdgeInsets.only(right: 38.rpx),
                    onTap: () {
                      // if (userInfoController.model.login ==
                      //     LoginStatus.LOGIN.code) {
                      //   TopSlideNotification.show(
                      //     context,
                      //     text: "待开发功能".tr,
                      //   );
                      // } else {
                      //   TopSlideNotification.show(
                      //     context,
                      //     text: "必须登录提示".tr,
                      //     textColor: themeController.currentColor.sc9,
                      //   );
                      //   Get.toNamed("/loginPage");
                      // }
                      Get.toNamed('/messagePage');
                    },
                    child: Container(
                        height: 42.rpx,
                        width: 42.rpx,
                        child: SvgPicture.asset(
                          'assets/img/icon/message.svg',
                          color: Colors.white,
                          // color: Colors.white,
                        ))),
                // ClickableContainer(
                //     backgroundColor: Colors.transparent,
                //     highlightColor: Colors.transparent,
                //     padding: EdgeInsets.only(right: 11.rpx),
                //     onTap: () {

                //     },
                //     child: Container(
                //         height: 42.rpx,
                //         width: 42.rpx,
                //         child: SvgPicture.asset(
                //           'assets/img/icon/people_info.svg',
                //           color: Colors.white,
                //         ))),
              ],
            ),
            body: SafeArea(
              top: true,
              child: Container(
                height: bodySize.maxHeight,
                child: Column(
                  mainAxisSize: MainAxisSize.max,
                  children: [
                    Padding(
                      padding: EdgeInsetsDirectional.only(top: 30.rpx),
                      child: Container(
                        width: 120.rpx,
                        height: 120.rpx,
                        clipBehavior: Clip.antiAlias,
                        decoration: const BoxDecoration(
                          shape: BoxShape.circle,
                        ),
                        child: login == 1
                            ? (userInfoController.model.user!.avatar == null ||
                                    userInfoController
                                        .model.user!.avatar!.isEmpty
                                ? Image.asset(
                                    "assets/images/people_avatar.png",
                                    fit: BoxFit.cover,
                                  )
                                : Image.network(
                                    userInfoController.model.user!.avatar!,
                                    fit: BoxFit.cover,
                                  ))
                            : Image.asset(
                                "assets/images/people_avatar.png",
                                fit: BoxFit.cover,
                              ),
                      ),
                    ),
                    Padding(
                      padding: EdgeInsetsDirectional.only(top: 19.rpx),
                      child: Container(
                        width: double.infinity,
                        decoration: const BoxDecoration(),
                        child: Stack(
                          alignment: Alignment.center, // 使子组件在Stack中居中
                          children: [
                            Obx(() {
                              return getUserInfo(userInfoController);
                            }),
                            Positioned(
                              left: MediaQuery.of(context).size.width / 2 +
                                  _textHalfWidth +
                                  30.rpx,
                              top: -10.rpx,
                              child: ClickableContainer(
                                  backgroundColor: Colors.transparent,
                                  highlightColor: const Color(0xFF055466),
                                  padding: EdgeInsets.zero,
                                  onTap: () async {
                                    await Get.toNamed("/editUserInfoPage");
                                    await userInfoController.getUserInfo();
                                    userInfoController.updateAll();
                                    final login =
                                        userInfoController.model.login;
                                    String text;

                                    if (login == 0) {
                                      text = '未命名'.tr;
                                    } else {
                                      final nickname = userInfoController
                                          .model.user?.nick_name;
                                      text = (nickname != null &&
                                              nickname.isNotEmpty)
                                          ? nickname
                                          : '未命名'.tr;
                                    }
                                    _calculateTextHalfWidth(text);
                                  },
                                  child: Container(
                                    width: 42.rpx,
                                    height: 42.rpx,
                                    alignment: Alignment.center,
                                    child: SvgPicture.asset(
                                      'assets/images/edit.svg',
                                      color: Colors.white,
                                      width: 18.rpx,
                                      height: 18.rpx,
                                    ),
                                  )),
                            ),
                         
                          ],
                        ),
                      ),
                    ),

                    Container(
                        margin: EdgeInsets.only(
                            left: 30.rpx, right: 30.rpx, top: 94.rpx),
                        child: Text(
                          '对已绑定的智能设备进行个性化配置，以获得更好的体验,',
                          style: TextStyle(
                              fontSize: 26.rpx,
                              color: const Color(0XFF929699),
                              height: 1),
                        )),
                    Padding(
                      padding: EdgeInsets.only(top: 46.rpx, bottom: 109.rpx),
                      child: ElevatedButton(
                        onPressed: () {},
                        style: ElevatedButton.styleFrom(
                          tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                          backgroundColor: const Color(0XFF85F5FF),
                          side: const BorderSide(color: Color(0XFF74DAE5)),
                          // foregroundColor: Colors.cyanAccent,
                          minimumSize: Size(260.rpx, 60.rpx),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(6),
                          ),
                        ),
                        child: Text(
                          '我的智能床',
                          style: TextStyle(
                              fontSize: 26.rpx, color: const Color(0xFF003058)),
                        ),
                      ),
                    ),
                    // 使用 Expanded 让滚动区域占据可用空间
                    // SizedBox(height: 109.rpx),
                    Expanded(
                      child: Container(
                        margin: const EdgeInsets.symmetric(horizontal: 16),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(12),
                          color: Colors.transparent,
                        ),
                        child: SingleChildScrollView(
                          // 直接使用 SingleChildScrollView
                          child: Column(
                            children: [
                              _buildListTile(
                                  Icons.receipt_long, '我的订单', '快捷查看我在网上的订单记录',
                                  showTopLine: true, path: "/issueListpage"),
                              _buildListTile(Icons.store_mall_directory, '门店体验',
                                  '如果想免费体验智能设备，可在此进行提前预约',
                                  path: "/experienceStorePage"),
                              _buildListTile(
                                Icons.build,
                                '设备报修',
                                '当您的智能设备需要报修时，可以通过该功能联系解决,',
                                path: '/deviceRepairPage',
                              ),
                              _buildListTile(
                                  Icons.shopping_cart, '网上商城', '最新的智能产品线上购买服务',
                                  path: "/issueListpage"),
                              _buildListTile(
                                  Icons.location_on, '地址管理', '用于收货和报修时联系您',
                                  path: "/addressListPage"),
                              _buildListTile(Icons.help_outline, '问题与帮助',
                                  '常见的问题汇总，如：智能床连接流程、如何查看睡眠报告',
                                  path: "/issueListpage"),
                              _buildListTile(Icons.headset_mic, '在线客服',
                                  '购买和使用智能床过程中，如果遇到疑问可与客服进行联系',
                                  path: "/issueListpage"),
                            ],
                          ),
                        ),
                      ),
                    ), // 使用 Expanded 让滚动区域占据可用空间
                    Padding(
                      padding:
                          EdgeInsets.fromLTRB(30.rpx, 24.rpx, 30.rpx, 50.rpx),
                      child: _buildSettingButton(),
                    ),
                  ],
                ),
                // Column(
                //   mainAxisSize: MainAxisSize.max,
                //   children: [

                //   ],
                // ),
              ),
            ),
          ),
        ),
      ),
    );
  }

  /// 构建列表项（带分隔线）
  Widget _buildListTile(
    IconData icon,
    String title,
    String subtitle, {
    // VoidCallback? onTap,
    String? path,
    bool showTopLine = false,
  }) {
    return ClickableContainer(
        backgroundColor: Colors.transparent,
        highlightColor: Colors.white,
        padding: EdgeInsets.all(0.rpx),
        onTap: () {
          Get.toNamed(path!);
        },
        child: Container(
          decoration: BoxDecoration(
            border: Border(
              top: showTopLine
                  ? BorderSide(color: Color(0xFF929699), width: 2.rpx)
                  : BorderSide.none,
              bottom: BorderSide(color: Color(0xFF929699), width: 2.rpx),
            ),
          ),
          height: 116.rpx,
          child: Padding(
            padding: EdgeInsets.fromLTRB(40.rpx, 0.rpx, 40.rpx, 0.rpx),
            child: Row(
              children: [
                Icon(icon, color: const Color(0xFF85F5FF), size: 28.rpx),
                SizedBox(width: 30.rpx),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.center, // 垂直方向居中对齐
                    children: [
                      Text(
                        title,
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 30.rpx,
                        ),
                      ),
                      // SizedBox(height: 6.rpx), // 加点间距
                      Text(
                        subtitle,
                        style: TextStyle(
                          color: Color(0xFF929699),
                          fontSize: 20.rpx,
                        ),
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        softWrap: true, // 允许换行
                      ),
                    ],
                  ),
                ),
                ClickableContainer(
                    backgroundColor: Colors.transparent,
                    highlightColor: Colors.transparent,
                    padding: EdgeInsets.only(right: 0),
                    onTap: () {},
                    child: Container(
                        height: 30.rpx,
                        width: 30.rpx,
                        child: SvgPicture.asset(
                          'assets/img/icon/expand.svg',
                          color: Colors.white,
                        )
                        //  Icon(
                        //   Icons.arrow_forward_ios,
                        //   color: Colors.white,
                        //   // size: 14.rpx,
                        // ),
                        )),
              ],
            ),
          ),
        ));
  }

  Widget _buildSettingButton() {
    return Container(
      width: double.infinity,
      height: MediaQuery.sizeOf(context).height * 0.055,
      constraints: BoxConstraints(
        minHeight: 90.rpx,
      ),
      child: ElevatedButton(
        onPressed: () {
          Get.toNamed("/settingPage");
        },
        style: ElevatedButton.styleFrom(
          backgroundColor: const Color(0xFF04345E),
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(10.rpx)),
        ),
        child:
            Text('设置', style: TextStyle(fontSize: 26.rpx, color: Colors.white)),
      ),
    );
  }

  Widget getUserInfo(UserInfoController userInfoController) {
    int login = userInfoController.model.login!;
    return Column(
      mainAxisSize: MainAxisSize.max,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        Text(
          login == 1
              ? (userInfoController.model.user!.nick_name ?? '未命名'.tr)
              : "未命名".tr,
          style: FlutterFlowTheme.of(context).bodyMedium.override(
                fontFamily: 'Inter',
                color: themeController.currentColor.sc3,
                fontSize: AppConstants().title_text_fontSize,
                letterSpacing: 0.0,
              ),
        ),
        Text(
          login == 1
              ? (() {
                  final user = userInfoController.model.user!;
                  if (user.email != null && user.email!.isNotEmpty) {
                    return user.email!;
                  } else if (user.phone != null && user.phone!.isNotEmpty) {
                    return MyUtils.hidePhoneNumber(user.phone!);
                  } else {
                    return "微信用户".tr;
                  }
                })()
              : "未知数据".tr,
          style: FlutterFlowTheme.of(context).bodyMedium.override(
                fontFamily: 'Inter',
                color: themeController.currentColor.sc4,
                fontSize: AppConstants().normal_text_fontSize,
                letterSpacing: 0.0,
              ),
        ),
      ].divide(SizedBox(height: 20.rpx)),
    );
  }
}