dy-admin-manager/src/views/OAMananger/index.vue

<template>
  <div class="m-container">
    <h2>
      <div class="squrt"></div>
      OA信息管理
      <!-- <div @click="chargeOperation('create')" v-permission="'paymentConfig/add'" class="newBand">添加</div> -->
    </h2>
    <div class="m-core">
      <!-- navMenu -->

      <tab-router
        v-model.trim="activeIndex"
        type="card"
        @tab-click="handleClick"
      >
        <el-tab-pane
          lazy
          label="OA老师列表"
          name="0"
          v-if="permissionList.teacher"
        >
          <teacher v-if="activeIndex == 0" />
        </el-tab-pane>
        <el-tab-pane
          lazy
          label="OA员工列表"
          name="1"
          v-if="permissionList.manager"
        >
          <manager v-if="activeIndex == 1" />
        </el-tab-pane>
      </tab-router>
    </div>
  </div>
</template>
<script>
import teacher from "./teacher";
import manager from "./manager";
import { permission } from "@/utils/directivePage";
export default {
  components: {
    teacher,
    manager
  },
  name: "oaManager",
  data() {
    const query = this.$route.query;
    return {
      activeIndex: "0",
      permissionList: {
        manager: permission("infoOAManager/manager"),
        teacher: permission("infoOAManager/teacher")
      }
    };
  },
  methods: {
    handleClick(val) {
      console.log(val);
      this.activeIndex = val.name;
    }
  }
};
</script>
<style lang="scss" scoped>
::v-deep .m-container {
  padding: 0 10px 40px;
}
</style>