import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_lock/main/lockDetail/electronicKey/electronicKeyDetail/electronicKeyPeriodValidity/electronicKeyPeriodValidity_state.dart';
import 'package:star_lock/tools/pickers/pickers.dart';
import 'package:star_lock/tools/pickers/time_picker/model/date_mode.dart';
import 'package:star_lock/tools/pickers/time_picker/model/pduration.dart';

import '../../../../../app_settings/app_colors.dart';
import '../../../../../tools/commonItem.dart';
import '../../../../../tools/dateTool.dart';
import '../../../../../tools/submitBtn.dart';
import '../../../../../tools/titleAppBar.dart';
import 'electronicKeyPeriodValidity_logic.dart';

class ElectronicKeyPeriodValidityPage extends StatefulWidget {
  const ElectronicKeyPeriodValidityPage({Key? key}) : super(key: key);

  @override
  State<ElectronicKeyPeriodValidityPage> createState() =>
      _ElectronicKeyPeriodValidityPageState();
}

class _ElectronicKeyPeriodValidityPageState
    extends State<ElectronicKeyPeriodValidityPage> {
  final ElectronicKeyPeriodValidityLogic logic = Get.put(ElectronicKeyPeriodValidityLogic());
  final ElectronicKeyPeriodValidityState state = Get.find<ElectronicKeyPeriodValidityLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: AppColors.mainBackgroundColor,
        appBar: TitleAppBar(
            barTitle: '修改有效期'.tr,
            haveBack: true,
            backgroundColor: AppColors.mainColor),
        body: ListView(
          children: <Widget>[
            topWidget(),
            SizedBox(height: 10.h),
            middleWidget(),
            SizedBox(height: 10.h),
            bottomWidget(),
            Container(
              margin: EdgeInsets.only(left: 20.w, right: 20.w, top: 30.h),
              child: SubmitBtn(
                  btnName: '保存'.tr,
                  onClick: () {
                    if (state.pushType.value == 0) {
                      logic.updateKeyDateRequest();
                    } else if (state.pushType.value == 1) {}
                  }),
            ),
          ],
        ));
  }

  Widget topWidget() {
    return Column(
      children: <Widget>[
        Container(
          color: Colors.white,
          child: Column(
            children: <Widget>[
              Obx(() => CommonItem(
                  leftTitel: '生效日期'.tr,
                  rightTitle: state.starDate.value,
                  isHaveDirection: true,
                  isHaveLine: true,
                  action: () {
                    final PDuration selectDate =
                        PDuration.parse(DateTime.tryParse(state.endTime.value));
                    Pickers.showDatePicker(context,
                        selectDate: selectDate,
                        mode: DateMode.YMD, onConfirm: (PDuration p) {
                      state.starDate.value =
                          DateTool().getYMDHNDateString(p, 2);
                    });
                  })),
              Obx(() => CommonItem(
                  leftTitel: '失效日期'.tr,
                  rightTitle: state.endDate.value,
                  isHaveDirection: true,
                  action: () {
                    final PDuration selectDate =
                        PDuration.parse(DateTime.tryParse(state.endDate.value));
                    Pickers.showDatePicker(context,
                        selectDate: selectDate,
                        mode: DateMode.YMD, onConfirm: (PDuration p) {
                      state.endDate.value = DateTool().getYMDHNDateString(p, 2);
                    });
                  })),
              Container(height: 10.h),
            ],
          ),
        ),
      ],
    );
  }

  Widget middleWidget() {
    return Container(
      height: 160.h,
      width: 1.sw,
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Container(
              height: 60.h,
              // color: Colors.red,
              padding: EdgeInsets.only(left: 30.w, top: 15.h),
              child: Text('有效日'.tr,
                  style:
                      TextStyle(fontSize: 24.sp, fontWeight: FontWeight.w600))),
          Container(
              height: 100.h,
              padding: EdgeInsets.only(left: 10.w, right: 10.w, bottom: 10.h),
              child: GridView.builder(
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 7, childAspectRatio: 1.0),
                  itemCount: 7,
                  physics: const NeverScrollableScrollPhysics(),
                  itemBuilder: (BuildContext context, int index) {
                    index += 1;
                    return btnItem(index);
                  })),
        ],
      ),
    );
  }

  Widget btnItem(int index) {
    String dateStr;
    switch (index) {
      case 1:
        dateStr = '简写周一'.tr;
        break;
      case 2:
        dateStr = '简写周二'.tr;
        break;
      case 3:
        dateStr = '简写周三'.tr;
        break;
      case 4:
        dateStr = '简写周四'.tr;
        break;
      case 5:
        dateStr = '简写周五'.tr;
        break;
      case 6:
        dateStr = '简写周六'.tr;
        break;
      case 7:
        dateStr = '简写周日'.tr;
        break;
      default:
        dateStr = '';
        break;
    }
    return GestureDetector(
      onTap: () {
        setState(() {
          if (state.weekDay.value.contains(index)) {
            state.weekDay.value.remove(index);
          } else {
            state.weekDay.value.add(index);
          }
          state.weekDay.value.sort();
        });
      },
      child: Obx(() => Container(
            width: 40.w,
            height: 40.w,
            margin: EdgeInsets.all(10.w),
            decoration: BoxDecoration(
              color: state.weekDay.value.contains(index)
                  ? AppColors.mainColor
                  : Colors.white,
              border: Border.all(width: 1, color: AppColors.btnDisableColor),
              borderRadius: BorderRadius.circular(30.w),
            ),
            child: Center(
                child: Text(
              dateStr,
              style: TextStyle(
                  fontSize: 20.sp,
                  color: state.weekDay.value.contains(index)
                      ? Colors.white
                      : AppColors.darkGrayTextColor),
            )),
          )),
    );
  }

  Widget bottomWidget() {
    return Column(
      children: <Widget>[
        Container(
          color: Colors.white,
          child: Column(
            children: <Widget>[
              Obx(() => CommonItem(
                  leftTitel: '开始时间'.tr,
                  rightTitle: state.starTime.value,
                  isHaveDirection: true,
                  isHaveLine: true,
                  action: () {
                    final PDuration selectDate = PDuration.parse(DateTool().dateToDateTime(state.starTime.value, 0));
                    Pickers.showDatePicker(context,
                        selectDate: selectDate,
                        mode: DateMode.HM, onConfirm: (PDuration p) {
                      setState(() {
                        state.starTime.value =
                            DateTool().getYMDHNDateString(p, 3);
                      });
                    });
                  })),
              Obx(() => CommonItem(
                  leftTitel: '结束时间'.tr,
                  rightTitle: state.endTime.value,
                  isHaveDirection: true,
                  action: () {
                    final PDuration selectDate = PDuration.parse(DateTool().dateToDateTime(state.endTime.value, 0));
                    Pickers.showDatePicker(context,
                        selectDate: selectDate,
                        mode: DateMode.HM, onConfirm: (PDuration p) {
                      setState(() {
                        state.endTime.value =
                            DateTool().getYMDHNDateString(p, 3);
                      });
                    });
                  })),
              Container(height: 10.h),
            ],
          ),
        ),
      ],
    );
  }
}