联调，暂存

src/views/system_manage/dataRefreshSetting.vue

@@ -12,22 +12,26 @@
                     <el-option v-for="item in SubSourceList" :key="item.Source" 
                     :label="item.SubSourceName" :value="item.Source"/>
                 </el-select>
-                <el-button type="primary" @click="showDialog(true)">默认刷新时间</el-button>
+                <el-button type="primary" @click="showDialog(true)"
+                    v-permission="permissionBtn.sysDepartPermission.refresh_default"
+                >默认刷新时间</el-button>
             </div>
             
-            <el-input placeholder="指标ID/指标名称" prefix-icon="el-icon-search" v-model="selectOption.keyWord" v-if="![34,11].includes(Source)"></el-input>
+            <el-input placeholder="指标ID/指标名称" prefix-icon="el-icon-search" 
+                v-model="selectOption.keyWord" @change="selectOptionChange('keyWord')"
+                v-if="![34,11].includes(Source)"></el-input>
             
         </div>
         <div class="table-box" v-if="hasSelectOption">
             <div class="table-select" v-loading="selectOptionLoading">
                 <div class="select-list">
                     <el-select placeholder="终端编码" no-match-text="请选择完整数据源"
-                        v-model="selectOption.terminalCode">
+                        v-model="selectOption.terminalCode" @change="selectOptionChange('terminalCode')">
                         <el-option v-for="i in terminalCodeList" :key="i.TerminalCode"
                             :label="i.Name" :value="i.TerminalCode"/>
                     </el-select>
                     <el-cascader placeholder="ETA指标库分类" no-match-text="请选择完整数据源"
-                        v-model="selectOption.classify"
+                        v-model="selectOption.classify" @change="selectOptionChange('classify')"
                         :options="edbClassifyList"
                         :props="{
                             emitPath:false,
@@ -37,7 +41,7 @@
                         }" />
                     <el-cascader
                         placeholder="创建人" no-match-text="请选择完整数据源"
-                        v-model="selectOption.user"
+                        v-model="selectOption.user" @change="selectOptionChange('user')"
                         :options="userList"
                         :props="{
                             value: 'ItemId',
@@ -50,23 +54,32 @@
                         clearable
                         filterable 
                     />
-                    <el-select placeholder="频度" v-model="selectOption.frequency">
+                    <el-select placeholder="频度" v-model="selectOption.frequency" @change="selectOptionChange('frequency')">
                         <el-option v-for="i in frequencyList" :key="i"
                             :label="i" :value="i"
                         />
                     </el-select>
-                    <el-select placeholder="刷新状态" v-model="selectOption.state">
+                    <el-select placeholder="刷新状态" v-model="selectOption.state" @change="selectOptionChange('state')">
                         <el-option label="启用刷新" :value="1"/>
                         <el-option label="暂停刷新" :value="2"/>
                     </el-select>
                 </div>
                 <div class="select-other">
-                    <el-checkbox :indeterminate="isIndeterminate" v-model="isCheckAll">列表全选</el-checkbox>
-                    <el-button type="primary" @click="showDialog(false)">设置刷新时间</el-button>
-                    <el-button type="primary" @click="isSetStateDialogShow=true">设置刷新状态</el-button>
+                    <el-checkbox :indeterminate="isIndeterminate" v-model="isCheckAll" @change="listCheckAllChange">列表全选</el-checkbox>
+                    <el-button type="primary" @click="showDialog(false)"
+                        v-permission="permissionBtn.sysDepartPermission.refresh_time"
+                    >设置刷新时间</el-button>
+                    <el-button type="primary" @click="isSetStateDialogShow=true"
+                        v-permission="permissionBtn.sysDepartPermission.refresh_state"
+                    >设置刷新状态</el-button>
                 </div>
             </div>
-            <el-table :data="tableData" border>
+            <el-table :data="tableData" border
+                ref="edbDataRef"
+                @selection-change="selectionChange"
+                @select="selectHandle" 
+                @select-all="selectAllHandle"
+                >
                 <!-- 多选 -->
                 <el-table-column
                     align="center"
@@ -187,7 +200,8 @@ export default {
                 {key: 'time',label: '刷新时间'},
                 {key: 'statue',label: '刷新状态'}
             ],
-            tableData: [{ code: 'aaa' }],
+            tableData: [{ code: 'aaa' },{code:'bbb'},{code:'ccc'}],
+            pageSize:10,
 
             isSetTimeDialogShow: false,//设置刷新时间弹窗
             defaultDialogLoading:false,//可能需要获取默认设置，增加loading
