This commit is contained in:
X1627315083@163.com
2026-03-04 15:40:30 +08:00
parent eb67982228
commit e96aa5dca8
4 changed files with 53 additions and 8 deletions

View File

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

View File

@@ -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)"
/>
</node>
</template>
@@ -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)
}
// 导出流程

View File

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

View File

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