UPDATE: fk

modeler/src/views/decision/api.ts

@@ -27,6 +27,9 @@ export const findOneTreeById = (id: number): Promise<BehaviorTreeDetailsResponse
   return req.get(`/system/behaviortree/${id}`);
 };
 
+export const deleteOneTreeById = (id: number): Promise<BehaviorTreeDetailsResponse> => {
+  return req.delete(`/system/behaviortree/${id}`);
+};
 
 export const updateTree = (rt: Partial<BehaviorTree>): Promise<BasicResponse> => {
   return req.postJson(`/system/behaviortree`, rt);
@@ -35,18 +38,3 @@ export const updateTree = (rt: Partial<BehaviorTree>): Promise<BasicResponse> =>
 export const createTree = (rt: Partial<BehaviorTree>): Promise<BasicResponse> => {
   return req.putJson(`/system/behaviortree`, rt);
 };
-
-
-// export const findOneTreeById = (id: number): Promise<TreeModelDetailsResponse> => {
-//   return req.postJson(`/tree-details`,{
-//     tree_id: id
-//   });
-// };
-//
-// export const updateTree = (rt: Partial<TreeModelGraph>): Promise<BasicResponse> => {
-//   return req.postJson('/update-tree', rt);
-// };
-//
-// export const createTree = (rt: Partial<TreeModelGraph>): Promise<BasicResponse> => {
-//   return req.postJson('/update-tree', rt);
-// };

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

@@ -8,16 +8,29 @@
         <a-input-search size="small" allowClear v-model:value="behaviorTreeQuery.name" placeholder="行为树名称" @search="loadTress" />
       </div>
       <a-list size="small" :data-source="behaviorTrees || []" style="min-height: 25vh">
+
+
         <template #renderItem="{ item }">
+          <a-list-item>
+            <a-flex>
               <a-tooltip placement="right">
                 <template #title>
                   <p>名称: {{ item.name }}</p>
                   <p>说明: {{item.description}}</p>
                 </template>
-            <a-list-item @click="()=> handleSelect(item)">
+                <span>{{ substring(item.name, 15) }}</span>
-              {{ substring(item.name, 15) }}
-            </a-list-item>
               </a-tooltip>
+              <a-flex class="ks-tree-actions">
+                <span style="margin-right: 10px"  @click="()=> handleSelect(item)"><EditFilled /></span>
+                <a-popconfirm
+                  title="确定删除?"
+                  @confirm="()=> handleDelete(item)"
+                >
+                  <span class="ks-tree-action ks-tree-action-delete"><DeleteOutlined /></span>
+                </a-popconfirm>
+              </a-flex>
+            </a-flex>
+          </a-list-item>
         </template>
       </a-list>
       <a-pagination
@@ -31,15 +44,18 @@
 
 <script lang="ts">
 import { defineComponent, onMounted, ref } from 'vue';
-import { PlusOutlined } from '@ant-design/icons-vue';
+import { CheckOutlined, DeleteOutlined, EditFilled, PlusOutlined } from '@ant-design/icons-vue';
 import type { BehaviorTree, BehaviorTreeRequest } from './types';
-import { findTreesByQuery } from './api';
+import { deleteOneTreeById, findTreesByQuery } from './api';
 import { substring } from '@/utils/strings';
 
 export default defineComponent({
   emits: ['select-tree'],
   components: {
-    PlusOutlined
+    CheckOutlined,
+    PlusOutlined,
+    DeleteOutlined,
+    EditFilled,
   },
   setup(_props, { emit }) {
     const behaviorTrees = ref<BehaviorTree[]>([]);
@@ -50,6 +66,7 @@ export default defineComponent({
     });
     const activeKey = ref<number>(1)
     const totalTress = ref<number>(0);
+
     const loadTress = () => {
       findTreesByQuery(behaviorTreeQuery.value).then(r => {
         behaviorTrees.value = r.rows;
@@ -63,6 +80,14 @@ export default defineComponent({
       loadTress();
     };
 
+    const handleDelete = (item: BehaviorTree) => {
+      deleteOneTreeById(item.id).then(r => {
+        if (r.code === 200) {
+          loadTress();
+        }
+      });
+    };
+
     const columns = [
       {
         title: '名称',
@@ -97,6 +122,7 @@ export default defineComponent({
       customRow,
       handleSelect,
       handleChange,
+      handleDelete,
     };
   },
 })
@@ -111,14 +137,27 @@ export default defineComponent({
       padding: 4px 15px;
       cursor: pointer;
       color: rgb(130 196 233);
+      position: relative;
+
+      .ks-tree-actions {
+        position: absolute;
+        right: 10px;
+        display: none;
+      }
 
       &:hover {
         background: #0d2d4e;
+
+        .ks-tree-actions {
+          display: block;
         }
       }
+
+    }
   }
 
   &.ks-trees-collapse {
+
     .ant-collapse-content-box {
       padding: 0;
       height: 40vh;