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

<template>
  <div class="m-container">
    <h2>
      <el-page-header @back="onCancel" :content="studentName"></el-page-header>
    </h2>
    <div class="m-core">
      <!-- navMenu -->
      <el-tabs v-model.trim="activeIndex" type="card" @tab-click="handleClick">
        <el-tab-pane label="基本信息" v-if="permissionList.studentInfo" name="1">
          <studentInfo v-if="activeIndex == 1" />
        </el-tab-pane>
        <el-tab-pane label="乐团&课程" v-if="permissionList.teamAndcourse" name="2">
          <teamAndcourse v-if="activeIndex == 2" />
        </el-tab-pane>
        <el-tab-pane label="VIP课" v-if="permissionList.studentVip" name="3">
          <studentVip v-if="activeIndex == 3" />
        </el-tab-pane>
        <el-tab-pane label="对外课程" v-if="permissionList.studentOutList" name="4">
          <studentOutList v-if="activeIndex == 4" />
        </el-tab-pane>
        <el-tab-pane label="课表详情" v-if="permissionList.studentRecord" name="5">
          <studentRecord v-if="activeIndex == 5" />
        </el-tab-pane>
        <el-tab-pane label="扣费记录" v-if="permissionList.studentPayList" name="6">
          <studentPayList v-if="activeIndex == 6" />
        </el-tab-pane>
        <el-tab-pane label="学员订单" v-if="permissionList.studentOrder" name="7">
          <studentOrder v-if="activeIndex == 7" />
        </el-tab-pane>
        <el-tab-pane label="学员提现" v-if="permissionList.studentCashout" name="8">
          <studentCashout v-if="activeIndex == 8" />
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
import studentInfo from "./components/studentInfo.vue";
import teamAndcourse from "./components/teamAndcourse.vue";
import studentRecord from "./components/studentRecord.vue";
import studentPayList from "./components/studentPayList.vue";
import studentVip from "./components/studentVip.vue";
import studentOutList from "./components/studentOutList.vue";
import studentOrder from "./components/studentOrder.vue";
import studentCashout from "./components/studentCashout.vue";
import { permission } from "@/utils/directivePage";
export default {
  components: {
    teamAndcourse,
    studentRecord,
    studentPayList,
    studentInfo,
    studentVip,
    studentOrder,
    studentCashout,
    studentOutList
  },
  name: "studentDetail",
  data() {
    return {
      activeIndex: "1",
      // acitveStatus: [true, false, false, false, false, false, false]
      permissionList: {
        studentInfo: permission("/studentDetail/studentInfo"),
        teamAndcourse: permission("/studentDetail/teamAndcourse"),
        studentVip: permission("/studentDetail/studentVip"),
        studentRecord: permission("/studentDetail/studentRecord"),
        studentPayList: permission("/studentDetail/studentPayList"),
        studentOrder: permission("/studentDetail/studentOrder"),
        studentCashout: permission("/studentDetail/studentCashout"),
        studentOutList: permission("/studentDetail/studentOutList"),
      },
      studentName: ""
    };
  },
  mounted() {
    if (this.$route.query.search) {
      this.Fsearch = this.$route.query.search;
    }
    if (this.$route.query.rules) {
      this.Frules = this.$route.query.rules;
    }
    this.studentName = this.$route.query.studentName;
  },
  activated() {
    if (this.$route.query.search) {
      this.Fsearch = this.$route.query.search;
    }
    if (this.$route.query.rules) {
      this.Frules = this.$route.query.rules;
    }
    this.studentName = this.$route.query.studentName;
  },
  methods: {
    onCancel() {
      this.$router.push({
        path: "/business/studentList",
        query: { rules: this.Frules, search: this.Fsearch }
      });
    },
    handleClick(val) {
      this.activeIndex = val.name;
      // this.acitveStatus[val.name - 1] = true
    }
  }
};
</script>
<style lang="scss">
</style>