Parcourir la source

修改机构树全选问题

凉纪 il y a 2 ans
Parent
commit
0b3d1cc350
2 fichiers modifiés avec 33 ajouts et 45 suppressions
  1. 5 7
      src/components/orgTree/index.vue
  2. 28 38
      src/components/orgTreeSelect/index.vue

+ 5 - 7
src/components/orgTree/index.vue

@@ -13,8 +13,7 @@
     <div class="tree-container">
       <div style="margin-bottom: 10px" v-show="showLowerCheck">
         <el-checkbox v-model="checkSub" @change="changeCheckBox"
-          >关联下级</el-checkbox
-        >
+          >关联下级</el-checkbox>
       </div>
       <el-tree
         :data="treeList"
@@ -34,8 +33,7 @@
             class="item"
             effect="light"
             :content="node.label"
-            placement="top-start"
-          >
+            placement="top-start">
             <span>{{ node.label }}</span>
           </el-tooltip>
         </span>
@@ -123,9 +121,9 @@ export default {
         this.dataFn(this.treeList);
       }
     },
-    dataFn(arr) {
-      console.log(arr, "arrr");
-      if(arr.length==0)return
+    dataFn(arr){
+      if(!arr||arr.length===0) return;
+      console.log(arr,'arrr')
       this.defaultKeys.push(arr[0].id);
       this.$emit("defaultKey", arr[0].id);
       this.$emit("defaultOrg", arr[0]);

+ 28 - 38
src/components/orgTreeSelect/index.vue

@@ -15,7 +15,7 @@
       style="width: 100%; margin-bottom: 20px"
       v-model="queryForm.value"
       @input="serchTreeHandler"
-      placeholder="请输入过滤值"
+      placeholder="请输入查询机构名称"
     ></el-input>
     <!--  下拉框   -->
     <el-row :gutter="20" type="flex" align="middle">
@@ -36,7 +36,7 @@
         </el-select>
       </el-col>
       <el-col :span="10" :xs="24">
-        <el-checkbox v-if="!disable" v-model="checked">按过滤机构类型勾选</el-checkbox>
+        <el-checkbox v-if="queryForm.type" :disabled="disable" v-model="checked">按过滤机构类型勾选</el-checkbox>
       </el-col>
     </el-row>
     <!--  机构树   -->
@@ -107,8 +107,6 @@ export default {
   },
   data() {
     return {
-      //是否取消关联父子级
-      strictly: true,
       //清除图标
       showClearable: false,
       //弹窗显示
@@ -122,19 +120,15 @@ export default {
       },
       //受否全选
       checked: false,
-      //默认展示的node
-      //defaultNode:[],
       //已选中的node
       sNodeList: [],
+      //默认显示及展开的node
       nodes: [],
     };
   },
   mounted() {
     this.getDeptTree();
   },
-  computed:{
-
-  },
   watch: {
     defaultNode: {
       immediate: true,
@@ -151,15 +145,6 @@ export default {
         });
       },
     },
-    checked: {
-      handler(v) {
-        if (v) {
-          this.strictly = false;
-        } else {
-          this.strictly = true;
-        }
-      },
-    },
     queryData: {
       handler(n) {
         if (n) {
@@ -180,10 +165,7 @@ export default {
       //   },
       // },
     },
-    // computed: {
-    //   defaultNode:
-    //   //pv: sync("value"),
-    // },
+
 
   },
   methods: {
@@ -231,28 +213,36 @@ export default {
       },
       onCheck(data, checked, tree) {
         if (this.checked) {
-          //当前按过滤机构类型勾选
-
-          //递归查询
-          this.recursionTreeHandler(this.queryForm.type, [data]);
+          let checkNodes = this.$refs.tree.getCheckedNodes();
+          let type = this.queryForm.type;
+          let recursionFn = function(tree) {
+            tree.forEach((item) => {
+              if (type == item.type) {
+                checkNodes.push(item);
+                //console.log('name',checkNodes.indexOf(item))
+                //checkNodes.indexOf(item) >= 0? checkNodes.splice(checkNodes.indexOf(item),1):checkNodes.push(item);
+              }
+              if (item.children?.length > 0) {
+                recursionFn(item.children)
+              } else {
+                return;
+              }
+            });
+          }
+         // 递归查询
+          recursionFn(data.children);
+          let arr = checkNodes.filter(v=>{
+            return v.type == this.queryForm.type}
+          );
+          this.$refs.tree.setCheckedNodes(arr);
+          this.sNodeList = this.$refs.tree.getCheckedNodes();
+          return
         }
         // debugger;
         this.sNodeList = this.$refs.tree.getCheckedNodes();
         this.$emit("selectNode", JSON.stringify(this.sNodeList));
       },
-      recursionTreeHandler(type, tree) {
-        tree.forEach((item) => {
-          if (type == item.type) {
-            this.$refs.tree.setCheckedKeys([item.id])
 
-          }
-        });
-        if (tree.children && tree.children.length > 0) {
-          this.recursionTreeHandler(type, tree.children)
-        } else {
-          return;
-        }
-      },
       getSubOrgIdsByOrgType(topOrg, orgType, orgIdList) {
         if (!topOrg) return;
         if (topOrg.type == orgType) {