<template>
  <div class="m-container">
    <h2>
      <div class="squrt"></div>
      全局配置
    </h2>
    <div class="m-core">
      <!-- navMenu -->
      <location-hash v-model="activeIndex" @change="handleClick">
        <el-tabs
          v-model.trim="activeIndex"
          type="card"
          @tab-click="handleClick"
        >
          <el-tab-pane
            label="声部设置(对内)"
            lazy
            name="0"
            v-if="permissionList.musicalManager"
          >
            <musicalManager v-if="activeIndex == 0" />
          </el-tab-pane>
          <el-tab-pane
            label="声部设置(对外)"
            lazy
            name="1"
            v-if="permissionList.musicalManagerOut"
          >
            <musicalManagerOut v-if="activeIndex == 1" />
          </el-tab-pane>
          <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="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>
          <el-tab-pane
            label="参数设置"
            lazy
            name="6"
            v-if="permissionList.overallManager"
          >
            <overallManager v-if="activeIndex == 6" />
          </el-tab-pane>
          <el-tab-pane
            label="收费分润配置"
            lazy
            name="7"
            v-if="permissionList.overallManagerTwo"
          >
            <overallManagerTwo v-if="activeIndex == 7" />
          </el-tab-pane>
          <!-- holiday_setting -->
          <el-tab-pane
            label="节假日设置"
            lazy
            name="8"
            v-if="permissionList.holidaySetting"
          >
            <holidaySetting v-if="activeIndex == 8" />
          </el-tab-pane>
        </el-tabs>
      </location-hash>
    </div>
  </div>
</template>
<script>
import musicalManager from "./specialSetup/musicalManager";
import musicalManagerOut from "./specialSetup/musicalManagerOut";
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 errorManager from "./generalSettings/errorManager";
import overallManager from "./generalSettings/overallManager";
import overallManagerTwo from "./generalSettings/overallManagerTwo";
import holidaySetting from "./generalSettings/holidaySetting";
import { permission } from "@/utils/directivePage";
export default {
  components: {
    overallManager,
    overallManagerTwo,
    holidaySetting,
    musicalManager,
    musicalManagerOut,
    typesManager,
    discountManage,
    jobTemplateSetting,
    errorManager,
    chargesList,
    musicCourseFee,
    courseTimerSetting
  },
  name: "globalConfig",
  data() {
    const query = this.$route.query
    return {
      activeIndex: query.opt || "0",
      permissionList: {
        overallManager: permission("/globalConfig/overallManager"),
        overallManagerTwo: permission("/globalConfig/overallManagerTwo"),
        musicalManager: permission("/globalConfig/musicalManager"),
        musicalManagerOut: permission("/globalConfig/musicalManagerOut"),
        typesManager: permission("/globalConfig/typesManager"),
        chargesList: permission("/globalConfig/chargesList"),
        jobTemplateSetting: permission("/globalConfig/jobTemplateSetting"),
        errorManager: permission("/globalConfig/errorManager"),
        holidaySetting: permission("/globalConfig/holidaySetting"),
        musicCourseFee: permission("/globalConfig/musicCourseFee"),
        discountManage: permission("/globalConfig/discountManage"),
        courseTimerSetting: permission("/globalConfig/courseTimerSetting")
      }
    };
  },
  methods: {
    handleClick(val) {
      this.activeIndex = val.name;
    }
  }
};
</script>
<style lang="scss" scoped>
/deep/.m-container {
  padding: 0 10px 40px;
}
</style>
