From 2e272e919a923d80bccb45f27710c0ccc15d1042 Mon Sep 17 00:00:00 2001
From: cmdparkour <1031596654@qq.com>
Date: Wed, 1 Dec 2021 00:29:39 +0800
Subject: [PATCH] feat: add the router interface which is easily to find
 anything you need

---
 src/router/createNode.ts           | 69 +++++++++++++++---------------
 src/router/index.type.ts           | 33 ++++++++++++++
 src/router/modules/chart.ts        |  3 +-
 src/router/modules/community.ts    |  3 +-
 src/router/modules/component.ts    |  3 +-
 src/router/modules/dashboard.ts    |  3 +-
 src/router/modules/directive.ts    |  3 +-
 src/router/modules/document.ts     |  3 +-
 src/router/modules/menu.ts         |  3 +-
 src/router/modules/pages.ts        |  3 +-
 src/router/modules/print.ts        |  3 +-
 src/router/modules/system.ts       |  3 +-
 src/router/modules/systemManage.ts |  3 +-
 13 files changed, 89 insertions(+), 46 deletions(-)
 create mode 100644 src/router/index.type.ts

diff --git a/src/router/createNode.ts b/src/router/createNode.ts
index 7acc437..583273e 100644
--- a/src/router/createNode.ts
+++ b/src/router/createNode.ts
@@ -1,46 +1,45 @@
 // 1. 用于解决keep-alive需要name的问题，动态生成随机name供keep-alive使用
 // 2. 用于解决transition动画内部结点只能为根元素的问题，单文件可写多结点
+import type { DefineComponent } from 'vue'
 import { defineComponent, h, createVNode, ref, nextTick } from 'vue'
 import reload from './reload.vue'
 import NProgress from '@/utils/system/nprogress'
 
