表格多选

src/components/IStreamTable.vue

 <template>
   <div class="eContainer-table-block">
-    <el-table :data="tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)" style="width: 100%" class="eContainer-table" :header-cell-style="{background: 'eef1f6', color: '#606266'}">
+    <el-table :data="tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
+      style="width: 100%"
+      class="eContainer-table"
+      @selection-change="handleSelectionChange"
+      :row-key="getRowKey"
+      :header-cell-style="{background: 'eef1f6', color: '#606266'}">
+      <el-table-column type="selection" width="55" v-if="showSelection" :reserve-selection="true"></el-table-column>
       <el-table-column
         v-for="(item, key) in tableColumns"
         :key="key"
@@ -40,6 +46,10 @@ export default {
         return [];
       },
     },
+    showSelection: {
+      type: Boolean,
+      default: false
+    }
   },
   computed: {
     tableColumns() {
@@ -84,7 +94,26 @@ export default {
 		},
 		currentChange(currentPage) {
 			this.currentPage = currentPage;
-		}
+		},
+    handleSelectionChange(val) {
+      this.$emit("multipleSelect", this.getSelectedRowIndex(val))
+    },
+    getRowKey(row) {
+      return row['1']
+    },
+    getSelectedRowIndex(val) {
+      const indexArr = []
+      for (let j = 0; j < val.length; j++) {
+        const v = val[j];
+        for (let i = 0; i < this.tableData.length; i++) {
+          const data = this.tableData[i];
+          if (v[1] === data [1]) {
+            indexArr.push(i)
+          } 
+        }
+      }
+      return indexArr
+    }
 	}
 };
 </script>

src/views/Business/Trnrel/Inftrnps.vue

@@ -113,7 +113,7 @@
             <c-button size="small" type="primary" disabled="disabled" @click="onImgmodHisimg">
                 Old.img
             </c-button>
-            <c-button size="small" type="primary" disabled="disabled" @click="onRelrow">
+            <c-button size="small" type="primary" :disabled="relrowDisabled" @click="onRelrow">
                 Release
             </c-button>
             <c-button size="small" type="primary" disabled="disabled" @click="onReprow">
@@ -221,7 +221,7 @@
        </el-col> -->
         <!--<p>{{model.trncorco.trnstm}}</p>-->
 
-        <c-istream-table :list="stmData.data" :columns="stmData.columns">
+        <c-istream-table :list="stmData.data" :columns="stmData.columns" :showSelection="true" v-on:multipleSelect="multipleSelect">
           <el-table-column
               prop="display"
               label="Display"
@@ -272,10 +272,19 @@ export default {
                 ],
                 data: [
                 ]
-            }
+            },
+            relrowDisabled: true,
+            multipleSelection: []
         }
     },
-    methods:{...Event},
+    methods:{
+        multipleSelect(val) {
+            // TODO 根据Status判断按钮是否禁用
+            this.relrowDisabled = !(val.length > 0);
+            this.multipleSelection = val;
+        },
+        ...Event
+    },
     created:function(){
     },
     computed:{