1，新增TimeLine

2，完善门锁日志页面
2024-01-18 11:24:12 +08:00 · 2024-01-18 11:24:12 +08:00 · c82b3493ca
commit c82b3493ca
parent e93f8624cf
4 changed files with 136 additions and 281 deletions
--- a/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_logic.dart
+++ b/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_logic.dart
@ -244,9 +244,9 @@ class DoorLockLogLogic extends BaseGetXController {
    // 获取是否是演示模式 演示模式不获取接口
    var isDemoMode = await Storage.getBool(ifIsDemoModeOrNot);
    if (isDemoMode == false) {
-      _initReplySubscription();
+      // _initReplySubscription();

-      mockNetworkDataRequest();
+      // mockNetworkDataRequest();
    }
  }

@ -259,7 +259,7 @@ class DoorLockLogLogic extends BaseGetXController {
    // 获取是否是演示模式 演示模式不获取接口
    var isDemoMode = await Storage.getBool(ifIsDemoModeOrNot);
    if (isDemoMode == false) {
-      getLockRecordLastUploadDataTime();
+      // getLockRecordLastUploadDataTime();
      // senderReferEventRecordTime();
      // senderReferEventRecordNumber();
    }
--- a/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_page.dart
+++ b/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_page.dart
@ -1,11 +1,9 @@
-import 'package:cupertino_stepper/cupertino_stepper.dart';
-import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_advanced_calendar/flutter_advanced_calendar.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:get/get.dart';
-import 'package:gzx_dropdown_menu/gzx_dropdown_menu.dart';
 import 'package:star_lock/main/lockDetail/doorLockLog/doorLockLog_logic.dart';
+import 'package:timelines/timelines.dart';

 import '../../../app_settings/app_colors.dart';
 import '../../../tools/storage.dart';
@ -56,270 +54,143 @@ class _DoorLockLogPageState extends State<DoorLockLogPage> {
          ),
        ],
      ),
