¶Ô±ÈÐÂÎļþ |
| | |
| | | import Vue from 'vue' |
| | | import App from './App.vue' |
| | | import router from './router' |
| | | import store from './store' |
| | | import ElementUI from 'element-ui' |
| | | import './assets/style/element-variables.scss' |
| | | import VueClipboard from 'vue-clipboard2' |
| | | import directives from './directives' |
| | | import filters from './filters' |
| | | import plugins from './plugins' |
| | | import { mapState, mapMutations } from 'vuex' |
| | | import { fetchMenuTree } from './api/system/menu' |
| | | import Treeselect from '@riophae/vue-treeselect' |
| | | import '@riophae/vue-treeselect/dist/vue-treeselect.css' |
| | | Vue.component('treeselect', Treeselect) |
| | | Vue.config.productionTip = false |
| | | Vue.use(ElementUI, { |
| | | size: 'small' |
| | | }) |
| | | Vue.use(VueClipboard) |
| | | Vue.use(directives) |
| | | Vue.use(filters) |
| | | Vue.use(plugins) |
| | | |
| | | new Vue({ |
| | | data: { |
| | | loading: false |
| | | }, |
| | | router, |
| | | store, |
| | | computed: { |
| | | ...mapState(['userInfo', 'homePage']) |
| | | }, |
| | | watch: { |
| | | async userInfo () { |
| | | if (this.userInfo == null) { |
| | | return |
| | | } |
| | | await this.initRoutes() |
| | | } |
| | | }, |
| | | methods: { |
| | | ...mapMutations(['switchCollapseMenu', 'setHomePage']), |
| | | /** |
| | | * åå§åæ¬å°é
ç½® |
| | | */ |
| | | initLocalConfig () { |
| | | // èåç¶æé
ç½® |
| | | const menuStatus = window.localStorage.getItem('MENU_STATUS') |
| | | if (menuStatus != null) { |
| | | this.switchCollapseMenu(menuStatus === 'true') |
| | | } |
| | | }, |
| | | /** |
| | | * åå§åè·¯ç± |
| | | * |
| | | * @returns {Promise<void>} |
| | | */ |
| | | async initRoutes () { |
| | | if (this.loading || this.userInfo == null) { |
| | | return |
| | | } |
| | | this.loading = true |
| | | // éç½®èå |
| | | this.$store.commit('resetMenus') |
| | | // è·åèå |
| | | const storeMenus = this.$store.state.menuData.list |
| | | if (storeMenus.length > 0 && this.homePage == null) { |
| | | this.setHomePage(storeMenus[0]) |
| | | } |
| | | await fetchMenuTree() |
| | | .then(menus => { |
| | | // æ·»å èå |
| | | storeMenus.push.apply(storeMenus, menus) |
| | | // æ·»å è·¯ç± |
| | | this.__addRouters(storeMenus) |
| | | // 404 |
| | | router.addRoute({ |
| | | path: '*', |
| | | redirect: '/not-found' |
| | | }) |
| | | // é¦é¡µ |
| | | router.addRoute({ |
| | | name: 'index', |
| | | path: '/', |
| | | redirect: this.homePage.url |
| | | }) |
| | | // è·¯ç±å è½½å®æåï¼å¦æè®¿é®çæ¯/ï¼è·³è½¬è³å¨æè¯å«çé¦é¡µ |
| | | if (this.$route.path === '/') { |
| | | this.$router.push(this.homePage.url) |
| | | } |
| | | }) |
| | | .catch(e => { |
| | | throw e |
| | | }) |
| | | .finally(() => { |
| | | this.loading = false |
| | | }) |
| | | }, |
| | | /** |
| | | * æ°å»ºè·¯ç± |
| | | * |
| | | * @param routes éæ·»å çè·¯ç± |
| | | * @param parents éæ·»å å°çç®æ å表 |
| | | * @private |
| | | */ |
| | | __addRouters (routes, parents = []) { |
| | | if (routes == null || routes.length === 0) { |
| | | return |
| | | } |
| | | const rs = router.getRoutes() |
| | | for (const route of routes) { |
| | | const parentsDump = JSON.parse(JSON.stringify(parents)) |
| | | parentsDump.push(route) |
| | | if (route.url == null || route.url === '') { |
| | | this.__addRouters(route.children, parentsDump) |
| | | continue |
| | | } |
| | | if (rs.findIndex(r => r.path === route.url) > -1) { |
| | | this.__addRouters(route.children, parentsDump) |
| | | continue |
| | | } |
| | | if (this.homePage == null) { |
| | | this.setHomePage(route) |
| | | } |
| | | router.addRoute('layout', { |
| | | path: route.url, |
| | | name: route.label, |
| | | meta: { |
| | | title: route.label, |
| | | paths: [...parents.map(p => p.label), route.label] |
| | | }, |
| | | component: () => import('@/views' + route.url) |
| | | }) |
| | | this.__addRouters(route.children, parentsDump) |
| | | } |
| | | } |
| | | }, |
| | | async created () { |
| | | if (this.userInfo == null) { |
| | | return |
| | | } |
| | | await this.initRoutes() |
| | | .catch(() => {}) |
| | | }, |
| | | mounted () { |
| | | this.initLocalConfig() |
| | | }, |
| | | render: h => h(App) |
| | | }).$mount('#app') |