快捷复用页面（单纯想记录下）

<template>
  <div class="experimentInfo-container">
    <el-table
      :data="tableData"
      class="borderColor"
      border
      :cell-style="{borderColor:'#C4C7CB',padding:'0'}"
      :header-cell-style="{borderColor:'#C4C7CB'}"
      :row-style="{height:'40px'}"
      size="mini"
    >
      <el-table-column
        align="center"
        label="样本类型"
        prop="sampleType"
      >
      </el-table-column>
      <el-table-column
        align="center"
        label="检查项目"
        prop="itemCheckName"
      >
      </el-table-column>
      <el-table-column
        align="center"
        label="样本状态"
        prop="status"
      >
      </el-table-column>
      <el-table-column
        align="center"
        label="实验时间"
        prop="chargeDescription"
      >
      </el-table-column>
      <el-table-column
        align="center"
        label="备注"
        prop="itemCheckNumber"
      >
      </el-table-column>
    </el-table>
  </div>

</template>

<script>

export default {
  name: 'ExperimentInfo',
  components: {

  },
  props: {
    id: {
      required: true,
      type: Number
    }
  },
  data: () => {
    return {
      tableData: []
    }
  },
  watch: {

  },
  created() {

  },
  methods: {

  }
}
</script>

<style scoped lang="scss">
.experimentInfo-container {
  padding: 20px;
  .borderColor {
    border: 1px solid #c4c7cb;
    ::v-deep .el-table__header-wrapper {
      .el-table__header {
        th {
          border-bottom: 1px solid #c4c7cb !important;
        }
      }
    }
    ::v-deep .el-table__body-wrapper {
      .el-table__body {
        tr {
          &:last-child {
            td {
              border-bottom: none;
            }
          }
        }
      }
    }
  }
  ::v-deep .el-table__empty-block {
    height: 40px !important;
    min-height: 40px !important;
    line-height: 40px;
    .el-table__empty-text {
      height: 40px;
      line-height: 40px;
      margin: 0;
    }
  }
}
</style>

效果如图：