-      body: SingleChildScrollView(
-        child: Column(
-          mainAxisSize: MainAxisSize.max,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            Theme(
-              data: theme.copyWith(
-                textTheme: theme.textTheme.copyWith(
-                  titleMedium: theme.textTheme.titleMedium!.copyWith(
-                    fontSize: 16,
-                    color: theme.colorScheme.secondary,
-                  ),
-                  bodyLarge: theme.textTheme.bodyLarge!.copyWith(
-                    fontSize: 14,
-                    color: Colors.black54,
-                  ),
-                  bodyMedium: theme.textTheme.bodyMedium!.copyWith(
-                    fontSize: 12,
-                    color: Colors.black87,
-                  ),
+      body: Column(
+        mainAxisSize: MainAxisSize.max,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Theme(
+            data: theme.copyWith(
+              textTheme: theme.textTheme.copyWith(
+                titleMedium: theme.textTheme.titleMedium!.copyWith(
+                  fontSize: 16,
+                  color: theme.colorScheme.secondary,
                ),
-                primaryColor: AppColors.mainColor,
-                highlightColor: Colors.yellow,
-                disabledColor: Colors.green,
-              ),
-              child: AdvancedCalendar(
-                controller: state.calendarControllerCustom,
-                events: state.events,
-                weekLineHeight: 48.0,
-                startWeekDay: 1,
-                innerDot: true,
-                keepLineSize: true,
-                calendarTextStyle: const TextStyle(
-                  fontSize: 18,
-                  fontWeight: FontWeight.w400,
-                  height: 1.3125,
-                  letterSpacing: 0,
+                bodyLarge: theme.textTheme.bodyLarge!.copyWith(
+                  fontSize: 14,
+                  color: Colors.black54,
+                ),
+                bodyMedium: theme.textTheme.bodyMedium!.copyWith(
+                  fontSize: 12,
+                  color: Colors.black87,
                ),
              ),
+              primaryColor: AppColors.mainColor,
+              highlightColor: Colors.yellow,
+              disabledColor: Colors.green,
            ),
-            Stack(
-              key: state.stackKey,
-              children: <Widget>[
-                Column(
-                  children: <Widget>[
-                    _buildHeaderView(),
-                  ],
-                ),
-                // 下拉菜单，注意GZXDropDownMenu目前只能在Stack内，后续有时间会改进，以及支持CustomScrollView和NestedScrollView
-                _buildDropDownMenu()
-              ],
+            child: AdvancedCalendar(
+              controller: state.calendarControllerCustom,
+              events: state.events,
+              weekLineHeight: 48.0,
+              startWeekDay: 1,
+              innerDot: true,
+              keepLineSize: true,
+              calendarTextStyle: const TextStyle(
+                fontSize: 18,
+                fontWeight: FontWeight.w400,
+                height: 1.3125,
+                letterSpacing: 0,
+              ),
            ),
-            OrientationBuilder(
-              builder: (BuildContext context, Orientation orientation) {
-                switch (orientation) {
-                  case Orientation.portrait:
-                    return _buildStepper(StepperType.vertical);
-                  case Orientation.landscape:
-                    return _buildStepper(StepperType.horizontal);
-                  default:
-                    throw UnimplementedError(orientation.toString());
-                }
-              },
+          ),
+          Row(children: [
+            SizedBox(
+              width: 30.w,
            ),
-          ],
-        ),
-      ),
-    );
-  }
-
-//下拉头部控件GZXDropDownHeader
-  Widget _buildHeaderView() {
-    return GZXDropDownHeader(
-      // 下拉的头部项，目前每一项，只能自定义显示的文字、图标、图标大小修改
-      items: [
-        GZXDropDownHeaderItem(state.dropDownDoorLockItem[0], iconSize: 36),
-      ],
-      // GZXDropDownHeader对应第一父级Stack的key
-      stackKey: state.stackKey,
-      // controller用于控制menu的显示或隐藏
-      controller: state.dropdownMenuController,
-      // 当点击头部项的事件，在这里可以进行页面跳转或openEndDrawer
-      onItemTap: (index) {},
-      // 头部的高度
-      height: 46,
-      // 头部背景颜色
-      color: Colors.white,
-      // 文字样式
-      style: TextStyle(
-          color: AppColors.darkGrayTextColor, fontSize: ScreenUtil().setSp(24)),
-      // 下拉时文字样式
-      dropDownStyle: TextStyle(
-        fontSize: ScreenUtil().setSp(24),
-        color: AppColors.darkGrayTextColor,
-      ),
-      // 图标大小
-      iconSize: 20,
-      // 图标颜色
-      iconColor: AppColors.greyBackgroundColor,
-      // 下拉时图标颜色
-      iconDropDownColor: AppColors.mainColor,
-    );
-  }
-
-  //下拉菜单
-  Widget _buildDropDownMenu() {
-    return Obx(() => GZXDropDownMenu(
-          // controller用于控制menu的显示或隐藏
-          controller: state.dropdownMenuController,
-          // 下拉菜单显示或隐藏动画时长
-          animationMilliseconds: 300,
-          // 下拉后遮罩颜色
-//          maskColor: Theme.of(context).primaryColor.withOpacity(0.5),
-//          maskColor: Colors.red.withOpacity(0.5),
-          dropdownMenuChanging: (isShow, index) {},
-          dropdownMenuChanged: (isShow, index) {},
-          // 下拉菜单，高度自定义，你想显示什么就显示什么，完全由你决定，你只需要在选择后调用_dropdownMenuController.hide();即可
-          menus: [
-            GZXDropdownMenuBuilder(
-                dropDownHeight: 44.0.h * state.eventSortConditions.value.length,
-                dropDownWidget: _buildConditionListWidget(
-                    state.eventSortConditions.value, (value) {
-                  state.selectGroupSortCondition = value;
-                  state.dropDownDoorLockItem[0] =
-                      state.selectGroupSortCondition.name;
-                })),
-          ],
-        ));
-  }
-
-  _buildConditionListWidget(
-      items, void Function(SortCondition sortCondition) itemOnTap) {
-    return Container(
-      color: Colors.white,
-      child: ListView.separated(
-        physics: const NeverScrollableScrollPhysics(),
-        shrinkWrap: true,
-        scrollDirection: Axis.vertical,
-        itemCount: items.length,
-        // item 的个数
-        separatorBuilder: (BuildContext context, int index) =>
-            const Divider(height: 1.0),
-        // 添加分割线
-        itemBuilder: (BuildContext context, int index) {
-          return gestureDetector(items, index, itemOnTap, context);
-        },
-      ),
-    );
-  }
-
-  GestureDetector gestureDetector(
-      items,
-      int index,
-      void Function(SortCondition sortCondition) itemOnTap,
-      BuildContext context) {
-    SortCondition goodsSortCondition = items[index];
-    return GestureDetector(
-        onTap: () {
-          for (var value in items) {
-            value.isSelected = false;
-          }
-          goodsSortCondition.isSelected = true;
-
-          itemOnTap(goodsSortCondition);
-        },
-        child: SizedBox(
-          height: 44.h,
-          child: Center(
-            child: Obx(() => Text(
-                  goodsSortCondition.name,
-                  style: TextStyle(
-                    color: goodsSortCondition.isSelected
-                        ? AppColors.mainColor
-                        : Colors.black,
+            Obx(() => DropdownButton<String>(
+                  value: state.dropdownValue.value,
+                  icon: const Icon(Icons.arrow_drop_down),
+                  iconSize: 40,
+                  elevation: 12,
+                  style: TextStyle(fontSize: 26.sp, color: Colors.black),
+                  iconEnabledColor: Colors.grey,
+                  onChanged: (newValue) {
+                    state.dropdownValue.value = newValue!;
+                  },
+                  items: state.dropDownItemList.obs
+                      .map<DropdownMenuItem<String>>((item) {
+                    return DropdownMenuItem<String>(
+                      value: item,
+                      child: Text(item),
+                    );
+                  }).toList(),
+                ))
+          ]),
+          SizedBox(
+            height: 20.h,
+          ),
+          Expanded(
+              child: Container(
+            margin: EdgeInsets.only(left: 20.w, right: 20.w),
+            //给contain设置一个10像素的圆角
+            decoration: BoxDecoration(
+                color: Colors.white, borderRadius: BorderRadius.circular(16.w)),
+            child: Timeline.tileBuilder(
+              builder: TimelineTileBuilder.fromStyle(
+                contentsAlign: ContentsAlign.basic,
+                contentsBuilder: (context, index) => Padding(
+                  padding: EdgeInsets.all(24.0.w),
+                  child: Column(
+                    mainAxisAlignment: MainAxisAlignment.start,
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text('09:30 有人出现在门口',
+                          textAlign: TextAlign.left,
+                          style: TextStyle(
+                            color: AppColors.darkGrayTextColor,
+                            fontSize: 24.sp,
+                          )),
+                      SizedBox(
+                        height: 10.h,
+                      ),
+                      const Image(
+                          image: AssetImage(
+                              'images/main/icon_lockDetail_monitoringvoiceFrist.png')),
+                    ],
                  ),
-                )),
-          ),
-        ));
-  }
-
-  CupertinoStepper _buildStepper(StepperType type) {
-    final canCancel = state.currentStep.value > 0;
-    final canContinue = state.currentStep.value < 3;
-    return CupertinoStepper(
-      type: type,
-      currentStep: state.currentStep.value,
-      onStepTapped: (step) => setState(() => state.currentStep.value = step),
-      onStepCancel:
-          canCancel ? () => setState(() => --state.currentStep.value) : null,
-      onStepContinue:
-          canContinue ? () => setState(() => ++state.currentStep.value) : null,
-      steps: [
-        for (var i = 0; i < 3; ++i)
-          _buildStep(
-            title: const Text(''),
-            isActive: i == state.currentStep.value,
-            state: i == state.currentStep.value
-                ? StepState.editing
-                : i < state.currentStep.value
-                    ? StepState.complete
-                    : StepState.indexed,
-          ),
-        // _buildStep(
-        //   title: Text('Error'),
-        //   state: StepState.error,
-        // ),
-        // _buildStep(
-        //   title: Text('Disabled'),
-        //   state: StepState.disabled,
-        // )
-      ],
-    );
-  }
-
-  Step _buildStep({
-    required Widget title,
-    StepState state = StepState.indexed,
-    bool isActive = false,
-  }) {
-    return Step(
-      title: title,
-      subtitle: const Text('10:45 有人出现在门口'),
-      state: state,
-      isActive: isActive,
-      content: LimitedBox(
-        maxWidth: 300,
-        maxHeight: 300,
-        child: Container(color: CupertinoColors.systemGrey),
+                ),
+                itemCount: 10,
+              ),
+              theme: TimelineThemeData(
+                nodePosition: 0.04, //居左侧距离
+                connectorTheme: const ConnectorThemeData(
+                    thickness: 2.0,
+                    color: AppColors.greyBackgroundColor,
+                    indent: 0.5),
+                indicatorTheme: const IndicatorThemeData(
+                    size: 16.0,
+                    color: AppColors.greyBackgroundColor,
+                    position: 0.07),
+              ),
+            ),
+          )),
+        ],
      ),
    );
  }
-}

-String getTypeIcon(int type) {
-  String title = 'images/controls_user.png';
-  switch (type) {
-    case 1:
-      // 蓝牙开锁
-      title = 'images/controls_user.png';
-      break;
-    case 4:
-      // 密码开锁
-      title = 'images/icon_password.png';
-      break;
-    case 7:
-      // ic卡
-      title = 'images/icon_card.png';
-      break;
-    case 8:
-      // 指纹开锁
-      title = 'images/icon_fingerprint.png';
-      break;
-    default:
-      break;
+  String getTypeIcon(int type) {
+    String title = 'images/controls_user.png';
+    switch (type) {
+      case 1:
+        // 蓝牙开锁
+        title = 'images/controls_user.png';
+        break;
+      case 4:
+        // 密码开锁
+        title = 'images/icon_password.png';
+        break;
+      case 7:
+        // ic卡
+        title = 'images/icon_card.png';
+        break;
+      case 8:
+        // 指纹开锁
+        title = 'images/icon_fingerprint.png';
+        break;
+      default:
+        break;
+    }
+    return title;
  }
-  return title;
-}
-
-class SortCondition {
-  String name;
-  bool isSelected;
-
-  SortCondition({
-    required this.name,
-    required this.isSelected,
-  });
 }
--- a/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_state.dart
+++ b/star_lock/lib/main/lockDetail/doorLockLog/doorLockLog_state.dart
@ -1,8 +1,5 @@
-import 'package:flutter/material.dart';
 import 'package:flutter_advanced_calendar/flutter_advanced_calendar.dart';
 import 'package:get/get.dart';
-import 'package:gzx_dropdown_menu/gzx_dropdown_menu.dart';
-import 'package:star_lock/main/lockDetail/doorLockLog/doorLockLog_page.dart';

 import '../../lockMian/entity/lockListInfo_entity.dart';
 import '../electronicKey/electronicKeyDetail/keyOperationRecordEntity.dart';
@ -11,25 +8,14 @@ class DoorLockLogState {
  final keyInfos = LockListInfoItemEntity().obs;
  final lockOperatingRecordListData = <KeyRecordDataItem>[].obs;
  final calendarControllerToday = AdvancedCalendarController.today();
-  final calendarControllerCustom =
-      AdvancedCalendarController(DateTime(2024, 01, 10));
+  final calendarControllerCustom = AdvancedCalendarController.today();
  final events = <DateTime>[
    DateTime.now(),
    DateTime(2024, 10, 10),
  ];
-  final eventSortConditions = [
-    SortCondition(name: '全部事件', isSelected: true),
-    SortCondition(name: '门锁异常', isSelected: false),
-    SortCondition(name: '有人出现', isSelected: false),
-    SortCondition(name: '有人按门铃', isSelected: false),
-    SortCondition(name: '一次性密码开门', isSelected: false)
-  ].obs;
-  final List dropDownDoorLockItem = ['全部事件'];
-  final GZXDropdownMenuController dropdownMenuController =
-      GZXDropdownMenuController();
-  final scaffoldKey = GlobalKey<ScaffoldState>();
-  final GlobalKey stackKey = GlobalKey();
-  late SortCondition selectGroupSortCondition = eventSortConditions.value[0];
+  var dropdownValue = '全部事件'.obs;
+  final List dropDownItemList =
+      ['全部事件', '门锁异常', '有人出现', '有人按门铃', '一次性密码开门'].obs;
  var currentStep = 0.obs;

  DoorLockLogState() {
--- a/star_lock/pubspec.yaml
+++ b/star_lock/pubspec.yaml
@ -135,9 +135,7 @@ dependencies:
  #监听网络连接状态
  connectivity_plus: ^5.0.2
  flutter_advanced_calendar: ^1.4.1
-  #下拉选择菜单框
-  gzx_dropdown_menu: ^3.1.0
-  cupertino_stepper: ^0.2.1
+  timelines: ^0.1.0

 dev_dependencies:
  flutter_test: