Commit eae28d2c authored by “yiyousong”'s avatar “yiyousong”

fix:修复动态注册路由i18n报错的问题

parent 19fedc50
import Vue from "vue";
import App from "./App.vue";
import { initRouter } from "./router";
import "./theme/index.less";
import Antd from "ant-design-vue";
import store from "./store";
......@@ -9,7 +8,8 @@ import "./assets/css/common.less";
import "./assets/css/relas.less";
import "./assets/css/use.less";
import Plugins from "@/plugins";
import { initI18n } from "@/utils/i18n";
import { router } from "@/router";
import { i18n } from "@/utils/i18n";
import bootstrap from "@/bootstrap";
import "moment/locale/zh-cn";
import VueResource from "vue-resource";
......@@ -56,8 +56,6 @@ Vue.prototype.$nanoid = nanoid;
import * as echarts from "echarts";
Vue.prototype.$echarts = echarts;
export const router = initRouter(store.state.setting.asyncRoutes);
const i18n = initI18n("CN", "US");
Vue.use(Antd);
Vue.config.productionTip = false;
// Vue.use(Viser)
......
......@@ -7,6 +7,7 @@
<script>
import local from "@/utils/local";
import { mapMutations } from "vuex";
import { createMenus } from "@/router";
export default {
data() {
return {};
......@@ -26,8 +27,15 @@ export default {
]),
// 获取token
getToken() {
let { token, userInfo, siteid, siteName, sysName, sysLogo, path } =
this.$route.query;
let {
token,
userInfo,
siteid,
siteName,
sysName,
sysLogo,
path,
} = this.$route.query;
if (token && userInfo) {
userInfo = JSON.parse(userInfo);
this.SET_userInfo(userInfo);
......@@ -39,6 +47,8 @@ export default {
this.SET_path(path);
local.setLocal("siteId", siteid);
local.setLocal("siteName", siteName);
// 动态菜单
createMenus();
this.$router.push("/website");
} else {
this.$message.warning("跳转失败,请重新登录");
......
......@@ -6,26 +6,6 @@ import Layouts from "@/layouts/Layouts";
// 路由配置
const options = {
routes: [
{
path: "/jump",
name: "跳转页面",
component: () => import("@/pages/basicset/jump/jump"),
},
{
path: "*",
name: "404",
component: () => import("@/pages/exception/404"),
},
{
path: "/403",
name: "403",
component: () => import("@/pages/exception/403"),
},
{
path: "/apppreview",
name: "预览页面",
component: () => import("@/pages/basicset/appmarket/AppPreview"),
},
{
path: "/",
name: "首页",
......@@ -33,7 +13,7 @@ const options = {
redirect: "/website",
children: [
{
path: "website",
path: "/website",
name: "站点管理",
meta: {
icon: "bank",
......@@ -41,7 +21,7 @@ const options = {
component: () => import("@/pages/basicset/site/website"),
},
{
path: "business",
path: "/business",
meta: {
icon: "book",
},
......@@ -118,7 +98,7 @@ const options = {
],
},
{
path: "department",
path: "/department",
meta: {
icon: "audit",
},
......@@ -141,7 +121,7 @@ const options = {
],
},
{
path: "personnel",
path: "/personnel",
name: "工作人员管理",
meta: {
icon: "idcard",
......@@ -149,7 +129,7 @@ const options = {
component: () => import("@/pages/basicset/workman/personnel"),
},
{
path: "festival",
path: "/festival",
name: "节假日管理",
meta: {
icon: "carry-out",
......@@ -157,7 +137,7 @@ const options = {
component: () => import("@/pages/basicset/holiday/festival"),
},
{
path: "deploy",
path: "/deploy",
name: "部署模块管理",
meta: {
icon: "appstore",
......@@ -167,7 +147,7 @@ const options = {
},
{
path: "hall",
path: "/hall",
name: "大厅管理",
meta: {
icon: "gateway",
......@@ -197,7 +177,7 @@ const options = {
},
{
path: "surface",
path: "/surface",
component: () => import("@/pages/basicset/surface/index"),
meta: {
icon: "skin",
......@@ -219,7 +199,7 @@ const options = {
],
},
{
path: "configurat",
path: "/configurat",
name: "短信配置",
meta: {
icon: "mail",
......@@ -228,7 +208,7 @@ const options = {
},
{
path: "appmarket",
path: "/appmarket",
component: () => import("@/pages/basicset/appmarket/Index"),
meta: {
icon: "shop",
......@@ -315,7 +295,7 @@ const options = {
],
},
{
path: "system",
path: "/system",
name: "系统设置",
component: () => import("@/pages/basicset/system/System"),
meta: {
......
import Vue from "vue";
import Router from "vue-router";
import VueRouter from "vue-router";
import { formatRoutes } from "@/utils/routerUtil";
import { i18n } from "@/utils/i18n";
import store from "@/store";
Vue.use(Router);
import { mergeI18nFromRoutes } from "@/utils/i18n";
Vue.use(VueRouter);
//解决重复路由报错
const originalPush = Router.prototype.push;
const originalPush = VueRouter.prototype.push;
// 修改原型对象中的push方法
Router.prototype.push = function push(location) {
VueRouter.prototype.push = function push(location) {
return originalPush.call(this, location).catch((err) => err);
};
const routes = [
{
path: "/jump",
name: "跳转页面",
component: () => import("@/pages/basicset/jump/jump"),
},
{
path: "*",
name: "404",
component: () => import("@/pages/exception/404"),
},
{
path: "/403",
name: "403",
component: () => import("@/pages/exception/403"),
},
{
path: "/apppreview",
name: "预览页面",
component: () => import("@/pages/basicset/appmarket/AppPreview"),
},
];
formatRoutes(routes);
const router = new VueRouter({
routes,
});
// 不需要登录拦截的路由配置
const loginIgnore = {
names: ["404", "403"], //根据路由名称匹配
paths: ["/login"], //根据路由fullPath匹配
paths: ["/login", "/jump"], //根据路由fullPath匹配
/**
* 判断路由是否包含在该配置中
* @param route vue-router 的 route 对象
......@@ -26,18 +55,15 @@ const loginIgnore = {
/**
* 初始化路由实例
* @param isAsync 是否异步路由模式
* @returns {VueRouter}
*/
function initRouter(isAsync) {
let role = store.getters["site/userInfo"].name;
if (!role) return;
const options = isAsync
function initRouter() {
// 是否异步路由模式
const options = store.state.setting.asyncRoutes
? require("./async/config.async").default
: require("./config").default;
formatRoutes(options.routes);
options.routes = calcRouters(options.routes, role);
return new Router(options);
return options;
}
// 判断权限
......@@ -66,4 +92,22 @@ function calcRouters(dynamicRouter, role) {
});
return res;
}
export { loginIgnore, initRouter };
// 动态菜单
function createMenus() {
let role = store.getters["site/userInfo"].name;
if (!role) return;
let options = initRouter();
let routesArr = calcRouters(options.routes, role);
const rootRoute = routesArr.find((item) => item.path === "/");
const menuRoutes = rootRoute && rootRoute.children;
mergeI18nFromRoutes(i18n, menuRoutes);
if (menuRoutes) {
routesArr.forEach((v) => {
router.addRoute(v);
});
store.commit("setting/setMenuData", menuRoutes);
}
}
createMenus();
export { loginIgnore, initRouter, createMenus, router };
......@@ -28,7 +28,6 @@ export default {
menuData(state, getters, rootState) {
if (state.filterMenu) {
const { permissions, roles } = rootState.account;
console.log(permissions, roles);
return filterMenu(deepClone(state.menuData), permissions, roles);
}
return state.menuData;
......
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import routesI18n from '@/router/i18n'
import './Objects'
import { getI18nKey } from '@/utils/routerUtil'
import Vue from "vue";
import VueI18n from "vue-i18n";
import routesI18n from "@/router/i18n";
import "./Objects";
import { getI18nKey } from "@/utils/routerUtil";
/**
* 创建 i18n 配置
......@@ -10,16 +10,18 @@ import { getI18nKey } from '@/utils/routerUtil'
* @param fallback 回退语言
* @returns {VueI18n}
*/
function initI18n (locale, fallback) {
Vue.use(VueI18n)
function initI18n(locale, fallback) {
Vue.use(VueI18n);
let i18nOptions = {
locale,
fallbackLocale: fallback,
silentFallbackWarn: true,
}
return new VueI18n(i18nOptions)
};
return new VueI18n(i18nOptions);
}
const i18n = initI18n("CN", "US");
/**
* 根据 router options 配置生成 国际化语言
* @param lang
......@@ -27,16 +29,22 @@ function initI18n (locale, fallback) {
* @param valueKey
* @returns {*}
*/
function generateI18n (lang, routes, valueKey) {
routes.forEach(route => {
let keys = getI18nKey(route.fullPath).split('.')
let value = valueKey === 'path' ? route[valueKey].split('/').filter(item => !item.startsWith(':') && item != '').join('.') : route[valueKey]
lang.assignProps(keys, value)
function generateI18n(lang, routes, valueKey) {
routes.forEach((route) => {
let keys = getI18nKey(route.fullPath).split(".");
let value =
valueKey === "path"
? route[valueKey]
.split("/")
.filter((item) => !item.startsWith(":") && item != "")
.join(".")
: route[valueKey];
lang.assignProps(keys, value);
if (route.children) {
generateI18n(lang, route.children, valueKey)
generateI18n(lang, route.children, valueKey);
}
})
return lang
});
return lang;
}
/**
......@@ -44,14 +52,18 @@ function generateI18n (lang, routes, valueKey) {
* @param routes
* @param parentPath
*/
function formatFullPath (routes, parentPath = '') {
routes.forEach(route => {
let isFullPath = route.path.substring(0, 1) === '/'
route.fullPath = isFullPath ? route.path : (parentPath === '/' ? parentPath + route.path : parentPath + '/' + route.path)
function formatFullPath(routes, parentPath = "") {
routes.forEach((route) => {
let isFullPath = route.path.substring(0, 1) === "/";
route.fullPath = isFullPath
? route.path
: parentPath === "/"
? parentPath + route.path
: parentPath + "/" + route.path;
if (route.children) {
formatFullPath(route.children, route.fullPath)
formatFullPath(route.children, route.fullPath);
}
})
});
}
/**
......@@ -59,20 +71,16 @@ function formatFullPath (routes, parentPath = '') {
* @param i18n
* @param routes
*/
function mergeI18nFromRoutes (i18n, routes) {
formatFullPath(routes)
const CN = generateI18n(new Object(), routes, 'name')
const US = generateI18n(new Object(), routes, 'path')
i18n.mergeLocaleMessage('CN', CN)
i18n.mergeLocaleMessage('US', US)
const messages = routesI18n.messages
Object.keys(messages).forEach(lang => {
i18n.mergeLocaleMessage(lang, messages[lang])
})
function mergeI18nFromRoutes(i18n, routes) {
formatFullPath(routes);
const CN = generateI18n(new Object(), routes, "name");
const US = generateI18n(new Object(), routes, "path");
i18n.mergeLocaleMessage("CN", CN);
i18n.mergeLocaleMessage("US", US);
const messages = routesI18n.messages;
Object.keys(messages).forEach((lang) => {
i18n.mergeLocaleMessage(lang, messages[lang]);
});
}
export {
initI18n,
mergeI18nFromRoutes,
formatFullPath
}
export { initI18n, mergeI18nFromRoutes, formatFullPath, i18n };
......@@ -136,11 +136,11 @@ function loadRoutes(routesConfig) {
// 提取路由国际化数据
mergeI18nFromRoutes(i18n, router.options.routes);
// 初始化Admin后台菜单数据
const rootRoute = router.options.routes.find((item) => item.path === "/");
const menuRoutes = rootRoute && rootRoute.children;
if (menuRoutes) {
store.commit("setting/setMenuData", menuRoutes);
}
// const rootRoute = router.options.routes.find((item) => item.path === "/");
// const menuRoutes = rootRoute && rootRoute.children;
// if (menuRoutes) {
// store.commit("setting/setMenuData", menuRoutes);
// }
}
/**
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment