<template>
  <div class="apply">
    <van-sticky>
      <m-header :backUrl="backUrl" :isFixed="false" />
    </van-sticky>
    <van-tabs v-model="active" offset-top="0.44rem" class="vanTabs" @change="onChange" color="#01C1B5">
      <!-- <van-tab title="考前辅导排课" :name="1">
        <free-course class="marginTop" v-if="active == 1" @reLoad="reLoad" />
      </van-tab> -->
      <van-tab title="VIP排课" :name="2">
        <vip-course class="marginTop" v-if="active == 2" @reLoad="reLoad" />
      </van-tab>
      <van-tab title="小组课排课" :name="3">
        <theory-course class="marginTop" v-if="active === 3" @reLoad="reLoad" />
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import MHeader from "@/components/MHeader";
import VipCourse from "./components/vipCourse";
import TheoryCourse from "./components/theoryCourse";
// import merge from 'webpack-merge'
export default {
  name: "applyActive",
  components: { MHeader, VipCourse, TheoryCourse },
  data() {
    return {
      backUrl: {
        status: true,
        path: "/home",
      },
      active: 2,
      organLists: [],
    };
  },
  async mounted() {
    if (this.$route.query.active) {
      this.active = this.$route.query.active;
    }
    document.title = "考级活动";
  },
  methods: {
    onChange() {
      // if (value == 1) {
      //   document.title = "赠课活动";
      // } else if (value == 2) {
      //   document.title = "VIP排课";
      // } else if (value == 3) {
      //   document.title = "小组课排课";
      // }
    },
    beforeChange() {
      // this.$router.push({
      //    query:merge({},{})})
      // return true
    },
    reLoad(index) {
      this.active = index + 1;
      this.$nextTick(() => {
        this.active = index;
      });
    },
  },
};
</script>

<style lang="less" scoped>
.apply {
  min-height: 100vh;
}
.marginTop {
  margin-top: 0.1rem;
  min-height: calc(100vh - 59px - 0.44rem);
}
</style>
