Initial commit

modeler/src/views/decision/builder/node.vue

@@ -268,14 +268,14 @@ export default defineComponent({
     // X6 只能作为连线目标（入）
     magnet: passive;
     box-shadow: none;
-    width: 20px;
-    height: 20px;
+    width: 15px;
+    height: 15px;
     display: block;
     background: url('@/assets/icons/point.svg') center / 100% 100%;
 
     position: absolute;
     left: 5px;
-    top: 10px;
+    top: 12px;
   }
 
   // 右侧出桩样式
@@ -285,14 +285,14 @@ export default defineComponent({
     // X6 只能作为连线源（出）
     magnet: active;
     box-shadow: none;
-    width: 20px;
-    height: 20px;
+    width: 15px;
+    height: 15px;
     display: block;
-    background: url('@/assets/icons/arrow-right.svg') center / 100% 100%;
+    background: url('@/assets/icons/point.svg') center / 100% 100%;
 
     position: absolute;
     right: 5px;
-    top: 10px;
+    top: 12px;
   }
 
   // 节点文本样式

modeler/src/views/decision/designer.vue

@@ -6,6 +6,7 @@
         <div class="ks-model-builder-body">
           <div class="ks-model-builder-left">
             <TressCard
+              ref="treesCardRef"
               @select-tree="handleSelectTree"
             />
             <NodesCard
@@ -107,7 +108,8 @@ export default defineComponent({
     const currentNodeGraph = ref<NodeGraph | null>(null);
     const selectedModelNode = ref<Node<NodeProperties> | null>(null);
     const selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
-    const changed = ref<boolean>(false)
+    const changed = ref<boolean>(false);
+    const treesCardRef = ref<HTMLElement|null>(null);
 
     const {
       handleGraphEvent,
@@ -238,28 +240,34 @@ export default defineComponent({
 
     const createElements = () => {
       nextTick(() => {
-        graph.value?.clearCells();
-        if (currentBehaviorTree.value?.graph && graph.value) {
-          if (currentBehaviorTree.value?.graph.nodes) {
-            currentBehaviorTree.value?.graph.nodes.forEach(ele => {
-              const node = createGraphTaskElement(ele as GraphTaskElement);
-              console.info('create node: ', ele);
-              // 将节点添加到画布
-              graph.value?.addNode(node as Node);
-            });
-          }
-          if (currentBehaviorTree.value?.graph.edges) {
-            // 然后添加所有边，确保包含桩点信息
-            setTimeout(() => {
-              currentBehaviorTree.value?.graph.edges.forEach(edgeData => {
-                graph.value?.addEdge({
-                  ...edgeData,
-                  ...createLineOptions(),
-                });
-              });
-            }, 100);  // 延迟一会儿,免得连线错位
-          }
+        try{
+          graph.value?.clearCells();
+        } catch (e: any){
+          console.error('clear cells error, cause:',e);
         }
+        setTimeout(()=> {
+          if (currentBehaviorTree.value?.graph && graph.value) {
+            if (currentBehaviorTree.value?.graph.nodes) {
+              currentBehaviorTree.value?.graph.nodes.forEach(ele => {
+                const node = createGraphTaskElement(ele as GraphTaskElement);
+                console.info('create node: ', ele);
+                // 将节点添加到画布
+                graph.value?.addNode(node as Node);
+              });
+            }
+            if (currentBehaviorTree.value?.graph.edges) {
+              // 然后添加所有边，确保包含桩点信息
+              setTimeout(() => {
+                currentBehaviorTree.value?.graph.edges.forEach(edgeData => {
+                  graph.value?.addEdge({
+                    ...edgeData,
+                    ...createLineOptions(),
+                  });
+                });
+              }, 100);  // 延迟一会儿,免得连线错位
+            }
+          }
+        }, 100)
       });
     };
 
@@ -352,6 +360,7 @@ export default defineComponent({
       }
       res.then(r => {
         if (r.code === 200) {
+          treesCardRef.value?.refresh();
           message.success(r.msg ?? '操作成功.');
         } else {
           message.error(r.msg ?? '操作失败.');
@@ -379,6 +388,7 @@ export default defineComponent({
     });
 
     return {
+      treesCardRef,
       currentTreeEditing,
       currentBehaviorTree,
       currentNodeGraph,

modeler/src/views/decision/trees-card.vue

@@ -107,11 +107,14 @@ export default defineComponent({
       };
     };
 
+    const refresh = ()=> loadTress();
+
     onMounted(() => {
       loadTress();
     });
 
     return {
+      refresh,
       totalTress,
       substring,
       activeKey,