feat: 解决组织机构树懒加载回显问题

frontend/src/business/components/settings/sys/dept.vue

@@ -87,7 +87,7 @@
             :load-options="loadDepts"
             :options="depts"
             style="width: 370px;"
-            placeholder="选择上级类目"
+            placeholder="选择上级类目"            
           />
         </el-form-item>
       </el-form>
@@ -139,9 +139,8 @@ export default {
   data() {
     return {
       rootNodeLoaded: false,
-      depts:null,
-      formType:"add",
-
+      depts: null,
+      formType: "add",
       queryPath: '/api/dept/childNodes',
       deletePath: '/api/dept/delete',
       createPath: '/api/dept/create',
@@ -184,17 +183,51 @@ export default {
       this.formType = "modify";
       this.oldPid = row.pid;
       this.form = Object.assign({}, row);
-      // this.treeByRow(row);
+      this.treeByRow(row);
       listenGoBack(this.closeFunc);
     },
 
     treeByRow(row){
       !this.depts && (this.depts = [])
-      if (!this.depts.some(node => node.id==row.deptId)) {
-        this.depts.push(this.normalizer(row));
+      if (!this.depts.some(node => node.id==row.pid) && row.pid!=0) {
+        const arr = this.mapToArray();
+        const ids = arr.map(item => item.id);
+        const tempTreeNodes = this.treeByArr(arr);
+        const pnodes = this.tableData.filter(node => (node.pid==0) && (ids.indexOf(node.deptId)==-1)).map(node => this.normalizer(node))
+        const showNodes = tempTreeNodes.concat(pnodes)                  
+        this.depts = this.depts.concat(showNodes);                  
       }
     },
 
+   mapToArray() {
+      const result = new Array();
+
+      this.maps.forEach((value, key) => {
+        if(value.hasOwnProperty('row')){
+          result.push(this.editNormalizer(value.row))
+        }        
+      })
+      return result;
+    },
+    treeByArr(arr){
+      if(!Array.isArray(arr) || !arr.length) return;
+        let map = {};
+        arr.forEach(item => map[item.id] = item);
+
+        let roots = [];
+        arr.forEach(item => {
+            const parent = map[item.pid];
+            if(parent){
+                (parent.children || (parent.children=[])).push(item);
+            }
+            else{
+                roots.push(item);
+            }
+        })
+        return roots;
+      
+    },
+
 
     initTableData(row, treeNode, resolve) {
       let _self = this;
@@ -222,6 +255,7 @@ export default {
       this.initTableData();
       this.form = {};
       this.oldPid = null;
+      this.depts = null;
       removeGoBackListener(this.closeFunc);
       this.dialogOrgAddVisible = false;
 
@@ -258,6 +292,14 @@ export default {
         children:node.children
       }
     },
+    editNormalizer(node) {
+      return {
+        id: node.deptId,
+        pid: node.pid,
+        label: node.name,
+        children: node.children
+      }
+    },
     // 改变状态
     changeEnabled(data, val) {
       this.$confirm('此操作将 "停用" ' + data.name + '部门, 是否继续？', '提示', {
@@ -324,7 +366,25 @@ export default {
         this.$set(this.$refs.table.store.states.lazyTreeNodeMap, pid, []);
         this.initTableData(row, treeNode, resolve);
       }
+    },
+    array2Tree(arr){
+        if(!Array.isArray(arr) || !arr.length) return;
+        let map = {};
+        arr.forEach(item => map[item.id] = item);
+
+        let roots = [];
+        arr.forEach(item => {
+            const parent = map[item.pid];
+            if(parent){
+                (parent.children || (parent.children=[])).push(item);
+            }
+            else{
+                roots.push(item);
+            }
+        })
+        return roots;
     }
+    
   }
 
 }