@@ -146,6 +146,10 @@ QQ群: 755242157
|
|||||||
|
|
||||||
本项目遵循 [Apache-2.0](https://github.com/dromara/orion-visor/blob/main/LICENSE) 开源许可证。
|
本项目遵循 [Apache-2.0](https://github.com/dromara/orion-visor/blob/main/LICENSE) 开源许可证。
|
||||||
|
|
||||||
## Gitee 最有价值开源项目 GVP
|
## Gitee 最有价值的开源项目 GVP
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
## GitCode 最有影响力的开源项目 G-Star
|
||||||
|
|
||||||
|

|
||||||
|
|||||||
@@ -215,8 +215,8 @@
|
|||||||
import { triggerMouseEvent } from '@/utils/event';
|
import { triggerMouseEvent } from '@/utils/event';
|
||||||
import { openAppSettingKey, toggleDrawerMenuKey } from '@/types/symbol';
|
import { openAppSettingKey, toggleDrawerMenuKey } from '@/types/symbol';
|
||||||
import { preferenceTipsKey } from './const';
|
import { preferenceTipsKey } from './const';
|
||||||
import { REDIRECT_ROUTE_NAME, routerToTag } from '@/router/constants';
|
import { getRouteTag, openNewRoute } from '@/router';
|
||||||
import { openNewRoute } from '@/router';
|
import { REDIRECT_ROUTE_NAME } from '@/router/constants';
|
||||||
import { checkHasUnreadMessage } from '@/api/system/message';
|
import { checkHasUnreadMessage } from '@/api/system/message';
|
||||||
import SystemMenuTree from '@/components/system/menu/tree/index.vue';
|
import SystemMenuTree from '@/components/system/menu/tree/index.vue';
|
||||||
import MessageBox from '@/components/system/message-box/index.vue';
|
import MessageBox from '@/components/system/message-box/index.vue';
|
||||||
@@ -291,13 +291,13 @@
|
|||||||
const reloadCurrent = async () => {
|
const reloadCurrent = async () => {
|
||||||
if (appStore.tabBar) {
|
if (appStore.tabBar) {
|
||||||
// 重新加载 tab
|
// 重新加载 tab
|
||||||
const itemData = routerToTag(route);
|
const tag = getRouteTag(route);
|
||||||
tabBarStore.deleteCache(itemData);
|
tabBarStore.deleteCache(tag);
|
||||||
await router.push({
|
await router.push({
|
||||||
name: REDIRECT_ROUTE_NAME,
|
name: REDIRECT_ROUTE_NAME,
|
||||||
params: { path: route.fullPath },
|
params: { path: route.fullPath },
|
||||||
});
|
});
|
||||||
tabBarStore.addCache(itemData.name);
|
tabBarStore.addCache(tag.name);
|
||||||
} else {
|
} else {
|
||||||
// 刷新页面
|
// 刷新页面
|
||||||
router.go(0);
|
router.go(0);
|
||||||
|
|||||||
@@ -18,12 +18,16 @@
|
|||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { RouteLocationNormalized } from 'vue-router';
|
import type { RouteLocationNormalized } from 'vue-router';
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
import { computed, onUnmounted, ref, watch } from 'vue';
|
import { computed, onUnmounted, ref, watch } from 'vue';
|
||||||
import { routerToTag } from '@/router/constants';
|
import { getRouteTag, getRouteTitle } from '@/router';
|
||||||
import { listenerRouteChange, removeRouteListener, } from '@/utils/route-listener';
|
import { listenerRouteChange, removeRouteListener } from '@/utils/route-listener';
|
||||||
import { useAppStore, useTabBarStore } from '@/store';
|
import { useAppStore, useTabBarStore } from '@/store';
|
||||||
|
import qs from 'query-string';
|
||||||
import TabItem from './tab-item.vue';
|
import TabItem from './tab-item.vue';
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
const appStore = useAppStore();
|
const appStore = useAppStore();
|
||||||
const tabBarStore = useTabBarStore();
|
const tabBarStore = useTabBarStore();
|
||||||
|
|
||||||
@@ -35,27 +39,33 @@
|
|||||||
return appStore.navbar ? 60 : 0;
|
return appStore.navbar ? 60 : 0;
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(
|
// 监听修改位置
|
||||||
() => appStore.navbar,
|
watch(() => appStore.navbar, () => {
|
||||||
() => {
|
affixRef.value.updatePosition();
|
||||||
affixRef.value.updatePosition();
|
});
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// 监听路由变化
|
// 监听路由变化
|
||||||
listenerRouteChange((route: RouteLocationNormalized) => {
|
listenerRouteChange((route: RouteLocationNormalized) => {
|
||||||
if (
|
// 不固定
|
||||||
!route.meta.noAffix &&
|
if (route.meta.noAffix) {
|
||||||
!tagList.value.some((tag) => tag.path === route.path)
|
return;
|
||||||
) {
|
}
|
||||||
// 固定并且没有此 tab 则添加
|
const tag = tagList.value.find((tag) => tag.path === route.path);
|
||||||
tabBarStore.addTab(routerToTag(route), route.meta?.ignoreCache as unknown as boolean);
|
if (tag) {
|
||||||
|
// 找到 更新信息
|
||||||
|
tag.fullPath = route.fullPath;
|
||||||
|
tag.query = qs.parseUrl(route.fullPath).query;
|
||||||
|
tag.title = getRouteTitle(route);
|
||||||
|
} else {
|
||||||
|
// 未找到 添加标签
|
||||||
|
tabBarStore.addTab(getRouteTag(route), route.meta?.ignoreCache as unknown as boolean);
|
||||||
}
|
}
|
||||||
}, true);
|
}, true);
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
removeRouteListener();
|
removeRouteListener();
|
||||||
});
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|||||||
@@ -1,6 +1,3 @@
|
|||||||
import type { RouteLocationNormalized } from 'vue-router';
|
|
||||||
import type { TagProps } from '@/store/modules/tab-bar/types';
|
|
||||||
|
|
||||||
export const LOGIN_ROUTE_NAME = 'login';
|
export const LOGIN_ROUTE_NAME = 'login';
|
||||||
|
|
||||||
export const REDIRECT_ROUTE_NAME = 'redirect';
|
export const REDIRECT_ROUTE_NAME = 'redirect';
|
||||||
@@ -36,18 +33,3 @@ export const STATUS_ROUTER_LIST = [
|
|||||||
{ name: NOT_FOUND_ROUTER_NAME, children: [] },
|
{ name: NOT_FOUND_ROUTER_NAME, children: [] },
|
||||||
{ name: FORBIDDEN_ROUTER_NAME, children: [] },
|
{ name: FORBIDDEN_ROUTER_NAME, children: [] },
|
||||||
];
|
];
|
||||||
|
|
||||||
/**
|
|
||||||
* router 转 tag
|
|
||||||
*/
|
|
||||||
export const routerToTag = (route: RouteLocationNormalized): TagProps => {
|
|
||||||
const { name, meta, path, fullPath, query } = route;
|
|
||||||
return {
|
|
||||||
title: meta.locale || String(name),
|
|
||||||
name: String(name),
|
|
||||||
path,
|
|
||||||
fullPath,
|
|
||||||
query,
|
|
||||||
ignoreCache: meta.ignoreCache,
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import type { Router } from 'vue-router';
|
import type { Router } from 'vue-router';
|
||||||
import { useMenuStore } from '@/store';
|
import { useMenuStore } from '@/store';
|
||||||
|
import { getRouteTitle } from '@/router';
|
||||||
import { NOT_FOUND_ROUTER_NAME, WHITE_ROUTER_LIST } from '../constants';
|
import { NOT_FOUND_ROUTER_NAME, WHITE_ROUTER_LIST } from '../constants';
|
||||||
import NProgress from 'nprogress';
|
import NProgress from 'nprogress';
|
||||||
import usePermission from '@/hooks/permission';
|
import usePermission from '@/hooks/permission';
|
||||||
@@ -30,10 +31,7 @@ export default function setupPermissionGuard(router: Router) {
|
|||||||
next({ name: NOT_FOUND_ROUTER_NAME });
|
next({ name: NOT_FOUND_ROUTER_NAME });
|
||||||
}
|
}
|
||||||
// 修改页面标题
|
// 修改页面标题
|
||||||
const locale = to.meta?.locale;
|
document.title = getRouteTitle(to);
|
||||||
if (locale) {
|
|
||||||
document.title = locale;
|
|
||||||
}
|
|
||||||
NProgress.done();
|
NProgress.done();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import type { RouteLocationRaw } from 'vue-router';
|
import type { RouteLocationNormalized, RouteLocationRaw } from 'vue-router';
|
||||||
|
import type { TagProps } from '@/store/modules/tab-bar/types';
|
||||||
import { createRouter, createWebHistory } from 'vue-router';
|
import { createRouter, createWebHistory } from 'vue-router';
|
||||||
import { appRoutes } from './routes';
|
import { appRoutes } from './routes';
|
||||||
import { openWindow } from '@/utils';
|
import { openWindow } from '@/utils';
|
||||||
@@ -37,4 +38,27 @@ export const openNewRoute = (route: RouteLocationRaw) => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// route 转 tag
|
||||||
|
export const getRouteTag = (route: RouteLocationNormalized): TagProps => {
|
||||||
|
const { name, meta, path, fullPath, query } = route;
|
||||||
|
return {
|
||||||
|
title: getRouteTitle(route),
|
||||||
|
name: String(name),
|
||||||
|
path,
|
||||||
|
fullPath,
|
||||||
|
query,
|
||||||
|
ignoreCache: meta.ignoreCache,
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取 router title
|
||||||
|
export const getRouteTitle = (route: RouteLocationNormalized) => {
|
||||||
|
const { meta } = route;
|
||||||
|
// 如果 meta.localeTemplate 则根据路由生成
|
||||||
|
if (meta.localeTemplate) {
|
||||||
|
return meta?.localeTemplate(route) || meta.locale || '';
|
||||||
|
}
|
||||||
|
return meta.locale || '';
|
||||||
|
};
|
||||||
|
|
||||||
export default router;
|
export default router;
|
||||||
|
|||||||
3
orion-visor-ui/src/router/typings.d.ts
vendored
3
orion-visor-ui/src/router/typings.d.ts
vendored
@@ -1,3 +1,4 @@
|
|||||||
|
import type { RouteLocationNormalized } from 'vue-router';
|
||||||
import 'vue-router';
|
import 'vue-router';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -21,5 +22,7 @@ declare module 'vue-router' {
|
|||||||
newWindow?: boolean;
|
newWindow?: boolean;
|
||||||
// 是否活跃
|
// 是否活跃
|
||||||
activeMenu?: string;
|
activeMenu?: string;
|
||||||
|
// 名称模板
|
||||||
|
localeTemplate?: (key: RouteLocationNormalized) => string;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user