<template>
  <div class='m-container'>
    <h2>
      <div class="squrt"></div> 内容管理
    </h2>
    <div class="m-core">
      <el-tabs v-model.trim="activeName"
               type="card"
               @tab-click="handleClick">
        <el-tab-pane label="精彩活动"
                     v-if="permissionList.activity"
                     name="0">
          <activity v-if="activeStatus[0]" />
        </el-tab-pane>
        <el-tab-pane label="热门资讯"
                     v-if="permissionList.information"
                     name="1">
          <information v-if="activeStatus[1]" />
        </el-tab-pane>
        <el-tab-pane label="专项训练"
                     v-if="permissionList.training"
                     name="2">
          <training v-if="activeStatus[2]" />
        </el-tab-pane>
        <el-tab-pane label="闪页管理"
                     v-if="permissionList.flashPage"
                     name="3">
          <flashPage v-if="activeStatus[3]" />
        </el-tab-pane>
        <el-tab-pane label="BANNER管理"
                     v-if="permissionList.banner"
                     name="4">
          <banner v-if="activeStatus[4]" />
        </el-tab-pane>
        <el-tab-pane label="APP按钮管理"
                     v-if="permissionList.appPage"
                     name="5">
          <appPage v-if="activeStatus[5]" />
        </el-tab-pane>
        <el-tab-pane label="知识库管理"
                     v-if="permissionList.knowledge"
                     name="6">
          <knowledge v-if="activeStatus[6]" />
        </el-tab-pane>
        <el-tab-pane label="广告管理"
                     v-if="permissionList.advert"
                     name="7">
          <advert v-if="activeStatus[7]" />
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script>
import banner from './components/banner'
import activity from './components/activity'
import information from './components/information'
import training from './components/training'
import flashPage from './components/flashPage'
import appPage from './components/appPage'
import knowledge from './components/knowledge'
import advert from './components/advert'
import { permission } from '@/utils/directivePage'
// 精彩活动 1 0
// 热门资讯 2 1
// 专项训练 4 2
// 闪页管理 5  3s
// BANNER管理 3 4
// APP按钮管理 6 5
// 知识库管理 7 6
// 广告管理 8 7
export default {
  components: { banner, activity, information, training, flashPage, appPage, knowledge, advert },
  name: 'contentManager',
  data () {
    return {
      activeName: "0",
      activeStatus: [true, false, false, false, false, false, false, false],
      permissionList: {
        banner: permission('/contentManager/banner'),
        activity: permission('/contentManager/activity'),
        information: permission('/contentManager/information'),
        training: permission('/contentManager/training'),
        flashPage: permission('/contentManager/flashPage'),
        appPage: permission('/contentManager/appPage'),
        knowledge: permission('/contentManager/knowledge'),
        advert: permission('/contentManager/advert'),
      }
    }
  },
  created () {
    let type = this.$route.query.type
    if (type != null) {
      this.activeName = type.toString()
      this.activeStatus[type] = true
    }
  },
  methods: {
    handleClick (val, event) {
      this.activeName = val.name
      this.activeStatus[val.name] = true
      const origin = window.location.origin
      history.pushState("", "Title", `${origin}/#/contentManager/contentManager?type=${val.name}`)
    }
  }
}
</script>
<style lang="scss">
</style>