<template>
  <div class="m-container">
    <h2>
      <div class="squrt"></div>
      乐团参数设置
    </h2>
    <div class="m-core">
      <!-- navMenu -->
        <tab-router
          v-model.trim="activeIndex"
          type="card"
          @tab-click="handleClick"
        >
          <el-tab-pane
            label="乐团收费类型"
            lazy
            name="2"
            v-if="permissionList.typesManager"
          >
            <typesManager v-if="activeIndex == 2" />
          </el-tab-pane>
          <!-- <el-tab-pane
            label="分部云教练价格配置"
            lazy
            name="13"
          >
            <cloudTeacherFee v-if="activeIndex == 13" />
          </el-tab-pane> -->
          <el-tab-pane
            label="课程时长设置"
            lazy
            name="11"
            v-if="permissionList.courseTimerSetting"
          >
            <courseTimerSetting v-if="activeIndex == 11" />
          </el-tab-pane>
          <el-tab-pane
            label="商品折扣和声部设置"
            lazy
            name="9"
            v-if="permissionList.discountManage"
          >
            <discountManage v-if="activeIndex == 9" />
          </el-tab-pane>
          <el-tab-pane
            label="乐团收费标准"
            lazy
            name="3"
            v-if="permissionList.chargesList"
          >
            <chargesList v-if="activeIndex == 3" />
          </el-tab-pane>
          <el-tab-pane
            label="乐团课程费用"
            lazy
            name="10"
            v-if="permissionList.musicCourseFee"
          >
            <musicCourseFee v-if="activeIndex == 10" />
          </el-tab-pane>
          <el-tab-pane
            label="乐团训练模板"
            lazy
            name="4"
            v-if="permissionList.jobTemplateSetting"
          >
            <jobTemplateSetting v-if="activeIndex == 4" />
          </el-tab-pane>
          <el-tab-pane
            label="热词标签"
            lazy
            name="5"
            v-if="permissionList.errorManager"
          >
            <errorManager v-if="activeIndex == 5" />
          </el-tab-pane>
        </tab-router>
    </div>
  </div>
</template>
<script>
import typesManager from "./specialSetup/typesManager";
import courseTimerSetting from "./specialSetup/courseTimerSetting";
import discountManage from "./specialSetup/discountManage";
import chargesList from "./specialSetup/chargesList";
import musicCourseFee from "./specialSetup/musicCourseFee";
import jobTemplateSetting from "./specialSetup/jobTemplateSetting";
import cloudTeacherFee from "./specialSetup/cloudTeacherFee";
import errorManager from "./generalSettings/errorManager";
import { permission } from "@/utils/directivePage";
export default {
  components: {
    typesManager,
    cloudTeacherFee,
    discountManage,
    jobTemplateSetting,
    errorManager,
    chargesList,
    musicCourseFee,
    courseTimerSetting
  },
  name: "globalConfig",
  data() {
    return {
      activeIndex: "2",
      permissionList: {
        typesManager: permission("/globalConfig/typesManager"),
        cloudTeacherFee: permission("/globalConfig/cloudTeacherFee"),
        chargesList: permission("/globalConfig/chargesList"),
        jobTemplateSetting: permission("/globalConfig/jobTemplateSetting"),
        errorManager: permission("/globalConfig/errorManager"),
        musicCourseFee: permission("/globalConfig/musicCourseFee"),
        discountManage: permission("/globalConfig/discountManage"),
        courseTimerSetting: permission("/globalConfig/courseTimerSetting")
      }
    };
  },
  methods: {
    handleClick(val) {
      this.activeIndex = val.name;
    }
  }
};
</script>
<style lang="scss" scoped>
::v-deep .m-container {
  padding: 0 10px 40px;
}
</style>
