From e96aa5dca882e24f66e4c959b608dca638641d66 Mon Sep 17 00:00:00 2001 From: "X1627315083@163.com" <1627315083@qq.com> Date: Wed, 4 Mar 2026 15:40:30 +0800 Subject: [PATCH] fix --- .../components/nodes/result-image.vue | 14 ++++++------ .../Canvas/FlowCanvas/flow-canvas.vue | 22 ++++++++++++++++++- .../Canvas/FlowCanvas/manager/NodeManager.ts | 17 ++++++++++++++ .../Canvas/FlowCanvas/manager/StateManager.ts | 8 +++++++ 4 files changed, 53 insertions(+), 8 deletions(-) diff --git a/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue b/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue index 0f50db2..e7ccaa4 100644 --- a/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue +++ b/src/components/Canvas/FlowCanvas/components/nodes/result-image.vue @@ -44,7 +44,7 @@ default: () => ({}) } }) - const emit = defineEmits(['delete-node', 'copy-node']) + const emit = defineEmits(['delete-node', 'copy-node', 'bring-to-font', 'send-to-back', 'flip-horizontal', 'flip-vertical']) const attrs = useAttrs() const showHeader = ref(!!attrs.node?.data?.isHeader) const showMenu = ref(false) @@ -59,15 +59,15 @@ ) const menus = ref([ { label: 'Copy', tip: 'Ctrl+C', on: () => emit('copy-node') }, - { label: 'Paste', tip: 'Ctrl+V', on: () => {} }, - { label: 'Duplicate', tip: 'Ctrl+D', on: () => {} }, + // { label: 'Paste', tip: 'Ctrl+V', on: () => {} }, + // { label: 'Duplicate', tip: 'Ctrl+D', on: () => {} }, { label: 'Delete', tip: 'Del', on: () => emit('delete-node') }, { isDivide: true }, - { label: 'Bring to font', tip: 'Del', on: () => {} }, - { label: 'Send to back', tip: 'Del', on: () => {} }, + { label: 'Bring to font', tip: '', on: () => {emit('bring-to-font')} }, + { label: 'Send to back', tip: '', on: () => {emit('send-to-back')} }, { isDivide: true }, - { label: 'Flip horizontal', tip: '', on: () => {} }, - { label: 'Flip vertical', tip: '', on: () => {} } + { label: 'Flip horizontal', tip: '', on: () => {emit('flip-horizontal')} }, + { label: 'Flip vertical', tip: '', on: () => {emit('flip-vertical')} } ]) const onMenuItem = (v) => { v.on && v.on() diff --git a/src/components/Canvas/FlowCanvas/flow-canvas.vue b/src/components/Canvas/FlowCanvas/flow-canvas.vue index f4262e9..17f5b98 100644 --- a/src/components/Canvas/FlowCanvas/flow-canvas.vue +++ b/src/components/Canvas/FlowCanvas/flow-canvas.vue @@ -33,6 +33,10 @@ @delete-node="deleteNode(node.id)" @copy-node="copyNode(node.id)" @update-data="(v) => (node.data.data = v)" + @bring-to-font="bringToFont(node.id)" + @send-to-back="sendToBack(node.id)" + @flip-horizontal="flipHorizontal(node.id)" + @flip-vertical="flipVertical(node.id)" /> @@ -138,7 +142,23 @@ } /** 复制节点 */ const copyNode = (id) => { - console.log('复制:', id) + nodeManager.copyNodeById(id) + } + /** 节点zIndex设置最大 */ + const bringToFont = (id) => { + // nodeManager.bringToFont(id) + } + /** 节点zIndex设置最小 */ + const sendToBack = (id) => { + // nodeManager.sendToBack(id) + } + /** 水平翻转 */ + const flipHorizontal = (id) => { + // nodeManager.flipHorizontal(id) + } + /** 垂直翻转 */ + const flipVertical = (id) => { + // nodeManager.flipVertical(id) } // 导出流程 diff --git a/src/components/Canvas/FlowCanvas/manager/NodeManager.ts b/src/components/Canvas/FlowCanvas/manager/NodeManager.ts index 242d4c1..637cfd7 100644 --- a/src/components/Canvas/FlowCanvas/manager/NodeManager.ts +++ b/src/components/Canvas/FlowCanvas/manager/NodeManager.ts @@ -100,4 +100,21 @@ export class NodeManager { } return this.createNode(options_) } + + copyNodeById(id: string) { + const node = this.stateManager.getNodeById(id) + const flowNode = this.stateManager.flowManager.getNodeById(id) + console.log(node,this.stateManager.flowManager.getNodeById(id)) + if (!node) return console.warn(`copyNodeById: ${id}找不到对应节点`) + const node_ = { + ...JSON.parse(JSON.stringify(node)), + id: createId(), + position: { + x: node.position.x, + y: node.position.y + (flowNode?.dimensions?.height || 0) + 50, + } + } + this.stateManager.addNode(node_) + // return this.createNode(options_) + } } diff --git a/src/components/Canvas/FlowCanvas/manager/StateManager.ts b/src/components/Canvas/FlowCanvas/manager/StateManager.ts index cd50557..8cbb95b 100644 --- a/src/components/Canvas/FlowCanvas/manager/StateManager.ts +++ b/src/components/Canvas/FlowCanvas/manager/StateManager.ts @@ -127,4 +127,12 @@ export class StateManager { setNodesDraggable(v: boolean) { this.nodesDraggable.value = v } /** 设置是否可以平移画布 */ setPanOnDrag(v: boolean) { this.panOnDrag.value = v } + /** 获取节点最大zIndex值 */ + getMaxZIndex() { + return this.nodes.value.reduce((max, node) => Math.max(max, node.zIndex), 0) + } + /** 获取节点最小zIndex值 */ + getMinZIndex() { + return this.nodes.value.reduce((min, node) => Math.min(min, node.zIndex), 0) + } }