故障联调 表格增加复选框事件回调函数

 <div >
     <!--  表格-->
-    <el-table :border="showBorder" v-loading="loading"  :data="dataList" stripe header-row-class-name="tbl-header-class" :height="height"
+    <el-table :border="showBorder" v-loading="loading"  @selection-change="handleSelectionChange"  :data="dataList" stripe header-row-class-name="tbl-header-class" :height="height"
               style="width: 100%;margin: 0px 0px;">
-        <el-table-column v-if="showIndex && columns.length > 0" type="index" :label="indexLabel" align="center" width="50"/>
         <el-table-column v-if="showSelection && columns.length > 0"  type="selection" width="55" />
+        <el-table-column v-if="showIndex && columns.length > 0" type="index" :label="indexLabel" align="center" width="50"/>
 
         <el-table-column v-for="item in columns" :prop="item.prop" :label="item.label" :sortable="item.sortable  == undefined ? false : item.sortable"  :align="item.align == undefined ? 'center' : item.align "
                          :width="getWidth(item.width)">

@@ -83,6 +83,7 @@ export default {
     setup(props, {attrs, slots, emit}) {
         let currentPage = Vue.ref(1);
         let pageSize = Vue.ref(props.pageSize);
+        let multipleSelection=Vue.ref([]);
 
 
         /**
@@ -159,6 +160,12 @@ export default {
         // Vue.watch(() => filterText.value, (newValue, oldVlaue) => {
         //     proxy.$refs.tree.filter(newValue)
         // });
+        //全选事件
+        let handleSelectionChange=(val)=>{
+            multipleSelection.value = val
+            emit('selectionChange', multipleSelection.value)
+
+        }
 
         // 挂载完
         Vue.onMounted(() => {
@@ -166,6 +173,8 @@ export default {
         })
 
         return {
+            handleSelectionChange,
+            multipleSelection,
             currentPage,
             pageSize,
             handleSizeChange,

@@ -39,8 +39,8 @@
         <el-row class="margin-bottom-50">
           <el-col :span="24" class="table-height">
             <cm-table-page :columns="columns" :dataList="tableDataList" @loaddata="loadTableDataList"
-                           :showIndex="true" :total="count"
-                           :showBorder="true" :loading="false"
+                           :showIndex="true" :total="count" :showSelection="true" @selectionChange="selectionChange"
+                           :showBorder="true" :loading="false" :pageSize="pageSize"
                            :showPage="true" :showTools="true" :height="(height - 500)">
               <template #tools="{scope}">
                 <el-button type="text" size="small" @click.prevent="addRes(scope.row,scope.$index)">

@@ -59,6 +59,8 @@ export default {
         let busTypeList = Vue.ref([]);
         let bizId=Vue.ref();//所属业务id
         let targetId=Vue.ref();//所属模块id
+        let page=Vue.ref(1);//当前页
+        let pageSize=Vue.ref(5);//每页显示条数
         let init = () =>{
 
             let params1={
@@ -122,12 +124,41 @@ export default {
 
 
         }
+        //表格全选事件
+        let selectionChange=(val)=>{
+            let selectData=val;
+            if(selectData.length>0){
+                selectData.map((item,index)=>{
+                    proxy.tableDataList.map((v,i)=>{
+                        if(item.id==v.id){
+                            v.checked=true;
+                        }
+                    })
+                })
+
+            }else{
+                proxy.tableDataList.map((v,i)=>{
+                    v.checked=false;
+                })
+            }
+        }
         //添加所有数据
         let saveAll=()=>{
+            let npmListSelectData=[];
+            proxy.tableDataList.map(item=>{
+                if(item.checked){
+                    npmListSelectData.push(item)
+                }
+
+            })
             let params={
-                busId:proxy.bizId
+                targetId:proxy.targetId,
+                npmList:npmListSelectData
             }
-            proxy.$http.post('/api-web/fault/conf/apm/saveOrUpdate',[params],function (res){
+            /*let params={
+                busId:proxy.bizId
+            }*/
+            proxy.$http.post('/api-web/fault/conf/apm/saveOrUpdate',params,function (res){
                 if(res && res.object){
                     proxy.$global.showMsg('添加成功','success');
                     proxy.targetId=res.src;
@@ -142,6 +173,9 @@ export default {
 
         }
         return {
+            page,
+            pageSize,
+            selectionChange,
             saveAll,
             getResData,
             changeRes,
@@ -177,7 +211,10 @@ export default {
             this.APMVisible=false;
         },
         //重新加载表格数据
-        loadTableDataList(){
+        loadTableDataList(val){
+            console.log("page",val)
+            this.page=val.page;
+            this.pageSize=val.limit;
             this.getNodeList()
         },
         //获取apm配置列表数据
@@ -187,8 +224,8 @@ export default {
                 keyWords:this.keyWords,
                 busId:this.bizId,
                 kpiId:this.kpiTypeArr,
-                page:1,
-                pageSize:5
+                page:this.page,
+                pageSize:this.pageSize,
 
             }
             this.$http.get(`/api-web/fault/conf/apm/getFaultApmAllResInfo`, params, function (res) {

@@ -38,8 +38,8 @@
                 <el-row class="margin-bottom-50">
                     <el-col :span="24" class="table-height">
                         <cm-table-page :columns="columns" :dataList="tableDataList" @loaddata="loadTableDataList"
-                                        :showIndex="true" :total="count"
-                                       :showBorder="true" :loading="false"
+                                        :showIndex="true" :total="count" :showSelection="true" @selectionChange="selectionChange"
+                                       :showBorder="true" :loading="false" :pageSize="pageSize"
                                        :showPage="true" :showTools="true" :height="(height - 500)">
                             <template #default="{row,prop,column}">
                                 <div  v-if="prop == 'url'"  class="text-overflow" :title="row.url">

@@ -53,6 +53,8 @@ export default {
         let busTypeList = Vue.ref([]);
         let networkMonitorList=Vue.ref([]);
         let isLoading=Vue.ref(false);//按钮加载中
+        let page=Vue.ref(1);//当前页
+        let pageSize=Vue.ref(5);//每页显示条数
         let init = () =>{
             proxy.$http.get("/api-web/manage/kpi/list", {}, function(res) {
                 if (res && res.data) {
@@ -107,12 +109,39 @@ export default {
 
 
         }
+        //表格全选事件
+        let selectionChange=(val)=>{
+            console.log("selectionChange",val,val.length)
+            let selectData=val;
+            if(selectData.length>0){
+                selectData.map((item,index)=>{
+                    proxy.tableDataList.map((v,i)=>{
+                        if(item.id==v.id){
+                            v.checked=true;
+                        }
+                    })
+                })
+
+            }else{
+                proxy.tableDataList.map((v,i)=>{
+                    v.checked=false;
+                })
+            }
+        }
         //全部添加
         let saveAll=()=>{
+            console.log("alldata",proxy.tableDataList);
+            let npmListSelectData=[];
+            proxy.tableDataList.map(item=>{
+                if(item.checked){
+                    npmListSelectData.push(item)
+                }
+
+            })
             proxy.isLoading=true;
             let params={
                 targetId:proxy.targetId,
-                npmList:[npmList]
+                npmList:npmListSelectData
             }
 
             proxy.$http.post('/api-web/fault/conf/npm/batchAddNpm',params,function (res){
@@ -127,6 +156,9 @@ export default {
 
         }
         return {
+            page,
+            pageSize,
+            selectionChange,
             isLoading,
             saveAll,
             networkMonitorList,
@@ -162,7 +194,9 @@ export default {
             this.applicationMonitorVisible=false;
         },
         //重新加载表格数据
-        loadTableDataList(){
+        loadTableDataList(val){
+            this.page=val.page;
+            this.pageSize=val.limit;
             this.getNodeList()
         },
         //获取应用监测配置列表数据
@@ -184,8 +218,8 @@ export default {
                 // busId: this.busTypeArr.join(','),
                 bizId: this.bizId,
                 configId: this.config,
-                page: 1,
-                pageSize: 5
+                page: this.page,
+                pageSize: this.pageSize
             }
         },
         //关闭弹框

@@ -157,7 +157,7 @@
                         <el-col :span="24" :class="[{'table-height':!flag},{'table-height-45':flag}]">
                             <cm-table-page :columns="columns" :dataList="tableDataList" @loaddata="loadTableDataList"
                                            :showIndex="true" :total="count"
-                                           :showBorder="true" :loading="false"
+                                           :showBorder="true" :loading="false" :pageSize="pageSize"
                                            :showPage="true" :showTools="true" :height="(height - 500)">
                                 <template #tools="{scope}">
                                     <el-button type="text" size="small" @click.prevent="addRes(scope.row,scope.$index)">

@@ -94,6 +94,8 @@ export default {
         let linkId=Vue.ref();
         //所有图标数据
         let iconArr=Vue.ref([]);
+        let page=Vue.ref(1);//当前页
+        let pageSize=Vue.ref(5);//每页显示条数
         let init = () =>{
             //根据业务id获取资源列表
             let paramsRes={
@@ -274,6 +276,8 @@ export default {
         }
 
         return {
+            page,
+            pageSize,
             addRes,
             setBizId,
             saveLinkAndNodeInfo,
@@ -431,7 +435,9 @@ export default {
 
         },
         //重新加载表格数据
-        loadTableDataList(){
+        loadTableDataList(val){
+            this.page=val.page;
+            this.pageSize=val.limit;
             this.getNodeList()
         },
         //获取配置节点列表数据
@@ -452,8 +458,8 @@ export default {
                 resId: this.resTypeArr,
                 kpiId: this.kpiTypeArr,
                 busId: this.busTypeArr.join(','),
-                page: 1,
-                pageSize: 5
+                page: this.page,
+                pageSize: this.pageSize
             }
         },
         //关闭弹框