diff --git a/src/components/Canvas/FlowCanvas/components/header-tools.vue b/src/components/Canvas/FlowCanvas/components/header-tools.vue index 10cffd2..484d469 100644 --- a/src/components/Canvas/FlowCanvas/components/header-tools.vue +++ b/src/components/Canvas/FlowCanvas/components/header-tools.vue @@ -5,8 +5,8 @@ @@ -32,16 +32,37 @@ const stateManager = inject('stateManager') as any const toolManager = inject('toolManager') as any const tool = computed(() => stateManager.tool.value) + const historyIndex = computed(() => stateManager.historyIndex.value) + const historyList = computed(() => stateManager.historyList.value) + const isUndo = computed(() => !historyList.value[historyIndex.value - 1]) + const isRedo = computed(() => !historyList.value[historyIndex.value + 1]) const tools = ref([ - { name: TOOLS.SELECT, icon: 'c-select', iconSize: 16 }, - { name: TOOLS.MOVE, icon: 'c-move', iconSize: 18 }, - { name: TOOLS.TEXT, icon: 'c-text', iconSize: 18 }, + { name: TOOLS.SELECT, icon: 'c-select', iconSize: 16, disabled: ref(false) }, + { name: TOOLS.MOVE, icon: 'c-move', iconSize: 18, disabled: ref(false) }, + { name: TOOLS.TEXT, icon: 'c-text', iconSize: 18, disabled: ref(false) }, { type: 'line' }, - { name: TOOLS.UNDO, icon: 'c-undo', iconSize: 18 }, - { name: TOOLS.REDO, icon: 'c-redo', iconSize: 18 } + { + name: TOOLS.UNDO, + icon: 'c-undo', + iconSize: 18, + disabled: isUndo, + on: () => stateManager.undoState() + }, + { + name: TOOLS.REDO, + icon: 'c-redo', + iconSize: 18, + disabled: isRedo, + on: () => stateManager.redoState() + } ]) const onClickTool = (tool: any) => { - toolManager.setTool(tool) + if (tool.disabled?.value) return + if (tool.on) { + tool.on() + } else { + toolManager.setTool(tool.name) + } } @@ -79,10 +100,14 @@ height: 3rem; --svg-icon-color: #000; border-radius: 0.4rem; - &.active, - &:hover { + &:not(.disabled).active, + &:not(.disabled):hover { background-color: #dfdfdf; } + &.disabled { + opacity: 0.5; + cursor: not-allowed; + } } > button { width: 10rem; diff --git a/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue b/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue index e7ccaa4..736ebc8 100644 --- a/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue +++ b/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue @@ -16,7 +16,7 @@ Edit - +
@@ -24,7 +24,7 @@