<template>
  <div class="m-container">
    <h2>
      学员详情
    </h2>
    <div class="m-core">
      <!-- navMenu -->
      <el-tabs v-model="activeIndex"
               type="card"
               @tab-click="handleClick">
        <el-tab-pane label="基本信息"
                     name="1">
        </el-tab-pane>
        <el-tab-pane label="乐团&课程"
                     name="2">
          <teamAndcourse />
        </el-tab-pane>
        <el-tab-pane label="VIP课"
                     name="3">

        </el-tab-pane>
        <el-tab-pane label="上课记录"
                     name="4">
          <studentRecord />
        </el-tab-pane>
        <el-tab-pane label="扣费记录"
                     name="5">
          <studentPayList />
        </el-tab-pane>
        <el-tab-pane label="学员订单"
                     name="6">
        </el-tab-pane>
        <el-tab-pane label="学员账户"
                     name="7">
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
import teamAndcourse from './components/teamAndcourse.vue';
import studentRecord from './components/studentRecord.vue';
import studentPayList from './components/studentPayList.vue';
export default {
  components: {
    teamAndcourse,
    studentRecord,
    studentPayList
  },
  name: 'studentDetail',
  data () {
    return {
      activeIndex: '2'
    }
  },
  methods: {
    handleClick (val) {
      this.activeIndex = val.name;
    }
  }
}
</script>
<style lang="scss">
</style>