jihe-hs/ruoyi-ui/src/views/JiHeExpressway/components/Table.vue

<template>
  <ElTable class="Table" stripe v-on="bindOns" v-bind="bindAttrs">
    <template>
      <slot />
    </template>
  </ElTable>
</template>

<script>
export default {
  name: 'Table',
  computed: {
    bindAttrs() {
      return {
        stripe: true,
        size: 'mini',
        ...this.$attrs
      }
    },
    bindOns() {
      return this.$listeners
    }
  },
  created() {
    console.log(this)
  },
}
</script>

<style lang='scss' scoped>
div.Table {
  font-size: 16px;
  background-color: unset;
  color: #fff;

  ::v-deep {
    tr {
      background-color: rgba(6, 66, 88, 0);
    }

    .el-table__header-wrapper th,
    .el-table .el-table__fixed-header-wrapper th {
      background-color: rgba(6, 66, 88, .6);
    }

    // &.el-table--striped
    .el-table__body tr.el-table__row--striped td.el-table__cell {
      background: rgba(6, 66, 88, .6);
    }

    // &.el-table--enable-row-hover
    .el-table__body tr:hover>td.el-table__cell {
      background: rgba(6, 66, 88, .9);
    }

    th.el-table__cell.is-leaf,
    td.el-table__cell {
      border-bottom: 0;

      div {
        padding: 0;
      }
    }

    .el-table__header-wrapper th,
    .el-table__fixed-header-wrapper th {
      font-size: 16px;
      height: 42px;
      font-weight: 500;
      color: #00D1FF;
      line-height: 19px;
    }
  }
}

// .Table {}
</style>