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

<template>
  <div class="m-container">
    <h2>
      <el-page-header @back="onCancel"
                      content="学员详情"></el-page-header>
    </h2>
    <div class="m-core">
      <!-- navMenu -->
      <el-tabs v-model="activeIndex"
               type="card"
               @tab-click="handleClick">
        <el-tab-pane label="基本信息"
                     name="1">
          <studentInfo v-if="activeIndex == 1" />
        </el-tab-pane>
        <el-tab-pane label="乐团&课程"
                     name="2">
          <teamAndcourse v-if="activeIndex == 2" />
        </el-tab-pane>
        <el-tab-pane label="VIP课"
                     name="3">
          <studentVip v-if="activeIndex == 3" />
        </el-tab-pane>
        <el-tab-pane label="上课记录"
                     name="4">
          <studentRecord v-if="activeIndex == 4" />
        </el-tab-pane>
        <el-tab-pane label="扣费记录"
                     name="5">
          <studentPayList v-if="activeIndex == 5" />
        </el-tab-pane>
        <el-tab-pane label="学员订单"
                     name="6">
          <studentOrder v-if="activeIndex == 6" />
        </el-tab-pane>
        <el-tab-pane label="学员提现"
                     name="7">
          <studentCashout v-if="activeIndex == 7" />
        </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 studentOrder from './components/studentOrder.vue';
import studentCashout from './components/studentCashout.vue';
export default {
  components: {
    teamAndcourse,
    studentRecord,
    studentPayList,
    studentInfo,
    studentVip,
    studentOrder,
    studentCashout
  },
  name: 'studentDetail',
  data () {
    return {
      activeIndex: '1',
      // acitveStatus: [true, false, false, false, false, false, false]
    }
  },
  mounted () {
    if (this.$route.query.search) {
      this.Fsearch = this.$route.query.search;
    }
    if (this.$route.query.rules) {
      this.Frules = this.$route.query.rules
    }
  },
  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>