import 'package:cs_resources/constants/color_constants.dart';
import 'package:cs_resources/generated/assets.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:widgets/ext/ex_widget.dart';
import 'package:widgets/my_button.dart';
import 'package:widgets/my_load_image.dart';
import 'package:widgets/my_text_view.dart';
import 'package:widgets/no_shadow_scroll_behavior.dart';
import 'package:widgets/shatter/custom_radio_check.dart';
import 'package:widgets/shatter/form_require_text.dart';
import 'package:widgets/shatter/round_my_text_field.dart';
import 'package:widgets/widget_export.dart';

import 'job_applied_edit_controller.dart';

import 'package:plugin_basic/base/base_state.dart';
import 'package:plugin_basic/base/base_stateful_page.dart';
import 'package:plugin_basic/utils/ext_get_nav.dart';
import 'package:router/path/router_path.dart';
import 'package:shared/utils/screen_util.dart';
import 'package:widgets/my_appbar.dart';

import 'job_applied_edit_state.dart';

/**
 * Applied列表中，编辑用户的此次工作打卡信息
 */
class JobAppliedEditPage extends BaseStatefulPage<JobAppliedEditController> {
  JobAppliedEditPage({Key? key}) : super(key: key);

  //启动当前页面
  static void startInstance(String? appliedId) {
    return Get.start(RouterPath.jobAppliedStaffEdit, arguments: {'appliedId': appliedId});
  }

  @override
  JobAppliedEditController createRawController() {
    return JobAppliedEditController();
  }

  @override
  State<JobAppliedEditPage> createState() => _JobAppliedEditState();
}

class _JobAppliedEditState extends BaseState<JobAppliedEditPage, JobAppliedEditController> {
  late JobAppliedEditState state;

  @override
  void initState() {
    super.initState();
    state = controller.state;
    state.appliedId = Get.arguments['appliedId'];
  }

  @override
  Widget build(BuildContext context) {
    return autoCtlGetBuilder(builder: (controller) {
      return Scaffold(
        extendBodyBehindAppBar: true,
        appBar: MyAppBar.appBar(context, "Edit".tr),
        body: SafeArea(
        bottom: MediaQuery.of(context).padding.bottom > 38,
          top: false,
          child: Container(
            width: double.infinity,
            height: double.infinity,
            padding: EdgeInsets.only(top: kToolbarHeight + ScreenUtil.getStatusBarH(context) + 1),
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                colors: [
                  Color(0xFF091D44),
                  Color(0xFF245A8A),
                  Color(0xFF7F7CEC),
                ],
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
              ),
            ),
            child: Scrollbar(
              child: ScrollConfiguration(
                behavior: NoShadowScrollBehavior(),
                child: SingleChildScrollView(
                  scrollDirection: Axis.vertical,
                  physics: const BouncingScrollPhysics(),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      //工作标题，选择模板
                      MyTextView(
                        "Staff Name".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //工作标题
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.5),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.memberName ?? "-",
                              fontSize: 15,
                              hint: "Choose Job Title".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                          ],
                        ),
                      ),

                      //开始时间
                      FormRequireText(
                        text: "Start Time".tr,
                      ).marginOnly(top: 15),

                      //选择时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.startTime ?? "-",
                              fontSize: 14,
                              hint: "Job Start Time".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickStartTime();
                      }),

                      //门卫签到时间
                      MyTextView(
                        "Security In".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //门卫签到时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.securityIn ?? "-",
                              fontSize: 14,
                              hint: "Security In".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickSecurityInTime();
                      }),

                      //工作地签到时间
                      MyTextView(
                        "Work In".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //工作地签到时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.workIn ?? "-",
                              fontSize: 14,
                              hint: "Work In".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickWorkInTime();
                      }),

                      //结束时间
                      FormRequireText(
                        text: "End Time".tr,
                      ).marginOnly(top: 15),

