Files
smart-admin/smart-admin-web/javascript-ant-design-vue3/src/main.js

89 lines
3.3 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/*
* 项目启动入口方法
*
* @Author: 1024创新实验室-主任:卓大
* @Date: 2022-09-06 20:59:23
* @Wechat: zhuda1024
* @Email: lab1024@163.com
* @Copyright 1024创新实验室 https://1024lab.net Since 2012
*/
import * as antIcons from '@ant-design/icons-vue';
import Antd, { message } from 'ant-design-vue';
import lodash from 'lodash';
import { createApp } from 'vue';
import JsonViewer from 'vue3-json-viewer';
import 'vue3-json-viewer/dist/index.css';
import App from './App.vue';
import { smartSentry } from '/@/lib/smart-sentry';
import { loginApi } from '/@/api/system/login/login-api';
import constantsInfo from '/@/constants/index';
import { privilegeDirective } from '/@/directives/privilege';
import i18n from '/@/i18n/index';
import privilegePlugin from '/@/plugins/privilege-plugin';
import smartEnumPlugin from '/@/plugins/smart-enums-plugin';
import { buildRoutes, router } from '/@/router/index';
import { store } from '/@/store/index';
import { useUserStore } from '/@/store/modules/system/user';
import '/@/theme/index.less';
import { getTokenFromCookie } from '/@/utils/cookie-util';
/*
* -------------------- ※ 着重 解释说明下这里的初始化逻辑 begin ※ --------------------
*
* 1、很多框架都是 直接调用vue方法创建vue实例然后挂载路由router、状态管理store等等但是关于router这块是有问题的
* 2、现在大部分路由都是从后台返回的直接挂载这个时候前端是没有从后端请求到所有路由的所以只能写到路由拦截器里这也很绕很不清晰
* 比如做法流程应该是:
* 2.1如果存在登录信息则先ajax请求用户的所有路由然后加载再去创建vue实例和挂载路由
* 2.2如果不存在路由信息则创建vue实例和挂载路由此时的路由应该只有login页面因为用户拥有哪些路由是登录之后才知道的
*
* -------------------- ※ 着重 解释说明下这里的初始化逻辑 end ※ --------------------
*/
/**
* 获取用户信息和用户权限对应的路由,构建动态路由
*/
async function getLoginInfo() {
try {
//获取登录用户信息
const res = await loginApi.getLoginInfo();
//构建系统的路由
let menuRouterList = res.data.menuList.filter((e) => e.path || e.frameUrl);
buildRoutes(menuRouterList);
initVue();
//更新用户信息到pinia
useUserStore().setUserLoginInfo(res.data);
} catch (e) {
message.error(e);
smartSentry.captureError(e);
}
}
function initVue() {
let vueApp = createApp(App);
let app = vueApp.use(router).use(store).use(i18n).use(Antd).use(smartEnumPlugin, constantsInfo).use(privilegePlugin).use(JsonViewer);
//注入权限
app.directive('privilege', {
mounted(el, binding) {
privilegeDirective(el, binding);
},
});
// 注册图标组件
Object.keys(antIcons).forEach((key) => {
app.component(key, antIcons[key]);
});
//全局
app.config.globalProperties.$antIcons = antIcons;
app.config.globalProperties.$lodash = lodash;
//挂载
app.mount('#app');
}
//不需要获取用户信息、用户菜单、用户菜单动态路由直接初始化vue即可
let token = getTokenFromCookie();
if (!token) {
initVue();
} else {
getLoginInfo();
}