From f1c8a14b98d523e595d2a5a2c0e4cf19727775a6 Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Tue, 23 Aug 2022 18:09:13 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=20RouteMeta=20?=
 =?UTF-8?q?=E5=AD=97=E6=AE=B5=E4=B8=8D=E5=AE=8C=E6=95=B4=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.ts     |  9 +++++----
 types/shims-app.d.ts    |  9 ---------
 types/shims-vue.d.ts    |  9 ---------
 types/vue-proptery.d.ts | 14 --------------
 types/vue-router.d.ts   | 41 +++++++++++++++++++++++++++++++++++++++++
 5 files changed, 46 insertions(+), 36 deletions(-)
 delete mode 100644 types/shims-app.d.ts
 delete mode 100644 types/vue-proptery.d.ts
 create mode 100644 types/vue-router.d.ts

diff --git a/src/router/index.ts b/src/router/index.ts
index a73d368..b0df9fb 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,8 +1,9 @@
-import { createRouter, createWebHashHistory, createWebHistory, RouteRecordRaw } from "vue-router"
+import { createRouter, createWebHashHistory, createWebHistory } from "vue-router"
+import type { RouteRecordRaw } from "vue-router"
 const Layout = () => import("@/layout/index.vue")
 
 /** 常驻路由 */
-export const constantRoutes: Array<RouteRecordRaw> = [
+export const constantRoutes: RouteRecordRaw[] = [
   {
     path: "/redirect",
     component: Layout,
@@ -138,7 +139,7 @@ export const constantRoutes: Array<RouteRecordRaw> = [
  * 用来放置有权限 (Roles 属性) 的路由
  * 必须带有 Name 属性
  */
-export const asyncRoutes: Array<RouteRecordRaw> = [
+export const asyncRoutes: RouteRecordRaw[] = [
   {
     path: "/permission",
     component: Layout,
@@ -220,7 +221,7 @@ export function resetRouter() {
       }
     })
   } catch (error) {
-    // 强制刷新浏览器，不过体验不是很好
+    // 强制刷新浏览器也行，只是交互体验不是很好
     window.location.reload()
   }
 }
diff --git a/types/shims-app.d.ts b/types/shims-app.d.ts
deleted file mode 100644
index f89eae4..0000000
--- a/types/shims-app.d.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-declare module "*.svg"
-declare module "*.png"
-declare module "*.jpg"
-declare module "*.jpeg"
-declare module "*.gif"
-declare module "*.bmp"
-declare module "*.tiff"
-declare module "*.yaml"
-declare module "*.json"
diff --git a/types/shims-vue.d.ts b/types/shims-vue.d.ts
index 33af938..fc20212 100644
--- a/types/shims-vue.d.ts
+++ b/types/shims-vue.d.ts
@@ -4,15 +4,6 @@ declare module "*.vue" {
   export default component
 }
 
-declare module "*.gif" {
-  export const gif: any
-}
-
-declare module "*.svg" {
-  const content: any
-  export default content
-}
-
 declare module "*.scss" {
   const scss: Record<string, string>
   export default scss
diff --git a/types/vue-proptery.d.ts b/types/vue-proptery.d.ts
deleted file mode 100644
index 059328b..0000000
--- a/types/vue-proptery.d.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { ElMessage } from "element-plus"
-
-declare module "@vue/runtime-core" {
-  interface ComponentCustomProperties {
-    $message: ElMessage
-  }
-}
-
-declare module "vue-router" {
-  interface RouteMeta {
-    roles?: string[]
-    activeMenu?: string
-  }
-}
diff --git a/types/vue-router.d.ts b/types/vue-router.d.ts
new file mode 100644
index 0000000..edf2659
--- /dev/null
+++ b/types/vue-router.d.ts
@@ -0,0 +1,41 @@
+import 'vue-router'
+
+declare module "vue-router" {
+  interface RouteMeta {
+    /**
+     * 设置该路由在侧边栏和面包屑中展示的名字
+     */
+    title?: string
+    /**
+     * 设置该路由的图标，记得将 svg 导入 @/icons/svg
+     */
+    icon?: string
+    /**
+     * 默认 false，设置 true 的时候该路由不会在侧边栏出现
+     */
+    hidden?: boolean
+    /**
+     * 设置该路由进入的权限，支持多个权限叠加
+     */
+    roles?: string[]
+    /**
+     * 默认 true，如果设置为 false，则不会在面包屑中显示
+     */
+    breadcrumb?: boolean
+    /**
+     * 默认 false，如果设置为 true，它则会固定在 tags-view 中
+     */
+    affix?: boolean
+    /**
+     * 当一个路由下面的 children 声明的路由大于 1 个时，自动会变成嵌套的模式
+     * 只有一个时，会将那个子路由当做根路由显示在侧边栏
+     * 若想不管路由下面的 children 声明的个数都显示你的根路由
+     * 可以设置 alwaysShow: true，这样就会忽略之前定义的规则，一直显示根路由
+     */
+    alwaysShow?: boolean
+    /**
+     * 当设置了该属性，进入路由时，则会高亮 activeMenu 属性对应的侧边栏
+     */
+    activeMenu?: string
+  }
+}