添加快捷键

src/components/Canvas/FlowCanvas/manager/EventManager.ts

@@ -7,6 +7,7 @@ export class EventManager {
 		this.stateManager = options.stateManager;
 		this.vueFlow = options.vueFlow
 		this.zoom = this.stateManager.zoom
+		this.registerEvents()
 	}
 	/** 处理视口变化 */
 	handleViewportChange(e: any) {
@@ -38,4 +39,45 @@ export class EventManager {
 			this.stateManager.toolManager.setTool(TOOLS.SELECT)
 		}
 	}
+
+	/** 处理复制 */
+	handleCopy(event: any, activeNodeID: string) {
+		event.preventDefault()
+		if (!activeNodeID) return console.warn('没有选中节点')
+		this.stateManager.nodeManager.copyNodeById(activeNodeID)
+	}
+	/** 处理删除 */
+	handleDelete(event: any, activeNodeID: string) {
+		event.preventDefault()
+		if (!activeNodeID) return console.warn('没有选中节点')
+		this.stateManager.nodeManager.deleteNode(activeNodeID)
+	}
+	/** 处理键盘事件 */
+	handleKeyDown(event: any) {
+		const activeNodeID = this.stateManager.activeNodeID.value;
+		// const shiftKey
+		const ctrl = event.ctrlKey ? 'ctrl-' : "";
+		const shift = event.shiftKey ? 'shift-' : "";
+		const key = event.key;
+		const reg = new RegExp(`^${ctrl}${shift}${key}$`, 'i')
+		const list = [
+			{ key: "ctrl-c", handler: () => this.handleCopy(event, activeNodeID) },
+			{ key: "delete", handler: () => this.handleDelete(event, activeNodeID) },
+			{ key: "ctrl-z", handler: () => this.stateManager.undoState() },
+			{ key: "ctrl-shift-z", handler: () => this.stateManager.redoState() },
+		]
+		list.forEach((v: any) => {
+			if (reg.test(v.key)) v.handler(event)
+		})
+	}
+	/** 注册事件 */
+	registerEvents() {
+		// document.addEventListener('copy', this.handleCopy.bind(this))
+		document.addEventListener('keydown', this.handleKeyDown.bind(this))
+	}
+	/** 删除事件 */
+	removeEvents() {
+		// document.removeEventListener('copy', this.handleCopy.bind(this))
+		document.removeEventListener('keydown', this.handleKeyDown.bind(this))
+	}
 }

src/components/Canvas/FlowCanvas/manager/NodeManager.ts

@@ -106,7 +106,6 @@ export class NodeManager {
 	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)),

src/components/Canvas/FlowCanvas/manager/StateManager.ts

@@ -101,6 +101,9 @@ export class StateManager {
 	}
 	/** 删除节点 */
 	deleteNode(id: string) {
+		const node = this.getNodeById(id)
+		if (!node) return console.warn(`没有找到指定id:${id}`)
+		if (node.data.disableDelete) return console.warn('该节点禁用删除')
 		this.nodes.value = this.nodes.value.filter((node: NodesItem) => node.id !== id)
 		this.recordState()
 	}