'admin-21.06.01:修复开启后端控制路由isRequestRoutes在非首页刷新页面后，回到首页的问题，感谢群友@伯牙已遇钟子期'

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 🎉🎉🔥 `vue-next-admin` 基于 vue3.x 、Typescript、vite、Element plus 等，适配手机、平板、pc 的后台开源免费模板库（vue2.x 请切换 vue-prev-admin 分支）
 
+## 1.0.3
+
+`2021.06.02`
+
+- ❄️ 删除 G6 思维导图界面
+- 🌟 更新 手动更新 vue、vue-router、vuex 到最近最多人使用的版本，出现不可预测的问题请降低版本。版本查看：<a href="https://www.npmjs.com/package/vue" target="_blank">vue 版本查看</a>
+- 🐞 修复 开启后端控制路由`isRequestRoutes`在非首页刷新页面后，回到首页的问题，感谢群友@伯牙已遇钟子期
+
 ## 1.0.2
 
 `2021.06.01`

README.md

@@ -98,7 +98,6 @@ cnpm run build
 - <a href="https://github.com/vitejs/vite" target="_blank">vite</a>
 - <a href="https://github.com/wangeditor-team/wangEditor" target="_blank">wangeditor</a>
 - <a href="https://github.com/fengyuanchen/cropperjs" target="_blank">cropperjs</a>
-- <a href="https://github.com/antvis/g6" target="_blank">@antv/g6</a>
 - <a href="https://github.com/davidshimjs/qrcodejs" target="_blank">qrcodejs</a>
 - <a href="https://github.com/crabbly/Print.js" target="_blank">print-js</a>
 - <a href="https://github.com/likaia/screen-shot" target="_blank">vue-web-screen-shot</a>

package.json

