feat: 搭建后台管理框架

types/components.d.ts

@@ -0,0 +1,8 @@
+declare module 'vue' {
+  export interface GlobalComponents {
+    Icon: (typeof import('../components/Icon/src/Icon.vue'))['default']
+    BaseButton: (typeof import('../components/Button/src/Button.vue'))['default']
+  }
+}
+
+export {}

types/env.d.ts

@@ -0,0 +1,34 @@
+/// <reference types="vite/client" />
+
+declare module 'virtual:svg-icons-register' {
+  const component: unknown
+  export default component
+}
+
+declare module 'virtual:svg-icons-names' {
+  const iconsNames: string[]
+  export default iconsNames
+}
+
+declare module '*.vue' {
+  import { DefineComponent } from 'vue'
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}
+
+interface ImportMetaEnv {
+  readonly VITE_APP_TITLE: string
+  readonly VITE_API_BASE_PATH: string
+  readonly VITE_BASE_PATH: string
+  readonly VITE_DROP_DEBUGGER: string
+  readonly VITE_DROP_CONSOLE: string
+  readonly VITE_SOURCEMAP: string
+  readonly VITE_OUT_DIR: string
+}
+
+declare global {
+  interface ImportMeta {
+    readonly env: ImportMetaEnv
+  }
+}

types/global.d.ts

@@ -0,0 +1,66 @@
+import type { CSSProperties } from 'vue'
+import { RawAxiosRequestHeaders } from 'axios'
+declare global {
+  declare interface Fn<T = any> {
+    (...arg: T[]): T
+  }
+
+  declare type Nullable<T> = T | null
+
+  declare type ElRef<T extends HTMLElement = HTMLDivElement> = Nullable<T>
+
+  declare type Recordable<T = any, K = string> = Record<K extends null | undefined ? string : K, T>
+
+  declare type RemoveReadonly<T> = {
+    -readonly [P in keyof T]: T[P]
+  }
+
+  declare type ComponentRef<T> = InstanceType<T>
+
+  declare type LocaleType = 'zh-CN' | 'en'
+
+  declare type TimeoutHandle = ReturnType<typeof setTimeout>
+  declare type IntervalHandle = ReturnType<typeof setInterval>
+
+  declare type ElementPlusInfoType = 'success' | 'info' | 'warning' | 'danger'
+
+  declare type LayoutType = 'classic' | 'topLeft' | 'top' | 'cutMenu'
+
+  declare type AxiosContentType =
+    'application/json' | 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain'
+
+  declare type AxiosMethod = 'get' | 'post' | 'delete' | 'put'
+
+  declare type AxiosResponseType = 'arraybuffer' | 'blob' | 'document' | 'json' | 'text' | 'stream'
+
+  declare interface AxiosConfig {
+    params?: any
+    data?: any
+    url?: string
+    method?: AxiosMethod
+    headers?: RawAxiosRequestHeaders
+    responseType?: AxiosResponseType
+  }
+
+  declare interface IResponse<T = any> {
+    code: number
+    data: T extends any ? T : T & any
+  }
+
+  declare interface ThemeTypes {
+    elColorPrimary?: string
+    leftMenuBorderColor?: string
+    leftMenuBgColor?: string
+    leftMenuBgLightColor?: string
+    leftMenuBgActiveColor?: string
+    leftMenuCollapseBgActiveColor?: string
+    leftMenuTextColor?: string
+    leftMenuTextActiveColor?: string
+    logoTitleTextColor?: string
+    logoBorderColor?: string
+    topHeaderBgColor?: string
+    topHeaderTextColor?: string
+    topHeaderHoverColor?: string
+    topToolBorderColor?: string
+  }
+}

types/router.d.ts

@@ -0,0 +1,73 @@
+import type { RouteRecordRaw } from 'vue-router'
+import { defineComponent } from 'vue'
+
+/**
+* redirect: noredirect        当设置 noredirect 的时候该路由在面包屑导航中不可被点击
+* name:'router-name'          设定路由的名字，一定要填写不然使用<keep-alive>时会出现各种问题
+* meta : {
+    hidden: true              当设置 true 的时候该路由不会再侧边栏出现 如404，login等页面(默认 false)
+
+    alwaysShow: true          当你一个路由下面的 children 声明的路由大于1个时，自动会变成嵌套的模式，
+                              只有一个时，会将那个子路由当做根路由显示在侧边栏，
+                              若你想不管路由下面的 children 声明的个数都显示你的根路由，
+                              你可以设置 alwaysShow: true，这样它就会忽略之前定义的规则，
+                              一直显示根路由(默认 false)
+
+    title: 'title'            设置该路由在侧边栏和面包屑中展示的名字
+
+    icon: 'svg-name'          设置该路由的图标
+
+    noCache: true             如果设置为true，则不会被 <keep-alive> 缓存(默认 false)
+
+    breadcrumb: false         如果设置为false，则不会在breadcrumb面包屑中显示(默认 true)
+
+    affix: true               如果设置为true，则会一直固定在tag项中(默认 false)
+
+    noTagsView: true          如果设置为true，则不会出现在tag中(默认 false)
+
+    activeMenu: '/dashboard'  显示高亮的路由路径
+
+    canTo: true               设置为true即使hidden为true，也依然可以进行路由跳转(默认 false)
+
+    permission: ['edit','add', 'delete']    设置该路由的权限
+  }
+**/
+declare module 'vue-router' {
+  interface RouteMeta extends Record<string | number | symbol, unknown> {
+    hidden?: boolean
+    alwaysShow?: boolean
+    title?: string
+    icon?: string
+    noCache?: boolean
+    breadcrumb?: boolean
+    affix?: boolean
+    activeMenu?: string
+    noTagsView?: boolean
+    followAuth?: string
+    canTo?: boolean
+    permission?: string[]
+  }
+}
+
+type Component<T = any> =
+  ReturnType<typeof defineComponent> | (() => Promise<typeof import('*.vue')>) | (() => Promise<T>)
+
+declare global {
+  declare interface AppRouteRecordRaw extends Omit<RouteRecordRaw, 'meta'> {
+    name: string
+    meta: RouteMeta
+    component?: Component | string
+    children?: AppRouteRecordRaw[]
+    props?: Recordable
+    fullPath?: string
+  }
+
+  declare interface AppCustomRouteRecordRaw extends Omit<RouteRecordRaw, 'meta'> {
+    name: string
+    meta: RouteMeta
+    component: string
+    path: string
+    redirect: string
+    children?: AppCustomRouteRecordRaw[]
+  }
+}