feat(projects): 添加路由跳转浏览器新标签

src/composables/common/router.ts

@@ -1,7 +1,7 @@
 import { unref } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
 import type { RouteLocationRaw } from 'vue-router';
-import { router as globalRouter, routeName } from '@/router';
+import { router as globalRouter, routeName, ROUTE_HOME } from '@/router';
 import type { LoginModuleType } from '@/interface';
 
 /**
@@ -12,9 +12,26 @@ export function useRouterPush(inSetup: boolean = true) {
   const router = inSetup ? useRouter() : globalRouter;
   const route = inSetup ? useRoute() : unref(globalRouter.currentRoute);
 
-  /** 跳转首页 */
-  function toHome() {
-    router.push('/');
+  /**
+   * 路由跳转
+   * @param to - 路由
+   * @param newTab - 在新的浏览器标签打开
+   */
+  function routerPush(to: RouteLocationRaw, newTab = false) {
+    if (newTab) {
+      const routerData = router.resolve(to);
+      window.open(routerData.href, '_blank');
+      return;
+    }
+    router.push(to);
+  }
+
+  /**
+   * 跳转首页
+   * @param newTab - 在新的浏览器标签打开
+   */
+  function toHome(newTab = false) {
+    routerPush(ROUTE_HOME.path, newTab);
   }
 
   /**
@@ -22,12 +39,14 @@ export function useRouterPush(inSetup: boolean = true) {
    * - current: 取当前的path作为重定向地址
    */
   type LoginRedirect = 'current' | string;
+
   /**
    * 跳转登录页面(通过vue路由)
    * @param module - 展示的登录模块
    * @param redirect - 重定向地址(登录成功后跳转的地址)
+   * @param newTab - 在新的浏览器标签打开
    */
-  function toLogin(module: LoginModuleType = 'pwd-login', redirect: LoginRedirect = 'current') {
+  function toLogin(module: LoginModuleType = 'code-login', redirect: LoginRedirect = 'current', newTab = false) {
     const routeLocation: RouteLocationRaw = {
       name: routeName('login'),
       params: { module }
@@ -35,32 +54,27 @@ export function useRouterPush(inSetup: boolean = true) {
     if (redirect) {
       let url = redirect;
       if (redirect === 'current') {
-        url = router.currentRoute.value.fullPath;
+        url = route.fullPath;
       }
       Object.assign(routeLocation, { query: { redirect: url } });
     }
-    router.push(routeLocation);
+    routerPush(routeLocation, newTab);
   }
 
   /**
    * 登陆页跳转登陆页(登录模块切换)
    * @param module - 展示的登录模块
-   * @param query - 查询参数
+   * @param newTab - 在新的浏览器标签打开
    */
-  function toCurrentLogin(module: LoginModuleType) {
+  function toCurrentLogin(module: LoginModuleType, newTab = false) {
     const { query } = route;
-    router.push({ name: routeName('login'), params: { module }, query: { ...query } });
-  }
-
-  /** 登录后跳转重定向的地址 */
-  function toLoginRedirectUrl(path: string) {
-    router.push(path);
+    routerPush({ name: routeName('login'), params: { module }, query: { ...query } }, newTab);
   }
 
   return {
+    routerPush,
     toHome,
     toLogin,
-    toCurrentLogin,
-    toLoginRedirectUrl
+    toCurrentLogin
   };
 }

src/views/system/login/components/PwdLogin/index.vue

@@ -43,7 +43,7 @@ import { OtherLogin } from './components';
 
 const notification = useNotification();
 const auth = useAuthStore();
-const { toHome, toCurrentLogin, toLoginRedirectUrl } = useRouterPush();
+const { routerPush, toHome, toCurrentLogin } = useRouterPush();
 const { loginRedirectUrl } = useRouteQuery();
 const { loading, startLoading, endLoading } = useLoading();
 
@@ -77,7 +77,7 @@ function handleSubmit(e: MouseEvent) {
         endLoading();
         setToken('temp-token');
         if (loginRedirectUrl.value) {
-          toLoginRedirectUrl(loginRedirectUrl.value);
+          routerPush(loginRedirectUrl.value);
         } else {
           toHome();
         }