选中颜色

src/views/salary/comparison/index.vue

@@ -16,13 +16,14 @@
       :total="total"
       :page-size="pageInfo.size"
       :page-current="pageInfo.current"
+      :row-class-name="rowClassName"
       @page-change="onPageChange"
       @expand-change="onExpandChange"
     >
       <template #expand="{ row }">
         <el-form label-position="left" inline class="demo-table-expand">
           <m-card shadow="nerve">
-            <el-timeline :reverse="reverse">
+            <el-timeline>
               <el-timeline-item
                 :hide-timestamp="true">
                 <el-row>
@@ -76,6 +77,7 @@ export default {
   name: 'salary-comparison',
   data () {
     return {
+      expandRow: [],
       importLoading: false,
       downloadLoading: false,
       submitLoading: false,
@@ -150,6 +152,10 @@ export default {
         this.$message.error(error)
       }
     },
+    rowClassName ({ row, rowIndex }) {
+      console.log(111, row)
+      return this.expandRow.includes(row.unifiedCertificationNumber) ? 'grey' : null
+    },
     onSearch () {
       this.pageInfo.current = 1
       this.init()
@@ -180,6 +186,7 @@ export default {
       }
     },
     async onExpandChange (row, expandedRows) {
+      this.expandRow = expandedRows.map(e => e.unifiedCertificationNumber)
       if (row.childrenList.length) {
         return
       }
@@ -239,4 +246,7 @@ export default {
   height: 32px;
   line-height: 30px;
 }
+::v-deep .grey {
+  background-color: #f0f0f0;
+}
 </style>