树形节点增删改接口调整

zkqy-ui/src/views/tablelist/commonTable/listTreeInfo.vue

@@ -41,7 +41,9 @@
         <!-- 左侧树形 -->
         <div class='container-left'>
           <!-- show-checkbox 节点是否可以被选择 -->
-          <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick" :expand-on-click-node="false">
+          <el-tree :data="treeData" :props="defaultProps" 
+          default-expand-all
+          @node-click="handleNodeClick" @node-dblclick="handleNodeDblClick" :expand-on-click-node="false">
             <span class="custom-tree-node" slot-scope="{ node, data }">
               <!-- <span style="margin-right: 10px;">{{ node.label }}</span> -->
               <span style="margin-right: 10px;">
@@ -59,16 +61,26 @@
               </span>
             </span>
           </el-tree>
-           <!-- 新增节点对话框 -->
-    <el-dialog title="请输入新节点名称" :visible.sync="dialogVisible" width="30%">
-      <el-input v-model="newNodeName" placeholder="请输入内容"></el-input>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="confirmAddNode()">确 定</el-button>
-      </span>
-    </el-dialog>
+          <!-- 新增节点对话框 -->
+          <el-dialog title="请输入新节点名称" :visible.sync="dialogVisible" width="30%">
+            <el-form>
+              <!-- 使用 label 属性 -->
+              <el-form-item label="节点内容">
+                <el-input v-model="newNodeName" placeholder="请输入内容"></el-input>
+              </el-form-item>
+              <!-- 使用 label 属性 -->
+              <el-form-item label="节点位置">
+                <el-radio v-model="treeRadio" label="cur">当前节点</el-radio>
+                <el-radio v-model="treeRadio" label="next">下一节点</el-radio>
+              </el-form-item>
+            </el-form>
+            <span slot="footer" class="dialog-footer">
+              <el-button @click="cancelAddNode()">取 消</el-button>
+              <el-button type="primary" @click="confirmAddNode()">确 定</el-button>
+            </span>
+          </el-dialog>
         </div>
-        
+
         <!-- 右侧 -->
         <div class='container-right'>
           <el-table v-loading="loading" :data="tableList" @selection-change="handleSelectionChange" ref="tableRef"
@@ -238,6 +250,8 @@ export default {
   },
   data() {
     return {
+      // cur next
+      treeRadio: 'cur',
       editingNodeId: null,
       dialogVisible: false,
       newNodeName: '',
@@ -409,6 +423,7 @@ export default {
       FormListDefaultValue: {}, //表单组的默认表单数据
       treeNode: {},
       treeSelectKey: '',
+      clickTimer: null,
     };
   },
   created() {
@@ -469,12 +484,13 @@ export default {
           parentName: this.templateData?.treeTableDgl,
         }
         console.log('editdata', data)
-        
+
         updateTreeNode(data).then(res => {
-            console.log('editdataRes', res)
-            // 成功的话要补上重新调用树形的接口
-          })
-        
+          console.log('editdataRes', res)
+          // 成功的话要补上重新调用树形的接口
+          this.getLeftTreeData(this.treeTableKey);
+        })
+
       }
 
       // 在此处调用你的保存接口
@@ -483,6 +499,16 @@ export default {
       this.currentNode = data; // 记录当前操作的节点
       this.dialogVisible = true; // 显示对话框
     },
+    resetFormFields() {
+      this.newNodeName = ''; // 清空输入框
+      this.treeRadio = 'cur'; // 重置radio选择为默认值
+    },
+    cancelAddNode() {
+      this.dialogVisible = false; // 关闭对话框
+
+      // 清空输入框和radio选择
+      this.resetFormFields();
+    },
     confirmAddNode() {
       if (!this.newNodeName.trim()) {
         this.$message.error('节点名称不能为空');
@@ -498,9 +524,8 @@ export default {
       }
       // this.currentNode.children.push(newNode);
       this.dialogVisible = false; // 关闭对话框
-      this.newNodeName = ''; // 清空输入框
-      console.log('Added node:', newNode,this.currentNode);
-      if(this.currentNode && this.templateData && newNode){
+      console.log('Added node:', newNode, this.currentNode);
+      if (this.currentNode && this.templateData && newNode) {
         let data = {
           // 表名称(固定)
           tableName: this.templateData?.treeTableName,
@@ -514,17 +539,24 @@ export default {
           columnValue: newNode?.name,
           // 父键的名(固定)
           parentName: this.templateData?.treeTableDgl,
+          // 节点位置，当前或下级
+          addLevel: this.treeRadio,
+          // 父键的值
+          parentValue:this.currentNode?.parentId,
         }
-        console.log('add', data)
+        // console.log('add', data)
         addTreeNode(data).then(res => {
-            console.log('addTreeNodeRes', res)
-            // 成功的话要补上重新调用树形的接口
-          })
+          this.resetFormFields();
+          this.getLeftTreeData(this.treeTableKey);
+          // 成功的话要补上重新调用树形的接口
+        })
       }
     },
     deleteNode(node, data) {
-      console.log('deleteNode--->', node, data)
-       if(data && this.templateData){
+      this.$modal
+        .confirm('是否确认删除"' + data?.label + '"的数据项？')
+        .then(()=>{
+          if (data && this.templateData) {
         let data1 = {
           // 表名称(固定)
           tableName: this.templateData?.treeTableName,
@@ -541,10 +573,14 @@ export default {
         }
         console.log('add', data1)
         deleteTreeNode(data1).then(res => {
-            console.log('deleteTreeNode', res)
-            // 成功的话要补上重新调用树形的接口
-          })
-       }
+          console.log('deleteTreeNode', res)
+          this.getLeftTreeData(this.treeTableKey);
+          // 成功的话要补上重新调用树形的接口
+        })
+      }
+        })
+      // console.log('deleteNode--->', node, data)
+      
     },
     getLeftTreeData(treeTableKey) {
       getTreeData(treeTableKey).then(res => {
@@ -563,7 +599,13 @@ export default {
       })
     },
     handleNodeClick(data) {
+      if (this.clickTimer) {
+      clearTimeout(this.clickTimer);
+      this.clickTimer = null;
+      return;
+    }
       // this.querymap.warehouse_name = '一号仓库'
+      this.clickTimer = setTimeout(() => {
       this.treeNode = data,
         this.queryParams = {
           pageNum: 1, // 第几页
@@ -583,7 +625,8 @@ export default {
           },
         },
         this.getList(this.queryParams);
-
+        this.clickTimer = null;
+    }, 200); // 200ms 延迟
     },
     isUpperCase(char) {
       return char === char.toUpperCase();
@@ -2205,4 +2248,5 @@ export default {
   line-height: 20px;
   width: 60px;
 }
+
 </style>