RemoveNode

simple-mind-map/types/src/core/render/Render.d.ts

@@ -114,7 +114,7 @@ declare class Render {
     moveNodeToCenter(node: any, resetScale: any): void;
     setRootNodeCenter(): void;
     expandToNodeUid(uid: any, callback?: () => void): void;
-    findNodeByUid(uid: any): any;
+    findNodeByUid(uid: string | number): any;
     highlightNode(node: any, range: any, style: any): void;
     closeHighlightNode(): void;
     hasRichTextPlugin(): boolean;

web3/packages/mind-map/src/components/ToolBar.vue

@@ -4,6 +4,7 @@
       <InsertSiblingNode/>
       <ImportBtn/>
       <ExportBtn/>
+      <RemoveNode/>
     </div>
 </template>
 
@@ -12,4 +13,5 @@ import InsertChildNode from "./ToolBar/InsertChildNode.vue";
 import ImportBtn from "./ToolBar/ImportBtn.vue";
 import ExportBtn from "./ToolBar/ExportBtn.vue";
 import InsertSiblingNode from "./ToolBar/InsertSiblingNode.vue";
+import RemoveNode from "./ToolBar/RemoveNode.vue";
 </script>

web3/packages/mind-map/src/components/ToolBar/InsertSiblingNode.vue

@@ -1,28 +1,25 @@
 <!-- 插入姐妹节点 -->
 <template>
-    <div
-      @click="addNewSiblingNode"
-      class="w-[80px] h-[80px] flex justify-center items-center border"
-    >
+  <div
+    @click="addNewSiblingNode"
+    class="w-[80px] h-[80px] flex justify-center items-center border"
+  >
     姐妹节点
-    </div>
-  </template>
-  
-  <script lang="ts" setup>
-  import { useMindMapStore } from "../../store/index";
-  import { createUid } from 'simple-mind-map/src/utils'
-  
-  const { insertSiblingNode } = useMindMapStore();
-  
-  async function addNewSiblingNode() {
-    insertSiblingNode(
-      async () => {
-        return {
-          uid: createUid(),
-          text: "新节点22222",
-        };
-      }
-    );
-  }
-  </script>
-  
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { useMindMapStore } from "../../store/index";
+import { createUid } from "simple-mind-map/src/utils";
+
+const { insertSiblingNode } = useMindMapStore();
+
+async function addNewSiblingNode() {
+  insertSiblingNode(async () => {
+    return {
+      uid: createUid(),
+      text: "新节点22222",
+    };
+  });
+}
+</script>

web3/packages/mind-map/src/components/ToolBar/RemoveNode.vue

@@ -0,0 +1,29 @@
+<template>
+  <div
+    @click="remove"
+    class="w-[80px] h-[80px] flex justify-center items-center border"
+  >
+    删除节点
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { useMindMapStore } from "../../store/index";
+const { removeNode } = useMindMapStore();
+
+function remove() {
+  const { activeNodes } = useMindMapStore();
+  const activeNodesIds = activeNodes.map((node) => node.uid);
+
+  if (activeNodesIds.length === 0) return;
+
+  for (const uid of activeNodesIds) {
+    removeNode({
+      beforeRemoveCallback: async () => {
+        return true;
+      },
+      nodeId: uid,
+    });
+  }
+}
+</script>

web3/packages/mind-map/src/store/helpers/removeNode.ts

@@ -0,0 +1,36 @@
+import { useMindMapStore } from "../../store/index";
+
+/**
+ * 删除节点
+ * @param beforeRemoveCallback 删除前执行的异步回调函数，如果返回false则取消删除操作
+ * @param nodeId 要删除的节点ID，如不提供则删除当前选中的节点
+ * @returns 返回Promise，可用于链式调用
+ */
+export async function removeNode(params: {
+  beforeRemoveCallback?: () => Promise<boolean>;
+  nodeId?: string | number;
+}): Promise<void> {
+  const { getMindMapInstance } = useMindMapStore();
+
+  try {
+    // 如果提供了回调函数，先执行回调
+    if (params.beforeRemoveCallback) {
+      const shouldContinue = await params.beforeRemoveCallback();
+      if (!shouldContinue) return; // 如果回调返回false则取消删除操作
+    }
+
+    if (params.nodeId) {
+      const node = getMindMapInstance()?.renderer?.findNodeByUid(
+        params.nodeId
+      );
+      if (node) {
+        return getMindMapInstance()?.execCommand("REMOVE_NODE", [node]);
+      }
+    } else {
+      return getMindMapInstance()?.execCommand("REMOVE_NODE");
+    }
+  } catch (error) {
+    console.error("删除节点失败:", error);
+    throw error;
+  }
+}

web3/packages/mind-map/src/store/modules/mindMap.ts

@@ -5,6 +5,7 @@ import { exportFile } from "../helpers/export";
 import { usePlugins } from "../helpers/usePlugin";
 import { insertChildNode } from "../helpers/insertChildNode";
 import { insertSiblingNode } from "../helpers/insertSiblingNode";
+import { removeNode } from "../helpers/removeNode";
 
 import type MindMapNode from "simple-mind-map/types/src/core/render/node/MindMapNode";
 
@@ -65,6 +66,7 @@ export const useMindMapStore = defineStore(
       exportFile,
       insertChildNode,
       insertSiblingNode,
+      removeNode,
 
       // func
       initMindMap,