thoth-frontend-test/src/views/ToConfigure/components/adminIndex.vue

<template>
  <div>
    <el-container class="admin-back">
      <el-aside width="215px" class="admin-conent">
        <!-- 导航 -->
        <admin-nav :datas="datas" :type="1" @delete="deleteTemplate" @createDialog="show = true" @clickName="getNavList" @querySelect="selectTemplates" />
        <!-- 导航 -->
      </el-aside>
      <el-main style="padding: 0; margin-left: 10px" class="admin-conent">
        <!-- 内容 -->
        <adminContent :data="admin_content" :type="1" />
        <!-- 内容 -->
        <!-- 创建/编辑 -->
        <Configure ref="configure" :show.sync="show" :title="'增加模版项'" @update="selectTemplates" />
        <!-- 创建/编辑 -->
      </el-main>
    </el-container>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { selectTemplates, deleteBizTemplate } from '@/api/admin/index'
import Configure from './toConfigureNodel.vue'
import adminNav from '@/views/administrators/components/adminNav.vue'
import adminContent from '@/views/administrators/components/adminContent.vue'
export default {
  components: {
    adminContent,
    adminNav,
    Configure
  },
  data() {
    return {
      show: false,
      datas: [],
      admin_content: {}
    }
  },
  computed: {
    ...mapGetters(['bizId'])
  },
  created() {
    this.selectTemplates()
  },
  methods: {
    async selectTemplates(val) {
      this.show = false
      const ruleForm = { bizId: this.bizId }
      if (val) {
        ruleForm.name = val
        delete ruleForm.content
        delete ruleForm.type
      }
      const res = await selectTemplates(ruleForm)
      if (res.code === 200) {
        this.admin_content = res.data[0] || { name: '无数据', content: '暂无无数据' }
        this.datas = res.data || [{ name: '无数据', content: '无数据' }]
      }
    },
    async deleteTemplate(cal) {
      const res = await deleteBizTemplate({ bizId: this.bizId, templateId: cal.id })
      if (res.code === 200) {
        this.selectTemplates()
        this.$refs.configure.selectBizUnAddTemplates()
        this.$message({ message: '模块删除成功', type: 'success', duration: 1000, offset: 150 })
      }
    },
    getNavList(val) {
      this.admin_content = val
    }
  }
}
</script>

<style>
.admin-back {
   background: #f2f3f6;
}
.admin-conent {
  min-height: calc(100vh - 80px);
  border-radius: 4px;
  background: #FFF;
}
</style>