import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:get/get.dart';
import 'package:star_lock/main/lockMian/lockList/lockList_state.dart';

import '../../../appRouters.dart';
import '../../../app_settings/app_colors.dart';
import '../../../common/XSConstantMacro/XSConstantMacro.dart';
import '../../../tools/appRouteObserver.dart';
import '../../../tools/dateTool.dart';
import '../entity/lockListInfo_entity.dart';
import 'lockListGroup_view.dart';
import 'lockList_logic.dart';

class LockListXHJPage extends StatefulWidget {
  const LockListXHJPage({required this.lockListInfoGroupEntity, Key? key})
      : super(key: key);
  final LockListInfoGroupEntity lockListInfoGroupEntity;

  @override
  State<LockListXHJPage> createState() => _LockListXHJPageState();
}

class _LockListXHJPageState extends State<LockListXHJPage> with RouteAware {
  late LockListLogic logic;
  late LockListState state;

  @override
  void initState() {
    super.initState();
    logic = Get.put(LockListLogic(widget.lockListInfoGroupEntity));
    state = Get.find<LockListLogic>().state;
  }

  @override
  Widget build(BuildContext context) {
    return GetBuilder<LockListLogic>(builder: (LockListLogic logic) {
      return SafeArea(
        bottom: false,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Align(
              alignment: Alignment.topRight,
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  IconButton(
                      onPressed: () {
                        state.showSearch.value = !state.showSearch.value;
                      },
                      icon: Icon(
                        Icons.search,
                        size: 32.w,
                        color: AppColors.blackColor,
                      )),
                  IconButton(
                      onPressed: () {
                        Get.toNamed(Routers.selectLockTypePage);
                      },
                      icon: Icon(
                        Icons.add_circle,
                        size: 48.w,
                        color: AppColors.mainColor,
                      )),
                ],
              ),
            ),
            //椭圆形 输入框
            Obx(() {
              return state.showSearch.value
                  ? Container(
                      height: 50.w,
                      decoration: BoxDecoration(
                        color: Colors.white.withOpacity(0.8),
                        borderRadius: BorderRadius.circular(40.w),
                      ),
                      margin: EdgeInsets.only(
                          left: 25.w, right: 25.w, bottom: 20.h),
                      child: Stack(
                        children: <Widget>[
                          Padding(
                            padding: EdgeInsets.only(top: 14.h, left: 20.w),
                            child: Icon(
                              Icons.search,
                              size: 28.w,
                              color: AppColors.blackColor,
                            ),
                          ),
                          TextField(
                            decoration: InputDecoration(
                              hintText: '搜索'.tr,
                              hintStyle: TextStyle(
                                fontSize: 24.sp,
                                color: AppColors.blackColor,
                              ),
                              border: InputBorder.none,
                              contentPadding: EdgeInsets.only(
                                top: 6.h,
                                left: 50.w,
                              ),
                              isCollapsed: true,
                            ),
                            onChanged: (String value) {
                              state.searchStr.value = value;
                            },
                            autofocus: true,
                          ),
                        ],
                      ),
                    )
                  : const SizedBox.shrink();
            }),
            Padding(
              padding: EdgeInsets.only(left: 45.w),
              child: Text(
                '常用程序'.tr,
                style: TextStyle(
                  fontSize: 32.sp,
                  color: AppColors.blackColor,
                  fontWeight: FontWeight.w600,
                ),
              ),
            ),
            Expanded(
              child: Obx(() {
                // AppLog.log('logic.groupDataList[0].lockList!.length:${logic.groupDataList[0].lockList!.length}');
                return ListView.builder(
                  itemCount: logic.groupDataList.length ?? 0,
                  itemBuilder: (BuildContext context, int index) {
                    final GroupList itemData = logic.groupDataList[index];
                    return _buildLockExpandedList(context, index, itemData);
                  },
                  shrinkWrap: true,
                  physics: const AlwaysScrollableScrollPhysics(),
                );
              }),
            ),
          ],
        ),
      );
    });
  }

  //设备多层级列表
  Widget _buildLockExpandedList(
      BuildContext context, int index, GroupList itemData) {
    final List<LockListInfoItemEntity> lockItemList =
        itemData.lockList ?? <LockListInfoItemEntity>[];
    // AppLog.log('lockItemList[0].lockAlias:${lockItemList[0].lockAlias}');
    final List<Widget> list = forItems(lockItemList);
    return LockListGroupView(
        onTap: () {
          setState(() {});
        },
        textStyle: TextStyle(fontSize: 28.sp, fontWeight: FontWeight.w600),
        backgroundColor: Colors.transparent,
        typeImgList: const <dynamic>[],
        groupItem: itemData,
        child: GridView.builder(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
            crossAxisCount: 2,
            crossAxisSpacing: 15.w,
            mainAxisSpacing: 15.h,
            childAspectRatio: 0.95,
          ),
          padding: EdgeInsets.symmetric(vertical: 15.h, horizontal: 15.w),
          shrinkWrap: true,
          physics: const NeverScrollableScrollPhysics(),
          itemBuilder: (BuildContext context, int index) {
            return list[index];
          },
          itemCount: list.length,
        ));
  }

  List<Widget> forItems(List<LockListInfoItemEntity> lockItemList) {
    final List<Widget> list = <Widget>[];
    for (int i = 0, j = 0; i < lockItemList.length; i++, j++) {
      final LockListInfoItemEntity keyInfo = lockItemList[i];
      bool isLast = false;
      if (lockItemList.length == i + 1) {
        isLast = true;
      }
      list.add(Slidable(
        key: ValueKey<String?>('${keyInfo.keyId}_${keyInfo.updateDate}'),
        endActionPane: ActionPane(
          extentRatio: 0.5,
          motion: const ScrollMotion(),
          children: <Widget>[
            SlidableAction(
              onPressed: (BuildContext context) {
                state.lockListInfoItemEntity = keyInfo;
                logic.deleyLockLogicOfRoles();
              },
              backgroundColor: Colors.red,
              foregroundColor: Colors.white,
              label: '删除'.tr,
              borderRadius: BorderRadius.all(Radius.circular(20.w)),
              padding: EdgeInsets.only(left: 5.w, right: 5.w),
            ),
          ],
        ),
        child: lockInfoListItem(keyInfo, isLast, () {
          if ((keyInfo.keyType == XSConstantMacro.keyTypeTime ||
                  keyInfo.keyType == XSConstantMacro.keyTypeLoop) &&
              (keyInfo.keyStatus == XSConstantMacro.keyStatusWaitIneffective)) {
            logic.showToast('您的钥匙未生效'.tr);
            return;
          }
          if ((keyInfo.keyType == XSConstantMacro.keyTypeTime ||
                  keyInfo.keyType == XSConstantMacro.keyTypeLong ||
                  keyInfo.keyType == XSConstantMacro.keyTypeLoop) &&
              (keyInfo.keyStatus == XSConstantMacro.keyStatusFrozen)) {
            logic.showToast('您的钥匙已冻结'.tr);
            return;
          }
          if ((keyInfo.keyType == XSConstantMacro.keyTypeTime ||
                  keyInfo.keyType == XSConstantMacro.keyTypeLoop) &&
              (keyInfo.keyStatus == XSConstantMacro.keyStatusExpired)) {
            logic.showToast('您的钥匙已过期'.tr);
            return;
          }
          Get.toNamed(Routers.lockDetailMainPage, arguments: <String, Object>{
            'keyInfo': keyInfo,
            'isOnlyOneData': false,
          });
        }),
      ));
    }
    return list;
  }

  Widget lockInfoListItem(
      LockListInfoItemEntity keyInfo, bool isLast, Function() action) {
    return _xhjLockInfoListItem(keyInfo, isLast, action);
  }

  Widget _xhjLockInfoListItem(
      LockListInfoItemEntity keyInfo, bool isLast, Function() action) {
    final String lockAlias = keyInfo.lockAlias!;
    final TextStyle lockAliasTextStyle = TextStyle(
      fontSize: 25.sp,
      fontWeight: FontWeight.w500,
      color: keyInfo.passageMode == 1
          ? AppColors.openPassageModeColor
          : AppColors.darkGrayTextColor,
      overflow: TextOverflow.ellipsis,
    );
    final List<String> useKeyTypeListStr = logic.getUseKeyTypeListStr(
        keyInfo.startDate, keyInfo.endDate, keyInfo.keyType);
    final bool isThree = useKeyTypeListStr.length == 3;
    final bool isOne = useKeyTypeListStr.length == 1;

    return GestureDetector(
      onTap: action,
      child: Container(
        decoration: BoxDecoration(
          color: (((keyInfo.keyType == XSConstantMacro.keyTypeTime ||
                          keyInfo.keyType == XSConstantMacro.keyTypeLoop) &&
                      (keyInfo.keyStatus ==
                              XSConstantMacro.keyStatusWaitIneffective ||
                          keyInfo.keyStatus ==
                              XSConstantMacro.keyStatusFrozen ||
                          keyInfo.keyStatus ==
                              XSConstantMacro.keyStatusExpired)) ||
                  (keyInfo.keyType == XSConstantMacro.keyTypeLong &&
                      keyInfo.keyStatus == XSConstantMacro.keyStatusFrozen))
              ? AppColors.greyBackgroundColor
              : Colors.white.withOpacity(0.8),
          borderRadius: BorderRadius.circular(20.w),
        ),
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 15.w, vertical: 5.h),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Image.asset(
                    'images/icon_lock_circle.png',
                    width: 48.r,
                    height: 48.r,
                    color: AppColors.mainColor,
                  ),
                  const Spacer(),
                  Column(
                    children: <Widget>[
                      SizedBox(
                        width: (1.sw - 10.w * 3) / 2 - 48.w - 50.w,
                        child: Row(
                          children: <Widget>[
                            Spacer(),
                            Image.asset(
                              logic.showElectricIcon(keyInfo.electricQuantity!),
                              width: 30.w,
                              height: 24.w,
                            ),
                            SizedBox(width: 2.w),
                            Text(
                              '${keyInfo.electricQuantity!}%',
                              style: TextStyle(
                                  fontSize: 16.sp,
                                  color: AppColors.darkGrayTextColor),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        width: (1.sw - 10.w * 3) / 2 - 48.w - 50.w,
                        child: Text(
                          keyInfo.isLockOwner == 1
                              ? '超级管理员'.tr
                              : (keyInfo.keyRight == 1
                                  ? '授权管理员'.tr
                                  : '普通用户'.tr),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                          textAlign: TextAlign.right,
                          style: TextStyle(
                              fontSize: 16.sp,
                              color: AppColors.darkGrayTextColor),
                        ),
                      )
                    ],
                  ),
                ],
              ),
              SizedBox(
                height: 8.h,
              ),
              Text(
                lockAlias,
                style: lockAliasTextStyle,
                maxLines: 2,
              ),
              Visibility(
                  visible: keyInfo.passageMode == 1,
                  child: Container(
                    padding: EdgeInsets.only(
                        top: 2.h, right: 3.w, left: 3.w, bottom: 1.h),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(5.w),
                      color: AppColors.openPassageModeColor,
                    ),
                    child: Text('常开模式开启'.tr,
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: TextStyle(
                            fontSize: 18.sp, color: AppColors.appBarIconColor)),
                  )),
              if (keyInfo.passageMode == 1)
                SizedBox(
                  height: 5.h,
                ),
              Visibility(
                  visible: keyInfo.lockSetting!.remoteUnlock == 1,
                  child: Row(
                    children: <Widget>[
                      Flexible(
                        child: Container(
                          padding: EdgeInsets.only(
                              top: 2.h, right: 3.w, left: 3.w, bottom: 1.h),
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(5.w),
                            color: AppColors.mainColor,
                          ),
                          child: Text(
                            '远程开锁'.tr,
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style:
                                TextStyle(fontSize: 18.sp, color: Colors.white),
                          ),
                        ),
                      ),
                    ],
                  )),
              Visibility(
                  visible: logic.getShowType(keyInfo),
                  child: Flexible(
                    child: Padding(
                      padding: EdgeInsets.only(top: 5.h),
                      child: Container(
                        padding: EdgeInsets.only(right: 5.w, left: 5.w),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.circular(5.w),
                          color:
                              DateTool().compareTimeIsOvertime(keyInfo.endDate!)
                                  ? AppColors.listTimeYellowColor
                                  : AppColors.mainColor,
                        ),
                        child: Text(logic.getKeyEffective(keyInfo),
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style:
                                TextStyle(fontSize: 18.sp, color: Colors.white)
                            // child: Text(logic.compareTimeIsOvertime(keyInfo.endDate!) ? "已过期" : "余${logic.compareTimeGetDaysFromNow(keyInfo.endDate!)}天", style: TextStyle(fontSize: 18.sp, color: Colors.white)
                            ),
                      ),
                    ),
                  )),
              SizedBox(height: 5.h),
              if (isThree)
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text(
                      Characters(useKeyTypeListStr[0]).join('\u{200B}'),
                      style: TextStyle(
                          fontSize: 16.sp, color: AppColors.darkGrayTextColor),
                    ),
                    Row(
                      children: <Widget>[
                        Text(
                          Characters(useKeyTypeListStr[1]).join('\u{200B}'),
                          style: TextStyle(
                              fontSize: 16.sp,
                              color: AppColors.darkGrayTextColor),
                        ),
                        SizedBox(width: 5.w),
                        Expanded(
                          child: Text(
                            useKeyTypeListStr[2],
                            maxLines: 1,
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                                fontSize: 16.sp,
                                color: AppColors.darkGrayTextColor),
                          ),
                        ),
                      ],
                    ),
                  ],
                )
              else if (isOne)
                Text(
                  useKeyTypeListStr[0],
                  style: TextStyle(
                      fontSize: 16.sp, color: AppColors.darkGrayTextColor),
                ),
            ],
          ),
        ),
      ),
    );
  }

  @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();

    // BlueManage().stopScan();
    state.ifCurrentScreen.value = false;
  }

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

  /// 进入下级界面 当前界面即将消失
  @override
  void didPushNext() {
    super.didPushNext();
    logic.cancelBlueConnetctToastTimer();

    // BlueManage().stopScan();
    state.ifCurrentScreen.value = false;
  }
}