<template>
  <!--  班级列表点查看、课程列表、学员列表-->
  <div class="app-warp">
    <div class="detail-structure">
      <el-page-header :content="content" @back="goBack"/>
      <div class="detail-container">
        <div style="margin: -35px -55px -55px -55px;">
          <student-list/>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import AddClass from './AddClass.vue'
import waves from '@/directive/waves'
import StudentList from './StudentList'
import CourseList from './CourseList'

export default {
  directives: {
    waves
  },
  components: {
    AddClass, StudentList, CourseList
  },
  data() {
    return {
      config: config,
      TabsActive: this.parentObj.TabsActive,
      STATE: this.parentObj.STATE,
      content: '',
      departmentList: []
    }
  },
  watch: {
    TabsActive: {
      handler(newVal) {
        if (newVal === 'first') {
          this.content = '基本信息'
        } else if (newVal === 'second') {
          this.content = '课程列表'
        } else if (newVal === 'third') {
          this.content = '学员列表'
        }
        this.setTabsActive(newVal)
      },
      immediate: true
    }
  },
  inject: ['setActiveName', 'setTabsActive', 'parentObj'],
  methods: {
    goBack() {
      this.setActiveName('List')
    },
    updateDic(e) {
      if (e._props.label === '课程列表') {
        if (this.$refs.courseList) { this.$refs.courseList.getDepartment() }
      }
      if (e._props.label === '课程列表') {
        this.$refs.courseList.getTraintype()
      }
    }
  }
}
</script>

<style scoped lang="scss">
</style>
