app-starlock/star_lock/lib/main/lockDetail/electronicKey/electronicKeyPeriodValidity/electronicKeyPeriodValidity_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_lock/main/lockDetail/electronicKey/electronicKeyPeriodValidity/KeyPeriodValidityModel.dart';
import 'package:star_lock/main/lockDetail/electronicKey/electronicKeyPeriodValidity/electronicKeyPeriodValidity_logic.dart';
import 'package:star_lock/tools/dateUtils.dart';
import 'package:star_lock/tools/pickers/pickers.dart';
import 'package:star_lock/tools/pickers/time_picker/model/date_mode.dart';

import '../../../../app_settings/app_colors.dart';
import '../../../../tools/commonItem.dart';
import '../../../../tools/submitBtn.dart';
import '../../../../tools/titleAppBar.dart';
import '../../../../translations/trans_lib.dart';

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

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

class _ElectronicKeyPeriodValidityPageState
    extends State<ElectronicKeyPeriodValidityPage> {
  final logic = Get.put(ElectronicKeyPeriodValidityLogic());
  final state = Get.find<ElectronicKeyPeriodValidityLogic>().state;
  @override
  void initState() {
    super.initState();

    for (var i = 0; i < state.validityTextList.value.length; i++) {
      int validityValue = 0;
      if (i == 0) {
        validityValue = 7;
      } else {
        validityValue = i;
      }
      KeyPeriodValidityModel model = KeyPeriodValidityModel(
          state.validityTextList.value[i], i, false, validityValue);
      state.validityDataList.value.add(model);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: AppColors.mainBackgroundColor,
        appBar: TitleAppBar(
            barTitle: TranslationLoader.lanKeys!.periodValidity!.tr,
            haveBack: true,
            backgroundColor: AppColors.mainColor),
        body: ListView(
          children: [
            effectiveDateWidget(),
            SizedBox(
              height: 10.h,
            ),
            topWidget(),
            SizedBox(
              height: 10.h,
            ),
            effectiveTimeWidget(),
            bottomWidget()
          ],
        ));
  }

  Widget topWidget() {
    return Container(
      height: 160.h,
      width: 1.sw,
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
              height: 60.h,
              // color: Colors.red,
              padding: EdgeInsets.only(left: 15.h, top: 15.h),
              child: Text(TranslationLoader.lanKeys!.periodValidity!.tr,
                  style:
                      TextStyle(fontSize: 24.sp, fontWeight: FontWeight.w600))),
          SizedBox(
              height: 90.h,
              child: GridView.builder(
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 7, childAspectRatio: 1.0),
                  itemCount: 7,
                  physics: const NeverScrollableScrollPhysics(),
                  itemBuilder: (context, index) {
                    KeyPeriodValidityModel model =
                        state.validityDataList.value[index];
                    return btnItem(model);
                  })),
          Container(
            color: Colors.white,
            height: 10.h,
          ),
        ],
      ),
    );
  }

  Widget btnItem(KeyPeriodValidityModel model) {
    return Obx(() => GestureDetector(
          onTap: () {
            model.isValidity = !model.isValidity;
            if (model.isValidity) {
              state.selectIndexList.value.add(model.validityValue);
            } else {
              state.selectIndexList.value.remove(model.validityValue);
            }

            setState(() {});
          },
          child: Container(
            width: 40.w,
            height: 40.w,
            margin: EdgeInsets.all(10.w),
            decoration: BoxDecoration(
              color: state.selectIndexList.value.contains(model.validityValue)
                  ? Colors.blue
                  : Colors.white,
              border:
                  Border.all(width: 1, color: AppColors.greyBackgroundColor),
              borderRadius: BorderRadius.circular(30.w),
            ),
            child: Center(
                child: Text(
              model.validityText,
              style: TextStyle(
                  fontSize: 20.sp,
                  color:
                      state.selectIndexList.value.contains(model.validityValue)
                          ? Colors.white
                          : AppColors.darkGrayTextColor),
            )),
          ),
        ));
  }

  //生效日期
  Widget effectiveDateWidget() {
    return Column(
      children: [
        Obx(() => CommonItem(
            leftTitel: TranslationLoader.lanKeys!.effectiveDate!.tr,
            rightTitle: state.selectEffectiveDate.value,
            isHaveDirection: true,
            isHaveLine: true,
            action: () {
              Pickers.showDatePicker(context, mode: DateMode.YMD,
                  onConfirm: (p) {
                state.isHaveEffectiveDate.value = true;
                state.effectiveDate.value = XSDateUtils.parseDateTime(
                    '${p.year}-${p.month!}-${p.day!}', 'yyyy-MM-dd');
                state.selectEffectiveDate.value = XSDateUtils.formatDateTime(
                    state.effectiveDate.value, 'yyyy-MM-dd');
              });
            })),
        Obx(() => CommonItem(
            leftTitel: TranslationLoader.lanKeys!.failureDate!.tr,
            rightTitle: state.selectFailureDate.value,
            isHaveDirection: true,
            action: () {
              Pickers.showDatePicker(context, mode: DateMode.YMD,
                  onConfirm: (p) {
                state.isHaveFailureDate.value = true;
                state.failureDate.value = XSDateUtils.parseDateTime(
                    '${p.year}-${p.month!}-${p.day!}', 'yyyy-MM-dd');
                state.selectFailureDate.value = XSDateUtils.formatDateTime(
                    state.failureDate.value, 'yyyy-MM-dd');
              });
            })),
      ],
    );
  }

  //生效时间
  Widget effectiveTimeWidget() {
    return Column(
      children: [
        Obx(() => CommonItem(
            leftTitel: TranslationLoader.lanKeys!.effectiveTime!.tr,
            rightTitle: state.selectEffectiveTime.value,
            isHaveDirection: true,
            isHaveLine: true,
            action: () {
              Pickers.showDatePicker(context, mode: DateMode.HM,
                  onConfirm: (p) {
                state.isHaveEffectiveTime.value = true;
                state.effectiveTime.value = XSDateUtils.parseDateTime(
                    '${p.hour!}:${p.minute!}', 'HH:mm');
                state.selectEffectiveTime.value = XSDateUtils.formatDateTime(
                    state.effectiveTime.value, 'HH:mm');
              });
            })),
        Obx(() => CommonItem(
            leftTitel: TranslationLoader.lanKeys!.failureTime!.tr,
            rightTitle: state.selectFailureTime.value,
            isHaveDirection: true,
            action: () {
              Pickers.showDatePicker(context, mode: DateMode.HM,
                  onConfirm: (p) {
                state.isHaveFailureTime.value = true;
                state.failureTime.value = XSDateUtils.parseDateTime(
                    '${p.hour!}:${p.minute!}', 'HH:mm');
                state.selectFailureTime.value = XSDateUtils.formatDateTime(
                    state.failureTime.value, 'HH:mm');
              });
            })),
      ],
    );
  }

  Widget bottomWidget() {
    return Column(
      children: [
        Container(height: 40.h),
        Obx(() => SubmitBtn(
            btnName: TranslationLoader.lanKeys!.sure!.tr,
            borderRadius: 20.w,
            margin: EdgeInsets.only(left: 30.w, right: 30.w, top: 30.w),
            padding: EdgeInsets.only(top: 25.w, bottom: 25.w),
            isDisabled: (state.selectIndexList.value.isNotEmpty &&
                    state.isHaveEffectiveDate.value == true &&
                    state.isHaveFailureDate.value == true &&
                    state.isHaveEffectiveTime.value == true &&
                    state.isHaveFailureTime.value == true)
                ? true
                : false,
            onClick: () {
              if ((state.selectIndexList.value.isNotEmpty &&
                  state.isHaveEffectiveDate.value == true &&
                  state.isHaveFailureDate.value == true)) {
                DateTime startDateTime = DateTime(
                    state.effectiveDate.value.year,
                    state.effectiveDate.value.month,
                    state.effectiveDate.value.day,
                    state.effectiveDate.value.hour,
                    state.effectiveDate.value.minute);
                DateTime endDateTime = DateTime(
                    state.failureDate.value.year,
                    state.failureDate.value.month,
                    state.failureDate.value.day,
                    state.failureDate.value.hour,
                    state.failureDate.value.minute);
                //时间判断
                if (!startDateTime.isBefore(endDateTime) ||
                    startDateTime.isAtSameMomentAs(endDateTime)) {
                  logic.showToast("失效时间需大于生效时间");
                } else {
                  Map<String, dynamic> resultMap = {};
                  resultMap['validityValue'] = state.selectIndexList.value;
                  resultMap['starDate'] = state.effectiveDate.value;
                  resultMap['endDate'] = state.failureDate.value;
                  resultMap['starTime'] = state.effectiveTime.value;
                  resultMap['endTime'] = state.failureTime.value;
                  Navigator.pop(context, resultMap);
                }
              }
            })),
      ],
    );
  }
}