@@ -1,13 +1,12 @@
 {
 	"name": "vue-next-admin",
-	"version": "1.0.2",
+	"version": "1.0.3",
 	"scripts": {
 		"dev": "vite",
 		"build": "vite build",
 		"lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"
 	},
 	"dependencies": {
-		"@antv/g6": "^4.3.2",
 		"axios": "^0.21.1",
 		"clipboard": "^2.0.8",
 		"countup.js": "^2.0.7",
@@ -22,12 +21,12 @@
 		"screenfull": "^5.1.0",
 		"sortablejs": "^1.13.0",
 		"splitpanes": "^3.0.4",
-		"vue": "^3.0.5",
+		"vue": "^3.0.11",
 		"vue-grid-layout": "^3.0.0-beta1",
 		"vue-i18n": "^9.1.4",
-		"vue-router": "^4.0.2",
+		"vue-router": "^4.0.8",
 		"vue-web-screen-shot": "^1.2.0",
-		"vuex": "^4.0.0-rc.2",
+		"vuex": "^4.0.1",
 		"wangeditor": "^4.7.1"
 	},
 	"devDependencies": {

src/i18n/lang/en.ts

@@ -26,7 +26,6 @@ export default {
 		funSelector: 'funSelector',
 		funWangEditor: 'wangEditor',
 		funCropper: 'cropper',
-		funMindMap: 'G6 MindMap',
 		funQrcode: 'qrcode',
 		funEchartsMap: 'EchartsMap',
 		funPrintJs: 'PrintJs',

src/i18n/lang/zh-cn.ts

@@ -26,7 +26,6 @@ export default {
 		funSelector: '图标选择器',
 		funWangEditor: 'wangEditor 编辑器',
 		funCropper: 'cropper 图片裁剪',
-		funMindMap: 'G6 思维导图',
 		funQrcode: 'qrcode 二维码生成',
 		funEchartsMap: '地理坐标/地图',
 		funPrintJs: '页面打印',

src/i18n/lang/zh-tw.ts

@@ -26,7 +26,6 @@ export default {
 		funSelector: '圖標選擇器',
 		funWangEditor: 'wangEditor 編輯器',
 		funCropper: 'cropper 圖片裁剪',
-		funMindMap: 'G6 心智圖',
 		funQrcode: 'qrcode 二維碼生成',
 		funEchartsMap: '地理座標/地圖',
 		funPrintJs: '頁面列印',

src/router/index.ts

@@ -7,7 +7,7 @@ import { NextLoading } from '/@/utils/loading.ts';
 import { getMenuAdmin, getMenuTest } from '/@/api/menu/index.ts';
 
 // 定义动态路由
-export const dynamicRoutes = [
+export const dynamicRoutes: Array<RouteRecordRaw> = [
 	{
 		path: '/',
 		name: '/',
@@ -409,21 +409,6 @@ export const dynamicRoutes = [
 							icon: 'iconfont icon-caijian',
 						},
 					},
-					{
-						path: '/fun/mindMap',
-						name: 'funMindMap',
-						component: () => import('/@/views/fun/mindMap/index.vue'),
-						meta: {
-							title: 'message.router.funMindMap',
-							isLink: '',
-							isHide: false,
-							isKeepAlive: true,
-							isAffix: false,
-							isIframe: false,
-							auth: ['admin', 'test'],
-							icon: 'iconfont icon-siweidaotu',
-						},
-					},
 					{
 						path: '/fun/qrcode',
 						name: 'funQrcode',
@@ -887,14 +872,13 @@ export function initAllFun() {
 	const token = getSession('token'); // 获取浏览器缓存 token 值
 	if (!token) return false; // 无 token 停止执行下一步
 	store.dispatch('userInfos/setUserInfos'); // 触发初始化用户信息
-	router.addRoute(pathMatch); // 添加404界面
 	resetRoute(); // 删除/重置路由
 	setAddRoute(); // 添加动态路由
 	setFilterMenu(); // 过滤权限菜单
 	setCacheTagsViewRoutes(); // 添加 keepAlive 缓存
 }
 
-// 后端控制路由：模拟执行路由数据初始化
+// 后端控制路由：模拟执行路由数据初始化，防止刷新时丢失
 export async function initBackEndControlRoutesFun() {
 	NextLoading.start(); // 界面 loading 动画开始执行
 	const token = getSession('token'); // 获取浏览器缓存 token 值
@@ -904,17 +888,9 @@ export async function initBackEndControlRoutesFun() {
 	const oldRoutes = JSON.parse(JSON.stringify(res.data)); // 获取接口原始路由（未处理component）
 	store.dispatch('requestOldRoutes/setBackEndControlRoutes', oldRoutes); // 存原始路由到 vuex 中
 	dynamicRoutes[0].children = await backEndRouter(res.data); // 处理路由（component）
-	router.addRoute(pathMatch); // 添加404界面
 	await setAddRoute(); // 添加动态路由
 	setFilterMenu(); // 过滤权限菜单
 	setCacheTagsViewRoutes(); // 添加 keepAlive 缓存
-	setRefreshPagesRestore(); // 防止界面刷新时，出现404、空白、报错等
-}
-
-// 防止界面刷新时，出现404、空白、报错等
-export function setRefreshPagesRestore() {
-	const { matched, query, path } = router.currentRoute.value;
-	if (matched.length <= 0) router.push({ path, query });
 }
 
 // 后端控制路由，isRequestRoutes 为 true，则开启后端控制路由
@@ -1040,37 +1016,35 @@ export function setFilterRoute(chil: any) {
 // 比对后的路由表，进行重新赋值
 export function setFilterRouteEnd() {
 	let filterRouteEnd: any = formatTwoStageRoutes(formatFlatteningRoutes(dynamicRoutes));
-	filterRouteEnd[0].children = setFilterRoute(filterRouteEnd[0].children);
+	filterRouteEnd[0].children = [...setFilterRoute(filterRouteEnd[0].children), { ...pathMatch }];
 	return filterRouteEnd;
 }
 
 // 添加动态路由
 export function setAddRoute() {
-	setFilterRouteEnd().forEach((route: any) => {
+	setFilterRouteEnd().forEach((route: RouteRecordRaw) => {
-		router.addRoute(route as unknown as RouteRecordRaw);
+		const routeName: any = route.name;
+		if (!router.hasRoute(routeName)) router.addRoute(route);
 	});
 }
 
 // 删除/重置路由
 export function resetRoute() {
-	setFilterRouteEnd().forEach((route: any) => {
+	setFilterRouteEnd().forEach((route: RouteRecordRaw) => {
-		const { name } = route;
+		const routeName: any = route.name;
-		router.hasRoute(name) && router.removeRoute(name);
+		router.hasRoute(routeName) && router.removeRoute(routeName);
 	});
 }
 
-// 初始化方法执行
+// isRequestRoutes 为 true，则开启后端控制路由，路径：`/src/store/modules/themeConfig.ts`
 const { isRequestRoutes } = store.state.themeConfig.themeConfig;
 if (!isRequestRoutes) {
-	// 未开启后端控制路由
+	// 前端控制路由：初始化方法，防止刷新时丢失
 	initAllFun();
-} else if (isRequestRoutes) {
-	// 后端控制路由，isRequestRoutes 为 true，则开启后端控制路由
-	initBackEndControlRoutesFun();
 }
 
 // 路由加载前
-router.beforeEach((to, from, next) => {
+router.beforeEach(async (to, from, next) => {
 	NProgress.configure({ showSpinner: false });
 	if (to.meta.title) NProgress.start();
 	const token = getSession('token');
@@ -1087,7 +1061,17 @@ router.beforeEach((to, from, next) => {
 			next('/home');
 			NProgress.done();
 		} else {
-			if (store.state.routesList.routesList.length > 0) next();
+			if (store.state.routesList.routesList.length === 0) {
+				if (isRequestRoutes) {
+					// 后端控制路由：路由数据初始化，防止刷新时丢失
+					await initBackEndControlRoutesFun();
+					// 动态添加路由：防止非首页刷新时跳转回首页的问题
+					// 确保 addRoute() 时动态添加的路由已经被完全加载上去
+					next({ ...to, replace: true });
+				}
+			} else {
+				next();
+			}
 		}
 	}
 });