xiangan_pc/src/page-subspecialty/views/main.vue

<template>
  <div v-loading.fullscreen.lock="loading" :element-loading-text="$t('loading')" :class="['aui-wrapper', { 'aui-sidebar--fold': $store.state.sidebarFold }]">
    <template v-if="!loading">
      <main-navbar />
      <main-sidebar />
      <div class="aui-content__wrapper">
        <main-content v-if="!$store.state.contentIsNeedRefresh" />
      </div>
    </template>
  </div>
</template>

<script>
import MainNavbar from './main-navbar'
import MainSidebar from './main-sidebar'
import MainContent from './main-content'
import debounce from 'lodash/debounce'
import { isURL } from '@/utils/validate'

export default {
  provide() {
    return {
      // 刷新
      refresh() {
        this.$store.state.contentIsNeedRefresh = true
        this.$nextTick(() => {
          this.$store.state.contentIsNeedRefresh = false
        })
      }
    }
  },
  components: {
    MainNavbar,
    MainSidebar,
    MainContent
  },
  data() {
    return {
      loading: true
    }
  },
  watch: {
    $route: 'routeHandle'
  },
  created() {
    this.windowResizeHandle()
    this.routeHandle(this.$route)
    Promise.all([
      this.getUserInfo(),
      this.getPermissions()
    ]).then(() => {
      this.loading = false
    })
  },
  methods: {
    // 窗口改变大小.
    windowResizeHandle() {
      this.$store.state.sidebarFold = document.documentElement.clientWidth <= 992 || false
      window.addEventListener('resize', debounce(() => {
        this.$store.state.sidebarFold = document.documentElement.clientWidth <= 992 || false
      }, 150))
    },
    // 路由, 监听
    routeHandle(route) {
      if (!route.meta.isTab) {
        return false
      }
      let tab = {}
      let routeName = route.name
      const routeMeta = route.meta
      if (route.name === 'iframe') {
        const url = route.query.url || ''
        if (!isURL(url)) {
          return false
        }
        const key = route.query.key || new Date().getTime()
        routeName = `${routeName}_${key}`
        routeMeta.title = key.toString()
        routeMeta.menuId = route.query.menuId || ''
        routeMeta.iframeURL = url
      }
      tab = this.$store.state.contentTabs.filter(item => item.name === routeName)[0]
      if (!tab) {
        tab = {
          ...window.SITE_CONFIG.contentTabDefault,
          ...routeMeta,
          name: routeName,
          params: { ...route.params },
          query: { ...route.query }
        }
        this.$store.state.contentTabs = this.$store.state.contentTabs.concat(tab)
      }
      this.$store.state.sidebarMenuActiveName = tab.menuId
      this.$store.state.contentTabsActiveName = tab.name
    },
    // 获取当前登录用户信息
    getUserInfo() {
      return this.$http.get('/sys/user/info').then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        this.$store.state.user = { ...res.data, name: res.data.realName }
      }).catch(() => {})
    },
    // 获取权限
    getPermissions() {
      return this.$http.get('/sys/menu/permissions', {
        params: {
          drgsName: window.localStorage.getItem('identity')
        }
      }).then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        window.SITE_CONFIG.permissions = res.data
      }).catch(() => {})
    }
  }
}
</script>