feat: 隐藏锁定操作，支持历史记录回退和前进

src/store/modules/chartEditStore/chartEditStore.ts

@@ -618,6 +618,32 @@ export const useChartEditStore = defineStore({
         }
         return
       }
+
+      switch (HistoryItem.actionType) {
+        // 锁定处理
+        case HistoryActionTypeEnum.LOCK:
+        case HistoryActionTypeEnum.UNLOCK:
+          if (!isForward) {
+            // 恢复原来状态
+            if (HistoryItem.actionType === HistoryActionTypeEnum.LOCK) historyData[0].status.lock = false
+            if (HistoryItem.actionType === HistoryActionTypeEnum.UNLOCK) historyData[0].status.lock = true
+            return
+          }
+          this.setLock(!historyData[0].status.lock, false)
+          break
+
+        // 隐藏处理
+        case HistoryActionTypeEnum.HIDE:
+        case HistoryActionTypeEnum.SHOW:
+          if (!isForward) {
+            // 恢复原来状态
+            if (HistoryItem.actionType === HistoryActionTypeEnum.HIDE) historyData[0].status.hide = false
+            if (HistoryItem.actionType === HistoryActionTypeEnum.SHOW) historyData[0].status.hide = true
+            return
+          }
+          this.setHide(!historyData[0].status.hide, false)
+          break
+      }
     },
     // * 撤回
     setBack() {
@@ -811,7 +837,7 @@ export const useChartEditStore = defineStore({
 
           // 历史记录
           if (isHistory) {
-            chartHistoryStore.createLayerHistory(
+            chartHistoryStore.createLockHistory(
               [targetItem],
               status ? HistoryActionTypeEnum.LOCK : HistoryActionTypeEnum.UNLOCK
             )
@@ -843,7 +869,7 @@ export const useChartEditStore = defineStore({
 
           // 历史记录
           if (isHistory) {
-            chartHistoryStore.createLayerHistory(
+            chartHistoryStore.createHideHistory(
               [targetItem],
               status ? HistoryActionTypeEnum.HIDE : HistoryActionTypeEnum.SHOW
             )

src/store/modules/chartHistoryStore/chartHistoryDefine.ts

@@ -1,7 +1,4 @@
-import {
-  HistoryTargetTypeEnum,
-  HistoryActionTypeEnum
-} from './chartHistoryStore.d'
+import { HistoryTargetTypeEnum, HistoryActionTypeEnum } from './chartHistoryStore.d'
 
 export const historyActionTypeName = {
   [HistoryActionTypeEnum.ADD]: '新增图表',
@@ -18,6 +15,10 @@ export const historyActionTypeName = {
   [HistoryActionTypeEnum.GROUP]: '创建分组',
   [HistoryActionTypeEnum.UN_GROUP]: '解除分组',
   [HistoryActionTypeEnum.SELECT_HISTORY]: '选择记录',
-  
+  [HistoryActionTypeEnum.LOCK]: '锁定',
+  [HistoryActionTypeEnum.UNLOCK]: '解除锁定',
+  [HistoryActionTypeEnum.HIDE]: '隐藏',
+  [HistoryActionTypeEnum.SHOW]: '显示',
+
   [HistoryTargetTypeEnum.CANVAS]: '画布初始化'
 }

src/store/modules/chartHistoryStore/chartHistoryStore.ts

@@ -153,10 +153,6 @@ export const useChartHistoryStore = defineStore({
         | HistoryActionTypeEnum.DOWN
         | HistoryActionTypeEnum.UP
         | HistoryActionTypeEnum.BOTTOM
-        | HistoryActionTypeEnum.LOCK
-        | HistoryActionTypeEnum.UNLOCK
-        | HistoryActionTypeEnum.HIDE
-        | HistoryActionTypeEnum.SHOW
     ) {
       this.createStackItem(item, type, HistoryTargetTypeEnum.CHART)
     },
@@ -171,6 +167,20 @@ export const useChartHistoryStore = defineStore({
     // * 解除分组
     createUnGroupHistory(item: Array<CreateComponentType | CreateComponentGroupType>) {
       this.createStackItem(item, HistoryActionTypeEnum.UN_GROUP, HistoryTargetTypeEnum.CHART)
+    },
+    // * 锁定记录
+    createLockHistory(
+      item: Array<CreateComponentType | CreateComponentGroupType>,
+      type: HistoryActionTypeEnum.LOCK | HistoryActionTypeEnum.UNLOCK
+    ) {
+      this.createStackItem(item, type, HistoryTargetTypeEnum.CHART)
+    },
+    // * 隐藏记录
+    createHideHistory(
+      item: Array<CreateComponentType | CreateComponentGroupType>,
+      type: HistoryActionTypeEnum.HIDE | HistoryActionTypeEnum.SHOW
+    ) {
+      this.createStackItem(item, type, HistoryTargetTypeEnum.CHART)
     }
   }
 })

src/views/chart/ContentEdit/components/EditHistory/index.vue

@@ -48,8 +48,19 @@ import {
   HistoryActionTypeEnum
 } from '@/store/modules/chartHistoryStore/chartHistoryStore.d'
 
-const { DesktopOutlineIcon, PencilIcon, TrashIcon, CopyIcon, LayersIcon, DuplicateIcon, HelpOutlineIcon } =
-  icon.ionicons5
+const {
+  DesktopOutlineIcon,
+  PencilIcon,
+  TrashIcon,
+  CopyIcon,
+  LayersIcon,
+  DuplicateIcon,
+  HelpOutlineIcon,
+  LockClosedOutlineIcon,
+  LockOpenOutlineIcon,
+  EyeOffOutlineIcon,
+  EyeOutlineIcon
+} = icon.ionicons5
 const { StackedMoveIcon, Carbon3DCursorIcon, Carbon3DSoftwareIcon } = icon.carbon
 
 const chartHistoryStoreStore = useChartHistoryStore()
@@ -83,6 +94,14 @@ const iconHandle = (e: HistoryItemType) => {
       return Carbon3DCursorIcon
     case HistoryActionTypeEnum.UN_GROUP:
       return Carbon3DSoftwareIcon
+    case HistoryActionTypeEnum.LOCK:
+      return LockClosedOutlineIcon
+    case HistoryActionTypeEnum.UNLOCK:
+      return LockOpenOutlineIcon
+    case HistoryActionTypeEnum.HIDE:
+      return EyeOffOutlineIcon
+    case HistoryActionTypeEnum.SHOW:
+      return EyeOutlineIcon
     default:
       return PencilIcon
   }
@@ -109,9 +128,7 @@ const options = computed(() => {
     }
   })
 
-  return reverse(options.filter(item => {
-    return item.label
-  }))
+  return reverse(options.filter(item => item.label))
 })
 </script>