@@ -203,9 +217,11 @@ export default {
             isSelectAll:false,//为true时，selectList是剔除的指标，为false时selectList是已选择的指标
             //已选择/已剔除的指标id
             selectList:[],//监听table的select-all select
+            selectionReactCancel:false,
         };
     },
     methods: {
+        //展示刷新时间弹窗
         showDialog(isDefault){
             if(isDefault){
                 //判断数据源是否选择
@@ -303,7 +319,131 @@ export default {
                 state:'',
                 terminalCode:''
             }
-        }
+            this.selectList=[]
+        },
+        //表格筛选项改变时触发
+        selectOptionChange(type){
+            console.log('触发了',type)
+            this.getTableData('optionChange')
+        },
+        getTableData(type){
+            if(type==='optionChange'){
+                //如果是表格筛选项改变导致重新请求数据
+                //数据获取完成后，列表全选，表格全选
+                this.selectList = []
+            }else{
+                //若不是，数据获取完成后，查询列表全选的值
+                //若当页有数据在selectList内，则勾选/剔除
+                this.adjustSelection()
+            }
+        },
+        //勾选/取消勾选表格项
+        adjustSelection(){
+            this.selectionReactCancel=true
+            if(!this.isSelectAll){
+                this.selectList.map(it =>{
+                    let row = this.tableData.find(da => da.code==it)
+                    if(row){
+                        setTimeout(()=>{
+                            this.$refs.edbDataRef.toggleRowSelection(row,true)
+                        },10)
+                    }
+                })
+            }else{
+                this.$refs.edbDataRef.toggleAllSelection()
+                this.selectList.map(it =>{
+                    let row = this.tableData.find(da => da.code==it)
+                    if(row){
+                        setTimeout(()=>{
+                            this.$refs.edbDataRef.toggleRowSelection(row,false)
+                        },50)
+                    }
+                })
+            }
+            setTimeout(()=>{
+                this.selectionReactCancel=false
+            },50)
+        },
+        //列表全选改变
+        listCheckAllChange(value){
+            this.selectList = []
+            this.isSelectAll = value
+            this.$refs.edbDataRef && this.$refs.edbDataRef.clearSelection()
+            if(value){
+                this.$refs.edbDataRef && this.$refs.edbDataRef.toggleAllSelection()
+            }
+        },
+        selectionChange(selection){
+            if(this.selectionReactCancel) return 
+            // selectAllHandle的触发在selectionChange后面，将selectionChange的逻辑延迟一下
+            setTimeout(()=>{
+                // 去重
+                let duplicateArr = Array.from(new Set(this.selectList))
+                //isSelectAll为true时，selectList表示需要剔除的项
+                //isSelectAll为false时，selectList表示需要勾选的项
+                //全选
+                if((duplicateArr.length == this.total && (!this.isSelectAll))|| (duplicateArr.length == 0 && this.isSelectAll)){
+                    this.isCheckAll = true
+                    this.isIndeterminate=false
+                //全不选
+                }else if((duplicateArr.length == 0 && (!this.isSelectAll))|| (duplicateArr.length == this.total && this.isSelectAll)){
+                    this.isCheckAll = false
+                    this.isIndeterminate=false
+                //半选
+                }else{
+                    this.isCheckAll = false
+                    this.isIndeterminate=true
+                }
+            },1)
+        },
+        selectHandle(selection,row){
+            if(this.selectionReactCancel) return 
+            let check = false; 
+            if(selection.some(it => it.code == row.code)){
+                // 勾选
+                if(this.isSelectAll){
+                    check=false
+                }else{
+                    check=true
+                }
+            }else{
+                // 取消勾选
+                if(this.isSelectAll){
+                    check=true
+                }else{
+                    check=false
+                }
+            }
+            if(check){
+                this.selectList.push(row.code)
+                }else{
+                this.selectList=this.selectList.filter(it => it!=row.code)
+            }
+        },
+        selectAllHandle(selection){
+            if(this.selectionReactCancel) return 
+            let check = false; 
+            if(selection && selection.length>0){
+                // 全选
+                if(this.isSelectAll){
+                    check=false
+                }else{
+                    check=true
+                }
+            }else{
+                // 全不选
+                if(this.isSelectAll){
+                    check=true
+                }else{
+                    check=false
+                }
+            }
+            if(check){
+                this.selectList =  [...this.selectList,...this.tableDataIds]
+            }else{
+                this.selectList = this.selectList.filter(it => !this.tableDataIds.includes(it))
+            }
+        },
     },
     mounted(){
         this.getSourceList()