dy-admin-manager/src/views/contentManager/index.vue

<template>
  <div class='m-container'>
    <h2>
      <div class="squrt"></div> 内容管理
    </h2>
    <div class="m-core">
      <el-tabs v-model="activeName"
               type="card"
               @tab-click="handleClick">
        <el-tab-pane label="BANNER管理"
                     name="0">
          <banner v-if="activeStatus[0]" />
        </el-tab-pane>
        <el-tab-pane label="精彩活动"
                     name="1">
          <activity v-if="activeStatus[1]" />
        </el-tab-pane>
        <el-tab-pane label="热门资讯"
                     name="2">
          <information v-if="activeStatus[2]" />
        </el-tab-pane>
        <el-tab-pane label="专项训练"
                     name="3">
          <training v-if="activeStatus[3]" />
        </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'
export default {
  components: { banner, activity, information, training },
  name: 'contentManager',
  data () {
    return {
      activeName: "0",
      activeStatus: [true, false, false, false]
    }
  },
  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
    }
  }
}
</script>
<style lang="scss">
</style>