update: dist

src/views/enterprise/salutatorySet.vue

@@ -69,7 +69,7 @@
             </div>
             <span @click="openScopeDialog" class="color-2f54eb cursor-pointer" style="margin-left:8px;"> {{ form.suitDepartmentAddList.length ? '修改使用范围' : '请选择使用范围' }}</span>
           </el-form-item>
-          <el-button type="primary" style="margin-left:117px;" :loading="btnLoading" @click="submit">保存</el-button>
+          <el-button type="primary" style="margin-left:117px;" :loading="submitbtnLoading" @click="submit">保存</el-button>
         </el-form>
         <div class="iphone">
           <div class="infoList">
@@ -141,7 +141,7 @@
         <div class="scopeBox">
           <div class="left">
             <el-input placeholder="请输入部门名称" maxlength="50" v-model="filterText" style="width: 398px;" clearable @clear="handlefilterTextClear" @keyup.native="value => toInput(value, searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
-            <el-tree v-loading="loading" ref="tree" :data="treeData" :check-on-click-node="true" show-checkbox node-key="departmentId" :props="defaultProps" :expand-on-click-node="false" class="tree" :render-after-expand="false" @check-change="handleCheckChange" @check="handleCheck">
+            <el-tree :key="showTree" v-loading="loading" ref="tree" :data="treeData" :check-on-click-node="true" show-checkbox node-key="departmentId" :props="defaultProps" :expand-on-click-node="false" class="tree" :render-after-expand="false" @check-change="handleCheckChange" @check="handleCheck">
               <span class="custom-tree-node" slot-scope="{ node }">
                 <span class="font-14  color-2f54eb opacity80 iconfont-hb3  iconqiye-tianchong"></span>
                 <span>{{ node.label }}</span>
@@ -150,7 +150,7 @@
           </div>
           <div class="right">
             <div class="right-top">
-              <span>已选：{{ selectedTreeData.length }}个部门</span><span @click="clearAllSelectedData" class="color-2f54eb cursor-pointer">清空</span>
+              <span>已选：{{ selectedTreeData.length }}个部门</span><el-button type="text" v-show="selectedTreeData.length" @click="clearAllSelectedData" :loading="btnLoading">清空</el-button>
             </div>
             <ul v-if="selectedTreeData.length" class="right-content">
               <li class="contact-li" v-for="(item, index) in selectedTreeData" :key="index + 'gic'">
@@ -239,16 +239,23 @@ export default {
       loading: false,
       dialogLoading: false,
       btnLoading: false,
+      submitbtnLoading: false,
       selectedTreeData: [],
-      friendSettingType: ''
+      friendSettingType: '',
+      showTree: true
     };
   },
-  watch: {},
+  watch: {
+    selectedTreeData(val) {
+      if (!val.length && this.btnLoading) {
+        this.btnLoading = false;
+      }
+    }
+  },
   computed: {
     showEchoData() {
       let bool1 = true;
       let bool2 = false;
-      console.log(this.form.welcomeMediaList);
       if (this.form.welcomeMediaList && this.form.welcomeMediaList.length && this.form.welcomeMediaList.length == 1 && this.form.welcomeMediaList[0].mediaType == 5) {
         bool1 = false;
       }
@@ -305,12 +312,19 @@ export default {
     },
     addSuitDepartment() {
       this.form.suitDepartmentAddList = Object.assign([], this.selectedTreeData);
-      // this.clearAllSelectedData();
       this.scopeVisible = false;
     },
     clearAllSelectedData() {
+      this.btnLoading = true;
       // 清空 右侧 被选中部门树的数据 和 清空 部门树的 选中节点
-      this.$refs.tree.setCheckedKeys([]);
+      setTimeout(() => {
+        this.showTree = !this.showTree;
+        this.treeData = this.handleTreeData(JSON.parse(JSON.stringify(this.treeDataCopy)));
+        this.$nextTick(() => {
+          this.$refs.tree.store._getAllNodes()[0].expanded = true;
+        });
+        this.selectedTreeData = [];
+      });
     },
     handleSelectedDataCancel(item, index) {
       // 删除 右侧 被选中部门树的数据
@@ -355,7 +369,9 @@ export default {
       // 部门树选中变化时
       const obj = JSON.parse(JSON.stringify(data));
       if (!checked) {
-        this.selectedTreeData = this.selectedTreeData.filter(item => item.departmentId !== obj.departmentId);
+        this.$nextTick(() => {
+          this.selectedTreeData = this.selectedTreeData.filter(item => item.departmentId !== obj.departmentId);
+        });
       }
     },
     /**
@@ -585,7 +601,7 @@ export default {
           });
           console.log(para);
           para.welcomeMediaList = para.welcomeMediaList.filter(item => item.mediaType != 5);
-          this.btnLoading = true;
+          this.submitbtnLoading = true;
           postJsonRequest('/haoban-manage3-web/welcome/save', para)
             .then(res => {
               let resData = res.data;
@@ -604,7 +620,7 @@ export default {
               });
             })
             .finally(() => {
-              this.btnLoading = false;
+              this.submitbtnLoading = false;
             });
         }
       });