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

This commit is contained in:
tnt group 2022-09-28 18:43:55 +08:00
parent 2c834c1d62
commit c22d559195
4 changed files with 70 additions and 16 deletions

View File

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

View File

@ -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]: '画布初始化'
}

View File

@ -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)
}
}
})

View File

@ -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>