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/color/appFontsize.dart';
import 'package:vbvs_app/common/util/FitTool.dart';
import 'package:vbvs_app/common/util/MyUtils.dart';
import 'package:vbvs_app/component/base/THFlutterFlowDropDown.dart';
import 'package:vbvs_app/component/tool/CustomCard.dart';
import 'package:vbvs_app/component/tool/TopSlideNotification.dart';
import 'package:vbvs_app/controller/mh_controller/book_info_controller.dart';
import 'package:vbvs_app/pages/common/selectDialog.dart';
import 'package:vbvs_app/pages/mh_page/book_date_widget.dart';

class BookInfoPage extends GetView<BookInfoController> {
  final scaffoldKey = GlobalKey<ScaffoldState>();
  Map data;

  BookInfoPage({required this.data}) {
    controller.getData(data["id"]);
  }
  getLine() {
    return Divider(
      color: Color(0XFF929699),
      thickness: 0.5.rpx,
    );
  }

  @override
  Widget build(BuildContext context) {
    return 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(
          // resizeToAvoidBottomInset: false, // 自
          // key: scaffoldKey,
          backgroundColor: Colors.transparent,
          appBar: AppBar(
            backgroundColor: Colors.transparent,
            automaticallyImplyLeading: false,
            iconTheme: const IconThemeData(color: Colors.white),
            titleSpacing: 0,
            title: Container(
              width: double.infinity,
              height: 70.rpx,
              child: Stack(
                alignment: Alignment.center,
                children: [
                  // 中间居中的标题
                  Text(
                    '我要预约'.tr,
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 30.rpx,
                    ),
                  ),
                  // 左侧图标
                  Positioned(
                    left: 0.rpx,
                    child: returnIconButtomNew(),
                  ),
                ],
              ),
            ),
            actions: [],
            centerTitle: false,
          ),
          body: Container(
            width: MediaQuery.sizeOf(context).width,
            height: MediaQuery.sizeOf(context).height * 1,
            child: Column(
              mainAxisSize: MainAxisSize.max,
              children: [
                // TitleComponentWidget(
                //   titleName: '我要预约',
                // ),
                Expanded(
                  child: Padding(
                    padding: EdgeInsetsDirectional.fromSTEB(
                        30.rpx, 40.rpx, 30.rpx, 0),
                    child: Container(
                        width: MediaQuery.sizeOf(context).width,
                        child: SingleChildScrollView(
                          child: Column(
                            mainAxisSize: MainAxisSize.max,
                            children: [
                              Container(
                                width: MediaQuery.sizeOf(context).width,
                                constraints: BoxConstraints(
                                  minHeight: 100.rpx,
                                ),
                                decoration: BoxDecoration(
                                    border: Border(
                                        bottom: BorderSide(
                                            color: Color(0xFF929699),
                                            width: 0.5.rpx))),
                                child: Container(
                                  margin: EdgeInsets.only(
                                      left: 30.rpx,
                                      right: 30.rpx,
                                      bottom: 10.rpx),
                                  child: Column(
                                    mainAxisSize: MainAxisSize.max,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      Text(
                                        '${data["name"]}',
                                        style: TextStyle(
                                            fontFamily: 'Readex Pro',
                                            fontSize: 30.rpx,
                                            letterSpacing: 0,
                                            height: 1,
                                            color: Colors.white),
                                      ),
                                      Text(
                                        '地址：${data["addressDetail"]}',
                                        style: TextStyle(
                                            fontFamily: 'Readex Pro',
                                            fontSize: 26.rpx,
                                            letterSpacing: 0,
                                            height: 1,
                                            color: Color(0xFF929699)),
                                      ),
                                    ].divide(SizedBox(
                                      height: 18.rpx,
                                    )),
                                  ),
                                ),
                              ),
                              Container(
                                margin: EdgeInsets.only(left: 30.rpx),
                                height: 136.rpx,
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '体验日期'.tr,
                                  style: TextStyle(
                                      fontFamily: 'Readex Pro',
                                      fontSize: 30.rpx,
                                      letterSpacing: 0,
                                      color: Colors.white),
                                ),
                              ),
                              // Align(
                              //   alignment: const AlignmentDirectional(-1, 0),
                              //   child: Padding(
                              //     padding: const EdgeInsetsDirectional.fromSTEB(
                              //         0, 0, 0, 16),

                              //   ),
                              // ),
                              Obx(() {
                                return Row(
                                  mainAxisSize: MainAxisSize.max,
                                  mainAxisAlignment:
                                      MainAxisAlignment.spaceBetween,
                                  children: getBuildItems(context),
                                );
                              }),
                              SizedBox(height: 90.rpx),
                              getLine(),
                              Padding(
                                  padding: EdgeInsetsDirectional.fromSTEB(
                                      30.rpx, 0.rpx, 30.rpx, 0),
                                  child: Container(
                                    height: 90.rpx,
                                    child: Row(
                                      mainAxisSize: MainAxisSize.max,
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text(
                                          '体验时段'.tr,
                                          style: TextStyle(
                                            fontFamily: 'Readex Pro',
                                            fontSize: 30.rpx,
                                            letterSpacing: 0,
                                            color: Colors.white,
                                            // 设置加粗
                                          ),
                                        ),
                                        Flexible(child: Obx(() {
                                          return InkWell(
                                            onTap: () {
                                              FocusScope.of(context)
                                                  .requestFocus(FocusNode());
                                              Future.delayed(
                                                  const Duration(
                                                      milliseconds: 250), () {
                                                showOneSelectionDialog(context,
                                                    arr: controller
                                                        .model.time_period
                                                        .map((d) =>
                                                            "${d['timeStr']} (${d['unBookAmount']}/${d['amount']})")
                                                        .toList()!,
                                                    checkIndex: controller.model
                                                            .select_time_index ??
                                                        0,
                                                    checkChange: (index) {
                                                  controller.model
                                                          .select_time_index =
                                                      index;

                                                  controller.updateAll();
                                                }, title: '请选择时间'.tr);
                                              });
                                            },
                                            child: Container(
                                              width: 140,
                                              height: 30,
                                              child: Row(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.end,
                                                crossAxisAlignment:
                                                    CrossAxisAlignment
                                                        .center, // 确保图标和文本垂直居中
                                                mainAxisSize: MainAxisSize.max,
                                                children: [
                                                  Padding(
                                                    padding:
                                                        const EdgeInsetsDirectional
                                                            .fromSTEB(
                                                            0, 3, 17, 0),
                                                    child: Text(
                                                      controller.model
                                                                  .select_time_index !=
                                                              null
                                                          ? "${controller.model.time_period?[controller.model.select_time_index!]?["timeStr"]}"
                                                          : '请选择时间'.tr,
                                                      style: TextStyle(
                                                          fontFamily:
                                                              'Readex Pro',
                                                          fontSize: AppFontsize
                                                              .normal_text_size,
                                                          letterSpacing: 0,
                                                          color: (controller
                                                                      .model
                                                                      .select_time_index ==
                                                                  null)
                                                              ? stringToColor(
                                                                  '#D0D0D0')
                                                              : Colors.white),
                                                    ),
                                                  ),
                                                  Icon(
                                                    Icons
                                                        .keyboard_arrow_down_sharp,
                                                    color: Colors.white,
                                                    size: 16,
                                                  ),
                                                ],
                                              ),
                                            ),
                                          );
                                        })),
                                      ],
                                    ),
                                  )),
                              getLine(),
                              Padding(
                                padding: EdgeInsetsDirectional.fromSTEB(
                                    30.rpx, 0, 30.rpx, 0),
                                child: Container(
                                  height: 90.rpx,
                                  // constraints: BoxConstraints(
                                  //   minHeight: 76.rpx,
                                  // ),
                                  child: Row(
                                    mainAxisSize: MainAxisSize.max,
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(
                                        '体验人员'.tr,
                                        style: TextStyle(
                                          fontFamily: 'Readex Pro',
                                          fontSize: 30.rpx,
                                          letterSpacing: 0,
                                          color: Colors.white,
                                          // 设置加粗
                                        ),
                                      ),
                                      Flexible(
                                        child: Align(
                                          alignment:
                                              const AlignmentDirectional(1, 0),
                                          child: Container(
                                            width: MediaQuery.sizeOf(context)
                                                    .width *
                                                0.3,
                                            height: MediaQuery.sizeOf(context)
                                                    .height *
                                                1,
                                            decoration: BoxDecoration(
                                              borderRadius:
                                                  BorderRadius.circular(0),
                                            ),
                                            child: Align(
                                              alignment:
                                                  const AlignmentDirectional(
                                                      1, 0),
                                              child: TextFormField(
                                                // autofocus: true,
                                                controller:
                                                    TextEditingController(
                                                        text: controller.model
                                                                .userName ??
                                                            ""),
                                                onChanged: (d) {
                                                  controller.model.userName = d;
                                                },
                                                enableInteractiveSelection:
                                                    false,
                                                obscureText: false,
                                                decoration: InputDecoration(
                                                  labelStyle: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: AppFontsize
                                                        .normal_text_size,
                                                    letterSpacing: 0,
                                                  ),
                                                  hintText: '输入姓名'.tr,
                                                  hintStyle: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: AppFontsize
                                                        .normal_text_size,
                                                    letterSpacing: 0,
                                                    color: themeController
                                                        .currentColor.sc4,
                                                  ),
                                                  enabledBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  focusedBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  errorBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  focusedErrorBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  contentPadding:
                                                      EdgeInsets.symmetric(
                                                          vertical: 0),
                                                ),
                                                style: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: 26.rpx,
                                                    letterSpacing: 0,
                                                    color: Colors.white),
                                                textAlign: TextAlign.end,
                                              ),
                                            ),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                              ),

                              getLine(),
                              Padding(
                                padding: EdgeInsetsDirectional.fromSTEB(
                                    30.rpx, 0, 30.rpx, 0),
                                child: Container(
                                  height: 90.rpx,
                                  constraints: BoxConstraints(
                                    minHeight: 76.rpx,
                                  ),
                                  child: Row(
                                    mainAxisSize: MainAxisSize.max,
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(
                                        '手机号'.tr,
                                        style: TextStyle(
                                          fontFamily: 'Readex Pro',
                                          fontSize: 30.rpx,
                                          letterSpacing: 0,
                                          color: Colors.white,
                                          // 设置加粗
                                        ),
                                      ),
                                      Flexible(
                                        child: Align(
                                          alignment:
                                              const AlignmentDirectional(1, 0),
                                          child: Container(
                                            width: MediaQuery.sizeOf(context)
                                                    .width *
                                                0.3,
                                            height: MediaQuery.sizeOf(context)
                                                    .height *
                                                1,
                                            decoration: BoxDecoration(
                                              borderRadius:
                                                  BorderRadius.circular(0),
                                            ),
                                            child: Align(
                                              alignment:
                                                  const AlignmentDirectional(
                                                      1, 0),
                                              child: TextFormField(
                                                // autofocus: true,
                                                controller:
                                                    TextEditingController(
                                                        text: controller.model
                                                                .userPhone ??
                                                            ""),
                                                onChanged: (d) {
                                                  controller.model.userPhone =
                                                      d;
                                                },
                                                obscureText: false,
                                                keyboardType:
                                                    TextInputType.phone,
                                                decoration: InputDecoration(
                                                  labelStyle: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: AppFontsize
                                                        .normal_text_size,
                                                    letterSpacing: 0,
                                                  ),
                                                  hintText: '输入手机号'.tr,
                                                  hintStyle: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: AppFontsize
                                                        .normal_text_size,
                                                    letterSpacing: 0,
                                                    color: themeController
                                                        .currentColor.sc4,
                                                  ),
                                                  enabledBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  focusedBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  errorBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  focusedErrorBorder:
                                                      UnderlineInputBorder(
                                                    borderSide:
                                                        const BorderSide(
                                                      color: Color(0x00000000),
                                                      width: 2,
                                                    ),
                                                    borderRadius:
                                                        BorderRadius.circular(
                                                            8),
                                                  ),
                                                  contentPadding:
                                                      EdgeInsets.symmetric(
                                                          vertical: 0),
                                                ),
                                                style: TextStyle(
                                                    fontFamily: 'Readex Pro',
                                                    fontSize: 26.rpx,
                                                    letterSpacing: 0,
                                                    color: Colors.white),
                                                textAlign: TextAlign.end,
                                              ),
                                            ),
                                          ),
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              getLine(),
                            ],
                          ),
                        )),
                  ),
                ),

                Padding(
                    padding: const EdgeInsetsDirectional.fromSTEB(
                        15, 0, 15, AppConstants.page_button_bottom_padding),
                    child: CustomCard(
                      borderRadius: 16.rpx,
                      gradientDirection: GradientDirection.vertical,
                      onTap: () {
                        // if (controller.model.select_time_index == null) {
                        //   showToast("请选择体验时间");
                        //   return;
                        // }
                        // if (controller.model.userName == null ||
                        //     controller.model.userName == "") {
                        //   showToast("请输入姓名");
                        //   return;
                        // }
                        // if (controller.model.userPhone == null ||
                        //     controller.model.userPhone == "") {
                        //   showToast("请输入手机号");
                        //   return;
                        // }
                        // if (MyUtils.isValidPhoneNumber(
                        //         controller.model.userPhone!) ==
                        //     false) {
                        //   showToast("请输入正确的手机号");
                        //   return;
                        // }
                        // controller.submitData(data["id"]).then((d) {
                        //   if (d.data["status"] == 2) {
                        //     d.data["addressDetail"] = data['addressDetail'];
                        //     d.data["name"] = data["name"];
                        //     controller.messageAdd(d.data);
                        //     Get.offAndToNamed("/bookSuccessPage",
                        //         arguments: {"data": d.data});
                        //   } else {
                        //     showToast("预约失败");
                        //   }
                        // }).catchError((d) {
                        //   showToast("预约失败");
                        // });
                        // Get.toNamed("/bookSuccessPage", arguments: {
                        //   "data": {
                        //     "id": "7fbfbd614ef5befa3d8a84730f666853",
                        //     "code": "10000114",
                        //     "orderSn": "2025051411302980610000114",
                        //     "userId": "09db8134288e8fb716c7acfdcca9f763",
                        //     "extUserId": null,
                        //     "deptId": 35,
                        //     "storeId": "962df2043ba06c99e6490616b37a60d4",
                        //     "customerId": "531ba6efe42d5e2cc3c8f219ebed4cee",
                        //     "idCard": null,
                        //     "realName": "江有龙",
                        //     "userPhone": "18956025450",
                        //     "province": "",
                        //     "city": "",
                        //     "district": "",
                        //     "addressDetail": "",
                        //     "bookType": 2,
                        //     "bookDateId": 104167,
                        //     "bookRoomNo": null,
                        //     "bookTimeStart": 1747281600000,
                        //     "bookTimeEnd": 1747303200000,
                        //     "payAmount": 0,
                        //     "transactionId": null,
                        //     "paid": 0,
                        //     "payTime": null,
                        //     "payType": null,
                        //     "status": 2,
                        //     "isVerify": false,
                        //     "verifyAdminId": null,
                        //     "verifyTime": null,
                        //     "giftAdminId": null,
                        //     "giftTime": null,
                        //     "createTime": 1747193430000,
                        //     "refundTime": null,
                        //     "isDel": false,
                        //     "audienceId": null,
                        //     "store": {
                        //       "id": "962df2043ba06c99e6490616b37a60d4",
                        //       "code": "55102",
                        //       "name": "合肥眠花糖共享会议华润大厦B座",
                        //       "deptId": 35,
                        //       "kingdeeId": ""
                        //     },
                        //     "dateStr": "2025年05月15日周四",
                        //     "timeStr": "12:00~18:00",
                        //     "qrCode": "",
                        //     "payName": "未付款",
                        //     "statusName": "待体验",
                        //     "user": {
                        //       "id": "09db8134288e8fb716c7acfdcca9f763",
                        //       "nickName": "生陌",
                        //       "avatar": null,
                        //       "mobile": "18956025450"
                        //     },
                        //     "verifyAdmin": null,
                        //     "giftAdmin": null,
                        //     "storeName": "合肥眠花糖共享会议华润大厦B座",
                        //     "storeAddress": null
                        //   },
                        // });
                        TopSlideNotification.show(
                          context,
                          text: "功能开发中...",
                        );
                      },
                      colors: const [
                        Color(0xFFFCFCFC),
                        Color(0xFFF8FAF9),
                        Color(0XFFECF6F3),
                        Color(0XFFD9F0E9),
                        Color(0xFFCEECE3)
                      ],
                      child: Container(
                        width: double.infinity,
                        height: 90.rpx,
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(6),
                        ),
                        child: Text(
                          "提交预约".tr,
                          style: TextStyle(
                            fontFamily: 'Readex Pro',
                            color: stringToColor("#011D33"),
                            letterSpacing: 0,
                            fontSize: 30.rpx,
                          ),
                        ),
                      ),
                    )),
              ],
            ),
          ),
        ),
      ),
    );
  }

  List<Widget> getBuildItems(BuildContext context) {
    List<Widget> images = [];
    controller.model.datetimes!.forEach((element) async {
      images.add(BookDateWidget(
        index: controller.model.datetimes!.indexOf(element),
        bookInfoController: controller,
      ));
    });
    return images;
  }
}