-export function createNameComponent(component: any) {
-  return () => {
-    return new Promise((res) => {
-      component().then((comm: any) => {
-        const name = (comm.default.name || 'vueAdminBox') + '$' + Date.now();
-        const tempComm = defineComponent({
-          name,
-          setup() {
-            const isReload = ref(false);
-            let timeOut: any = null;
-            const handleReload = () => {
-              isReload.value = true;
-              timeOut && clearTimeout(timeOut);
-              NProgress.start();
-              timeOut = setTimeout(() => {
-                nextTick(() => {
-                  NProgress.done();
-                  isReload.value = false;
-                });
-              }, 260);
-            };
-            return {
-              isReload,
-              handleReload
-            };
-          },
-          render: function () {
-            if (this.isReload) {
-              return h('div', { class: 'el-main-box' }, [h(reload)]);
-            } else {
-              return h('div', { class: 'el-main-box' }, [createVNode(comm.default)]);
-            }
+export function createNameComponent(component: () => Promise<any>): Promise<DefineComponent<{}, {}, any>> {
+  return new Promise((resolve) => {
+    component().then((comm: DefineComponent<{}, {}, any>) => {
+      const name = (comm.default.name || 'vueAdminBox') + '$' + Date.now();
+      const tempComm = defineComponent({
+        name,
+        setup() {
+          const isReload = ref(false);
+          let timeOut: any = null;
+          const handleReload = () => {
+            isReload.value = true;
+            timeOut && clearTimeout(timeOut);
+            NProgress.start();
+            timeOut = setTimeout(() => {
+              nextTick(() => {
+                NProgress.done();
+                isReload.value = false;
+              });
+            }, 260);
+          };
+          return {
+            isReload,
+            handleReload
+          };
+        },
+        render: function () {
+          if (this.isReload) {
+            return h('div', { class: 'el-main-box' }, [h(reload)]);
+          } else {
+            return h('div', { class: 'el-main-box' }, [createVNode(comm.default)]);
           }
-        });
-        res(tempComm);
+        }
       });
+      resolve(tempComm);
     });
-  };
+  });
 }
 
diff --git a/src/router/index.type.ts b/src/router/index.type.ts
new file mode 100644
index 0000000..3b3b6b9
--- /dev/null
+++ b/src/router/index.type.ts
@@ -0,0 +1,33 @@
+import type { DefineComponent } from 'vue'
+import { createNameComponent } from './createNode'
+
+/** @name 基础路由类型 */
+export interface Route {
+    /** @name 访问路径 */
+    path: string
+    /** @name 需要使用的组件 @description 两种类型，第一种是默认的Vue文件类型，第二种是通过createNameComponent搞出来的，凡是一个组件需要keep-alive,必须使用createNameComponent来搞定 */
+    component: DefineComponent<{}, {}, any> | Promise<DefineComponent<{}, {}, any>>
+    /** @name 基础元数据 */
+    meta: Meta
+
+    /** @name 路由名称，全局唯一，可以不填 */
+    name?: string
+    /** @name 需要重定向的地址，可选 */
+    redirect?: string
+    /** @name 是否总是显示,不设置的话，子元素只有一个的时候默认显示子元素，隐藏父元素 @description 大部分时候针对二级三级四级菜单的根结点 @default false */
+    alwayShow?: boolean
+    /** @name 路由子集，和Route类型一致的数组，可选 */
+    children?: Route[]
+}
+
+/** @name 基础元数据的类型说明 */
+export interface Meta {
+    /** @name 标题 @description 可供很多地方使用，在国际化版本中使用i18n对应的值，非国际化版本中使用真实的路由值 */
+    title: string
+    /** @name 使用的icon的值，可选 @description 对应自己Iconfont链接库进来，通常只在一级菜单使用，但二级三级使用也没问题 */
+    icon?: string
+    /** @name 是否需要缓存页面，目前仅支持二级菜单缓存，多级菜单缓存会在未来支持，可选 @default false */
+    cache?: boolean
+    /** @name 任意值 @description 供自行扩展使用，但推荐在上面自己定义好 */
+    [key: string]: any
+}
\ No newline at end of file
diff --git a/src/router/modules/chart.ts b/src/router/modules/chart.ts
index 62c3fad..3d9c8e7 100644
--- a/src/router/modules/chart.ts
+++ b/src/router/modules/chart.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/echarts',
     component: Layout,
diff --git a/src/router/modules/community.ts b/src/router/modules/community.ts
index 7328707..60425fa 100644
--- a/src/router/modules/community.ts
+++ b/src/router/modules/community.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/community',
     component: Layout,
diff --git a/src/router/modules/component.ts b/src/router/modules/component.ts
index d1e99d3..733b3e4 100644
--- a/src/router/modules/component.ts
+++ b/src/router/modules/component.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/component',
     component: Layout,
diff --git a/src/router/modules/dashboard.ts b/src/router/modules/dashboard.ts
index 6ef3f14..b5aee3c 100644
--- a/src/router/modules/dashboard.ts
+++ b/src/router/modules/dashboard.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/',
     component: Layout,
diff --git a/src/router/modules/directive.ts b/src/router/modules/directive.ts
index fc6e50a..98151e2 100644
--- a/src/router/modules/directive.ts
+++ b/src/router/modules/directive.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/directive',
     component: Layout,
diff --git a/src/router/modules/document.ts b/src/router/modules/document.ts
index 566feae..4ba692c 100644
--- a/src/router/modules/document.ts
+++ b/src/router/modules/document.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/document',
     component: Layout,
diff --git a/src/router/modules/menu.ts b/src/router/modules/menu.ts
index f183a7a..204f394 100644
--- a/src/router/modules/menu.ts
+++ b/src/router/modules/menu.ts
@@ -1,7 +1,8 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import MenuBox from '@/components/menu/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/menu',
     component: Layout,
diff --git a/src/router/modules/pages.ts b/src/router/modules/pages.ts
index 1db14df..df11e6d 100644
--- a/src/router/modules/pages.ts
+++ b/src/router/modules/pages.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/pages',
     component: Layout,
diff --git a/src/router/modules/print.ts b/src/router/modules/print.ts
index 738311a..c2a885c 100644
--- a/src/router/modules/print.ts
+++ b/src/router/modules/print.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/print',
     component: Layout,
diff --git a/src/router/modules/system.ts b/src/router/modules/system.ts
index da19a6c..abb1803 100644
--- a/src/router/modules/system.ts
+++ b/src/router/modules/system.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/system',
     component: Layout,
diff --git a/src/router/modules/systemManage.ts b/src/router/modules/systemManage.ts
index 737cb13..5069c7e 100644
--- a/src/router/modules/systemManage.ts
+++ b/src/router/modules/systemManage.ts
@@ -1,6 +1,7 @@
+import type { Route } from '../index.type'
 import Layout from '@/layout/index.vue'
 import { createNameComponent } from '../createNode'
-const route = [
+const route: Route[] = [
   {
     path: '/systemManage',
     component: Layout,