insertChildNode

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

@@ -8,6 +8,6 @@
 
 <script lang="ts" setup>
 import InsertChildNode from "./ToolBar/InsertChildNode.vue";
-import ImportBtn from "./ToolBar/importBtn.vue";
+import ImportBtn from "./ToolBar/ImportBtn.vue";
 import ExportBtn from "./ToolBar/ExportBtn.vue";
 </script>

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

@@ -1,7 +1,26 @@
 <!-- 插入子节点 -->
 <template>
-<div class="w-[80px] h-[80px] border">新增子节点</div>
+  <div
+    @click="addNewChildNode"
+    class="w-[80px] h-[80px] flex justify-center items-center border"
+  >
+    新增子节点
+  </div>
 </template>
 
 <script lang="ts" setup>
-</script>
+import { useMindMapStore } from "../../store/index";
+
+const { insertChildNode } = useMindMapStore();
+
+async function addNewChildNode() {
+  insertChildNode(
+    async () => {
+      return {
+        uid: "newChildNode",
+        text: "新节点22222",
+      };
+    }
+  );
+}
+</script>

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

@@ -0,0 +1,35 @@
+import { useMindMapStore } from "../../store/index";
+
+/**
+ * 追加子节点
+ * @param beforeInsertCallback 插入前执行的异步回调函数，如果返回节点信息则会合并到节点选项中
+ * @param nodeOptions 节点选项，可自定义节点属性
+ * @returns 返回Promise，可用于链式调用
+ */
+export async function insertChildNode(
+  beforeInsertCallback: () => Promise<({ uid: number | string, text: string } | boolean)>,
+  nodeOptions: Record<string, any> = { uid: 313123123, text: "新节点" }
+) {
+  const { getMindMapInstance } = useMindMapStore();
+
+  const _nodeOptions = {
+    ...nodeOptions,
+  }
+  
+  try {
+    // 如果提供了回调函数，先执行回调
+    const result = await beforeInsertCallback();
+
+    if (!result) return; // 如果直接 false 则不再执行插入操作
+
+    if (result) {
+        Object.assign(_nodeOptions, result);
+    }
+    
+    // 执行插入子节点命令
+    return getMindMapInstance()?.execCommand("INSERT_CHILD_NODE", false, [], _nodeOptions);
+  } catch (error) {
+    console.error("插入子节点失败:", error);
+    throw error;
+  }
+}

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

@@ -3,6 +3,7 @@ import { ref } from "vue";
 import { importFile } from "../helpers/import";
 import { exportFile } from "../helpers/export";
 import { usePlugins } from "../helpers/usePlugin";
+import { insertChildNode } from "../helpers/insertChildNode";
 
 import MindMap from "simple-mind-map";
 
@@ -32,7 +33,7 @@ export const useMindMapStore = defineStore(
     }
 
     
-
+    // 因为避免使用响应对象
     function getMindMapInstance (): MindMap | null {
       return mindMapInstance;
     }
@@ -45,6 +46,7 @@ export const useMindMapStore = defineStore(
 
       importFile,
       exportFile,
+      insertChildNode,
 
       // func
       initMindMap,

web3/packages/mind-map/src/types/index.d.ts

@@ -1,6 +1,3 @@
-// 导入全局声明文件
-/// <reference path="./global.d.ts" />
-
 declare module 'simple-mind-map' {
     import MindMap from 'simple-mind-map/types/index';
     export default MindMap
@@ -21,7 +18,6 @@ declare module 'simple-mind-map/src/plugins/Export' {
     export default Export;
 }
 
-// simple-mind-map/src/parse/markdown
 declare module 'simple-mind-map/src/parse/markdown' {
     import markdown from 'simple-mind-map/types/src/parse/markdown';
     export default markdown;