import 'package:ef/ef.dart';
import 'package:flutter/material.dart';
import 'package:flutterflow_ui/flutterflow_ui.dart';
import 'package:vbvs_app/common/color/ServiceConstant.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/common/util/requestWithLog.dart';
import 'package:vbvs_app/component/NullDataComponentWidget.dart';
import 'package:vbvs_app/component/tool/ClickableContainer.dart';
import 'package:vbvs_app/controller/message/message_review_controller.dart';
import 'package:vbvs_app/model/api_response.dart';
import 'package:vbvs_app/pages/device/component/ReviewMessageWidgetWidget.dart';

class MessageReviewPage extends StatefulWidget {
  var data; //1.绑定时 2.绑定后
  MessageReviewPage({super.key, required this.data});

  @override
  State<MessageReviewPage> createState() => _MessageReviewPageState();
}

class _MessageReviewPageState extends State<MessageReviewPage> {
  MessageReviewController messageReviewController = Get.find();

  @override
  void initState() {
    super.initState();
    loadData(widget.data);
  }

  @override
  void dispose() {
    super.dispose();
  }

  @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/img/bgNoImg.png'), // 本地图片
              fit: BoxFit.fill, // 填满整个 Container
            ),
          ),
          child: Scaffold(
            backgroundColor: Colors.transparent,
            appBar: AppBar(
              backgroundColor: themeController.currentColor.sc17,
              automaticallyImplyLeading: false,
              iconTheme: IconThemeData(
                color: themeController.currentColor.sc3,
              ),
              titleSpacing: 0,
              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: returnIconButtom,
                      child: returnIconButtomAddCallback(() {}),
                    ),
                  ],
                ),
              ),
              actions: [],
              centerTitle: false,
            ),
            body: SafeArea(
              top: true,
              child: Padding(
                padding:
                    EdgeInsetsDirectional.fromSTEB(30.rpx, 29.rpx, 30.rpx, 0),
                child: Column(
                  children: [
                    Padding(
                      padding: EdgeInsetsDirectional.fromSTEB(
                          0.rpx, 0.rpx, 0.rpx, 26.rpx),
                      child: ClickableContainer(
                        backgroundColor: themeController.currentColor.sc5,
                        highlightColor:
                            themeController.currentColor.sc21, // 或你希望的点击水波纹颜色
                        borderRadius: AppConstants()
                            .normal_container_radius, // 如果你想加圆角可以设置 eg. 12.rpx
                        padding: EdgeInsets.zero,
                        onTap: () {
                          print('点击了体征卡片');
                        },
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          children: [
                            Flexible(
                              flex: 2,
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Row(
                                    children: [
                                      Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.end,
                                        children: [
                                          Text(
                                            '实时体征.姓名'.tr,
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc4,
                                            ),
                                          ),
                                          Text(
                                            '实时体征.年龄'.tr,
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc4,
                                            ),
                                          ),
                                        ].divide(SizedBox(height: 34.rpx)),
                                      ),
                                      Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.start,
                                        children: [
                                          Text(
                                            '${widget.data['person']?['name'] ?? '未命名'.tr}',
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc3,
                                            ),
                                          ),
                                          Text(
                                            '${MyUtils.getAgeByDate(MyUtils.formatBirthdayTime(widget.data['person']?['birthday'])) ?? '未知数据'.tr}',
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc3,
                                            ),
                                          ),
                                        ].divide(SizedBox(height: 34.rpx)),
                                      ),
                                    ]
                                        .divide(SizedBox(width: 33.rpx))
                                        .addToStart(SizedBox(width: 37.rpx)),
                                  ),
                                ]
                                    .addToStart(SizedBox(height: 36.rpx))
                                    .addToEnd(SizedBox(height: 36.rpx)),
                              ),
                            ),
                            Flexible(
                              flex: 3,
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Row(
                                    children: [
                                      Column(
                                        crossAxisAlignment:
                                            CrossAxisAlignment.end,
                                        children: [
                                          Text(
                                            '实时体征.设备ID'.tr,
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc4,
                                            ),
                                          ),
                                          Text(
                                            '实时体征.体重'.tr,
                                            style: TextStyle(
                                              fontFamily: 'Inter',
                                              fontSize: 26.rpx,
                                              letterSpacing: 0.0,
                                              color: themeController
                                                  .currentColor.sc4,
                                            ),
                                          ),
                                        ].divide(SizedBox(height: 34.rpx)),
                                      ),
                                      Expanded(
                                        child: Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              '${widget.data['code'] ?? '未知数据'.tr}',
                                              // "D11250300003",
                                              style: TextStyle(
                                                fontFamily: 'Inter',
                                                fontSize: 26.rpx,
                                                letterSpacing: 0.0,
                                                color: themeController
                                                    .currentColor.sc3,
                                              ),
                                              maxLines: 1,
                                              overflow: TextOverflow.ellipsis,
                                            ),
                                            Text(
                                              '${widget.data['person']?['weight'] ?? '未知数据'.tr}kg',
                                              style: TextStyle(
                                                fontFamily: 'Inter',
                                                fontSize: 26.rpx,
                                                letterSpacing: 0.0,
                                                color: themeController
                                                    .currentColor.sc3,
                                              ),
                                            ),
                                          ].divide(SizedBox(height: 34.rpx)),
                                        ),
                                      ),
                                    ]
                                        .divide(SizedBox(width: 33.rpx))
                                        .addToStart(SizedBox(width: 37.rpx)),
                                  ),
                                ]
                                    .addToStart(SizedBox(height: 36.rpx))
                                    .addToEnd(SizedBox(height: 36.rpx)),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                    Expanded(
                      child: Obx(() {
                        final list = messageReviewController.messageList.value;
                        return list.isEmpty
                            ? const NullDataWidget()
                            : _buildMessageListView(list);
                      }),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }

  Future<void> loadData(data) async {
    //todo 请求历史体征数据
    String serviceAddress = ServiceConstant.service_address;
    String serviceName = ServiceConstant.server_service;
    String serviceApi = ServiceConstant.message_list;
    String queryUrl =
        "${serviceAddress}${serviceName}${serviceApi}?type=app_vsm&mac=${data['mac']}";
    ApiResponse apiResponse = await requestWithLog(
        logTitle: "查询消息回看数据", method: MyHttpMethod.get, queryUrl: queryUrl);
    messageReviewController.messageList.value = apiResponse.data;
    messageReviewController.updateAll();
  }

  Widget _buildMessageListView(List dataList) {
    return Container(
      width: double.infinity,
      padding: EdgeInsets.symmetric(horizontal: 0.rpx),
      child: SingleChildScrollView(
        child: Column(
          children: [
            SizedBox(height: 30.rpx),
            ...dataList
                .map((item) => ReviewMessageWidgetWidget(data: item))
                .toList()
                .divide(SizedBox(height: 30.rpx)),
            SizedBox(height: 30.rpx),
          ],
        ),
      ),
    );
  }
}
