<!--  -->
<template>
  <div class="m-container">
    <h2>
      <div class="squrt"></div>课外训练
    </h2>
    <div class="m-core">
      <el-tabs v-model.trim="activeIndex" type="card" @tab-click="handleClick">
        <el-tab-pane label="课外训练" name="1">
          <afterSchoolList v-if="activeIndex == 1" ></afterSchoolList>
        </el-tab-pane>
        <el-tab-pane label="课外训练(教学)" name="2">
          <afterSchoolTeach
            v-if="activeIndex == 2"
          ></afterSchoolTeach>
        </el-tab-pane>
           <el-tab-pane label="课外训练(学员)" name="3">
          <afterWorkList
            v-if="activeIndex == 3" ></afterWorkList>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import afterSchoolList from "@/views/afterSchoolManager/afterSchoolList";
import afterWorkList from "@/views/afterSchoolManager/afterWorkList";
import afterSchoolTeach from "@/views/afterSchoolManager/afterSchoolTeach";
export default {
  components: { afterSchoolList, afterWorkList,afterSchoolTeach },
  data() {
    return {
      activeIndex: "1",
      extracurricularExercisesId: null
    };
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
    this.init();
  },
  activated() {
    this.init()
  },
  methods: {
    init() {
      this.$route.query.activeIndex
        ? (this.activeIndex = this.$route.query.activeIndex)
        : this.activeIndex;
    },
    handleClick(){}
  }
};
</script>
<style lang='scss' scoped>
</style>