import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_lock/main/lockDetail/lockSet/automaticBlocking/automaticBlocking_state.dart';
import 'package:star_lock/tools/storage.dart';

import '../../../../app_settings/app_colors.dart';
import '../../../../tools/appRouteObserver.dart';
import '../../../../tools/commonItem.dart';
import '../../../../tools/showBottomSheetTool.dart';
import '../../../../tools/showTipView.dart';
import '../../../../tools/titleAppBar.dart';
import 'automaticBlocking_logic.dart';

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

  @override
  State<AutomaticBlockingPage> createState() => _AutomaticBlockingPageState();
}

class _AutomaticBlockingPageState extends State<AutomaticBlockingPage>
    with RouteAware {
  final AutomaticBlockingLogic logic = Get.put(AutomaticBlockingLogic());
  final AutomaticBlockingState state = Get.find<AutomaticBlockingLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: AppColors.mainBackgroundColor,
        appBar: TitleAppBar(
            barTitle: '自动闭锁'.tr,
            haveBack: true,
            actionsList: <Widget>[
              Obx(() => TextButton(
                    onPressed: state.canNext.value == false
                        ? null
                        : () {
                            if (state.isOpen.value == false) {
                              ShowTipView().showIosTipWithContentDialog(
                                  '关闭后，智能锁将设置为全天常开模式，直到手动关闭'.tr,
                                  logic.sendAutoLock);
                            } else {
                              logic.sendAutoLock();
                            }
                          },
                    child: Text(
                      state.canNext.value == false
                          ? ''
                          : '保存'.tr,
                      style: TextStyle(color: Colors.white, fontSize: 24.sp),
                    ),
                  )),
            ],
            backgroundColor: AppColors.mainColor),
        body: ListView(
          children: <Widget>[
            Obx(
              () => CommonItem(
                  leftTitel: '自动闭锁'.tr,
                  isHaveLine: false,
                  isHaveRightWidget: true,
                  rightWidget:
                      SizedBox(width: 60.w, height: 50.h, child: _switch())),
            ),
            Visibility(
              visible: state.isOpen.value == true,
              child: Column(
                children: <Widget>[
                  Container(
                    height: 10.h,
                  ),
                  Builder(builder: (BuildContext context) {
                    return Obx(() => CommonItem(
                        leftTitel: '延迟时间'.tr,
                        rightTitle: state.isCustomLockTime.value == true
                            ? '自定义'.tr
                            : (state.autoLockTime.value.isNotEmpty &&
                                    state.autoLockTime.value != '0')
                                ? '${state.autoLockTime}s'
                                : '',
                        isHaveLine: false,
                        isHaveDirection: true,
                        action: () {
                          if (state.isJustForShow.value == true) {
                            return;
                          }
                          final List<String> list = <String>[
                            '5S',
                            '10S',
                            '15S',
                            '30S',
                            '60S',
                            '自定义'.tr
                          ];
                          ShowBottomSheetTool().showSingleRowPicker(
                              //上下文
                              context,
                              //默认的索引
                              normalIndex: 0,
                              title: '时间'.tr,
                              cancelTitle:'取消'.tr,
                              sureTitle: '确定'.tr,
                              //要显示的列表
                              data: list,
                              //选择事件的回调
                              clickCallBack: (int index, Object str) {
                            if (index != 5) {
                              str = str.toString().substring(0, str.toString().length - 1);
                              state.isCustomLockTime.value = false;
                              state.autoLockTime.value = str.toString();
                              Storage.saveAutomaticLockOffTime(str.toString());
                            } else {
                              state.isCustomLockTime.value = true;
                            }
                            logic.ifCanNext();
                          });
                        }));
                  }),
                  Container(height: 10.h),
                  Obx(() => Visibility(
                      visible: state.isCustomLockTime.value,
                      child: Container(
                        color: Colors.white,
                        padding: EdgeInsets.only(
                            left: 20.w, top: 10.w, right: 20.w, bottom: 10.w),
                        child: Column(
                          children: <Widget>[
                            Row(
                              children: <Widget>[
                                Text(
                                  '时间'.tr,
                                  style: TextStyle(fontSize: 24.sp),
                                ),
                              ],
                            ),
                            Obx(() => TextField(
                                  //输入框一行
                                  maxLines: 1,
                                  controller: state.timeController,
                                  keyboardType: TextInputType.number,
                                  autofocus: false,
                                  readOnly: state.isJustForShow.value == true,
                                  onChanged: (String value) {
                                    state.autoLockTime.value = value;
                                    logic.ifCanNext();
                                  },
                                  inputFormatters: <TextInputFormatter>[
                                    FilteringTextInputFormatter.allow(RegExp('[0-9]')),
                                  ],
                                  decoration: InputDecoration(
                                    //输入里面输入文字内边距设置
                                    contentPadding: const EdgeInsets.only(
                                        top: 12.0, bottom: 8.0),
                                    hintText: '请输入时间(秒)'.tr,
                                    hintStyle: TextStyle(fontSize: 24.sp),
                                    //不需要输入框下划线
                                    border: InputBorder.none,
                                  ),
                                )),
                            Container(
                              height: 0.5.h,
                              color: Colors.grey,
                            ),
                          ],
                        ),
                      ))),
                ],
              ),
            ),
            Container(
              padding: EdgeInsets.all(30.w),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                children: <Widget>[
                  Expanded(child: Text(
                  '经过以上设定的时间，锁会自动关闭。开启或修改设置后，请先开一次锁，使时间生效。'.tr,
                    style: TextStyle(fontSize: 20.sp),
                  )),
                ],
              ),
            )
          ],
        ));
  }

  CupertinoSwitch _switch() {
    return CupertinoSwitch(
      activeColor: CupertinoColors.activeBlue,
      trackColor: CupertinoColors.systemGrey5,
      thumbColor: CupertinoColors.white,
      value: state.isOpen.value,
      onChanged: state.isJustForShow.value == true
          ? null
          : (bool value) {
              setState(() {
                state.isOpen.value = value;
                logic.ifCanNext();
              });
            },
    );
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();

    /// 路由订阅
    AppRouteObserver().routeObserver.subscribe(this, ModalRoute.of(context)!);
  }

  @override
  void dispose() {
    /// 取消路由订阅
    AppRouteObserver().routeObserver.unsubscribe(this);
    super.dispose();
  }

  /// 从上级界面进入 当前界面即将出现
  @override
  void didPush() {
    super.didPush();
    state.ifCurrentScreen.value = true;
  }

  /// 返回上一个界面 当前界面即将消失
  @override
  void didPop() {
    super.didPop();
    logic.cancelBlueConnetctToastTimer();
    if (EasyLoading.isShow) {
      EasyLoading.dismiss(animation: true);
    }
    state.ifCurrentScreen.value = false;
    state.sureBtnState.value = 0;
  }

  /// 从下级返回 当前界面即将出现
  @override
  void didPopNext() {
    super.didPopNext();
    state.ifCurrentScreen.value = true;
  }

  /// 进入下级界面 当前界面即将消失
  @override
  void didPushNext() {
    super.didPushNext();
    logic.cancelBlueConnetctToastTimer();
    if (EasyLoading.isShow) {
      EasyLoading.dismiss(animation: true);
    }
    state.ifCurrentScreen.value = false;
    state.sureBtnState.value = 0;
  }
}