重新整理仓库

src/utils/page-tab-util.ts

@@ -0,0 +1,254 @@
+/**
+ * 页签操作封装
+ */
+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 : ''));
+  }
+}