From 7305de45a06338afb7dafc5e7aeb55b8847d4d69 Mon Sep 17 00:00:00 2001
From: wf <2547096351@qq.com>
Date: Thu, 27 Jun 2024 17:48:32 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A4=96=E9=93=BE=E8=B7=AF=E7=94=B1?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/svgs/link.svg                      |  1 +
 src/lang/modules/enUS.ts                      |  2 +
 src/lang/modules/zhCN.ts                      |  2 +
 src/layout/layout-mixing/index.vue            |  5 +-
 src/router/route-output.ts                    |  7 ++-
 src/router/route.ts                           | 63 ++++++++++++++-----
 src/views/about-project/about-project.vue     |  1 -
 .../external-links/link-gitee/link-gitee.vue  |  9 +++
 .../internationalization.vue                  | 19 +++---
 9 files changed, 81 insertions(+), 28 deletions(-)
 create mode 100644 src/assets/svgs/link.svg
 create mode 100644 src/views/external-links/link-gitee/link-gitee.vue

diff --git a/src/assets/svgs/link.svg b/src/assets/svgs/link.svg
new file mode 100644
index 0000000..c85b0c0
--- /dev/null
+++ b/src/assets/svgs/link.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1719473821252" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1582" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M13 512a499 499 0 1 0 998 0 499 499 0 1 0-998 0z" fill="#008AFF" p-id="1583"></path><path d="M728.3 297.7l-2-2c-46.1-46.1-121.6-46.1-167.7 0L451.7 402.6c-46.1 46.1-46.1 121.6 0 167.7l2 2c3.8 3.8 7.9 7.3 12.1 10.5l39.1-39.1c-4.6-2.7-8.9-5.9-12.8-9.8l-2-2c-25-25-25-65.8 0-90.8L597 334.2c25-25 65.8-25 90.8 0l2 2c25 25 25 65.8 0 90.8l-48.3 48.3c8.4 20.7 12.4 42.8 12 64.9l74.8-74.8c46.1-46.1 46.1-121.6 0-167.7z m-158 154c-3.8-3.8-7.9-7.3-12.1-10.5l-39.1 39.1c4.6 2.7 8.9 5.9 12.8 9.8l2 2c25 25 25 65.8 0 90.8L427 689.8c-25 25-65.8 25-90.8 0l-2-2c-25-25-25-65.8 0-90.8l48.4-48.3c-8.4-20.7-12.4-42.8-12-64.9l-74.8 74.8c-46.1 46.1-46.1 121.6 0 167.7l2 2c46.1 46.1 121.6 46.1 167.7 0l106.9-106.9c46.1-46.1 46.1-121.6 0-167.7l-2.1-2z" fill="#FFFFFF" p-id="1584"></path></svg>
\ No newline at end of file
diff --git a/src/lang/modules/enUS.ts b/src/lang/modules/enUS.ts
index 162dd64..73a7b7d 100644
--- a/src/lang/modules/enUS.ts
+++ b/src/lang/modules/enUS.ts
@@ -23,6 +23,8 @@ export default {
     ["personal-center"]: "personal center",
     ["userinfo"]: "userinfo",
     ["user-settings"]: "user settings",
+    ["external-links"]: "external links",
+    ["link-gitee"]: "link gitee",
     ["about-project"]: "about project",
     ["not-power"]: "No permission",
     ["not-found"]: "Page not found",
diff --git a/src/lang/modules/zhCN.ts b/src/lang/modules/zhCN.ts
index bac8da4..cc67154 100644
--- a/src/lang/modules/zhCN.ts
+++ b/src/lang/modules/zhCN.ts
@@ -24,6 +24,8 @@ export default {
     ["userinfo"]: "用户信息",
     ["user-settings"]: "用户设置",
     ["about-project"]: "关于项目",
+    ["external-links"]: "外部链接",
+    ["link-gitee"]: "链接 gitee",
     ["not-power"]: "没有权限",
     ["not-found"]: "未找到页面",
     ["zh-CN"]: "中文",
diff --git a/src/layout/layout-mixing/index.vue b/src/layout/layout-mixing/index.vue
index 3be5578..64a803a 100644
--- a/src/layout/layout-mixing/index.vue
+++ b/src/layout/layout-mixing/index.vue
@@ -81,7 +81,11 @@ const onMenuItem = (key: string) => {
   const find = findLinearArray(key);
   // 路由存在则存入并跳转，不存在则跳404
   if (find) {
+    // 给左侧树赋值
     setAsideMenu(find);
+    // 这里直接跳转父级path，因为父级路由做了重定向
+    // 如果有子路由则重定向到自己的第一个菜单
+    // 如果没有子路由则说明当前父级是一个菜单，直接跳转
     router.push(find.path);
   } else {
     router.push("/404");
@@ -105,7 +109,6 @@ const getAsideMenu = (key: string) => {
   const find = findLinearArray(key);
   setAsideMenu(find);
 };
-// getAsideMenu(aciveRoute.value as string);
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/router/route-output.ts b/src/router/route-output.ts
index fd4f3f8..a85dd19 100644
--- a/src/router/route-output.ts
+++ b/src/router/route-output.ts
@@ -103,9 +103,12 @@ export const currentlyRoute = (name: string) => {
   if (find === undefined) return;
   // 存入当前路由-高亮
   store.setCurrentRoute(find);
-  // 存入tabs栏数据：如果系统配置里允许展示标签栏则存入
+
+  // 如果是外链路由则不做后续任何缓存操作: 有外链 && 内嵌false
+  if (find.meta.link && !find.meta.iframe) return;
+  // 存入tabs栏数据：开启tabs
   if (isTabs.value) store.setTabs(find);
-  // 是否缓存路由 || 是否渲染tabs，符合任意条件则不缓存路由
+  // 不缓存路由 || 不渲染tabs ，符合任意条件则不缓存路由
   if (!find.meta.keepAlive || !isTabs.value) return;
   store.setRouteNames(find.name); // 缓存路由name
 };
diff --git a/src/router/route.ts b/src/router/route.ts
index 8d3c33b..4d2df65 100644
--- a/src/router/route.ts
+++ b/src/router/route.ts
@@ -6,10 +6,10 @@ import { testMultilevelMenu } from "@/mock/testRoute";
  * 路由meta对象参数，我们通常将属性放到meta对象中
  * meta: {
  * title:       菜单栏以及 tabsView 栏、菜单搜索名称（国际化）
- * link:        是否是超链接菜单，开启外链条件：1、 link：链接地址不为空  2、iframe: false
  * hide:        是否隐藏此路由
  * keepAlive:   是否缓存组件状态
  * affix:       是否固定在 tabsView 栏上
+ * link:        是否是超链接菜单，开启外链条件：1、 link：链接地址不为空  2、iframe: false
  * iframe:      是否内嵌窗口，开启条件：1、iframe：true  2、link：链接地址不为空
  * roles:       当前路由权限表示，取角色管理。路由控制显示、隐藏。 超级管理员：admin；普通角色：common
  * icon:        菜单、tabsView 图标等
@@ -71,10 +71,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
         redirect: "/table-management/common-table",
         meta: {
           title: "table-management",
-          link: "",
           hide: false,
           keepAlive: true,
           affix: true,
+          link: "",
           iframe: false,
           roles: ["admin"],
           svgIcon: "table"
@@ -86,10 +86,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/table-management/common-table/common-table.vue"),
             meta: {
               title: "common-table",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -101,10 +101,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/table-management/custom-table/custom-table.vue"),
             meta: {
               title: "custom-table",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -118,10 +118,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
         redirect: "/form-management/common-form",
         meta: {
           title: "form-management",
-          link: "",
           hide: false,
           keepAlive: true,
           affix: true,
+          link: "",
           iframe: false,
           roles: ["admin"],
           svgIcon: "form"
@@ -133,10 +133,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/form-management/common-form/common-form.vue"),
             meta: {
               title: "common-form",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -148,10 +148,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/form-management/step-form/step-form.vue"),
             meta: {
               title: "step-form",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -165,10 +165,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
         redirect: "/multilevel-menu/second-menu-1",
         meta: {
           title: "multilevel-menu",
-          link: "",
           hide: false,
           keepAlive: true,
           affix: true,
+          link: "",
           iframe: false,
           roles: ["admin"],
           svgIcon: "switch"
@@ -180,10 +180,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/multilevel-menu/second-menu/second-menu-1.vue"),
             meta: {
               title: "second-menu-1",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -195,10 +195,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             redirect: "/multilevel-menu/third-menu-1",
             meta: {
               title: "second-menu-2",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -210,10 +210,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
                 component: () => import("@/views/multilevel-menu/third-menu/third-menu-1.vue"),
                 meta: {
                   title: "third-menu-1",
-                  link: "",
                   hide: false,
                   keepAlive: true,
                   affix: false,
+                  link: "",
                   iframe: false,
                   roles: ["admin"],
                   icon: "icon-menu"
@@ -225,10 +225,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
                 component: () => import("@/views/multilevel-menu/third-menu/third-menu-2.vue"),
                 meta: {
                   title: "third-menu-2",
-                  link: "",
                   hide: false,
                   keepAlive: true,
                   affix: false,
+                  link: "",
                   iframe: false,
                   roles: ["admin"],
                   icon: "icon-menu"
@@ -245,10 +245,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
         redirect: "/personal-center/userinfo",
         meta: {
           title: "personal-center",
-          link: "",
           hide: false,
           keepAlive: true,
           affix: false,
+          link: "",
           iframe: false,
           roles: ["admin"],
           svgIcon: "user"
@@ -260,10 +260,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/personal-center/userinfo/userinfo.vue"),
             meta: {
               title: "userinfo",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -276,10 +276,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
             component: () => import("@/views/personal-center/user-settings/user-settings.vue"),
             meta: {
               title: "user-settings",
-              link: "",
               hide: false,
               keepAlive: true,
               affix: false,
+              link: "",
               iframe: false,
               roles: ["admin"],
               icon: "icon-menu"
@@ -288,6 +288,39 @@ export const dynamicRoutes: RouteRecordRaw[] = [
           }
         ]
       },
+      {
+        path: "/external-links",
+        name: "external-links",
+        redirect: "/external-links/link-gitee",
+        meta: {
+          title: "external-links",
+          hide: false,
+          keepAlive: true,
+          affix: false,
+          link: "",
+          iframe: false,
+          roles: ["admin"],
+          svgIcon: "link"
+        },
+        children: [
+          {
+            path: "/external-links/link-gitee",
+            name: "link-gitee",
+            component: () => import("@/views/external-links/link-gitee/link-gitee.vue"),
+            meta: {
+              title: "link-gitee",
+              hide: false,
+              keepAlive: true,
+              affix: false,
+              link: "https://gitee.com/wang_fan_w", // 链接
+              iframe: false, // 区分是否内链 true内链 false外链
+              roles: ["admin"],
+              icon: "icon-menu"
+            },
+            children: []
+          }
+        ]
+      },
       {
         path: "/internationalization",
         name: "internationalization",
diff --git a/src/views/about-project/about-project.vue b/src/views/about-project/about-project.vue
index f6c61ea..f82b824 100644
--- a/src/views/about-project/about-project.vue
+++ b/src/views/about-project/about-project.vue
@@ -21,7 +21,6 @@
 
 <script setup lang="ts">
 import packageJson from "../../../package.json";
-
 const projectInfo = [
   {
     label: "版本号",
diff --git a/src/views/external-links/link-gitee/link-gitee.vue b/src/views/external-links/link-gitee/link-gitee.vue
new file mode 100644
index 0000000..8fb1115
--- /dev/null
+++ b/src/views/external-links/link-gitee/link-gitee.vue
@@ -0,0 +1,9 @@
+<template>
+  <div>外部链接 gitee <a-date-picker v-model="form" placeholder="请选择日期" /></div>
+</template>
+
+<script setup lang="ts">
+const form = ref();
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/internationalization/internationalization.vue b/src/views/internationalization/internationalization.vue
index 09860df..76f2a7a 100644
--- a/src/views/internationalization/internationalization.vue
+++ b/src/views/internationalization/internationalization.vue
@@ -3,20 +3,15 @@
     <p>{{ $t(`language.switch-language-to-preview`) }}</p>
     <br />
     <div>
-      <a-date-picker style="width: 200px" />
+      <a-date-picker style="width: 200px" v-model="form.time" />
     </div>
     <br />
     <div>
-      <a-time-picker type="time-range" style="width: 252px" />
+      <a-time-picker type="time-range" style="width: 252px" v-model="form.timeRange" />
     </div>
     <br />
     <div>
-      <a-range-picker
-        style="width: 360px"
-        show-time
-        :time-picker-props="{ defaultValue: ['00:00:00', '09:09:06'] }"
-        format="YYYY-MM-DD HH:mm"
-      />
+      <a-range-picker style="width: 360px" show-time format="YYYY-MM-DD HH:mm" v-model="form.date" />
     </div>
     <br />
     <div>
@@ -25,6 +20,12 @@
   </div>
 </template>
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+const form = reactive({
+  time: null,
+  timeRange: [],
+  date: []
+});
+</script>
 
 <style lang="scss" scoped></style>