You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
1.6 KiB
68 lines
1.6 KiB
import { watch } from 'vue';
|
|
import { useRouter } from 'vue-router';
|
|
import { useI18n } from 'vue-i18n';
|
|
import type { RouteLocationNormalizedLoaded } from 'vue-router';
|
|
import {
|
|
routeI18nKey,
|
|
findTabByPath
|
|
} from 'ele-admin-pro/es/ele-pro-layout/util';
|
|
import { storeToRefs } from 'pinia';
|
|
import { useThemeStore } from '@/store/modules/theme';
|
|
import { PROJECT_NAME, REDIRECT_PATH, I18N_ENABLE } from '@/config/setting';
|
|
|
|
/**
|
|
* 修改浏览器标题
|
|
* @param title 标题
|
|
*/
|
|
export function setDocumentTitle(title: string) {
|
|
const names: string[] = [];
|
|
if (title) {
|
|
names.push(title);
|
|
}
|
|
if (PROJECT_NAME) {
|
|
names.push(PROJECT_NAME);
|
|
}
|
|
document.title = names.join(' - ');
|
|
}
|
|
|
|
/**
|
|
* 路由切换更新浏览器标题
|
|
*/
|
|
export function useSetDocumentTitle() {
|
|
const { currentRoute } = useRouter();
|
|
const { t, locale } = useI18n();
|
|
const themeStore = useThemeStore();
|
|
const { tabs } = storeToRefs(themeStore);
|
|
|
|
const updateTitle = (route: RouteLocationNormalizedLoaded) => {
|
|
const { path, meta, fullPath } = route;
|
|
if (path.includes(REDIRECT_PATH)) {
|
|
return;
|
|
}
|
|
const pathKey = routeI18nKey(path);
|
|
if (!pathKey) {
|
|
return;
|
|
}
|
|
const tab = findTabByPath(fullPath, tabs.value);
|
|
const title = tab?.title || (meta?.title as string);
|
|
if (!I18N_ENABLE) {
|
|
setDocumentTitle(title);
|
|
return;
|
|
}
|
|
const k = `route.${pathKey}._name`;
|
|
const v = t(k);
|
|
setDocumentTitle(v === k || !v ? title : v);
|
|
};
|
|
|
|
watch(
|
|
currentRoute,
|
|
(route) => {
|
|
updateTitle(route);
|
|
},
|
|
{ immediate: true }
|
|
);
|
|
|
|
watch(locale, () => {
|
|
updateTitle(currentRoute.value);
|
|
});
|
|
}
|