table

src/components/complexTable/index.vue

        :width="item.width ? item.width : ''" align="center" :className="item.active">
        <template slot-scope="scope">
          <div v-if="scope.row[item.prop]">
            <div v-if="item.active" @click.stop="$emit('jump', scope.row.id)">{{scope.row[item.prop]}}</div>
            <el-button type="text" v-if="item.active" @click.stop="$emit('jump', scope.row.id)">{{scope.row[item.prop]}}</el-button>
            <div v-else> {{scope.row[item.prop]}}</div>
          </div>
          <div v-if="item.operate && typeof scope.row === 'object'">

src/styles/mixin.scss

$mainColor:#409eff;
@import '../element-variables';
$mainColor:$--color-primary;
$bg:#2d3a4b;
$dark_gray:#889aa4;
$light_gray:#eee;

src/styles/sidebar.scss

    .svg-icon {
      margin-right: 16px;
    }
    .el-menu{
      background-color: $menuBg;
    }
    .el-menu-sidebar {
      border: none;
      height: 100%;
      width: 100% !important;
    }
    .el-submenu__title{
      color:#bfcbd9;
    }
  }
  .sidebar-container .nest-menu .el-submenu>.el-submenu__title,
  .sidebar-container .el-submenu .el-menu-item {
    min-width: 200px !important;
    color:#bfcbd9;
    background-color: $subMenuBg !important;
    &:hover {
      background-color: $menuHover !important;

src/views/layout/components/Sidebar/index.vue

      :show-timeout="200"
      :default-active="$route.path"
      background-color="#20436b"
      text-color="#bfcbd9"
      active-text-color="#409EFF"
    >
      text-color="#bfcbd9">
      <sidebar-item v-for="route in permission_routers" :key="permission_routers.name" :item="route" :base-path="route.path"></sidebar-item>
    </el-menu>
  </el-scrollbar>