import 'package:flutter/material.dart';
import 'package:flutter/services.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/lockDetail/electronicKey/massSendElectronicKey/massSendLockGroupList/massSendLockGroupListEntity.dart';
import 'package:star_lock/mine/mineSet/lockGroup/lockGroupList/lockGroupList_state.dart';
import 'package:star_lock/tools/left_slide/left_slide_logic.dart';
import 'package:star_lock/tools/showTipView.dart';

import '../../../../../../appRouters.dart';
import '../../../../../../app_settings/app_colors.dart';
import '../../../../../../tools/titleAppBar.dart';
import '../../../../tools/noData.dart';
import 'lockGroupList_logic.dart';

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

  @override
  State<LockGroupListPage> createState() => _LockGroupListPageState();
}

class _LockGroupListPageState extends State<LockGroupListPage> {
  final LockGroupListLogic logic = Get.put(LockGroupListLogic());
  final LockGroupListState state = Get.find<LockGroupListLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.mainBackgroundColor,
      appBar: TitleAppBar(
          barTitle: '锁分组'.tr,
          haveBack: true,
          actionsList: <Widget>[
            IconButton(
              icon: Image.asset(
                'images/icon_add_white.png',
                width: 36.w,
                height: 36.w,
              ),
              onPressed: () {
                // 处理操作按钮的点击事件-添加锁分组
                state.changeNameController.text = '';
                // showCupertinoAlertDialog(context, true, 0);
                ShowTipView().showTFViewAlertDialog(
                    state.changeNameController,
                    '创建新分组'.tr,
                    '请输入姓名'.tr, () {
                  //发送编辑钥匙名称请求
                  if (state.changeNameController.text.isNotEmpty) {
                    Navigator.of(context).pop();
                    logic.addLockGroupRequest();
                  } else {
                    logic.showToast('请输入分组名称'.tr);
                  }
                },
                    isShowSuffixIcon: true,
                    inputFormatters: <TextInputFormatter>[
                      LengthLimitingTextInputFormatter(50),
                    ]);
              },
            ),
          ],
          backgroundColor: AppColors.mainColor),
      body: Column(
        children: <Widget>[
          Expanded(
              child: Obx(() =>
                  state.itemDataList.isEmpty ? NoData() : _buildMainUI())),
        ],
      ),
    );
  }

  Widget _buildMainUI() {
    for (int i = 0; i < state.itemDataList.length; i++) {
      final GroupListItem itemData = state.itemDataList[i];
      state.lockNum += itemData.lockList!.length;
    }
    return SlidableAutoCloseBehavior(
      child: ListView.separated(
          itemCount: state.itemDataList.length + 1,
          itemBuilder: (BuildContext c, int index) {
            if (index == state.itemDataList.length) {
              return Center(
                child: Column(
                  children: <Widget>[
                    SizedBox(
                      height: 20.h,
                    ),
                    SizedBox(
                      height: 40.h,
                      child: Text(
                        '${'锁数量'.tr}：${state.lockNum.toString()}',
                        style: TextStyle(
                            color: AppColors.darkGrayTextColor, fontSize: 20.sp),
                      ),
                    )
                  ],
                ),
              );
            } else {
              final GroupListItem itemData = state.itemDataList[index];
              if (itemData.groupType == 0) {
                state.ungrouped = itemData;
              }
              if (index < state.itemDataList.length) {
                return Slidable(
                  key: ValueKey(itemData.keyGroupId),
                  endActionPane: ActionPane(
                    extentRatio: 0.4,
                    motion: const ScrollMotion(),
                    children: <Widget>[
                      _buildEditBtn(itemData),
                      _buildDeleteBtn(itemData),
                    ],
                  ),
                  child: lockDataListItem(
                      '${itemData.keyGroupName}(${itemData.lockList?.length})',
                          () {
                        Get.toNamed(Routers.lockItemListPage,
                            arguments: <String, GroupListItem>{
                              'groupListItem': itemData,
                              'ungrouped': state.ungrouped
                            });
                      }),
                );

                // return LeftSlideActions(
                //   tag: itemData.keyGroupId!.toString(),
                //   key: Key(itemData.keyGroupId!.toString()),
                //   actionsWidth: itemData.groupType != 0 ? 200.w : 0,
                //   actions: itemData.groupType != 0
                //       ? <Widget>[
                //           _buildEditBtn(itemData),
                //           _buildDeleteBtn(itemData),
                //         ]
                //       : <Widget>[],
                //   decoration: const BoxDecoration(
                //     borderRadius: BorderRadius.all(Radius.circular(1)),
                //   ),
                //   child: lockDataListItem(
                //       '${itemData.keyGroupName}(${itemData.lockList?.length})',
                //       () {
                //     Get.toNamed(Routers.lockItemListPage,
                //         arguments: <String, GroupListItem>{
                //           'groupListItem': itemData,
                //           'ungrouped': state.ungrouped
                //         });
                //   }),
                // );
              }
              return const SizedBox.shrink();
            }
          },
          separatorBuilder: (BuildContext context, int index) {
            return const Divider(
              height: 1,
              color: AppColors.greyLineColor,
            );
          }),
    );
  }

  Widget _buildDeleteBtn(GroupListItem groupListItem) {
    return GestureDetector(
      onTap: () {
        // 省略: 弹出是否删除的确认对话框。
        // showIosTipViewDialog(context, groupListItem);
        ShowTipView().showIosTipWithContentDialog('分组下的锁将被移到未分组里'.tr, () {
          logic.deleteLockGroupRequest(groupListItem.keyGroupId!);
        });
      },
      child: Container(
        width: 1.sw*0.2,
        color: const Color(0xFFF20101),
        alignment: Alignment.center,
        child: Text(
          '删除'.tr,
          style: const TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w500,
            color: Colors.white,
            height: 1,
          ),
        ),
      ),
    );
  }

  Widget _buildEditBtn(GroupListItem groupListItem) {
    return GestureDetector(
      onTap: () {
        // 编辑
        state.changeNameController.text = groupListItem.keyGroupName!;
        // showCupertinoAlertDialog(context, false,  groupListItem.keyGroupId!);

        ShowTipView().showTFViewAlertDialog(state.changeNameController,
            '修改名称'.tr, '请输入姓名'.tr, () {
          if (state.changeNameController.text.isNotEmpty) {
            Get.back();
            logic.editLockGroupRequest(groupListItem.keyGroupId!);
            final String keyGroupId = groupListItem.keyGroupId!.toString();
            if (Get.isRegistered<LeftSlideLogic>(tag: keyGroupId)) {
              Get.find<LeftSlideLogic>(tag: keyGroupId).hide();
            }
          } else {
            logic.showToast('请输入分组名称'.tr);
          }
        }, isShowSuffixIcon: true);
      },
      child: Container(
        width: 1.sw*0.2,
        color: AppColors.mainColor,
        alignment: Alignment.center,
        child: Text(
          '重命名'.tr,
          style: const TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w500,
            color: Colors.white,
            height: 1,
          ),
        ),
      ),
    );
  }

  Widget lockDataListItem(String title, Function()? action) {
    return GestureDetector(
      onTap: action,
      child: Container(
        height: 70.h,
        padding:
            EdgeInsets.only(left: 20.w, right: 10.w, top: 15.h, bottom: 15.h),
        decoration: BoxDecoration(
            color: Colors.white,
            border: Border(
              bottom: BorderSide(
                color: AppColors.greyLineColor, // 设置边框颜色
                width: 2.0.h, // 设置边框宽度
              ),
            )),
        child: Row(
          children: <Widget>[
            Expanded(child: Text(title, style: TextStyle(fontSize: 22.sp))),
            // Text(title, style: TextStyle(fontSize: 22.sp)),
          ],
        ),
      ),
    );
  }
}