import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutterflow_ui/flutterflow_ui.dart';
import 'package:vbvs_app/common/color/appConstants.dart';
import 'package:vbvs_app/common/color/app_uri_status.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
import 'package:vbvs_app/component/tool/ClickableContainer.dart';
import 'package:vbvs_app/component/tool/TopSlideNotification.dart';
import 'package:vbvs_app/controller/message/message_controller.dart';
import 'package:vbvs_app/controller/theme_controller/ThemeController.dart';
import 'package:vbvs_app/pages/main_bottom/component/MessageWidgetWidget.dart';

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

  @override
  State<MessagePage> createState() => _MessagePageState();
}

class _MessagePageState extends State<MessagePage> {
  ThemeController themeController = Get.find();
  MessageController messageController = Get.find();

  @override
  void initState() {
    messageController.getMessageList().then((response) {
      if (response.code != HttpStatusCodes.ok) {
        TopSlideNotification.show(
          Get.context!,
          text: response.msg ?? "服务器.失败".tr,
          textColor: themeController.currentColor.sc9,
        );
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.transparent, // 这里设置你希望的颜色
      statusBarIconBrightness: Brightness.light, // 状态栏图标的亮度
    ));
    return LayoutBuilder(
      builder: (context, boxConstraints) => GestureDetector(
        onTap: () => FocusScope.of(context).unfocus(),
        child: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
              image: AssetImage('assets/img/bgNoImg.png'), // 本地图片
              fit: BoxFit.fill, // 填满整个 Container
            ),
          ),
          child: Scaffold(
            appBar: AppBar(
              backgroundColor: themeController.currentColor.sc17,
              automaticallyImplyLeading: false,
              iconTheme: IconThemeData(
                color: themeController.currentColor.sc3,
              ),
              toolbarHeight: 140.rpx,
              titleSpacing: 0,
              title: Padding(
                padding: EdgeInsetsDirectional.fromSTEB(
                  40.rpx,
                  0.rpx,
                  0.rpx,
                  0.rpx,
                ),
                child: Container(
                  width: double.infinity,
                  height: 140.rpx, // 👈 明确告诉 Flutter 高度
                  child: Column(
                    children: [
                      SizedBox(height: 40.rpx), // 上边距
                      Expanded(
                        child: Stack(
                          alignment: Alignment.bottomLeft,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: [
                                Obx(() {
                                  return ClickableContainer(
                                    backgroundColor: Colors.transparent,
                                    highlightColor:
                                        themeController.currentColor.sc3,
                                    borderRadius: 8.rpx,
                                    padding: EdgeInsets.all(0),
                                    onTap: () async {
                                      messageController.model.type = 1;
                                      await messageController.getMessageList();
                                      messageController.updateAll();
                                    },
                                    child: Container(
                                      width: 160.rpx,
                                      alignment: Alignment.center,
                                      child: Text(
                                        '体征消息'.tr,
                                        style: FlutterFlowTheme.of(context)
                                            .bodyMedium
                                            .override(
                                              fontFamily: 'Inter',
                                              fontSize: AppConstants()
                                                  .title_text_fontSize,
                                              letterSpacing: 0.0,
                                              color:
                                                  messageController
                                                              .model.type ==
                                                          2
                                                      ? themeController
                                                          .currentColor.sc3
                                                      : themeController
                                                          .currentColor.sc2,
                                            ),
                                      ),
                                    ),
                                  );
                                }),
                                Obx(() {
                                  return ClickableContainer(
                                    backgroundColor: Colors.transparent,
                                    highlightColor:
                                        themeController.currentColor.sc3,
                                    borderRadius: 8.rpx,
                                    padding: EdgeInsets.all(0),
                                    onTap: () async {
                                      messageController.model.type = 2;
                                      await messageController.getMessageList();
                                      messageController.updateAll();
                                    },
                                    child: Container(
                                      width: 160.rpx,
                                      alignment: Alignment.center,
                                      child: Text(
                                        '系统消息'.tr,
                                        style: FlutterFlowTheme.of(context)
                                            .bodyMedium
                                            .override(
                                              fontFamily: 'Inter',
                                              fontSize: AppConstants()
                                                  .title_text_fontSize,
                                              letterSpacing: 0.0,
                                              color:
                                                  messageController
                                                              .model.type ==
                                                          1
                                                      ? themeController
                                                          .currentColor.sc3
                                                      : themeController
                                                          .currentColor.sc2,
                                            ),
                                      ),
                                    ),
                                  );
                                }),
                              ],
                            ),
                            Obx(() {
                              double lineWidth = 160.rpx;
                              return AnimatedPositioned(
                                duration: Duration(milliseconds: 300),
                                curve: Curves.easeInOut,
                                bottom: 0, // 👈 现在 Stack 够大，线能放得下
                                left: messageController.model.type == 1
                                    ? 0
                                    : 160.rpx,
                                child: Container(
                                  width: lineWidth,
                                  height: 4.rpx,
                                  decoration: BoxDecoration(
                                    color: themeController.currentColor.sc2,
                                    borderRadius: BorderRadius.circular(2.rpx),
                                  ),
                                ),
                              );
                            }),
                          ],
                        ),
                      ),
                      SizedBox(height: 17.rpx), // 上边距
                    ],
                  ),
                ),
              ),
              actions: [],
              centerTitle: false,
            ),
            backgroundColor: Colors.transparent,
            body: SafeArea(
              top: true,
              child: Column(
                mainAxisSize: MainAxisSize.max,
                children: [
                  Expanded(
                    child: Container(
                      width: double.infinity,
                      decoration: BoxDecoration(),
                      child: Padding(
                        padding: EdgeInsetsDirectional.fromSTEB(
                          30.rpx,
                          0.rpx,
                          30.rpx,
                          0.rpx,
                        ),
                        child: SingleChildScrollView(
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            children: [
                              MessageWidgetWidget(),
                              MessageWidgetWidget(),
                              MessageWidgetWidget(),
                            ]
                                .divide(SizedBox(height: 30.rpx))
                                .addToStart(SizedBox(height: 30.rpx))
                                .addToEnd(SizedBox(height: 30.rpx)),
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}