Initial commit

modeler/src/views/decision/designer.vue

@@ -7,6 +7,7 @@
           <div class="ks-model-builder-left">
             <TressCard
               ref="treesCardRef"
+              @create-tree="handleCreateTree"
               @select-tree="handleSelectTree"
             />
             <NodesCard
@@ -109,7 +110,7 @@ export default defineComponent({
     const selectedModelNode = ref<Node<NodeProperties> | null>(null);
     const selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
     const changed = ref<boolean>(false);
-    const treesCardRef = ref<HTMLElement|null>(null);
+    const treesCardRef = ref<InstanceType<typeof TressCard> | null>(null);
 
     const {
       handleGraphEvent,
@@ -271,6 +272,30 @@ export default defineComponent({
       });
     };
 
+    const handleCreateTree = ()=> {
+      currentBehaviorTree.value = {
+        id: 0,
+        name: '行为树',
+        description: null,
+        englishName: null,
+        xmlContent: null,
+        createdAt: null,
+        graph: {
+          edges: [],
+          nodes: [],
+        },
+        updatedAt: null,
+      }
+      currentNodeGraph.value = {
+        edges: [],
+        nodes: [],
+      }
+      selectedModelNode.value = null;
+      selectedNodeTaskElement.value = null;
+
+      createElements();
+    }
+
     // 初始化X6画布
     const initGraph = () => {
       if (!canvas.value) {
@@ -352,6 +377,14 @@ export default defineComponent({
         graph: graphData,
         xmlContent: JSON.stringify(graphData),
       };
+      if(! newTree.name){
+        message.error('行为树名称不能为空.');
+        return;
+      }
+      if(! newTree.englishName){
+        message.error('行为树英文名称不能为空.');
+        return;
+      }
       let res = null;
       if (currentBehaviorTree.value.id > 0) {
         res = createTree(newTree);
@@ -389,6 +422,7 @@ export default defineComponent({
 
     return {
       treesCardRef,
+      handleCreateTree,
       currentTreeEditing,
       currentBehaviorTree,
       currentNodeGraph,

modeler/src/views/decision/properties.vue

@@ -18,6 +18,10 @@
               <a-input size="small" v-model:value="tree.name" placeholder="行为树名称" />
             </a-form-item>
 
+            <a-form-item label="行为树英文名称">
+              <a-input size="small" v-model:value="tree.englishName" placeholder="行为树英文名称" />
+            </a-form-item>
+
             <a-form-item label="行为树说明">
               <a-textarea size="small" v-model:value="tree.description" placeholder="行为树说明" />
             </a-form-item>

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

@@ -1,15 +1,20 @@
 <template>
   <a-collapse v-model:activeKey="activeKey" :accordion="false" class="ks-trees-collapse">
-    <a-collapse-panel key="1">
+    <a-collapse-panel key="1" style="position: relative">
       <template #header>
-        <span class="ks-model-builder-title-icon icon-model"></span>我的行为树
+        <a-flex>
+          <span class="ks-model-builder-title-icon icon-model"></span>
+          <span style="color: #82c4e9;font-size: 16px;">我的行为树</span>
+<!--          <span style="position: absolute; right: 15px;"><PlusOutlined @click="$emit('create-tree')"/></span>-->
+        </a-flex>
       </template>
       <div class="w-full" style="padding: 5px;">
-        <a-input-search size="small" allowClear v-model:value="behaviorTreeQuery.name" placeholder="行为树名称" @search="loadTress" />
+        <a-flex>
+          <a-input-search size="small" allowClear v-model:value="behaviorTreeQuery.name" placeholder="行为树名称" @search="loadTress" />
+          <a-button size="small" style="margin-left: 10px;"><PlusOutlined style="margin-top: 0px;display: block;" @click="$emit('create-tree')"/></a-button>
+        </a-flex>
       </div>
       <a-list size="small" :data-source="behaviorTrees || []" style="min-height: 25vh">
-
-
         <template #renderItem="{ item }">
           <a-list-item>
             <a-flex>
@@ -50,7 +55,7 @@ import { deleteOneTreeById, findTreesByQuery } from './api';
 import { substring } from '@/utils/strings';
 
 export default defineComponent({
-  emits: ['select-tree'],
+  emits: ['select-tree','create-tree'],
   components: {
     CheckOutlined,
     PlusOutlined,