69 lines
2.2 KiB
TypeScript
69 lines
2.2 KiB
TypeScript
import { watch, unref } from 'vue';
|
||
import { useI18n } from '/@/hooks/web/useI18n';
|
||
import { useTitle as usePageTitle } from '@vueuse/core';
|
||
import { useGlobSetting } from '/@/hooks/setting';
|
||
import { useRouter } from 'vue-router';
|
||
import { useLocaleStore } from '/@/store/modules/locale';
|
||
import { REDIRECT_NAME } from '/@/router/constant';
|
||
import { getMenus } from '/@/router/menus';
|
||
|
||
/**
|
||
* Listening to page changes and dynamically changing site titles
|
||
*/
|
||
export function useTitle() {
|
||
const { title } = useGlobSetting();
|
||
const { t } = useI18n();
|
||
const { currentRoute } = useRouter();
|
||
const localeStore = useLocaleStore();
|
||
|
||
const pageTitle = usePageTitle();
|
||
|
||
watch(
|
||
[() => currentRoute.value.path, () => localeStore.getLocale],
|
||
() => {
|
||
const route = unref(currentRoute);
|
||
|
||
if (route.name === REDIRECT_NAME) {
|
||
return;
|
||
}
|
||
// update-begin--author:liaozhiyang---date:20231110---for：【QQYUN-6938】online菜单名字和页面title不一致
|
||
if (route.params && Object.keys(route.params).length) {
|
||
getMenus().then((menus) => {
|
||
const getTitle = getMatchingRouterName(menus, route.fullPath);
|
||
let tTitle = '';
|
||
if (getTitle) {
|
||
tTitle = t(getTitle);
|
||
} else {
|
||
tTitle = t(route?.meta?.title as string);
|
||
};
|
||
pageTitle.value = tTitle ? ` ${tTitle} - ${title} ` : `${title}`;
|
||
});
|
||
} else {
|
||
const tTitle = t(route?.meta?.title as string);
|
||
pageTitle.value = tTitle ? ` ${tTitle} - ${title} ` : `${title}`;
|
||
}
|
||
// update-end--author:liaozhiyang---date:20231110---for：【QQYUN-6938】online菜单名字和页面title不一致
|
||
},
|
||
{ immediate: true }
|
||
);
|
||
}
|
||
/**
|
||
2023-11-09
|
||
liaozhiyang
|
||
获取路由匹配模式的真实页面名字
|
||
*/
|
||
function getMatchingRouterName(menus, path) {
|
||
for (let i = 0, len = menus.length; i < len; i++) {
|
||
const item = menus[i];
|
||
if (item.path === path && !item.redirect && !item.paramPath) {
|
||
return item.meta?.title;
|
||
} else if (item.children?.length) {
|
||
const result = getMatchingRouterName(item.children, path);
|
||
if (result) {
|
||
return result;
|
||
}
|
||
}
|
||
}
|
||
return '';
|
||
}
|