                      //结束时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.endTime ?? "-",
                              fontSize: 14,
                              hint: "Job End Time".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),

                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickEndTime();
                      }),

                      //门卫签出时间
                      MyTextView(
                        "Security Out".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //门卫签出时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.securityOut ?? "-",
                              fontSize: 14,
                              hint: "Security Out".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickSecurityOutTime();
                      }),

                      //工作地签出时间
                      MyTextView(
                        "Work Out".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //工作地签出时间
                      Container(
                        padding: EdgeInsets.only(left: 16, right: 10),
                        margin: EdgeInsets.only(top: 10),
                        height: 45,
                        decoration: BoxDecoration(
                          color: Color(0xFF4DCFF6).withOpacity(0.2),
                          borderRadius: const BorderRadius.all(Radius.circular(5)),
                        ),
                        child: Row(
                          mainAxisSize: MainAxisSize.max,
                          crossAxisAlignment: CrossAxisAlignment.center,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            MyTextView(
                              state.appliedEditView?.workOut ?? "-",
                              fontSize: 14,
                              hint: "Work Out".tr,
                              textHintColor: ColorConstants.textGrayAECAE5,
                              isFontMedium: true,
                              textColor: ColorConstants.white,
                            ).expanded(),
                            //下拉选图标
                            MyAssetImage(Assets.baseServiceTriangleDropDownIcon, width: 11.5, height: 6.28),
                          ],
                        ),
                      ).onTap(() {
                        FocusScope.of(context).unfocus();
                        controller.pickWorkOutTime();
                      }),

                      // + - 小时
                      Visibility(
                        visible: state.appliedEditView?.jobUnit == "hour",
                        child: MyTextView(
                          "+/- Hours".tr,
                          textColor: Colors.white,
                          fontSize: 15,
                          marginTop: 15,
                          isFontRegular: true,
                        ),
                      ),

                      //+ - 小时输入框
                      Visibility(
                        visible: state.appliedEditView?.jobUnit == "hour",
                        child: CustomTextField(
                          formKey: "add_hours",
                          marginLeft: 0,
                          marginRight: 0,
                          paddingTop: 0,
                          paddingBottom: 0,
                          height: 45,
                          fillBackgroundColor: Color(0xFF4DCFF6).withOpacity(0.2),
                          enabled: true,
                          textInputType: TextInputType.number,
                          formData: state.formData,
                          textInputAction: TextInputAction.done,
                          onSubmit: (key, value) {
                            FocusScope.of(context).unfocus();
                          },
                          marginTop: 10,
                        ),
                      ),

                      // 房间计费，房间数量
                      Visibility(
                        visible: state.appliedEditView?.jobUnit != "hour",
                        child: MyTextView(
                          "Total Rooms".tr,
                          textColor: Colors.white,
                          fontSize: 15,
                          marginTop: 15,
                          isFontRegular: true,
                        ),
                      ),

                      // 房间计费，房间数量输入框
                      Visibility(
                        visible: state.appliedEditView?.jobUnit != "hour",
                        child: CustomTextField(
                          formKey: "total_room",
                          marginLeft: 0,
                          marginRight: 0,
                          paddingTop: 0,
                          paddingBottom: 0,
                          height: 45,
                          fillBackgroundColor: Color(0xFF4DCFF6).withOpacity(0.2),
                          enabled: true,
                          inputFormatters: <TextInputFormatter>[FilteringTextInputFormatter.digitsOnly],
                          textInputType: TextInputType.number,
                          formData: state.formData,
                          textInputAction: TextInputAction.done,
                          onSubmit: (key, value) {
                            FocusScope.of(context).unfocus();
                          },
                          marginTop: 10,
                        ),
                      ),

                      // 修改的理由
                      MyTextView(
                        "Reason".tr,
                        textColor: Colors.white,
                        fontSize: 15,
                        marginTop: 15,
                        isFontRegular: true,
                      ),

                      //理由的单选
                      state.appliedEditView != null
                          ? CustomRadioCheck(
                              options: state.appliedEditView!.reasonList!.map((e) => e.txt).whereType<String>().toList(), //后台返回的数据展示，并且根据后台的数据匹配索引
                              selectedPosition: state.appliedEditView!.reasonList!.indexWhere((element) => element.value == state.appliedEditView!.reasonType),
                              onOptionSelected: (index, text) {
                                //修改内存的值
                                state.appliedEditView!.reasonType = state.appliedEditView!.reasonList![index].value;
                              },
                            ).marginOnly(top: 15, bottom: 20)
                          : CircularProgressIndicator(),

                      IgnoreKeyboardDismiss(
                        child: Container(
                          height: 130,
                          padding: EdgeInsets.symmetric(vertical: 15, horizontal: 15),
                          decoration: BoxDecoration(
                            color: Color(0xFF4DCFF6).withOpacity(0.2),
                            borderRadius: const BorderRadius.all(Radius.circular(5)),
                          ),
                          child: TextField(
                            cursorColor: ColorConstants.white,
                            cursorWidth: 1.5,
                            autofocus: false,
                            controller: state.formData["reason"]!['controller'],
                            focusNode: state.formData["reason"]!['focusNode'],
                            obscureText: state.formData["reason"]!['obsecure'],
                            // 装饰
                            decoration: InputDecoration(
                              isDense: true,
                              isCollapsed: true,
                              border: InputBorder.none,
                              hintText: state.formData["reason"]!['hintText'],
                              hintStyle: TextStyle(
                                color: ColorConstants.white,
                                fontSize: 15.0,
                                fontWeight: FontWeight.w400,
                              ),
                            ),
                            style: TextStyle(
                              color: ColorConstants.white,
                              fontSize: 15.0,
                              fontWeight: FontWeight.w400,
                            ),
                            // 键盘动作右下角图标
                            textInputAction: TextInputAction.done,
                            onSubmitted: (value) {
                              FocusScope.of(context).unfocus();
                            },
                          ),
                        ),
                      ),

                      //提交按钮
                      MyButton(
                        type: ClickType.throttle,
                        milliseconds: 500,
                        onPressed: () {
                          FocusScope.of(context).unfocus();
                          controller.doSubmit();
                        },
                        text: "Submit".tr,
                        textColor: ColorConstants.white,
                        fontSize: 16,
                        radius: 22.5,
                        backgroundColor: hexToColor("#FFBB1B"),
                        fontWeight: FontWeight.w500,
                      ).marginSymmetric(horizontal: 0, vertical: 30),
                    ],
                  ).paddingOnly(left: 15, right: 15),
                ),
              ),
            ),
          ),
        ),
      );
    });
  }
}
