// @ts-nocheck import {computed} from "vue"; import {useLocalStorage} from "@vueuse/core"; import {secondLevelRouterKey} from "@/router"; import XEUtils from "xe-utils"; import {RouteLocationNormalizedLoaded} from "vue-router"; // @ts-ignore import {stringIsBlank} from "@/utils/blank-utils"; import router from "@/router"; // 定义Tabs类型 export interface Tab { name: string; query: any; title: string; path: string params: string | null } // 导出tabs对象 export const tabs = useLocalStorage("tabs", []) export const tabsKeys = computed(() => { return XEUtils.eachAndReturnList(tabs, (item) => { return item.name }) }) export const getKeepAliveNames = computed(() => { const tmp = [] secondLevelRouterKey.forEach((item, key) => { if (item.includes(router.currentRoute.value.name)) { tmp.push(key) } }) return [...tmp, ...tabsKeys.value] }) function useTabs() { function routerPush(index: number) { if (XEUtils.has(tabs.value, index)) { const pushInfo = tabs.value[index] router.push({ name: pushInfo.name, query: pushInfo.query, params: pushInfo.params }).then(r => { }) } else { router.push({ name: 'dashboard' }).then(() => { }) } } function removeByIndex(index: number) { const closeInfo = tabs.value[index] const currentRouter = router.currentRoute.value if (closeInfo.name === currentRouter.name) { if (index > 0) { routerPush(index - 1) } else { routerPush(index + 1) } } tabs.value.splice(index, 1) } function tabsAdd(info: RouteLocationNormalizedLoaded) { const hasIndex = tabsKeys.value.indexOf(info.name) const tmp: Tab = { path: info.path, name: info.name, query: info.query, title: info.meta.title, params: info.params } if (XEUtils.get(info, 'meta.hideTabs', true)) { return } if (stringIsBlank(info.name)) { return; } if (hasIndex > -1) { tabs.value[hasIndex] = tmp } else { tabs.value.push(tmp) } } function closeRight(index: number) { tabs.value.splice(index + 1, tabsKeys.value.length - 1); router.push(tabs.value[tabs.value.length - 1].path) } function closeLeft(index: number) { tabs.value.splice(0, index); router.push(tabs.value[0].path) } function closeAll() { router.push({ name: 'dashboard' }).then(() => { }) tabs.value = [] } function isActive(name: string) { return name === router.currentRoute.value.name } function closeOther(index: number) { routerPush(index) tabs.value = tabs.value.splice(index, 1) } return { tabs: tabs, removeByIndex, routerPush, closeRight, closeLeft, closeAll, isActive, closeOther, tabsAdd } } export const useTab = useTabs()