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.
254 lines
5.4 KiB
254 lines
5.4 KiB
/**
|
|
* 页签操作封装
|
|
*/
|
|
import { unref } from 'vue';
|
|
import type { RouteLocationNormalizedLoaded } from 'vue-router';
|
|
import type { TabItem, TabRemoveOption } from 'ele-admin-pro/es';
|
|
import { message } from 'ant-design-vue/es';
|
|
import router from '@/router';
|
|
import { useThemeStore } from '@/store/modules/theme';
|
|
import type { RouteReloadOption } from '@/store/modules/theme';
|
|
import { removeToken } from '@/utils/token-util';
|
|
import { setDocumentTitle } from '@/utils/document-title-util';
|
|
import {
|
|
HOME_PATH,
|
|
LAYOUT_PATH,
|
|
REDIRECT_PATH,
|
|
REPEATABLE_TABS
|
|
} from '@/config/setting';
|
|
const HOME_ROUTE = HOME_PATH || LAYOUT_PATH;
|
|
const BASE_URL = import.meta.env.BASE_URL;
|
|
|
|
/**
|
|
* 刷新页签参数类型
|
|
*/
|
|
export interface TabReloadOptions {
|
|
// 是否是主页
|
|
isHome?: boolean;
|
|
// 路由地址
|
|
fullPath?: string;
|
|
}
|
|
|
|
/**
|
|
* 刷新当前路由
|
|
*/
|
|
export function reloadPageTab(option?: TabReloadOptions) {
|
|
if (!option) {
|
|
// 刷新当前路由
|
|
const { path, fullPath, query } = unref(router.currentRoute);
|
|
if (path.includes(REDIRECT_PATH)) {
|
|
return;
|
|
}
|
|
const isHome = isHomeRoute(unref(router.currentRoute));
|
|
setRouteReload({
|
|
reloadHome: isHome,
|
|
reloadPath: isHome ? void 0 : fullPath
|
|
});
|
|
router.replace({
|
|
path: REDIRECT_PATH + path,
|
|
query
|
|
});
|
|
} else {
|
|
// 刷新指定页签
|
|
const { fullPath, isHome } = option;
|
|
setRouteReload({
|
|
reloadHome: isHome,
|
|
reloadPath: isHome ? void 0 : fullPath
|
|
});
|
|
router.replace(REDIRECT_PATH + fullPath);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 关闭当前页签
|
|
*/
|
|
export function finishPageTab() {
|
|
const key = getRouteTabKey();
|
|
removePageTab({ key, active: key });
|
|
}
|
|
|
|
/**
|
|
* 关闭页签
|
|
*/
|
|
export function removePageTab(option: TabRemoveOption) {
|
|
useThemeStore()
|
|
.tabRemove(option)
|
|
.then(({ path, home }) => {
|
|
if (path) {
|
|
router.push(path);
|
|
} else if (home) {
|
|
router.push(HOME_ROUTE);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
message.error('当前页签不可关闭');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 关闭左侧页签
|
|
*/
|
|
export function removeLeftPageTab(option: TabRemoveOption) {
|
|
useThemeStore()
|
|
.tabRemoveLeft(option)
|
|
.then(({ path }) => {
|
|
if (path) {
|
|
router.push(path);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
message.error('左侧没有可关闭的页签');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 关闭右侧页签
|
|
*/
|
|
export function removeRightPageTab(option: TabRemoveOption) {
|
|
useThemeStore()
|
|
.tabRemoveRight(option)
|
|
.then(({ path, home }) => {
|
|
if (path) {
|
|
router.push(path);
|
|
} else if (home) {
|
|
router.push(HOME_ROUTE);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
message.error('右侧没有可关闭的页签');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 关闭其它页签
|
|
*/
|
|
export function removeOtherPageTab(option: TabRemoveOption) {
|
|
useThemeStore()
|
|
.tabRemoveOther(option)
|
|
.then(({ path, home }) => {
|
|
if (path) {
|
|
router.push(path);
|
|
} else if (home) {
|
|
router.push(HOME_ROUTE);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
message.error('没有可关闭的页签');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 关闭全部页签
|
|
* @param active 当前选中页签
|
|
*/
|
|
export function removeAllPageTab(active: string) {
|
|
useThemeStore()
|
|
.tabRemoveAll(active)
|
|
.then(({ home }) => {
|
|
if (home) {
|
|
router.push(HOME_ROUTE);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
message.error('没有可关闭的页签');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 登录成功后清空页签
|
|
*/
|
|
export function cleanPageTabs() {
|
|
useThemeStore().setTabs([]);
|
|
}
|
|
|
|
/**
|
|
* 添加页签
|
|
* @param data 页签数据
|
|
*/
|
|
export function addPageTab(data: TabItem | TabItem[]) {
|
|
useThemeStore().tabAdd(data);
|
|
}
|
|
|
|
/**
|
|
* 修改页签
|
|
* @param data 页签数据
|
|
*/
|
|
export function setPageTab(data: TabItem) {
|
|
useThemeStore().tabSetItem(data);
|
|
}
|
|
|
|
/**
|
|
* 修改页签标题
|
|
* @param title 标题
|
|
*/
|
|
export function setPageTabTitle(title: string) {
|
|
setPageTab({ key: getRouteTabKey(), title });
|
|
setDocumentTitle(title);
|
|
}
|
|
|
|
/**
|
|
* 获取当前路由对应的页签 key
|
|
*/
|
|
export function getRouteTabKey() {
|
|
const { path, fullPath, meta } = unref(router.currentRoute);
|
|
const isUnique = meta.tabUnique === false || REPEATABLE_TABS.includes(path);
|
|
return isUnique ? fullPath : path;
|
|
}
|
|
|
|
/**
|
|
* 设置主页的组件名称
|
|
* @param components 组件名称
|
|
*/
|
|
export function setHomeComponents(components: string[]) {
|
|
useThemeStore().setHomeComponents(components);
|
|
}
|
|
|
|
/**
|
|
* 设置路由刷新信息
|
|
* @param option 路由刷新参数
|
|
*/
|
|
export function setRouteReload(option: RouteReloadOption | null) {
|
|
return useThemeStore().setRouteReload(option);
|
|
}
|
|
|
|
/**
|
|
* 判断路由是否是主页
|
|
* @param route 路由信息
|
|
*/
|
|
export function isHomeRoute(route: RouteLocationNormalizedLoaded) {
|
|
const { path, matched } = route;
|
|
if (HOME_ROUTE === path) {
|
|
return true;
|
|
}
|
|
return (
|
|
matched[0] &&
|
|
matched[0].path === LAYOUT_PATH &&
|
|
matched[0].redirect === path
|
|
);
|
|
}
|
|
|
|
/**
|
|
* 登录成功后跳转首页
|
|
* @param from 登录前的地址
|
|
*/
|
|
export function goHomeRoute(from?: string) {
|
|
router.replace(from || HOME_ROUTE);
|
|
}
|
|
|
|
/**
|
|
* 退出登录
|
|
* @param route 是否使用路由跳转
|
|
* @param from 登录后跳转的地址
|
|
*/
|
|
export function logout(route?: boolean, from?: string) {
|
|
removeToken();
|
|
if (route) {
|
|
router.push({
|
|
path: '/login',
|
|
query: from ? { from } : void 0
|
|
});
|
|
} else {
|
|
// 这样跳转避免再次登录重复注册动态路由
|
|
location.replace(BASE_URL + 'login' + (from ? '?from=' + from : ''));
|
|
}
|
|
}
|