refactor: 版本更新

build/vite/plugin/mock.ts

@@ -2,19 +2,18 @@
  * Mock plugin for development and production.
  * https://github.com/anncwb/vite-plugin-mock
  */
-import { viteMockServe } from 'vite-plugin-mock';
+import { viteMockServe } from 'vite-plugin-mock'
 
 export function configMockPlugin(isBuild: boolean) {
   return viteMockServe({
     ignore: /^\_/,
     mockPath: 'mock',
-    showTime: true,
     localEnabled: !isBuild,
     prodEnabled: isBuild,
     injectCode: `
       import { setupProdMockServer } from '../mock/_createProductionServer';
 
       setupProdMockServer();
-      `,
-  });
+      `
+  })
 }

mock/sys/menu.ts

@@ -1,23 +1,23 @@
-import { resultSuccess } from '../_util';
-import { MockMethod } from 'vite-plugin-mock';
+import { resultSuccess } from '../_util'
+import { MockMethod } from 'vite-plugin-mock'
 
 // single
 const dashboardRoute = {
   path: '/home',
-  name: 'Home',
+  name: 'Welcome',
   component: '/dashboard/welcome/index',
   meta: {
     title: 'routes.dashboard.welcome',
     affix: true,
-    icon: 'bx:bx-home',
-  },
-};
+    icon: 'bx:bx-home'
+  }
+}
 
 const frontRoute = {
   path: 'front',
   name: 'PermissionFrontDemo',
   meta: {
-    title: 'routes.demo.permission.front',
+    title: 'routes.demo.permission.front'
   },
   children: [
     {
@@ -25,40 +25,40 @@ const frontRoute = {
       name: 'FrontPageAuth',
       component: '/demo/permission/front/index',
       meta: {
-        title: 'routes.demo.permission.frontPage',
-      },
+        title: 'routes.demo.permission.frontPage'
+      }
     },
     {
       path: 'btn',
       name: 'FrontBtnAuth',
       component: '/demo/permission/front/Btn',
       meta: {
-        title: 'routes.demo.permission.frontBtn',
-      },
+        title: 'routes.demo.permission.frontBtn'
+      }
     },
     {
       path: 'auth-pageA',
       name: 'FrontAuthPageA',
       component: '/demo/permission/front/AuthPageA',
       meta: {
-        title: 'routes.demo.permission.frontTestA',
-      },
+        title: 'routes.demo.permission.frontTestA'
+      }
     },
     {
       path: 'auth-pageB',
       name: 'FrontAuthPageB',
       component: '/demo/permission/front/AuthPageB',
       meta: {
-        title: 'routes.demo.permission.frontTestB',
-      },
-    },
-  ],
-};
+        title: 'routes.demo.permission.frontTestB'
+      }
+    }
+  ]
+}
 const backRoute = {
   path: 'back',
   name: 'PermissionBackDemo',
   meta: {
-    title: 'routes.demo.permission.back',
+    title: 'routes.demo.permission.back'
   },
 
   children: [
@@ -67,19 +67,19 @@ const backRoute = {
       name: 'BackAuthPage',
       component: '/demo/permission/back/index',
       meta: {
-        title: 'routes.demo.permission.backPage',
-      },
+        title: 'routes.demo.permission.backPage'
+      }
     },
     {
       path: 'btn',
       name: 'BackAuthBtn',
       component: '/demo/permission/back/Btn',
       meta: {
-        title: 'routes.demo.permission.backBtn',
-      },
-    },
-  ],
-};
+        title: 'routes.demo.permission.backBtn'
+      }
+    }
+  ]
+}
 const authRoute = {
   path: '/permission',
   name: 'Permission',
@@ -87,10 +87,10 @@ const authRoute = {
   redirect: '/permission/front/page',
   meta: {
     icon: 'carbon:user-role',
-    title: 'routes.demo.permission.permission',
+    title: 'routes.demo.permission.permission'
   },
-  children: [frontRoute, backRoute],
-};
+  children: [frontRoute, backRoute]
+}
 
 const authRoute1 = {
   path: '/permission',
@@ -99,10 +99,10 @@ const authRoute1 = {
   redirect: '/permission/front/page',
   meta: {
     icon: 'carbon:user-role',
-    title: 'routes.demo.permission.permission',
+    title: 'routes.demo.permission.permission'
   },
-  children: [backRoute],
-};
+  children: [backRoute]
+}
 
 const levelRoute = {
   path: '/level',
@@ -111,7 +111,7 @@ const levelRoute = {
   redirect: '/level/menu1/menu1-1',
   meta: {
     icon: 'carbon:user-role',
-    title: 'routes.demo.level.level',
+    title: 'routes.demo.level.level'
   },
 
   children: [
@@ -119,14 +119,14 @@ const levelRoute = {
       path: 'menu1',
       name: 'Menu1Demo',
       meta: {
-        title: 'Menu1',
+        title: 'Menu1'
       },
       children: [
         {
           path: 'menu1-1',
           name: 'Menu11Demo',
           meta: {
-            title: 'Menu1-1',
+            title: 'Menu1-1'
           },
           children: [
             {
@@ -134,44 +134,44 @@ const levelRoute = {
               name: 'Menu111Demo',
               component: '/demo/level/Menu111',
               meta: {
-                title: 'Menu111',
-              },
-            },
-          ],
+                title: 'Menu111'
+              }
+            }
+          ]
         },
         {
           path: 'menu1-2',
           name: 'Menu12Demo',
           component: '/demo/level/Menu12',
           meta: {
-            title: 'Menu1-2',
-          },
-        },
-      ],
+            title: 'Menu1-2'
+          }
+        }
+      ]
     },
     {
       path: 'menu2',
       name: 'Menu2Demo',
       component: '/demo/level/Menu2',
       meta: {
-        title: 'Menu2',
-      },
-    },
-  ],
-};
+        title: 'Menu2'
+      }
+    }
+  ]
+}
 export default [
   {
     url: '/basic-api/getMenuListById',
     timeout: 1000,
     method: 'get',
     response: ({ query }) => {
-      const { id } = query;
+      const { id } = query
       if (!id || id === '1') {
-        return resultSuccess([dashboardRoute, authRoute, levelRoute]);
+        return resultSuccess([dashboardRoute, authRoute, levelRoute])
       }
       if (id === '2') {
-        return resultSuccess([dashboardRoute, authRoute1, levelRoute]);
+        return resultSuccess([dashboardRoute, authRoute1, levelRoute])
       }
-    },
-  },
-] as MockMethod[];
+    }
+  }
+] as MockMethod[]

package.json

@@ -19,10 +19,10 @@
     "clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite",
     "clean:lib": "rimraf node_modules",
     "lint:eslint": "eslint \"{src,mock}/**/*.{vue,ts,tsx}\" --fix",
-    "lint:prettier": "prettier --write --loglevel warn \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
+    "lint:prettier": "prettier --write --loglevel warn \"src/**/*.{ts,js,json,tsx,css,less,scss,vue,html,md}\"",
     "lint:stylelint": "stylelint --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
-    "lint:ls-lint": "ls-lint",
     "lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js",
+    "lint:ls-lint": "ls-lint",
     "lint:pretty": "pretty-quick --staged",
     "test:gzip": "http-server dist --cors --gzip -c-1",
     "test:br": "http-server dist --cors --brotli -c-1",
@@ -35,14 +35,14 @@
     "@iconify/iconify": "^2.0.0-rc.6",
     "@vueuse/core": "^4.4.1",
     "@zxcvbn-ts/core": "^0.3.0",
-    "ant-design-vue": "2.0.1",
+    "ant-design-vue": "2.1.0",
     "axios": "^0.21.1",
     "crypto-js": "^4.0.0",
+    "qrcode": "^1.4.4",
     "lodash-es": "^4.17.21",
     "mockjs": "^1.1.0",
     "nprogress": "^0.2.0",
     "path-to-regexp": "^6.2.0",
-    "qrcode": "^1.4.4",
     "sortablejs": "^1.13.0",
     "vue": "^3.0.7",
     "vue-i18n": "^9.0.0",
@@ -54,8 +54,7 @@
   "devDependencies": {
     "@commitlint/cli": "^12.0.1",
     "@commitlint/config-conventional": "^12.0.1",
-    "@iconify/json": "^1.1.317",
-    "@ls-lint/ls-lint": "^1.9.2",
+    "@iconify/json": "^1.1.320",
     "@purge-icons/generated": "^0.7.0",
     "@types/crypto-js": "^4.0.1",
     "@types/fs-extra": "^9.0.8",
@@ -76,22 +75,19 @@
     "@vitejs/plugin-vue-jsx": "^1.1.2",
     "@vue/compiler-sfc": "^3.0.7",
     "autoprefixer": "^10.2.5",
+    "body-parser": "^1.19.0",
     "commitizen": "^4.2.3",
     "conventional-changelog-cli": "^2.1.1",
     "cross-env": "^7.0.3",
     "dotenv": "^8.2.0",
     "eslint": "^7.22.0",
     "eslint-config-prettier": "^8.1.0",
-    "eslint-plugin-html": "^6.1.2",
-    "eslint-plugin-javascript": "^1.3.4",
-    "eslint-plugin-jsx": "^0.1.0",
     "eslint-plugin-prettier": "^3.3.1",
-    "eslint-plugin-typescript": "^0.14.0",
-    "eslint-plugin-vue": "^7.7.0",
+    "eslint-plugin-vue": "^7.8.0",
     "esno": "^0.5.0",
     "fs-extra": "^9.1.0",
     "http-server": "^0.12.3",
-    "husky": "^5.1.3",
+    "husky": "^5.2.0",
     "inquirer": "^8.0.0",
     "is-ci": "^3.0.0",
     "less": "^4.1.1",
@@ -101,7 +97,7 @@
     "prettier": "^2.2.1",
     "pretty-quick": "^3.1.0",
     "rimraf": "^3.0.2",
-    "rollup-plugin-visualizer": "^4.2.1",
+    "rollup-plugin-visualizer": "4.2.1",
     "stylelint": "^13.12.0",
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-standard": "^21.0.0",
@@ -112,21 +108,19 @@
     "vite-plugin-compression": "^0.2.3",
     "vite-plugin-html": "^2.0.3",
     "vite-plugin-imagemin": "^0.2.9",
-    "vite-plugin-mock": "^2.2.4",
+    "vite-plugin-mock": "^2.3.0",
     "vite-plugin-purge-icons": "^0.7.0",
     "vite-plugin-pwa": "^0.5.6",
     "vite-plugin-style-import": "^0.8.1",
-    "vite-plugin-svg-icons": "^0.3.5",
+    "vite-plugin-svg-icons": "^0.4.0",
     "vite-plugin-theme": "^0.5.0",
-    "vite-plugin-windicss": "0.9.2",
+    "vite-plugin-windicss": "0.9.6",
     "vue-eslint-parser": "^7.6.0",
     "yargs": "^16.2.0"
   },
   "resolutions": {
     "//": "Used to install imagemin dependencies, because imagemin may not be installed in China.If it is abroad, you can delete it",
-    "bin-wrapper": "npm:bin-wrapper-china",
-    "rollup": "2.41.5",
-    "vite": "2.0.5"
+    "bin-wrapper": "npm:bin-wrapper-china"
   },
   "repository": {
     "type": "git",

src/api/model/baseModel.ts

@@ -1,9 +1,9 @@
 export interface BasicPageParams {
-  page: number;
-  pageSize: number;
+  page: number
+  pageSize: number
 }
 
 export interface BasicFetchResult<T extends any> {
-  items: T;
-  total: number;
+  items: T
+  total: number
 }

src/api/sys/menu.ts

@@ -1,8 +1,8 @@
-import { defHttp } from '/@/utils/http/axios';
-import { getMenuListByIdParams, getMenuListByIdParamsResultModel } from './model/menuModel';
+import { defHttp } from '/@/utils/http/axios'
+import { getMenuListByIdParams, getMenuListByIdParamsResultModel } from './model/menuModel'
 
 enum Api {
-  GetMenuListById = '/getMenuListById',
+  GetMenuListById = '/getMenuListById'
 }
 
 /**
@@ -10,5 +10,5 @@ enum Api {
  */
 
 export const getMenuListById = (params: getMenuListByIdParams) => {
-  return defHttp.get<getMenuListByIdParamsResultModel>({ url: Api.GetMenuListById, params });
-};
+  return defHttp.get<getMenuListByIdParamsResultModel>({ url: Api.GetMenuListById, params })
+}

src/api/sys/model/menuModel.ts

@@ -1,23 +1,23 @@
-import { RouteMeta } from '/@/router/types';
+import { RouteMeta } from '/@/router/types'
 export interface RouteItem {
-  path: string;
-  component: any;
-  meta: RouteMeta;
-  name?: string;
-  alias?: string | string[];
-  redirect?: string;
-  caseSensitive?: boolean;
-  children?: RouteItem[];
+  path: string
+  component: any
+  meta: RouteMeta
+  name?: string
+  alias?: string | string[]
+  redirect?: string
+  caseSensitive?: boolean
+  children?: RouteItem[]
 }
 
 /**
  * @description: Get menu interface
  */
 export interface getMenuListByIdParams {
-  id: number | string;
+  id: number | string
 }
 
 /**
  * @description: Get menu return value
  */
-export type getMenuListByIdParamsResultModel = RouteItem[];
+export type getMenuListByIdParamsResultModel = RouteItem[]

src/api/sys/model/uploadModel.ts

@@ -1,5 +1,5 @@
 export interface UploadApiResult {
-  message: string;
-  code: number;
-  url: string;
+  message: string
+  code: number
+  url: string
 }

src/api/sys/model/userModel.ts

@@ -2,42 +2,42 @@
  * @description: Login interface parameters
  */
 export interface LoginParams {
-  username: string;
-  password: string;
+  username: string
+  password: string
 }
 
 /**
  * @description: Get user information
  */
 export interface GetUserInfoByUserIdParams {
-  userId: string | number;
+  userId: string | number
 }
 
 export interface RoleInfo {
-  roleName: string;
-  value: string;
+  roleName: string
+  value: string
 }
 
 /**
  * @description: Login interface return value
  */
 export interface LoginResultModel {
-  userId: string | number;
-  token: string;
-  role: RoleInfo;
+  userId: string | number
+  token: string
+  role: RoleInfo
 }
 
 /**
  * @description: Get user information return value
  */
 export interface GetUserInfoByUserIdModel {
-  roles: RoleInfo[];
+  roles: RoleInfo[]
   // 用户id
-  userId: string | number;
+  userId: string | number
   // 用户名
-  username: string;
+  username: string
   // 真实名字
-  realName: string;
+  realName: string
   // 介绍
-  desc?: string;
+  desc?: string
 }

src/api/sys/upload.ts

@@ -1,9 +1,9 @@
-import { UploadApiResult } from './model/uploadModel';
-import { defHttp } from '/@/utils/http/axios';
-import { UploadFileParams } from '/@/utils/http/axios/types';
-import { useGlobSetting } from '/@/hooks/setting';
+import { UploadApiResult } from './model/uploadModel'
+import { defHttp } from '/@/utils/http/axios'
+import { UploadFileParams } from '/@/utils/http/axios/types'
+import { useGlobSetting } from '/@/hooks/setting'
 
-const { uploadUrl = '' } = useGlobSetting();
+const { uploadUrl = '' } = useGlobSetting()
 
 /**
  * @description: Upload interface
@@ -15,8 +15,8 @@ export function uploadApi(
   return defHttp.uploadFile<UploadApiResult>(
     {
       url: uploadUrl,
-      onUploadProgress,
+      onUploadProgress
     },
     params
-  );
+  )
 }

src/api/sys/user.ts

@@ -1,17 +1,17 @@
-import { defHttp } from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios'
 import {
   LoginParams,
   LoginResultModel,
   GetUserInfoByUserIdParams,
-  GetUserInfoByUserIdModel,
-} from './model/userModel';
+  GetUserInfoByUserIdModel
+} from './model/userModel'
 
-import { ErrorMessageMode } from '/@/utils/http/axios/types';
+import { ErrorMessageMode } from '/@/utils/http/axios/types'
 
 enum Api {
   Login = '/login',
   GetUserInfoById = '/getUserInfoById',
-  GetPermCodeByUserId = '/getPermCodeByUserId',
+  GetPermCodeByUserId = '/getPermCodeByUserId'
 }
 
 /**
@@ -21,12 +21,12 @@ export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal')
   return defHttp.post<LoginResultModel>(
     {
       url: Api.Login,
-      params,
+      params
     },
     {
-      errorMessageMode: mode,
+      errorMessageMode: mode
     }
-  );
+  )
 }
 
 /**
@@ -35,13 +35,13 @@ export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal')
 export function getUserInfoById(params: GetUserInfoByUserIdParams) {
   return defHttp.get<GetUserInfoByUserIdModel>({
     url: Api.GetUserInfoById,
-    params,
-  });
+    params
+  })
 }
 
 export function getPermCodeByUserId(params: GetUserInfoByUserIdParams) {
   return defHttp.get<string[]>({
     url: Api.GetPermCodeByUserId,
-    params,
-  });
+    params
+  })
 }

src/components/Application/index.ts

@@ -1,7 +1,7 @@
-import AppLogo from './src/AppLogo.vue';
-import AppProvider from './src/AppProvider.vue';
-import AppSearch from './src/search/AppSearch.vue';
-import AppLocalePicker from './src/AppLocalePicker.vue';
+import AppLogo from './src/AppLogo.vue'
+import AppProvider from './src/AppProvider.vue'
+import AppSearch from './src/search/AppSearch.vue'
+import AppLocalePicker from './src/AppLocalePicker.vue'
 
-export { useAppProviderContext } from './src/useAppContext';
-export { AppLogo, AppProvider, AppSearch, AppLocalePicker };
+export { useAppProviderContext } from './src/useAppContext'
+export { AppLogo, AppProvider, AppSearch, AppLocalePicker }

src/components/Application/src/search/useMenuSearch.ts

@@ -1,168 +1,168 @@
-import type { Menu } from '/@/router/types';
+import type { Menu } from '/@/router/types'
 
-import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue';
+import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue'
 
-import { getMenus } from '/@/router/menus';
-import { KeyCodeEnum } from '/@/enums/keyCodeEnum';
+import { getMenus } from '/@/router/menus'
+import { KeyCodeEnum } from '/@/enums/keyCodeEnum'
 
-import { cloneDeep } from 'lodash-es';
-import { filter, forEach } from '/@/utils/helper/treeHelper';
+import { cloneDeep } from 'lodash-es'
+import { filter, forEach } from '/@/utils/helper/treeHelper'
 
-import { useDebounce } from '/@/hooks/core/useDebounce';
-import { useGo } from '/@/hooks/web/usePage';
-import { useScrollTo } from '/@/hooks/event/useScrollTo';
-import { useKeyPress } from '/@/hooks/event/useKeyPress';
-import { useI18n } from '/@/hooks/web/useI18n';
+import { useDebounce } from '/@/hooks/core/useDebounce'
+import { useGo } from '/@/hooks/web/usePage'
+import { useScrollTo } from '/@/hooks/event/useScrollTo'
+import { useKeyPress } from '/@/hooks/event/useKeyPress'
+import { useI18n } from '/@/hooks/web/useI18n'
 
 export interface SearchResult {
-  name: string;
-  path: string;
-  icon?: string;
+  name: string
+  path: string
+  icon?: string
 }
 
 // Translate special characters
 function transform(c: string) {
-  const code: string[] = ['$', '(', ')', '*', '+', '.', '[', ']', '?', '\\', '^', '{', '}', '|'];
-  return code.includes(c) ? `\\${c}` : c;
+  const code: string[] = ['$', '(', ')', '*', '+', '.', '[', ']', '?', '\\', '^', '{', '}', '|']
+  return code.includes(c) ? `\\${c}` : c
 }
 
 function createSearchReg(key: string) {
-  const keys = [...key].map((item) => transform(item));
-  const str = ['', ...keys, ''].join('.*');
-  return new RegExp(str);
+  const keys = [...key].map(item => transform(item))
+  const str = ['', ...keys, ''].join('.*')
+  return new RegExp(str)
 }
 
 export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>, emit: EmitType) {
-  const searchResult = ref<SearchResult[]>([]);
-  const keyword = ref('');
-  const activeIndex = ref(-1);
+  const searchResult = ref<SearchResult[]>([])
+  const keyword = ref('')
+  const activeIndex = ref(-1)
 
-  let menuList: Menu[] = [];
+  let menuList: Menu[] = []
 
-  const { t } = useI18n();
-  const go = useGo();
-  const [handleSearch] = useDebounce(search, 200);
+  const { t } = useI18n()
+  const go = useGo()
+  const [handleSearch] = useDebounce(search, 200)
 
   onBeforeMount(async () => {
-    const list = await getMenus();
-    menuList = cloneDeep(list);
-    forEach(menuList, (item) => {
-      item.name = t(item.name);
-    });
-  });
+    const list = await getMenus()
+    menuList = cloneDeep(list)
+    forEach(menuList, item => {
+      item.name = t(item.name)
+    })
+  })
 
   function search(e: ChangeEvent) {
-    e?.stopPropagation();
-    const key = e.target.value;
-    keyword.value = key.trim();
+    e?.stopPropagation()
+    const key = e.target.value
+    keyword.value = key.trim()
     if (!key) {
-      searchResult.value = [];
-      return;
+      searchResult.value = []
+      return
     }
-    const reg = createSearchReg(unref(keyword));
-    const filterMenu = filter(menuList, (item) => {
-      return reg.test(item.name);
-    });
-    searchResult.value = handlerSearchResult(filterMenu, reg);
-    activeIndex.value = 0;
+    const reg = createSearchReg(unref(keyword))
+    const filterMenu = filter(menuList, item => {
+      return reg.test(item.name)
+    })
+    searchResult.value = handlerSearchResult(filterMenu, reg)
+    activeIndex.value = 0
   }
 
   function handlerSearchResult(filterMenu: Menu[], reg: RegExp, parent?: Menu) {
-    const ret: SearchResult[] = [];
+    const ret: SearchResult[] = []
 
-    filterMenu.forEach((item) => {
-      const { name, path, icon, children } = item;
+    filterMenu.forEach(item => {
+      const { name, path, icon, children } = item
       if (reg.test(name) && !children?.length) {
         ret.push({
           name: parent?.name ? `${parent.name} > ${name}` : name,
           path,
-          icon,
-        });
+          icon
+        })
       }
       if (Array.isArray(children) && children.length) {
-        ret.push(...handlerSearchResult(children, reg, item));
+        ret.push(...handlerSearchResult(children, reg, item))
       }
-    });
-    return ret;
+    })
+    return ret
   }
 
   function handleMouseenter(e: any) {
-    const index = e.target.dataset.index;
-    activeIndex.value = Number(index);
+    const index = e.target.dataset.index
+    activeIndex.value = Number(index)
   }
 
   function handleUp() {
-    if (!searchResult.value.length) return;
-    activeIndex.value--;
+    if (!searchResult.value.length) return
+    activeIndex.value--
     if (activeIndex.value < 0) {
-      activeIndex.value = searchResult.value.length - 1;
+      activeIndex.value = searchResult.value.length - 1
     }
-    handleScroll();
+    handleScroll()
   }
 
   function handleDown() {
-    if (!searchResult.value.length) return;
-    activeIndex.value++;
+    if (!searchResult.value.length) return
+    activeIndex.value++
     if (activeIndex.value > searchResult.value.length - 1) {
-      activeIndex.value = 0;
+      activeIndex.value = 0
     }
-    handleScroll();
+    handleScroll()
   }
 
   function handleScroll() {
-    const refList = unref(refs);
-    if (!refList || !Array.isArray(refList) || refList.length === 0 || !unref(scrollWrap)) return;
-
-    const index = unref(activeIndex);
-    const currentRef = refList[index];
-    if (!currentRef) return;
-    const wrapEl = unref(scrollWrap);
-    if (!wrapEl) return;
-    const scrollHeight = currentRef.offsetTop + currentRef.offsetHeight;
-    const wrapHeight = wrapEl.offsetHeight;
+    const refList = unref(refs)
+    if (!refList || !Array.isArray(refList) || refList.length === 0 || !unref(scrollWrap)) return
+
+    const index = unref(activeIndex)
+    const currentRef = refList[index]
+    if (!currentRef) return
+    const wrapEl = unref(scrollWrap)
+    if (!wrapEl) return
+    const scrollHeight = currentRef.offsetTop + currentRef.offsetHeight
+    const wrapHeight = wrapEl.offsetHeight
     const { start } = useScrollTo({
       el: wrapEl,
       duration: 100,
-      to: scrollHeight - wrapHeight,
-    });
-    start();
+      to: scrollHeight - wrapHeight
+    })
+    start()
   }
 
   async function handleEnter() {
-    if (!searchResult.value.length) return;
-    const result = unref(searchResult);
-    const index = unref(activeIndex);
+    if (!searchResult.value.length) return
+    const result = unref(searchResult)
+    const index = unref(activeIndex)
     if (result.length === 0 || index < 0) {
-      return;
+      return
     }
-    const to = result[index];
-    handleClose();
-    await nextTick();
-    go(to.path);
+    const to = result[index]
+    handleClose()
+    await nextTick()
+    go(to.path)
   }
 
   function handleClose() {
-    searchResult.value = [];
-    emit('close');
+    searchResult.value = []
+    emit('close')
   }
 
-  useKeyPress(['enter', 'up', 'down', 'esc'], (events) => {
-    const keyCode = events.keyCode;
+  useKeyPress(['enter', 'up', 'down', 'esc'], events => {
+    const keyCode = events.keyCode
     switch (keyCode) {
       case KeyCodeEnum.UP:
-        handleUp();
-        break;
+        handleUp()
+        break
       case KeyCodeEnum.DOWN:
-        handleDown();
-        break;
+        handleDown()
+        break
       case KeyCodeEnum.ENTER:
-        handleEnter();
-        break;
+        handleEnter()
+        break
       case KeyCodeEnum.ESC:
-        handleClose();
-        break;
+        handleClose()
+        break
     }
-  });
+  })
 
-  return { handleSearch, searchResult, keyword, activeIndex, handleMouseenter, handleEnter };
+  return { handleSearch, searchResult, keyword, activeIndex, handleMouseenter, handleEnter }
 }

src/components/Application/src/useAppContext.ts

@@ -1,18 +1,18 @@
-import { InjectionKey, Ref } from 'vue';
-import { createContext, useContext } from '/@/hooks/core/useContext';
+import { InjectionKey, Ref } from 'vue'
+import { createContext, useContext } from '/@/hooks/core/useContext'
 
 export interface AppProviderContextProps {
-  prefixCls: Ref<string>;
+  prefixCls: Ref<string>
 
-  isMobile: Ref<boolean>;
+  isMobile: Ref<boolean>
 }
 
-const key: InjectionKey<AppProviderContextProps> = Symbol();
+const key: InjectionKey<AppProviderContextProps> = Symbol()
 
 export function createAppProviderContext(context: AppProviderContextProps) {
-  return createContext<AppProviderContextProps>(context, key);
+  return createContext<AppProviderContextProps>(context, key)
 }
 
 export function useAppProviderContext() {
-  return useContext<AppProviderContextProps>(key);
+  return useContext<AppProviderContextProps>(key)
 }

src/components/Authority/index.ts

@@ -1,3 +1,3 @@
-import Authority from './src/index.vue';
+import Authority from './src/index.vue'
 
-export { Authority };
+export { Authority }

src/components/Basic/index.ts

@@ -1,5 +1,5 @@
-import BasicArrow from './src/BasicArrow.vue';
-import BasicTitle from './src/BasicTitle.vue';
-import BasicHelp from './src/BasicHelp.vue';
+import BasicArrow from './src/BasicArrow.vue'
+import BasicTitle from './src/BasicTitle.vue'
+import BasicHelp from './src/BasicHelp.vue'
 
-export { BasicArrow, BasicTitle, BasicHelp };
+export { BasicArrow, BasicTitle, BasicHelp }

src/components/Button/index.ts

@@ -1,4 +1,4 @@
-import Button from './src/BasicButton.vue';
-import PopConfirmButton from './src/PopConfirmButton.vue';
+import Button from './src/BasicButton.vue'
+import PopConfirmButton from './src/PopConfirmButton.vue'
 
-export { Button, PopConfirmButton };
+export { Button, PopConfirmButton }

src/components/ClickOutSide/index.ts

@@ -1,3 +1,3 @@
-import ClickOutSide from './src/index.vue';
+import ClickOutSide from './src/index.vue'
 
-export { ClickOutSide };
+export { ClickOutSide }

src/components/Container/index.ts

@@ -1,6 +1,6 @@
-import CollapseContainer from './src/collapse/CollapseContainer.vue';
-import ScrollContainer from './src/ScrollContainer.vue';
-import LazyContainer from './src/LazyContainer.vue';
+import CollapseContainer from './src/collapse/CollapseContainer.vue'
+import ScrollContainer from './src/ScrollContainer.vue'
+import LazyContainer from './src/LazyContainer.vue'
 
-export { CollapseContainer, ScrollContainer, LazyContainer };
-export * from './src/types';
+export { CollapseContainer, ScrollContainer, LazyContainer }
+export * from './src/types'

src/components/Container/src/types.ts

@@ -1,17 +1,17 @@
-export type ScrollType = 'default' | 'main';
+export type ScrollType = 'default' | 'main'
 
 export interface CollapseContainerOptions {
-  canExpand?: boolean;
-  title?: string;
-  helpMessage?: Array<any> | string;
+  canExpand?: boolean
+  title?: string
+  helpMessage?: Array<any> | string
 }
 export interface ScrollContainerOptions {
-  enableScroll?: boolean;
-  type?: ScrollType;
+  enableScroll?: boolean
+  type?: ScrollType
 }
 
 export type ScrollActionType = RefType<{
-  scrollBottom: () => void;
-  getScrollWrap: () => Nullable<HTMLElement>;
-  scrollTo: (top: number) => void;
-}>;
+  scrollBottom: () => void
+  getScrollWrap: () => Nullable<HTMLElement>
+  scrollTo: (top: number) => void
+}>

src/components/ContextMenu/index.ts

@@ -1,3 +1,3 @@
-export { createContextMenu, destroyContextMenu } from './src/createContextMenu';
+export { createContextMenu, destroyContextMenu } from './src/createContextMenu'
 
-export * from './src/types';
+export * from './src/types'

src/components/ContextMenu/src/createContextMenu.ts

@@ -1,73 +1,73 @@
-import contextMenuVue from './index';
-import { isClient } from '/@/utils/is';
-import { CreateContextOptions, ContextMenuProps } from './types';
-import { createVNode, render } from 'vue';
+import contextMenuVue from './index'
+import { isClient } from '/@/utils/is'
+import { CreateContextOptions, ContextMenuProps } from './types'
+import { createVNode, render } from 'vue'
 
 const menuManager: {
-  domList: Element[];
-  resolve: Fn;
+  domList: Element[]
+  resolve: Fn
 } = {
   domList: [],
-  resolve: () => {},
-};
+  resolve: () => {}
+}
 
 export const createContextMenu = function (options: CreateContextOptions) {
-  const { event } = options || {};
+  const { event } = options || {}
 
-  event && event?.preventDefault();
+  event && event?.preventDefault()
 
-  if (!isClient) return;
-  return new Promise((resolve) => {
-    const body = document.body;
+  if (!isClient) return
+  return new Promise(resolve => {
+    const body = document.body
 
-    const container = document.createElement('div');
-    const propsData: Partial<ContextMenuProps> = {};
+    const container = document.createElement('div')
+    const propsData: Partial<ContextMenuProps> = {}
     if (options.styles) {
-      propsData.styles = options.styles;
+      propsData.styles = options.styles
     }
 
     if (options.items) {
-      propsData.items = options.items;
+      propsData.items = options.items
     }
 
     if (options.event) {
-      propsData.customEvent = event;
-      propsData.axis = { x: event.clientX, y: event.clientY };
+      propsData.customEvent = event
+      propsData.axis = { x: event.clientX, y: event.clientY }
     }
 
-    const vm = createVNode(contextMenuVue, propsData);
-    render(vm, container);
+    const vm = createVNode(contextMenuVue, propsData)
+    render(vm, container)
 
     const handleClick = function () {
-      menuManager.resolve('');
-    };
+      menuManager.resolve('')
+    }
 
-    menuManager.domList.push(container);
+    menuManager.domList.push(container)
 
     const remove = function () {
       menuManager.domList.forEach((dom: Element) => {
         try {
-          dom && body.removeChild(dom);
+          dom && body.removeChild(dom)
         } catch (error) {}
-      });
-      body.removeEventListener('click', handleClick);
-      body.removeEventListener('scroll', handleClick);
-    };
+      })
+      body.removeEventListener('click', handleClick)
+      body.removeEventListener('scroll', handleClick)
+    }
 
     menuManager.resolve = function (...arg: any) {
-      remove();
-      resolve(arg[0]);
-    };
-    remove();
-    body.appendChild(container);
-    body.addEventListener('click', handleClick);
-    body.addEventListener('scroll', handleClick);
-  });
-};
+      remove()
+      resolve(arg[0])
+    }
+    remove()
+    body.appendChild(container)
+    body.addEventListener('click', handleClick)
+    body.addEventListener('scroll', handleClick)
+  })
+}
 
 export const destroyContextMenu = function () {
   if (menuManager) {
-    menuManager.resolve('');
-    menuManager.domList = [];
+    menuManager.resolve('')
+    menuManager.domList = []
   }
-};
+}

src/components/ContextMenu/src/props.ts

@@ -1,11 +1,11 @@
-import type { PropType } from 'vue';
-import type { Axis, ContextMenuItem } from './types';
-import { propTypes } from '/@/utils/propTypes';
+import type { PropType } from 'vue'
+import type { Axis, ContextMenuItem } from './types'
+import { propTypes } from '/@/utils/propTypes'
 export const contextMenuProps = {
   width: propTypes.number.def(156),
   customEvent: {
     type: Object as PropType<Event>,
-    default: null,
+    default: null
   },
   styles: propTypes.style,
   showIcon: propTypes.bool.def(true),
@@ -13,14 +13,14 @@ export const contextMenuProps = {
     // The position of the right mouse button click
     type: Object as PropType<Axis>,
     default() {
-      return { x: 0, y: 0 };
-    },
+      return { x: 0, y: 0 }
+    }
   },
   items: {
     // The most important list, if not, will not be displayed
     type: Array as PropType<ContextMenuItem[]>,
     default() {
-      return [];
-    },
-  },
-};
+      return []
+    }
+  }
+}

src/components/ContextMenu/src/types.ts

@@ -1,35 +1,35 @@
 export interface Axis {
-  x: number;
-  y: number;
+  x: number
+  y: number
 }
 
 export interface ContextMenuItem {
-  label: string;
-  icon?: string;
-  disabled?: boolean;
-  handler?: Fn;
-  divider?: boolean;
-  children?: ContextMenuItem[];
+  label: string
+  icon?: string
+  disabled?: boolean
+  handler?: Fn
+  divider?: boolean
+  children?: ContextMenuItem[]
 }
 export interface CreateContextOptions {
-  event: MouseEvent;
-  icon?: string;
-  styles?: any;
-  items?: ContextMenuItem[];
+  event: MouseEvent
+  icon?: string
+  styles?: any
+  items?: ContextMenuItem[]
 }
 
 export interface ContextMenuProps {
-  event?: MouseEvent;
-  styles?: any;
-  items: ContextMenuItem[];
-  customEvent?: MouseEvent;
-  axis?: Axis;
-  width?: number;
-  showIcon?: boolean;
+  event?: MouseEvent
+  styles?: any
+  items: ContextMenuItem[]
+  customEvent?: MouseEvent
+  axis?: Axis
+  width?: number
+  showIcon?: boolean
 }
 
 export interface ItemContentProps {
-  showIcon: boolean | undefined;
-  item: ContextMenuItem;
-  handler: Fn;
+  showIcon: boolean | undefined
+  item: ContextMenuItem
+  handler: Fn
 }

src/components/CountDown/index.ts

@@ -1,4 +1,4 @@
-import CountButton from './src/CountButton.vue';
-import CountdownInput from './src/CountdownInput.vue';
+import CountButton from './src/CountButton.vue'
+import CountdownInput from './src/CountdownInput.vue'
 
-export { CountdownInput, CountButton };
+export { CountdownInput, CountButton }

src/components/CountDown/src/useCountdown.ts

@@ -1,51 +1,51 @@
-import { ref, unref } from 'vue';
-import { tryOnUnmounted } from '@vueuse/core';
+import { ref, unref } from 'vue'
+import { tryOnUnmounted } from '@vueuse/core'
 
 export function useCountdown(count: number) {
-  const currentCount = ref(count);
+  const currentCount = ref(count)
 
-  const isStart = ref(false);
+  const isStart = ref(false)
 
-  let timerId: ReturnType<typeof setInterval> | null;
+  let timerId: ReturnType<typeof setInterval> | null
 
   function clear() {
-    timerId && window.clearInterval(timerId);
+    timerId && window.clearInterval(timerId)
   }
 
   function stop() {
-    isStart.value = false;
-    clear();
-    timerId = null;
+    isStart.value = false
+    clear()
+    timerId = null
   }
 
   function start() {
     if (unref(isStart) || !!timerId) {
-      return;
+      return
     }
-    isStart.value = true;
+    isStart.value = true
     timerId = setInterval(() => {
       if (unref(currentCount) === 1) {
-        stop();
-        currentCount.value = count;
+        stop()
+        currentCount.value = count
       } else {
-        currentCount.value -= 1;
+        currentCount.value -= 1
       }
-    }, 1000);
+    }, 1000)
   }
 
   function reset() {
-    currentCount.value = count;
-    stop();
+    currentCount.value = count
+    stop()
   }
 
   function restart() {
-    reset();
-    start();
+    reset()
+    start()
   }
 
   tryOnUnmounted(() => {
-    reset();
-  });
+    reset()
+  })
 
-  return { start, reset, restart, clear, stop, currentCount, isStart };
+  return { start, reset, restart, clear, stop, currentCount, isStart }
 }

src/components/CountTo/index.ts

@@ -1,4 +1,4 @@
 // Transform vue-count-to to support vue3 version
 
-import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
-export const CountTo = createAsyncComponent(() => import('./src/index.vue'));
+import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
+export const CountTo = createAsyncComponent(() => import('./src/index.vue'))

src/components/CountTo/src/props.ts

@@ -1,5 +1,5 @@
-import { PropType } from 'vue';
-import { propTypes } from '/@/utils/propTypes';
+import { PropType } from 'vue'
+import { propTypes } from '/@/utils/propTypes'
 export const countToProps = {
   startVal: propTypes.number.def(0),
   endVal: propTypes.number.def(2020),
@@ -10,8 +10,8 @@ export const countToProps = {
     required: false,
     default: 0,
     validator(value: number) {
-      return value >= 0;
-    },
+      return value >= 0
+    }
   },
   decimal: propTypes.string.def('.'),
   separator: propTypes.string.def(','),
@@ -21,7 +21,7 @@ export const countToProps = {
   easingFn: {
     type: Function as PropType<(t: number, b: number, c: number, d: number) => number>,
     default(t: number, b: number, c: number, d: number) {
-      return (c * (-Math.pow(2, (-10 * t) / d) + 1) * 1024) / 1023 + b;
-    },
-  },
-};
+      return (c * (-Math.pow(2, (-10 * t) / d) + 1) * 1024) / 1023 + b
+    }
+  }
+}

src/components/Description/index.ts

@@ -1,5 +1,5 @@
-import Description from './src/index.vue';
+import Description from './src/index.vue'
 
-export { Description };
-export * from './src/types';
-export { useDescription } from './src/useDescription';
+export { Description }
+export * from './src/types'
+export { useDescription } from './src/useDescription'

src/components/Description/src/props.ts

@@ -1,7 +1,7 @@
-import type { PropType } from 'vue';
-import type { CollapseContainerOptions } from '/@/components/Container';
-import type { DescItem } from './types';
-import { propTypes } from '/@/utils/propTypes';
+import type { PropType } from 'vue'
+import type { CollapseContainerOptions } from '/@/components/Container'
+import type { DescItem } from './types'
+import { propTypes } from '/@/utils/propTypes'
 export default {
   useCollapse: propTypes.bool.def(true),
   title: propTypes.string.def(''),
@@ -10,16 +10,16 @@ export default {
   column: {
     type: [Number, Object] as PropType<number | Recordable>,
     default: () => {
-      return { xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 };
-    },
+      return { xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }
+    }
   },
   collapseOptions: {
     type: Object as PropType<CollapseContainerOptions>,
-    default: null,
+    default: null
   },
   schema: {
     type: Array as PropType<Array<DescItem>>,
-    default: () => [],
+    default: () => []
   },
-  data: propTypes.object,
-};
+  data: propTypes.object
+}

src/components/Description/src/types.ts

@@ -1,53 +1,53 @@
-import type { VNode, CSSProperties } from 'vue';
-import type { CollapseContainerOptions } from '/@/components/Container/index';
-import type { DescriptionsProps } from 'ant-design-vue/es/descriptions/index';
+import type { VNode, CSSProperties } from 'vue'
+import type { CollapseContainerOptions } from '/@/components/Container/index'
+import type { DescriptionsProps } from 'ant-design-vue/es/descriptions/index'
 
 export interface DescItem {
-  labelMinWidth?: number;
+  labelMinWidth?: number
 
-  contentMinWidth?: number;
+  contentMinWidth?: number
 
-  labelStyle?: CSSProperties;
+  labelStyle?: CSSProperties
 
-  field: string;
-  label: string | VNode | JSX.Element;
+  field: string
+  label: string | VNode | JSX.Element
   // Merge column
-  span?: number;
-  show?: (...arg: any) => boolean;
+  span?: number
+  show?: (...arg: any) => boolean
   // render
   render?: (
     val: any,
     data: Recordable
-  ) => VNode | undefined | JSX.Element | Element | string | number;
+  ) => VNode | undefined | JSX.Element | Element | string | number
 }
 
 export interface DescOptions extends DescriptionsProps {
   // Whether to include the collapse component
-  useCollapse?: boolean;
+  useCollapse?: boolean
   /**
    * item configuration
    * @type DescItem
    */
-  schema: DescItem[];
+  schema: DescItem[]
   /**
    * 数据
    * @type object
    */
-  data: Recordable;
+  data: Recordable
   /**
    * Built-in CollapseContainer component configuration
    * @type CollapseContainerOptions
    */
-  collapseOptions?: CollapseContainerOptions;
+  collapseOptions?: CollapseContainerOptions
 }
 
 export interface DescInstance {
-  setDescProps(descProps: Partial<DescOptions>): void;
+  setDescProps(descProps: Partial<DescOptions>): void
 }
 
-export type Register = (descInstance: DescInstance) => void;
+export type Register = (descInstance: DescInstance) => void
 
 /**
  * @description:
  */
-export type UseDescReturnType = [Register, DescInstance];
+export type UseDescReturnType = [Register, DescInstance]

src/components/Description/src/useDescription.ts

@@ -1,27 +1,27 @@
-import { ref, getCurrentInstance, unref } from 'vue';
-import { isProdMode } from '/@/utils/env';
+import { ref, getCurrentInstance, unref } from 'vue'
+import { isProdMode } from '/@/utils/env'
 
-import type { DescOptions, DescInstance, UseDescReturnType } from './types';
+import type { DescOptions, DescInstance, UseDescReturnType } from './types'
 
 export function useDescription(props?: Partial<DescOptions>): UseDescReturnType {
   if (!getCurrentInstance()) {
-    throw new Error('Please put useDescription function in the setup function!');
+    throw new Error('Please put useDescription function in the setup function!')
   }
-  const descRef = ref<Nullable<DescInstance>>(null);
-  const loadedRef = ref(false);
+  const descRef = ref<Nullable<DescInstance>>(null)
+  const loadedRef = ref(false)
 
   function register(instance: DescInstance) {
-    if (unref(loadedRef) && isProdMode()) return;
-    descRef.value = instance;
-    props && instance.setDescProps(props);
-    loadedRef.value = true;
+    if (unref(loadedRef) && isProdMode()) return
+    descRef.value = instance
+    props && instance.setDescProps(props)
+    loadedRef.value = true
   }
 
   const methods: DescInstance = {
     setDescProps: (descProps: Partial<DescOptions>): void => {
-      unref(descRef)?.setDescProps(descProps);
-    },
-  };
+      unref(descRef)?.setDescProps(descProps)
+    }
+  }
 
-  return [register, methods];
+  return [register, methods]
 }

src/components/Drawer/index.ts

@@ -1,5 +1,5 @@
-import BasicDrawer from './src/BasicDrawer.vue';
+import BasicDrawer from './src/BasicDrawer.vue'
 
-export { BasicDrawer };
-export * from './src/types';
-export { useDrawer, useDrawerInner } from './src/useDrawer';
+export { BasicDrawer }
+export * from './src/types'
+export { useDrawer, useDrawerInner } from './src/useDrawer'

src/components/Drawer/src/props.ts

@@ -1,8 +1,8 @@
-import type { PropType } from 'vue';
+import type { PropType } from 'vue'
 
-import { useI18n } from '/@/hooks/web/useI18n';
-import { propTypes } from '/@/utils/propTypes';
-const { t } = useI18n();
+import { useI18n } from '/@/hooks/web/useI18n'
+import { propTypes } from '/@/utils/propTypes'
+const { t } = useI18n()
 
 export const footerProps = {
   confirmLoading: propTypes.bool,
@@ -22,9 +22,9 @@ export const footerProps = {
   showFooter: propTypes.bool,
   footerHeight: {
     type: [String, Number] as PropType<string | number>,
-    default: 60,
-  },
-};
+    default: 60
+  }
+}
 export const basicProps = {
   isDetail: propTypes.bool,
   title: propTypes.string.def(''),
@@ -34,17 +34,17 @@ export const basicProps = {
   loading: propTypes.bool,
   maskClosable: propTypes.bool.def(true),
   getContainer: {
-    type: [Object, String] as PropType<any>,
+    type: [Object, String] as PropType<any>
   },
   scrollOptions: {
     type: Object as PropType<any>,
-    default: null,
+    default: null
   },
   closeFunc: {
     type: [Function, Object] as PropType<any>,
-    default: null,
+    default: null
   },
   triggerWindowResize: propTypes.bool,
   destroyOnClose: propTypes.bool,
-  ...footerProps,
-};
+  ...footerProps
+}

src/components/Drawer/src/types.ts

@@ -1,194 +1,194 @@
-import type { ButtonProps } from 'ant-design-vue/lib/button/buttonTypes';
-import type { CSSProperties, VNodeChild, ComputedRef } from 'vue';
-import type { ScrollContainerOptions } from '/@/components/Container/index';
+import type { ButtonProps } from 'ant-design-vue/lib/button/buttonTypes'
+import type { CSSProperties, VNodeChild, ComputedRef } from 'vue'
+import type { ScrollContainerOptions } from '/@/components/Container/index'
 
 export interface DrawerInstance {
-  setDrawerProps: (props: Partial<DrawerProps> | boolean) => void;
-  emitVisible?: (visible: boolean, uid: number) => void;
+  setDrawerProps: (props: Partial<DrawerProps> | boolean) => void
+  emitVisible?: (visible: boolean, uid: number) => void
 }
 
 export interface ReturnMethods extends DrawerInstance {
-  openDrawer: <T = any>(visible?: boolean, data?: T, openOnSet?: boolean) => void;
-  getVisible?: ComputedRef<boolean>;
+  openDrawer: <T = any>(visible?: boolean, data?: T, openOnSet?: boolean) => void
+  getVisible?: ComputedRef<boolean>
 }
 
-export type RegisterFn = (drawerInstance: DrawerInstance, uuid?: string) => void;
+export type RegisterFn = (drawerInstance: DrawerInstance, uuid?: string) => void
 
 export interface ReturnInnerMethods extends DrawerInstance {
-  closeDrawer: () => void;
-  changeLoading: (loading: boolean) => void;
-  changeOkLoading: (loading: boolean) => void;
-  getVisible?: ComputedRef<boolean>;
+  closeDrawer: () => void
+  changeLoading: (loading: boolean) => void
+  changeOkLoading: (loading: boolean) => void
+  getVisible?: ComputedRef<boolean>
 }
 
-export type UseDrawerReturnType = [RegisterFn, ReturnMethods];
+export type UseDrawerReturnType = [RegisterFn, ReturnMethods]
 
-export type UseDrawerInnerReturnType = [RegisterFn, ReturnInnerMethods];
+export type UseDrawerInnerReturnType = [RegisterFn, ReturnInnerMethods]
 
 export interface DrawerFooterProps {
-  showOkBtn: boolean;
-  showCancelBtn: boolean;
+  showOkBtn: boolean
+  showCancelBtn: boolean
   /**
    * Text of the Cancel button
    * @default 'cancel'
    * @type string
    */
-  cancelText: string;
+  cancelText: string
   /**
    * Text of the OK button
    * @default 'OK'
    * @type string
    */
-  okText: string;
+  okText: string
 
   /**
    * Button type of the OK button
    * @default 'primary'
    * @type string
    */
-  okType: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default';
+  okType: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default'
   /**
    * The ok button props, follow jsx rules
    * @type object
    */
-  okButtonProps: { props: ButtonProps; on: {} };
+  okButtonProps: { props: ButtonProps; on: {} }
 
   /**
    * The cancel button props, follow jsx rules
    * @type object
    */
-  cancelButtonProps: { props: ButtonProps; on: {} };
+  cancelButtonProps: { props: ButtonProps; on: {} }
   /**
    * Whether to apply loading visual effect for OK button or not
    * @default false
    * @type boolean
    */
-  confirmLoading: boolean;
+  confirmLoading: boolean
 
-  showFooter: boolean;
-  footerHeight: string | number;
+  showFooter: boolean
+  footerHeight: string | number
 }
 export interface DrawerProps extends DrawerFooterProps {
-  isDetail?: boolean;
-  loading?: boolean;
-  showDetailBack?: boolean;
-  visible?: boolean;
+  isDetail?: boolean
+  loading?: boolean
+  showDetailBack?: boolean
+  visible?: boolean
   /**
    * Built-in ScrollContainer component configuration
    * @type ScrollContainerOptions
    */
-  scrollOptions?: ScrollContainerOptions;
-  closeFunc?: () => Promise<any>;
-  triggerWindowResize?: boolean;
+  scrollOptions?: ScrollContainerOptions
+  closeFunc?: () => Promise<any>
+  triggerWindowResize?: boolean
   /**
    * Whether a close (x) button is visible on top right of the Drawer dialog or not.
    * @default true
    * @type boolean
    */
-  closable?: boolean;
+  closable?: boolean
 
   /**
    * Whether to unmount child components on closing drawer or not.
    * @default false
    * @type boolean
    */
-  destroyOnClose?: boolean;
+  destroyOnClose?: boolean
 
   /**
    * Return the mounted node for Drawer.
    * @default 'body'
    * @type any ( HTMLElement| () => HTMLElement | string)
    */
-  getContainer?: () => HTMLElement | string;
+  getContainer?: () => HTMLElement | string
 
   /**
    * Whether to show mask or not.
    * @default true
    * @type boolean
    */
-  mask?: boolean;
+  mask?: boolean
 
   /**
    * Clicking on the mask (area outside the Drawer) to close the Drawer or not.
    * @default true
    * @type boolean
    */
-  maskClosable?: boolean;
+  maskClosable?: boolean
 
   /**
    * Style for Drawer's mask element.
    * @default {}
    * @type object
    */
-  maskStyle?: CSSProperties;
+  maskStyle?: CSSProperties
 
   /**
    * The title for Drawer.
    * @type any (string | slot)
    */
-  title?: VNodeChild | JSX.Element;
+  title?: VNodeChild | JSX.Element
 
   /**
    * The class name of the container of the Drawer dialog.
    * @type string
    */
-  wrapClassName?: string;
+  wrapClassName?: string
 
   /**
    * Style of wrapper element which **contains mask** compare to `drawerStyle`
    * @type object
    */
-  wrapStyle?: CSSProperties;
+  wrapStyle?: CSSProperties
 
   /**
    * Style of the popup layer element
    * @type object
    */
-  drawerStyle?: CSSProperties;
+  drawerStyle?: CSSProperties
 
   /**
    * Style of floating layer, typically used for adjusting its position.
    * @type object
    */
-  bodyStyle?: CSSProperties;
-  headerStyle?: CSSProperties;
+  bodyStyle?: CSSProperties
+  headerStyle?: CSSProperties
 
   /**
    * Width of the Drawer dialog.
    * @default 256
    * @type string | number
    */
-  width?: string | number;
+  width?: string | number
 
   /**
    * placement is top or bottom, height of the Drawer dialog.
    * @type string | number
    */
-  height?: string | number;
+  height?: string | number
 
   /**
    * The z-index of the Drawer.
    * @default 1000
    * @type number
    */
-  zIndex?: number;
+  zIndex?: number
 
   /**
    * The placement of the Drawer.
    * @default 'right'
    * @type string
    */
-  placement?: 'top' | 'right' | 'bottom' | 'left';
-  afterVisibleChange?: (visible?: boolean) => void;
-  keyboard?: boolean;
+  placement?: 'top' | 'right' | 'bottom' | 'left'
+  afterVisibleChange?: (visible?: boolean) => void
+  keyboard?: boolean
 
   /**
    * Specify a callback that will be called when a user clicks mask, close button or Cancel button.
    */
-  onClose?: (e?: Event) => void;
+  onClose?: (e?: Event) => void
 }
 export interface DrawerActionType {
-  scrollBottom: () => void;
-  scrollTo: (to: number) => void;
-  getScrollWrap: () => Element | null;
+  scrollBottom: () => void
+  scrollTo: (to: number) => void
+  getScrollWrap: () => Element | null
 }

src/components/Drawer/src/useDrawer.ts

@@ -3,8 +3,8 @@ import type {
   DrawerInstance,
   ReturnMethods,
   DrawerProps,
-  UseDrawerInnerReturnType,
-} from './types';
+  UseDrawerInnerReturnType
+} from './types'
 
 import {
   ref,
@@ -14,145 +14,145 @@ import {
   watchEffect,
   nextTick,
   toRaw,
-  computed,
-} from 'vue';
+  computed
+} from 'vue'
 
-import { isProdMode } from '/@/utils/env';
-import { isFunction } from '/@/utils/is';
-import { tryOnUnmounted } from '@vueuse/core';
+import { isProdMode } from '/@/utils/env'
+import { isFunction } from '/@/utils/is'
+import { tryOnUnmounted } from '@vueuse/core'
 
-import { isEqual } from 'lodash-es';
-import { error } from '/@/utils/log';
+import { isEqual } from 'lodash-es'
+import { error } from '/@/utils/log'
 
-const dataTransferRef = reactive<any>({});
+const dataTransferRef = reactive<any>({})
 
-const visibleData = reactive<{ [key: number]: boolean }>({});
+const visibleData = reactive<{ [key: number]: boolean }>({})
 
 /**
  * @description: Applicable to separate drawer and call outside
  */
 export function useDrawer(): UseDrawerReturnType {
-  const drawerRef = ref<DrawerInstance | null>(null);
-  const loadedRef = ref<Nullable<boolean>>(false);
-  const uidRef = ref<string>('');
+  const drawerRef = ref<DrawerInstance | null>(null)
+  const loadedRef = ref<Nullable<boolean>>(false)
+  const uidRef = ref<string>('')
 
   function register(drawerInstance: DrawerInstance, uuid: string) {
     isProdMode() &&
       tryOnUnmounted(() => {
-        drawerRef.value = null;
-        loadedRef.value = null;
-        dataTransferRef[unref(uidRef)] = null;
-      });
+        drawerRef.value = null
+        loadedRef.value = null
+        dataTransferRef[unref(uidRef)] = null
+      })
 
     if (unref(loadedRef) && isProdMode() && drawerInstance === unref(drawerRef)) {
-      return;
+      return
     }
-    uidRef.value = uuid;
-    drawerRef.value = drawerInstance;
-    loadedRef.value = true;
+    uidRef.value = uuid
+    drawerRef.value = drawerInstance
+    loadedRef.value = true
 
     drawerInstance.emitVisible = (visible: boolean, uid: number) => {
-      visibleData[uid] = visible;
-    };
+      visibleData[uid] = visible
+    }
   }
 
   const getInstance = () => {
-    const instance = unref(drawerRef);
+    const instance = unref(drawerRef)
     if (!instance) {
-      error('useDrawer instance is undefined!');
+      error('useDrawer instance is undefined!')
     }
-    return instance;
-  };
+    return instance
+  }
 
   const methods: ReturnMethods = {
     setDrawerProps: (props: Partial<DrawerProps>): void => {
-      getInstance()?.setDrawerProps(props);
+      getInstance()?.setDrawerProps(props)
     },
 
     getVisible: computed((): boolean => {
-      return visibleData[~~unref(uidRef)];
+      return visibleData[~~unref(uidRef)]
     }),
 
     openDrawer: <T = any>(visible = true, data?: T, openOnSet = true): void => {
       getInstance()?.setDrawerProps({
-        visible: visible,
-      });
-      if (!data) return;
+        visible: visible
+      })
+      if (!data) return
 
       if (openOnSet) {
-        dataTransferRef[unref(uidRef)] = null;
-        dataTransferRef[unref(uidRef)] = toRaw(data);
-        return;
+        dataTransferRef[unref(uidRef)] = null
+        dataTransferRef[unref(uidRef)] = toRaw(data)
+        return
       }
-      const equal = isEqual(toRaw(dataTransferRef[unref(uidRef)]), toRaw(data));
+      const equal = isEqual(toRaw(dataTransferRef[unref(uidRef)]), toRaw(data))
       if (!equal) {
-        dataTransferRef[unref(uidRef)] = toRaw(data);
+        dataTransferRef[unref(uidRef)] = toRaw(data)
       }
-    },
-  };
+    }
+  }
 
-  return [register, methods];
+  return [register, methods]
 }
 
 export const useDrawerInner = (callbackFn?: Fn): UseDrawerInnerReturnType => {
-  const drawerInstanceRef = ref<Nullable<DrawerInstance>>(null);
-  const currentInstance = getCurrentInstance();
-  const uidRef = ref<string>('');
+  const drawerInstanceRef = ref<Nullable<DrawerInstance>>(null)
+  const currentInstance = getCurrentInstance()
+  const uidRef = ref<string>('')
 
   if (!currentInstance) {
-    error('useDrawerInner instance is undefined!');
+    error('useDrawerInner instance is undefined!')
   }
 
   const getInstance = () => {
-    const instance = unref(drawerInstanceRef);
+    const instance = unref(drawerInstanceRef)
     if (!instance) {
-      error('useDrawerInner instance is undefined!');
-      return;
+      error('useDrawerInner instance is undefined!')
+      return
     }
-    return instance;
-  };
+    return instance
+  }
 
   const register = (modalInstance: DrawerInstance, uuid: string) => {
     isProdMode() &&
       tryOnUnmounted(() => {
-        drawerInstanceRef.value = null;
-      });
+        drawerInstanceRef.value = null
+      })
 
-    uidRef.value = uuid;
-    drawerInstanceRef.value = modalInstance;
-    currentInstance?.emit('register', modalInstance, uuid);
-  };
+    uidRef.value = uuid
+    drawerInstanceRef.value = modalInstance
+    currentInstance?.emit('register', modalInstance, uuid)
+  }
 
   watchEffect(() => {
-    const data = dataTransferRef[unref(uidRef)];
-    if (!data) return;
-    if (!callbackFn || !isFunction(callbackFn)) return;
+    const data = dataTransferRef[unref(uidRef)]
+    if (!data) return
+    if (!callbackFn || !isFunction(callbackFn)) return
     nextTick(() => {
-      callbackFn(data);
-    });
-  });
+      callbackFn(data)
+    })
+  })
 
   return [
     register,
     {
       changeLoading: (loading = true) => {
-        getInstance()?.setDrawerProps({ loading });
+        getInstance()?.setDrawerProps({ loading })
       },
 
       changeOkLoading: (loading = true) => {
-        getInstance()?.setDrawerProps({ confirmLoading: loading });
+        getInstance()?.setDrawerProps({ confirmLoading: loading })
       },
       getVisible: computed((): boolean => {
-        return visibleData[~~unref(uidRef)];
+        return visibleData[~~unref(uidRef)]
       }),
 
       closeDrawer: () => {
-        getInstance()?.setDrawerProps({ visible: false });
+        getInstance()?.setDrawerProps({ visible: false })
       },
 
       setDrawerProps: (props: Partial<DrawerProps>) => {
-        getInstance()?.setDrawerProps(props);
-      },
-    },
-  ];
-};
+        getInstance()?.setDrawerProps(props)
+      }
+    }
+  ]
+}

src/components/Dropdown/index.ts

@@ -1,4 +1,4 @@
-import Dropdown from './src/Dropdown.vue';
+import Dropdown from './src/Dropdown.vue'
 
-export * from './src/types';
-export { Dropdown };
+export * from './src/types'
+export { Dropdown }

src/components/Dropdown/src/types.ts

@@ -1,11 +1,11 @@
 export interface DropMenu {
-  onClick?: Fn;
-  to?: string;
-  icon?: string;
-  event: string | number;
-  text: string;
-  disabled?: boolean;
-  divider?: boolean;
+  onClick?: Fn
+  to?: string
+  icon?: string
+  event: string | number
+  text: string
+  disabled?: boolean
+  divider?: boolean
 }
 
 // export type Trigger = 'click' | 'hover' | 'contextMenu';

src/components/Excel/index.ts

@@ -1,8 +1,8 @@
-import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
+import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
 
-export const ImpExcel = createAsyncComponent(() => import('./src/ImportExcel.vue'));
-export const ExpExcelModel = createAsyncComponent(() => import('./src/ExportExcelModel.vue'));
+export const ImpExcel = createAsyncComponent(() => import('./src/ImportExcel.vue'))
+export const ExpExcelModel = createAsyncComponent(() => import('./src/ExportExcelModel.vue'))
 
-export * from './src/types';
+export * from './src/types'
 
-export { jsonToSheetXlsx, aoaToSheetXlsx } from './src/Export2Excel';
+export { jsonToSheetXlsx, aoaToSheetXlsx } from './src/Export2Excel'

src/components/Excel/src/Export2Excel.ts

@@ -1,34 +1,34 @@
-import xlsx from 'xlsx';
-import type { WorkBook } from 'xlsx';
-import type { JsonToSheet, AoAToSheet } from './types';
+import xlsx from 'xlsx'
+import type { WorkBook } from 'xlsx'
+import type { JsonToSheet, AoAToSheet } from './types'
 
-const { utils, writeFile } = xlsx;
+const { utils, writeFile } = xlsx
 
-const DEF_FILE_NAME = 'excel-list.xlsx';
+const DEF_FILE_NAME = 'excel-list.xlsx'
 export function jsonToSheetXlsx<T = any>({
   data,
   header,
   filename = DEF_FILE_NAME,
   json2sheetOpts = {},
-  write2excelOpts = { bookType: 'xlsx' },
+  write2excelOpts = { bookType: 'xlsx' }
 }: JsonToSheet<T>) {
-  const arrData = [...data];
+  const arrData = [...data]
   if (header) {
-    arrData.unshift(header);
-    json2sheetOpts.skipHeader = true;
+    arrData.unshift(header)
+    json2sheetOpts.skipHeader = true
   }
 
-  const worksheet = utils.json_to_sheet(arrData, json2sheetOpts);
+  const worksheet = utils.json_to_sheet(arrData, json2sheetOpts)
 
   /* add worksheet to workbook */
   const workbook: WorkBook = {
     SheetNames: [filename],
     Sheets: {
-      [filename]: worksheet,
-    },
-  };
+      [filename]: worksheet
+    }
+  }
   /* output format determined by filename */
-  writeFile(workbook, filename, write2excelOpts);
+  writeFile(workbook, filename, write2excelOpts)
   /* at this point, out.xlsb will have been downloaded */
 }
 
@@ -36,23 +36,23 @@ export function aoaToSheetXlsx<T = any>({
   data,
   header,
   filename = DEF_FILE_NAME,
-  write2excelOpts = { bookType: 'xlsx' },
+  write2excelOpts = { bookType: 'xlsx' }
 }: AoAToSheet<T>) {
-  const arrData = [...data];
+  const arrData = [...data]
   if (header) {
-    arrData.unshift(header);
+    arrData.unshift(header)
   }
 
-  const worksheet = utils.aoa_to_sheet(arrData);
+  const worksheet = utils.aoa_to_sheet(arrData)
 
   /* add worksheet to workbook */
   const workbook: WorkBook = {
     SheetNames: [filename],
     Sheets: {
-      [filename]: worksheet,
-    },
-  };
+      [filename]: worksheet
+    }
+  }
   /* output format determined by filename */
-  writeFile(workbook, filename, write2excelOpts);
+  writeFile(workbook, filename, write2excelOpts)
   /* at this point, out.xlsb will have been downloaded */
 }

src/components/Excel/src/types.ts

@@ -1,9 +1,9 @@
-import type { JSON2SheetOpts, WritingOptions, BookType } from 'xlsx';
+import type { JSON2SheetOpts, WritingOptions, BookType } from 'xlsx'
 
 export interface ExcelData<T = any> {
-  header: string[];
-  results: T[];
-  meta: { sheetName: string };
+  header: string[]
+  results: T[]
+  meta: { sheetName: string }
 }
 
 // export interface ImportProps {
@@ -11,21 +11,21 @@ export interface ExcelData<T = any> {
 // }
 
 export interface JsonToSheet<T = any> {
-  data: T[];
-  header?: T;
-  filename?: string;
-  json2sheetOpts?: JSON2SheetOpts;
-  write2excelOpts?: WritingOptions;
+  data: T[]
+  header?: T
+  filename?: string
+  json2sheetOpts?: JSON2SheetOpts
+  write2excelOpts?: WritingOptions
 }
 
 export interface AoAToSheet<T = any> {
-  data: T[][];
-  header?: T[];
-  filename?: string;
-  write2excelOpts?: WritingOptions;
+  data: T[][]
+  header?: T[]
+  filename?: string
+  write2excelOpts?: WritingOptions
 }
 
 export interface ExportModalResult {
-  filename: string;
-  bookType: BookType;
+  filename: string
+  bookType: BookType
 }

src/components/Form/index.ts

@@ -1,12 +1,12 @@
-import BasicForm from './src/BasicForm.vue';
+import BasicForm from './src/BasicForm.vue'
 
-export * from './src/types/form';
-export * from './src/types/formItem';
+export * from './src/types/form'
+export * from './src/types/formItem'
 
-export { useComponentRegister } from './src/hooks/useComponentRegister';
-export { useForm } from './src/hooks/useForm';
+export { useComponentRegister } from './src/hooks/useComponentRegister'
+export { useForm } from './src/hooks/useForm'
 
-export { default as ApiSelect } from './src/components/ApiSelect.vue';
-export { default as RadioButtonGroup } from './src/components/RadioButtonGroup.vue';
+export { default as ApiSelect } from './src/components/ApiSelect.vue'
+export { default as RadioButtonGroup } from './src/components/RadioButtonGroup.vue'
 
-export { BasicForm };
+export { BasicForm }

src/components/Form/src/componentMap.ts

@@ -1,5 +1,5 @@
-import type { Component } from 'vue';
-import type { ComponentType } from './types/index';
+import type { Component } from 'vue'
+import type { ComponentType } from './types/index'
 
 /**
  * Component list, register here to setting it in the form
@@ -15,53 +15,53 @@ import {
   InputNumber,
   Switch,
   TimePicker,
-  TreeSelect,
-} from 'ant-design-vue';
+  TreeSelect
+} from 'ant-design-vue'
 
-import RadioButtonGroup from './components/RadioButtonGroup.vue';
-import ApiSelect from './components/ApiSelect.vue';
-import { BasicUpload } from '/@/components/Upload';
-import { StrengthMeter } from '/@/components/StrengthMeter';
-import { IconPicker } from '/@/components/Icon';
-import { CountdownInput } from '/@/components/CountDown';
+import RadioButtonGroup from './components/RadioButtonGroup.vue'
+import ApiSelect from './components/ApiSelect.vue'
+import { BasicUpload } from '/@/components/Upload'
+import { StrengthMeter } from '/@/components/StrengthMeter'
+import { IconPicker } from '/@/components/Icon'
+import { CountdownInput } from '/@/components/CountDown'
 
-const componentMap = new Map<ComponentType, Component>();
+const componentMap = new Map<ComponentType, Component>()
 
-componentMap.set('Input', Input);
-componentMap.set('InputGroup', Input.Group);
-componentMap.set('InputPassword', Input.Password);
-componentMap.set('InputSearch', Input.Search);
-componentMap.set('InputTextArea', Input.TextArea);
-componentMap.set('InputNumber', InputNumber);
-componentMap.set('AutoComplete', AutoComplete);
+componentMap.set('Input', Input)
+componentMap.set('InputGroup', Input.Group)
+componentMap.set('InputPassword', Input.Password)
+componentMap.set('InputSearch', Input.Search)
+componentMap.set('InputTextArea', Input.TextArea)
+componentMap.set('InputNumber', InputNumber)
+componentMap.set('AutoComplete', AutoComplete)
 
-componentMap.set('Select', Select);
-componentMap.set('ApiSelect', ApiSelect);
-componentMap.set('TreeSelect', TreeSelect);
-componentMap.set('Switch', Switch);
-componentMap.set('RadioButtonGroup', RadioButtonGroup);
-componentMap.set('RadioGroup', Radio.Group);
-componentMap.set('Checkbox', Checkbox);
-componentMap.set('CheckboxGroup', Checkbox.Group);
-componentMap.set('Cascader', Cascader);
+componentMap.set('Select', Select)
+componentMap.set('ApiSelect', ApiSelect)
+componentMap.set('TreeSelect', TreeSelect)
+componentMap.set('Switch', Switch)
+componentMap.set('RadioButtonGroup', RadioButtonGroup)
+componentMap.set('RadioGroup', Radio.Group)
+componentMap.set('Checkbox', Checkbox)
+componentMap.set('CheckboxGroup', Checkbox.Group)
+componentMap.set('Cascader', Cascader)
 
-componentMap.set('DatePicker', DatePicker);
-componentMap.set('MonthPicker', DatePicker.MonthPicker);
-componentMap.set('RangePicker', DatePicker.RangePicker);
-componentMap.set('WeekPicker', DatePicker.WeekPicker);
-componentMap.set('TimePicker', TimePicker);
-componentMap.set('StrengthMeter', StrengthMeter);
-componentMap.set('IconPicker', IconPicker);
-componentMap.set('InputCountDown', CountdownInput);
+componentMap.set('DatePicker', DatePicker)
+componentMap.set('MonthPicker', DatePicker.MonthPicker)
+componentMap.set('RangePicker', DatePicker.RangePicker)
+componentMap.set('WeekPicker', DatePicker.WeekPicker)
+componentMap.set('TimePicker', TimePicker)
+componentMap.set('StrengthMeter', StrengthMeter)
+componentMap.set('IconPicker', IconPicker)
+componentMap.set('InputCountDown', CountdownInput)
 
-componentMap.set('Upload', BasicUpload);
+componentMap.set('Upload', BasicUpload)
 
 export function add(compName: ComponentType, component: Component) {
-  componentMap.set(compName, component);
+  componentMap.set(compName, component)
 }
 
 export function del(compName: ComponentType) {
-  componentMap.delete(compName);
+  componentMap.delete(compName)
 }
 
-export { componentMap };
+export { componentMap }

src/components/Form/src/helper.ts

@@ -1,19 +1,19 @@
-import type { ValidationRule } from 'ant-design-vue/lib/form/Form';
-import type { ComponentType } from './types/index';
-import { useI18n } from '/@/hooks/web/useI18n';
-import { isNumber } from '/@/utils/is';
+import type { ValidationRule } from 'ant-design-vue/lib/form/Form'
+import type { ComponentType } from './types/index'
+import { useI18n } from '/@/hooks/web/useI18n'
+import { isNumber } from '/@/utils/is'
 
-const { t } = useI18n();
+const { t } = useI18n()
 
 /**
  * @description: 生成placeholder
  */
 export function createPlaceholderMessage(component: ComponentType) {
   if (component.includes('Input') || component.includes('Complete')) {
-    return t('common.inputText');
+    return t('common.inputText')
   }
   if (component.includes('Picker')) {
-    return t('common.chooseText');
+    return t('common.chooseText')
   }
   if (
     component.includes('Select') ||
@@ -23,34 +23,34 @@ export function createPlaceholderMessage(component: ComponentType) {
     component.includes('Switch')
   ) {
     // return `请选择${label}`;
-    return t('common.chooseText');
+    return t('common.chooseText')
   }
-  return '';
+  return ''
 }
 
 function genType() {
-  return ['DatePicker', 'MonthPicker', 'RangePicker', 'WeekPicker', 'TimePicker'];
+  return ['DatePicker', 'MonthPicker', 'RangePicker', 'WeekPicker', 'TimePicker']
 }
 
 export function setComponentRuleType(rule: ValidationRule, component: ComponentType) {
   if (['DatePicker', 'MonthPicker', 'WeekPicker', 'TimePicker'].includes(component)) {
-    rule.type = 'object';
+    rule.type = 'object'
   } else if (['RangePicker', 'Upload', 'CheckboxGroup', 'TimePicker'].includes(component)) {
-    rule.type = 'array';
+    rule.type = 'array'
   } else if (['InputNumber'].includes(component)) {
-    rule.type = 'number';
+    rule.type = 'number'
   }
 }
 
 export function handleInputNumberValue(component?: ComponentType, val: any) {
-  if (!component) return val;
+  if (!component) return val
   if (['Input', 'InputPassword', 'InputSearch', 'InputTextArea'].includes(component)) {
-    return val && isNumber(val) ? `${val}` : val;
+    return val && isNumber(val) ? `${val}` : val
   }
-  return val;
+  return val
 }
 
 /**
  * 时间字段
  */
-export const dateItemType = genType();
+export const dateItemType = genType()

src/components/Form/src/hooks/useAdvanced.ts

@@ -1,22 +1,22 @@
-import type { ColEx } from '../types';
-import type { AdvanceState } from '../types/hooks';
-import type { ComputedRef, Ref } from 'vue';
-import type { FormProps, FormSchema } from '../types/form';
+import type { ColEx } from '../types'
+import type { AdvanceState } from '../types/hooks'
+import type { ComputedRef, Ref } from 'vue'
+import type { FormProps, FormSchema } from '../types/form'
 
-import { computed, unref, watch } from 'vue';
-import { isBoolean, isFunction, isNumber, isObject } from '/@/utils/is';
+import { computed, unref, watch } from 'vue'
+import { isBoolean, isFunction, isNumber, isObject } from '/@/utils/is'
 
-import { useBreakpoint } from '/@/hooks/event/useBreakpoint';
+import { useBreakpoint } from '/@/hooks/event/useBreakpoint'
 
-const BASIC_COL_LEN = 24;
+const BASIC_COL_LEN = 24
 
 interface UseAdvancedContext {
-  advanceState: AdvanceState;
-  emit: EmitType;
-  getProps: ComputedRef<FormProps>;
-  getSchema: ComputedRef<FormSchema[]>;
-  formModel: Recordable;
-  defaultValueRef: Ref<Recordable>;
+  advanceState: AdvanceState
+  emit: EmitType
+  getProps: ComputedRef<FormProps>
+  getSchema: ComputedRef<FormSchema[]>
+  formModel: Recordable
+  defaultValueRef: Ref<Recordable>
 }
 
 export default function ({
@@ -25,102 +25,102 @@ export default function ({
   getProps,
   getSchema,
   formModel,
-  defaultValueRef,
+  defaultValueRef
 }: UseAdvancedContext) {
-  const { realWidthRef, screenEnum, screenRef } = useBreakpoint();
+  const { realWidthRef, screenEnum, screenRef } = useBreakpoint()
 
   const getEmptySpan = computed((): number => {
     if (!advanceState.isAdvanced) {
-      return 0;
+      return 0
     }
     // For some special cases, you need to manually specify additional blank lines
-    const emptySpan = unref(getProps).emptySpan || 0;
+    const emptySpan = unref(getProps).emptySpan || 0
 
     if (isNumber(emptySpan)) {
-      return emptySpan;
+      return emptySpan
     }
     if (isObject(emptySpan)) {
-      const { span = 0 } = emptySpan;
-      const screen = unref(screenRef) as string;
+      const { span = 0 } = emptySpan
+      const screen = unref(screenRef) as string
 
-      const screenSpan = (emptySpan as any)[screen.toLowerCase()];
-      return screenSpan || span || 0;
+      const screenSpan = (emptySpan as any)[screen.toLowerCase()]
+      return screenSpan || span || 0
     }
-    return 0;
-  });
+    return 0
+  })
 
   watch(
     [() => unref(getSchema), () => advanceState.isAdvanced, () => unref(realWidthRef)],
     () => {
-      const { showAdvancedButton } = unref(getProps);
+      const { showAdvancedButton } = unref(getProps)
       if (showAdvancedButton) {
-        updateAdvanced();
+        updateAdvanced()
       }
     },
     { immediate: true }
-  );
+  )
 
   function getAdvanced(itemCol: Partial<ColEx>, itemColSum = 0, isLastAction = false) {
-    const width = unref(realWidthRef);
+    const width = unref(realWidthRef)
 
     const mdWidth =
       parseInt(itemCol.md as string) ||
       parseInt(itemCol.xs as string) ||
       parseInt(itemCol.sm as string) ||
       (itemCol.span as number) ||
-      BASIC_COL_LEN;
+      BASIC_COL_LEN
 
-    const lgWidth = parseInt(itemCol.lg as string) || mdWidth;
-    const xlWidth = parseInt(itemCol.xl as string) || lgWidth;
-    const xxlWidth = parseInt(itemCol.xxl as string) || xlWidth;
+    const lgWidth = parseInt(itemCol.lg as string) || mdWidth
+    const xlWidth = parseInt(itemCol.xl as string) || lgWidth
+    const xxlWidth = parseInt(itemCol.xxl as string) || xlWidth
     if (width <= screenEnum.LG) {
-      itemColSum += mdWidth;
+      itemColSum += mdWidth
     } else if (width < screenEnum.XL) {
-      itemColSum += lgWidth;
+      itemColSum += lgWidth
     } else if (width < screenEnum.XXL) {
-      itemColSum += xlWidth;
+      itemColSum += xlWidth
     } else {
-      itemColSum += xxlWidth;
+      itemColSum += xxlWidth
     }
 
     if (isLastAction) {
-      advanceState.hideAdvanceBtn = false;
+      advanceState.hideAdvanceBtn = false
       if (itemColSum <= BASIC_COL_LEN * 2) {
         // When less than or equal to 2 lines, the collapse and expand buttons are not displayed
-        advanceState.hideAdvanceBtn = true;
-        advanceState.isAdvanced = true;
+        advanceState.hideAdvanceBtn = true
+        advanceState.isAdvanced = true
       } else if (
         itemColSum > BASIC_COL_LEN * 2 &&
         itemColSum <= BASIC_COL_LEN * (unref(getProps).autoAdvancedLine || 3)
       ) {
-        advanceState.hideAdvanceBtn = false;
+        advanceState.hideAdvanceBtn = false
 
         // More than 3 lines collapsed by default
       } else if (!advanceState.isLoad) {
-        advanceState.isLoad = true;
-        advanceState.isAdvanced = !advanceState.isAdvanced;
+        advanceState.isLoad = true
+        advanceState.isAdvanced = !advanceState.isAdvanced
       }
-      return { isAdvanced: advanceState.isAdvanced, itemColSum };
+      return { isAdvanced: advanceState.isAdvanced, itemColSum }
     }
     if (itemColSum > BASIC_COL_LEN) {
-      return { isAdvanced: advanceState.isAdvanced, itemColSum };
+      return { isAdvanced: advanceState.isAdvanced, itemColSum }
     } else {
       // The first line is always displayed
-      return { isAdvanced: true, itemColSum };
+      return { isAdvanced: true, itemColSum }
     }
   }
 
   function updateAdvanced() {
-    let itemColSum = 0;
-    let realItemColSum = 0;
-    const { baseColProps = {} } = unref(getProps);
+    let itemColSum = 0
+    let realItemColSum = 0
+    const { baseColProps = {} } = unref(getProps)
 
     for (const schema of unref(getSchema)) {
-      const { show, colProps } = schema;
-      let isShow = true;
+      const { show, colProps } = schema
+      let isShow = true
 
       if (isBoolean(show)) {
-        isShow = show;
+        isShow = show
       }
 
       if (isFunction(show)) {
@@ -130,35 +130,35 @@ export default function ({
           field: schema.field,
           values: {
             ...unref(defaultValueRef),
-            ...formModel,
-          },
-        });
+            ...formModel
+          }
+        })
       }
 
       if (isShow && (colProps || baseColProps)) {
         const { itemColSum: sum, isAdvanced } = getAdvanced(
           { ...baseColProps, ...colProps },
           itemColSum
-        );
+        )
 
-        itemColSum = sum || 0;
+        itemColSum = sum || 0
         if (isAdvanced) {
-          realItemColSum = itemColSum;
+          realItemColSum = itemColSum
         }
-        schema.isAdvanced = isAdvanced;
+        schema.isAdvanced = isAdvanced
       }
     }
 
-    advanceState.actionSpan = (realItemColSum % BASIC_COL_LEN) + unref(getEmptySpan);
+    advanceState.actionSpan = (realItemColSum % BASIC_COL_LEN) + unref(getEmptySpan)
 
-    getAdvanced(unref(getProps).actionColOptions || { span: BASIC_COL_LEN }, itemColSum, true);
+    getAdvanced(unref(getProps).actionColOptions || { span: BASIC_COL_LEN }, itemColSum, true)
 
-    emit('advanced-change');
+    emit('advanced-change')
   }
 
   function handleToggleAdvanced() {
-    advanceState.isAdvanced = !advanceState.isAdvanced;
+    advanceState.isAdvanced = !advanceState.isAdvanced
   }
 
-  return { handleToggleAdvanced };
+  return { handleToggleAdvanced }
 }

src/components/Form/src/hooks/useAutoFocus.ts

@@ -1,34 +1,34 @@
-import type { ComputedRef, Ref } from 'vue';
-import type { FormSchema, FormActionType } from '../types/form';
+import type { ComputedRef, Ref } from 'vue'
+import type { FormSchema, FormActionType } from '../types/form'
 
-import { unref, nextTick, watchEffect } from 'vue';
+import { unref, nextTick, watchEffect } from 'vue'
 
 interface UseAutoFocusContext {
-  getSchema: ComputedRef<FormSchema[]>;
-  autoFocusFirstItem: Ref<boolean>;
-  isInitedDefault: Ref<boolean>;
-  formElRef: Ref<FormActionType>;
+  getSchema: ComputedRef<FormSchema[]>
+  autoFocusFirstItem: Ref<boolean>
+  isInitedDefault: Ref<boolean>
+  formElRef: Ref<FormActionType>
 }
 export async function useAutoFocus({
   getSchema,
   autoFocusFirstItem,
   formElRef,
-  isInitedDefault,
+  isInitedDefault
 }: UseAutoFocusContext) {
   watchEffect(async () => {
-    if (unref(isInitedDefault) || !unref(autoFocusFirstItem)) return;
-    await nextTick();
-    const schemas = unref(getSchema);
-    const formEl = unref(formElRef);
-    const el = (formEl as any)?.$el as HTMLElement;
-    if (!formEl || !el || !schemas || schemas.length === 0) return;
+    if (unref(isInitedDefault) || !unref(autoFocusFirstItem)) return
+    await nextTick()
+    const schemas = unref(getSchema)
+    const formEl = unref(formElRef)
+    const el = (formEl as any)?.$el as HTMLElement
+    if (!formEl || !el || !schemas || schemas.length === 0) return
 
-    const firstItem = schemas[0];
+    const firstItem = schemas[0]
     // Only open when the first form item is input type
-    if (!firstItem.component.includes('Input')) return;
+    if (!firstItem.component.includes('Input')) return
 
-    const inputEl = el.querySelector('.ant-row:first-child input') as Nullable<HTMLInputElement>;
-    if (!inputEl) return;
-    inputEl?.focus();
-  });
+    const inputEl = el.querySelector('.ant-row:first-child input') as Nullable<HTMLInputElement>
+    if (!inputEl) return
+    inputEl?.focus()
+  })
 }

src/components/Form/src/hooks/useComponentRegister.ts

@@ -1,11 +1,11 @@
-import type { ComponentType } from '../types/index';
-import { tryOnUnmounted } from '@vueuse/core';
-import { add, del } from '../componentMap';
-import type { Component } from 'vue';
+import type { ComponentType } from '../types/index'
+import { tryOnUnmounted } from '@vueuse/core'
+import { add, del } from '../componentMap'
+import type { Component } from 'vue'
 
 export function useComponentRegister(compName: ComponentType, comp: Component) {
-  add(compName, comp);
+  add(compName, comp)
   tryOnUnmounted(() => {
-    del(compName);
-  });
+    del(compName)
+  })
 }

src/components/Form/src/hooks/useForm.ts

@@ -1,94 +1,94 @@
-import { ref, onUnmounted, unref, nextTick, watch } from 'vue';
+import { ref, onUnmounted, unref, nextTick, watch } from 'vue'
 
-import { isProdMode } from '/@/utils/env';
-import { error } from '/@/utils/log';
-import { getDynamicProps } from '/@/utils';
+import { isProdMode } from '/@/utils/env'
+import { error } from '/@/utils/log'
+import { getDynamicProps } from '/@/utils'
 
-import type { FormProps, FormActionType, UseFormReturnType, FormSchema } from '../types/form';
-import type { NamePath } from 'ant-design-vue/lib/form/interface';
-import type { DynamicProps } from '/#/utils';
+import type { FormProps, FormActionType, UseFormReturnType, FormSchema } from '../types/form'
+import type { NamePath } from 'ant-design-vue/lib/form/interface'
+import type { DynamicProps } from '/#/utils'
 
-export declare type ValidateFields = (nameList?: NamePath[]) => Promise<Recordable>;
+export declare type ValidateFields = (nameList?: NamePath[]) => Promise<Recordable>
 
-type Props = Partial<DynamicProps<FormProps>>;
+type Props = Partial<DynamicProps<FormProps>>
 
 export function useForm(props?: Props): UseFormReturnType {
-  const formRef = ref<Nullable<FormActionType>>(null);
-  const loadedRef = ref<Nullable<boolean>>(false);
+  const formRef = ref<Nullable<FormActionType>>(null)
+  const loadedRef = ref<Nullable<boolean>>(false)
 
   async function getForm() {
-    const form = unref(formRef);
+    const form = unref(formRef)
     if (!form) {
       error(
         'The form instance has not been obtained, please make sure that the form has been rendered when performing the form operation!'
-      );
+      )
     }
-    await nextTick();
-    return form as FormActionType;
+    await nextTick()
+    return form as FormActionType
   }
 
   function register(instance: FormActionType) {
     isProdMode() &&
       onUnmounted(() => {
-        formRef.value = null;
-        loadedRef.value = null;
-      });
-    if (unref(loadedRef) && isProdMode() && instance === unref(formRef)) return;
+        formRef.value = null
+        loadedRef.value = null
+      })
+    if (unref(loadedRef) && isProdMode() && instance === unref(formRef)) return
 
-    formRef.value = instance;
-    loadedRef.value = true;
+    formRef.value = instance
+    loadedRef.value = true
 
     watch(
       () => props,
       () => {
-        props && instance.setProps(getDynamicProps(props));
+        props && instance.setProps(getDynamicProps(props))
       },
       {
         immediate: true,
-        deep: true,
+        deep: true
       }
-    );
+    )
   }
 
   const methods: FormActionType = {
     scrollToField: async (name: NamePath, options?: ScrollOptions | undefined) => {
-      const form = await getForm();
-      form.scrollToField(name, options);
+      const form = await getForm()
+      form.scrollToField(name, options)
     },
     setProps: async (formProps: Partial<FormProps>) => {
-      const form = await getForm();
-      form.setProps(formProps);
+      const form = await getForm()
+      form.setProps(formProps)
     },
 
     updateSchema: async (data: Partial<FormSchema> | Partial<FormSchema>[]) => {
-      const form = await getForm();
-      form.updateSchema(data);
+      const form = await getForm()
+      form.updateSchema(data)
     },
 
     clearValidate: async (name?: string | string[]) => {
-      const form = await getForm();
-      form.clearValidate(name);
+      const form = await getForm()
+      form.clearValidate(name)
     },
 
     resetFields: async () => {
-      getForm().then(async (form) => {
-        await form.resetFields();
-      });
+      getForm().then(async form => {
+        await form.resetFields()
+      })
     },
 
     removeSchemaByFiled: async (field: string | string[]) => {
-      const form = await getForm();
-      form.removeSchemaByFiled(field);
+      const form = await getForm()
+      form.removeSchemaByFiled(field)
     },
 
     // TODO promisify
     getFieldsValue: <T>() => {
-      return unref(formRef)?.getFieldsValue() as T;
+      return unref(formRef)?.getFieldsValue() as T
     },
 
     setFieldsValue: async <T>(values: T) => {
-      const form = await getForm();
-      form.setFieldsValue<T>(values);
+      const form = await getForm()
+      form.setFieldsValue<T>(values)
     },
 
     appendSchemaByField: async (
@@ -96,25 +96,25 @@ export function useForm(props?: Props): UseFormReturnType {
       prefixField: string | undefined,
       first: boolean
     ) => {
-      const form = await getForm();
-      form.appendSchemaByField(schema, prefixField, first);
+      const form = await getForm()
+      form.appendSchemaByField(schema, prefixField, first)
     },
 
     submit: async (): Promise<any> => {
-      const form = await getForm();
-      return form.submit();
+      const form = await getForm()
+      return form.submit()
     },
 
     validate: async (nameList?: NamePath[]): Promise<Recordable> => {
-      const form = await getForm();
-      return form.validate(nameList);
+      const form = await getForm()
+      return form.validate(nameList)
     },
 
     validateFields: async (nameList?: NamePath[]): Promise<Recordable> => {
-      const form = await getForm();
-      return form.validateFields(nameList);
-    },
-  };
+      const form = await getForm()
+      return form.validateFields(nameList)
+    }
+  }
 
-  return [register, methods];
+  return [register, methods]
 }

src/components/Form/src/hooks/useFormContext.ts

@@ -1,17 +1,17 @@
-import type { InjectionKey } from 'vue';
-import { createContext, useContext } from '/@/hooks/core/useContext';
+import type { InjectionKey } from 'vue'
+import { createContext, useContext } from '/@/hooks/core/useContext'
 
 export interface FormContextProps {
-  resetAction: () => Promise<void>;
-  submitAction: () => Promise<void>;
+  resetAction: () => Promise<void>
+  submitAction: () => Promise<void>
 }
 
-const key: InjectionKey<FormContextProps> = Symbol();
+const key: InjectionKey<FormContextProps> = Symbol()
 
 export function createFormContext(context: FormContextProps) {
-  return createContext<FormContextProps>(context, key);
+  return createContext<FormContextProps>(context, key)
 }
 
 export function useFormContext() {
-  return useContext<FormContextProps>(key);
+  return useContext<FormContextProps>(key)
 }

src/components/Form/src/hooks/useFormEvents.ts

@@ -1,25 +1,25 @@
-import type { ComputedRef, Ref } from 'vue';
-import type { FormProps, FormSchema, FormActionType } from '../types/form';
-import type { NamePath } from 'ant-design-vue/lib/form/interface';
+import type { ComputedRef, Ref } from 'vue'
+import type { FormProps, FormSchema, FormActionType } from '../types/form'
+import type { NamePath } from 'ant-design-vue/lib/form/interface'
 
-import { unref, toRaw } from 'vue';
+import { unref, toRaw } from 'vue'
 
-import { isArray, isFunction, isObject, isString } from '/@/utils/is';
-import { deepMerge } from '/@/utils';
-import { dateItemType, handleInputNumberValue } from '../helper';
-import { dateUtil } from '/@/utils/dateUtil';
-import { cloneDeep, uniqBy } from 'lodash-es';
-import { error } from '/@/utils/log';
+import { isArray, isFunction, isObject, isString } from '/@/utils/is'
+import { deepMerge } from '/@/utils'
+import { dateItemType, handleInputNumberValue } from '../helper'
+import { dateUtil } from '/@/utils/dateUtil'
+import { cloneDeep, uniqBy } from 'lodash-es'
+import { error } from '/@/utils/log'
 
 interface UseFormActionContext {
-  emit: EmitType;
-  getProps: ComputedRef<FormProps>;
-  getSchema: ComputedRef<FormSchema[]>;
-  formModel: Recordable;
-  defaultValueRef: Ref<Recordable>;
-  formElRef: Ref<FormActionType>;
-  schemaRef: Ref<FormSchema[]>;
-  handleFormValues: Fn;
+  emit: EmitType
+  getProps: ComputedRef<FormProps>
+  getSchema: ComputedRef<FormSchema[]>
+  formModel: Recordable
+  defaultValueRef: Ref<Recordable>
+  formElRef: Ref<FormActionType>
+  schemaRef: Ref<FormSchema[]>
+  handleFormValues: Fn
 }
 export function useFormEvents({
   emit,
@@ -29,21 +29,21 @@ export function useFormEvents({
   defaultValueRef,
   formElRef,
   schemaRef,
-  handleFormValues,
+  handleFormValues
 }: UseFormActionContext) {
   async function resetFields(): Promise<void> {
-    const { resetFunc, submitOnReset } = unref(getProps);
-    resetFunc && isFunction(resetFunc) && (await resetFunc());
-
-    const formEl = unref(formElRef);
-    if (!formEl) return;
-
-    Object.keys(formModel).forEach((key) => {
-      formModel[key] = defaultValueRef.value[key];
-    });
-    clearValidate();
-    emit('reset', toRaw(formModel));
-    submitOnReset && handleSubmit();
+    const { resetFunc, submitOnReset } = unref(getProps)
+    resetFunc && isFunction(resetFunc) && (await resetFunc())
+
+    const formEl = unref(formElRef)
+    if (!formEl) return
+
+    Object.keys(formModel).forEach(key => {
+      formModel[key] = defaultValueRef.value[key]
+    })
+    clearValidate()
+    emit('reset', toRaw(formModel))
+    submitOnReset && handleSubmit()
   }
 
   /**
@@ -51,53 +51,53 @@ export function useFormEvents({
    */
   async function setFieldsValue(values: Recordable): Promise<void> {
     const fields = unref(getSchema)
-      .map((item) => item.field)
-      .filter(Boolean);
+      .map(item => item.field)
+      .filter(Boolean)
 
-    const validKeys: string[] = [];
-    Object.keys(values).forEach((key) => {
-      const schema = unref(getSchema).find((item) => item.field === key);
-      let value = values[key];
+    const validKeys: string[] = []
+    Object.keys(values).forEach(key => {
+      const schema = unref(getSchema).find(item => item.field === key)
+      let value = values[key]
 
-      const hasKey = Reflect.has(values, key);
+      const hasKey = Reflect.has(values, key)
 
-      value = handleInputNumberValue(schema?.component, value);
+      value = handleInputNumberValue(schema?.component, value)
       // 0| '' is allow
       if (hasKey && fields.includes(key)) {
         // time type
         if (itemIsDateType(key)) {
           if (Array.isArray(value)) {
-            const arr: moment.Moment[] = [];
+            const arr: moment.Moment[] = []
             for (const ele of value) {
-              arr.push(dateUtil(ele));
+              arr.push(dateUtil(ele))
             }
-            formModel[key] = arr;
+            formModel[key] = arr
           } else {
-            formModel[key] = dateUtil(value);
+            formModel[key] = dateUtil(value)
           }
         } else {
-          formModel[key] = value;
+          formModel[key] = value
         }
-        validKeys.push(key);
+        validKeys.push(key)
       }
-    });
-    validateFields(validKeys);
+    })
+    validateFields(validKeys)
   }
   /**
    * @description: Delete based on field name
    */
   async function removeSchemaByFiled(fields: string | string[]): Promise<void> {
-    const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
-    if (!fields) return;
+    const schemaList: FormSchema[] = cloneDeep(unref(getSchema))
+    if (!fields) return
 
-    let fieldList: string[] = isString(fields) ? [fields] : fields;
+    let fieldList: string[] = isString(fields) ? [fields] : fields
     if (isString(fields)) {
-      fieldList = [fields];
+      fieldList = [fields]
     }
     for (const field of fieldList) {
-      _removeSchemaByFiled(field, schemaList);
+      _removeSchemaByFiled(field, schemaList)
     }
-    schemaRef.value = schemaList;
+    schemaRef.value = schemaList
   }
 
   /**
@@ -105,9 +105,9 @@ export function useFormEvents({
    */
   function _removeSchemaByFiled(field: string, schemaList: FormSchema[]): void {
     if (isString(field)) {
-      const index = schemaList.findIndex((schema) => schema.field === field);
+      const index = schemaList.findIndex(schema => schema.field === field)
       if (index !== -1) {
-        schemaList.splice(index, 1);
+        schemaList.splice(index, 1)
       }
     }
   }
@@ -116,102 +116,102 @@ export function useFormEvents({
    * @description: Insert after a certain field, if not insert the last
    */
   async function appendSchemaByField(schema: FormSchema, prefixField?: string, first = false) {
-    const schemaList: FormSchema[] = cloneDeep(unref(getSchema));
+    const schemaList: FormSchema[] = cloneDeep(unref(getSchema))
 
-    const index = schemaList.findIndex((schema) => schema.field === prefixField);
-    const hasInList = schemaList.some((item) => item.field === prefixField || schema.field);
+    const index = schemaList.findIndex(schema => schema.field === prefixField)
+    const hasInList = schemaList.some(item => item.field === prefixField || schema.field)
 
-    if (!hasInList) return;
+    if (!hasInList) return
 
     if (!prefixField || index === -1 || first) {
-      first ? schemaList.unshift(schema) : schemaList.push(schema);
-      schemaRef.value = schemaList;
-      return;
+      first ? schemaList.unshift(schema) : schemaList.push(schema)
+      schemaRef.value = schemaList
+      return
     }
     if (index !== -1) {
-      schemaList.splice(index + 1, 0, schema);
+      schemaList.splice(index + 1, 0, schema)
     }
-    schemaRef.value = schemaList;
+    schemaRef.value = schemaList
   }
 
   async function updateSchema(data: Partial<FormSchema> | Partial<FormSchema>[]) {
-    let updateData: Partial<FormSchema>[] = [];
+    let updateData: Partial<FormSchema>[] = []
     if (isObject(data)) {
-      updateData.push(data as FormSchema);
+      updateData.push(data as FormSchema)
     }
     if (isArray(data)) {
-      updateData = [...data];
+      updateData = [...data]
     }
 
-    const hasField = updateData.every((item) => Reflect.has(item, 'field') && item.field);
+    const hasField = updateData.every(item => Reflect.has(item, 'field') && item.field)
 
     if (!hasField) {
       error(
         'All children of the form Schema array that need to be updated must contain the `field` field'
-      );
-      return;
+      )
+      return
     }
-    const schema: FormSchema[] = [];
-    updateData.forEach((item) => {
-      unref(getSchema).forEach((val) => {
+    const schema: FormSchema[] = []
+    updateData.forEach(item => {
+      unref(getSchema).forEach(val => {
         if (val.field === item.field) {
-          const newSchema = deepMerge(val, item);
-          schema.push(newSchema as FormSchema);
+          const newSchema = deepMerge(val, item)
+          schema.push(newSchema as FormSchema)
         } else {
-          schema.push(val);
+          schema.push(val)
         }
-      });
-    });
-    schemaRef.value = uniqBy(schema, 'field');
+      })
+    })
+    schemaRef.value = uniqBy(schema, 'field')
   }
 
   function getFieldsValue(): Recordable {
-    const formEl = unref(formElRef);
-    if (!formEl) return {};
-    return handleFormValues(toRaw(unref(formModel)));
+    const formEl = unref(formElRef)
+    if (!formEl) return {}
+    return handleFormValues(toRaw(unref(formModel)))
   }
 
   /**
    * @description: Is it time
    */
   function itemIsDateType(key: string) {
-    return unref(getSchema).some((item) => {
-      return item.field === key ? dateItemType.includes(item.component) : false;
-    });
+    return unref(getSchema).some(item => {
+      return item.field === key ? dateItemType.includes(item.component) : false
+    })
   }
 
   async function validateFields(nameList?: NamePath[] | undefined) {
-    return unref(formElRef)?.validateFields(nameList);
+    return unref(formElRef)?.validateFields(nameList)
   }
 
   async function validate(nameList?: NamePath[] | undefined) {
-    return await unref(formElRef)?.validate(nameList);
+    return await unref(formElRef)?.validate(nameList)
   }
 
   async function clearValidate(name?: string | string[]) {
-    await unref(formElRef)?.clearValidate(name);
+    await unref(formElRef)?.clearValidate(name)
   }
 
   async function scrollToField(name: NamePath, options?: ScrollOptions | undefined) {
-    await unref(formElRef)?.scrollToField(name, options);
+    await unref(formElRef)?.scrollToField(name, options)
   }
 
   /**
    * @description: Form submission
    */
   async function handleSubmit(e?: Event): Promise<void> {
-    e && e.preventDefault();
-    const { submitFunc } = unref(getProps);
+    e && e.preventDefault()
+    const { submitFunc } = unref(getProps)
     if (submitFunc && isFunction(submitFunc)) {
-      await submitFunc();
-      return;
+      await submitFunc()
+      return
     }
-    const formEl = unref(formElRef);
-    if (!formEl) return;
+    const formEl = unref(formElRef)
+    if (!formEl) return
     try {
-      const values = await validate();
-      const res = handleFormValues(values);
-      emit('submit', res);
+      const values = await validate()
+      const res = handleFormValues(values)
+      emit('submit', res)
     } catch (error) {}
   }
 
@@ -226,6 +226,6 @@ export function useFormEvents({
     removeSchemaByFiled,
     resetFields,
     setFieldsValue,
-    scrollToField,
-  };
+    scrollToField
+  }
 }

src/components/Form/src/hooks/useFormValues.ts

@@ -1,89 +1,89 @@
-import { isArray, isFunction, isObject, isString, isNullOrUnDef } from '/@/utils/is';
-import { dateUtil } from '/@/utils/dateUtil';
+import { isArray, isFunction, isObject, isString, isNullOrUnDef } from '/@/utils/is'
+import { dateUtil } from '/@/utils/dateUtil'
 
-import { unref } from 'vue';
-import type { Ref, ComputedRef } from 'vue';
-import type { FieldMapToTime, FormSchema } from '../types/form';
+import { unref } from 'vue'
+import type { Ref, ComputedRef } from 'vue'
+import type { FieldMapToTime, FormSchema } from '../types/form'
 
 interface UseFormValuesContext {
-  transformDateFuncRef: Ref<Fn>;
-  fieldMapToTimeRef: Ref<FieldMapToTime>;
-  defaultValueRef: Ref<any>;
-  getSchema: ComputedRef<FormSchema[]>;
-  formModel: Recordable;
+  transformDateFuncRef: Ref<Fn>
+  fieldMapToTimeRef: Ref<FieldMapToTime>
+  defaultValueRef: Ref<any>
+  getSchema: ComputedRef<FormSchema[]>
+  formModel: Recordable
 }
 export function useFormValues({
   transformDateFuncRef,
   fieldMapToTimeRef,
   defaultValueRef,
   getSchema,
-  formModel,
+  formModel
 }: UseFormValuesContext) {
   // Processing form values
   function handleFormValues(values: Recordable) {
     if (!isObject(values)) {
-      return {};
+      return {}
     }
-    const res: Recordable = {};
+    const res: Recordable = {}
     for (const item of Object.entries(values)) {
-      let [, value] = item;
-      const [key] = item;
+      let [, value] = item
+      const [key] = item
       if ((isArray(value) && value.length === 0) || isFunction(value)) {
-        continue;
+        continue
       }
-      const transformDateFunc = unref(transformDateFuncRef);
+      const transformDateFunc = unref(transformDateFuncRef)
       if (isObject(value)) {
-        value = transformDateFunc(value);
+        value = transformDateFunc(value)
       }
       if (isArray(value) && value[0]._isAMomentObject && value[1]._isAMomentObject) {
-        value = value.map((item) => transformDateFunc(item));
+        value = value.map(item => transformDateFunc(item))
       }
       // Remove spaces
       if (isString(value)) {
-        value = value.trim();
+        value = value.trim()
       }
-      res[key] = value;
+      res[key] = value
     }
-    return handleRangeTimeValue(res);
+    return handleRangeTimeValue(res)
   }
 
   /**
    * @description: Processing time interval parameters
    */
   function handleRangeTimeValue(values: Recordable) {
-    const fieldMapToTime = unref(fieldMapToTimeRef);
+    const fieldMapToTime = unref(fieldMapToTimeRef)
 
     if (!fieldMapToTime || !Array.isArray(fieldMapToTime)) {
-      return values;
+      return values
     }
 
     for (const [field, [startTimeKey, endTimeKey], format = 'YYYY-MM-DD'] of fieldMapToTime) {
       if (!field || !startTimeKey || !endTimeKey || !values[field]) {
-        continue;
+        continue
       }
 
-      const [startTime, endTime]: string[] = values[field];
+      const [startTime, endTime]: string[] = values[field]
 
-      values[startTimeKey] = dateUtil(startTime).format(format);
-      values[endTimeKey] = dateUtil(endTime).format(format);
-      Reflect.deleteProperty(values, field);
+      values[startTimeKey] = dateUtil(startTime).format(format)
+      values[endTimeKey] = dateUtil(endTime).format(format)
+      Reflect.deleteProperty(values, field)
     }
 
-    return values;
+    return values
   }
 
   function initDefault() {
-    const schemas = unref(getSchema);
-    const obj: Recordable = {};
-    schemas.forEach((item) => {
-      const { defaultValue } = item;
+    const schemas = unref(getSchema)
+    const obj: Recordable = {}
+    schemas.forEach(item => {
+      const { defaultValue } = item
       if (!isNullOrUnDef(defaultValue)) {
-        obj[item.field] = defaultValue;
-        formModel[item.field] = defaultValue;
+        obj[item.field] = defaultValue
+        formModel[item.field] = defaultValue
       }
-    });
-    defaultValueRef.value = obj;
+    })
+    defaultValueRef.value = obj
   }
 
-  return { handleFormValues, initDefault };
+  return { handleFormValues, initDefault }
 }

src/components/Form/src/hooks/useLabelWidth.ts

@@ -1,39 +1,39 @@
-import type { Ref } from 'vue';
-import type { FormProps, FormSchema } from '../types/form';
+import type { Ref } from 'vue'
+import type { FormProps, FormSchema } from '../types/form'
 
-import { computed, unref } from 'vue';
-import { isNumber } from '/@/utils/is';
+import { computed, unref } from 'vue'
+import { isNumber } from '/@/utils/is'
 
 export function useItemLabelWidth(schemaItemRef: Ref<FormSchema>, propsRef: Ref<FormProps>) {
   return computed(() => {
-    const schemaItem = unref(schemaItemRef);
-    const { labelCol = {}, wrapperCol = {} } = schemaItem.itemProps || {};
-    const { labelWidth, disabledLabelWidth } = schemaItem;
+    const schemaItem = unref(schemaItemRef)
+    const { labelCol = {}, wrapperCol = {} } = schemaItem.itemProps || {}
+    const { labelWidth, disabledLabelWidth } = schemaItem
 
     const {
       labelWidth: globalLabelWidth,
       labelCol: globalLabelCol,
-      wrapperCol: globWrapperCol,
-    } = unref(propsRef);
+      wrapperCol: globWrapperCol
+    } = unref(propsRef)
 
     // If labelWidth is set globally, all items setting
     if ((!globalLabelWidth && !labelWidth && !globalLabelCol) || disabledLabelWidth) {
       labelCol.style = {
-        textAlign: 'left',
-      };
-      return { labelCol, wrapperCol };
+        textAlign: 'left'
+      }
+      return { labelCol, wrapperCol }
     }
-    let width = labelWidth || globalLabelWidth;
-    const col = { ...globalLabelCol, ...labelCol };
-    const wrapCol = { ...globWrapperCol, ...wrapperCol };
+    let width = labelWidth || globalLabelWidth
+    const col = { ...globalLabelCol, ...labelCol }
+    const wrapCol = { ...globWrapperCol, ...wrapperCol }
 
     if (width) {
-      width = isNumber(width) ? `${width}px` : width;
+      width = isNumber(width) ? `${width}px` : width
     }
 
     return {
       labelCol: { style: { width }, ...col },
-      wrapperCol: { style: { width: `calc(100% - ${width})` }, ...wrapCol },
-    };
-  });
+      wrapperCol: { style: { width: `calc(100% - ${width})` }, ...wrapCol }
+    }
+  })
 }

src/components/Form/src/props.ts

@@ -1,41 +1,41 @@
-import type { FieldMapToTime, FormSchema } from './types/form';
-import type { CSSProperties, PropType } from 'vue';
-import type { ColEx } from './types';
-import type { TableActionType } from '/@/components/Table';
-import type { ButtonProps } from 'ant-design-vue/es/button/buttonTypes';
+import type { FieldMapToTime, FormSchema } from './types/form'
+import type { CSSProperties, PropType } from 'vue'
+import type { ColEx } from './types'
+import type { TableActionType } from '/@/components/Table'
+import type { ButtonProps } from 'ant-design-vue/es/button/buttonTypes'
 
-import { propTypes } from '/@/utils/propTypes';
+import { propTypes } from '/@/utils/propTypes'
 
 export const basicProps = {
   model: {
     type: Object as PropType<Recordable>,
-    default: {},
+    default: {}
   },
   // 标签宽度  固定宽度
   labelWidth: {
     type: [Number, String] as PropType<number | string>,
-    default: 0,
+    default: 0
   },
   fieldMapToTime: {
     type: Array as PropType<FieldMapToTime>,
-    default: () => [],
+    default: () => []
   },
   compact: propTypes.bool,
   // 表单配置规则
   schemas: {
     type: [Array] as PropType<FormSchema[]>,
     default: () => [],
-    required: true,
+    required: true
   },
   mergeDynamicData: {
     type: Object as PropType<Recordable>,
-    default: null,
+    default: null
   },
   baseRowStyle: {
-    type: Object as PropType<CSSProperties>,
+    type: Object as PropType<CSSProperties>
   },
   baseColProps: {
-    type: Object as PropType<Partial<ColEx>>,
+    type: Object as PropType<Partial<ColEx>>
   },
   autoSetPlaceHolder: propTypes.bool.def(true),
   submitOnReset: propTypes.bool,
@@ -44,7 +44,7 @@ export const basicProps = {
   disabled: propTypes.bool,
   emptySpan: {
     type: [Number, Object] as PropType<number>,
-    default: 0,
+    default: 0
   },
   // 是否显示收起展开按钮
   showAdvancedButton: propTypes.bool,
@@ -52,8 +52,8 @@ export const basicProps = {
   transformDateFunc: {
     type: Function as PropType<Fn>,
     default: (date: any) => {
-      return date._isAMomentObject ? date?.format('YYYY-MM-DD HH:mm:ss') : date;
-    },
+      return date._isAMomentObject ? date?.format('YYYY-MM-DD HH:mm:ss') : date
+    }
   },
   rulesMessageJoinLabel: propTypes.bool.def(true),
   // 超过3行自动折叠
@@ -86,12 +86,12 @@ export const basicProps = {
 
   layout: propTypes.oneOf(['horizontal', 'vertical', 'inline']).def('horizontal'),
   tableAction: {
-    type: Object as PropType<TableActionType>,
+    type: Object as PropType<TableActionType>
   },
 
   wrapperCol: Object as PropType<Partial<ColEx>>,
 
   colon: propTypes.bool,
 
-  labelAlign: propTypes.string,
-};
+  labelAlign: propTypes.string
+}

src/components/Form/src/types/form.ts

@@ -1,208 +1,208 @@
-import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface';
-import type { VNode } from 'vue';
-import type { ButtonProps as AntdButtonProps } from 'ant-design-vue/es/button/buttonTypes';
+import type { NamePath, RuleObject } from 'ant-design-vue/lib/form/interface'
+import type { VNode } from 'vue'
+import type { ButtonProps as AntdButtonProps } from 'ant-design-vue/es/button/buttonTypes'
 
-import type { FormItem } from './formItem';
-import type { ColEx, ComponentType } from './index';
-import type { TableActionType } from '/@/components/Table/src/types/table';
-import type { CSSProperties } from 'vue';
+import type { FormItem } from './formItem'
+import type { ColEx, ComponentType } from './index'
+import type { TableActionType } from '/@/components/Table/src/types/table'
+import type { CSSProperties } from 'vue'
 
-export type FieldMapToTime = [string, [string, string], string?][];
+export type FieldMapToTime = [string, [string, string], string?][]
 
 export type Rule = RuleObject & {
-  trigger?: 'blur' | 'change' | ['change', 'blur'];
-};
+  trigger?: 'blur' | 'change' | ['change', 'blur']
+}
 
 export interface RenderCallbackParams {
-  schema: FormSchema;
-  values: Recordable;
-  model: Recordable;
-  field: string;
+  schema: FormSchema
+  values: Recordable
+  model: Recordable
+  field: string
 }
 
 export interface ButtonProps extends AntdButtonProps {
-  text?: string;
+  text?: string
 }
 
 export interface FormActionType {
-  submit: () => Promise<void>;
-  setFieldsValue: <T>(values: T) => Promise<void>;
-  resetFields: () => Promise<void>;
-  getFieldsValue: () => Recordable;
-  clearValidate: (name?: string | string[]) => Promise<void>;
-  updateSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>;
-  setProps: (formProps: Partial<FormProps>) => Promise<void>;
-  removeSchemaByFiled: (field: string | string[]) => Promise<void>;
+  submit: () => Promise<void>
+  setFieldsValue: <T>(values: T) => Promise<void>
+  resetFields: () => Promise<void>
+  getFieldsValue: () => Recordable
+  clearValidate: (name?: string | string[]) => Promise<void>
+  updateSchema: (data: Partial<FormSchema> | Partial<FormSchema>[]) => Promise<void>
+  setProps: (formProps: Partial<FormProps>) => Promise<void>
+  removeSchemaByFiled: (field: string | string[]) => Promise<void>
   appendSchemaByField: (
     schema: FormSchema,
     prefixField: string | undefined,
     first?: boolean | undefined
-  ) => Promise<void>;
-  validateFields: (nameList?: NamePath[]) => Promise<any>;
-  validate: (nameList?: NamePath[]) => Promise<any>;
-  scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>;
+  ) => Promise<void>
+  validateFields: (nameList?: NamePath[]) => Promise<any>
+  validate: (nameList?: NamePath[]) => Promise<any>
+  scrollToField: (name: NamePath, options?: ScrollOptions) => Promise<void>
 }
 
-export type RegisterFn = (formInstance: FormActionType) => void;
+export type RegisterFn = (formInstance: FormActionType) => void
 
-export type UseFormReturnType = [RegisterFn, FormActionType];
+export type UseFormReturnType = [RegisterFn, FormActionType]
 
 export interface FormProps {
   // layout?: 'vertical' | 'inline' | 'horizontal';
   // Form value
-  model?: Recordable;
+  model?: Recordable
   // The width of all items in the entire form
-  labelWidth?: number | string;
+  labelWidth?: number | string
   // Submit form on reset
-  submitOnReset?: boolean;
+  submitOnReset?: boolean
   // Col configuration for the entire form
-  labelCol?: Partial<ColEx>;
+  labelCol?: Partial<ColEx>
   // Col configuration for the entire form
-  wrapperCol?: Partial<ColEx>;
+  wrapperCol?: Partial<ColEx>
 
   // General row style
-  baseRowStyle?: CSSProperties;
+  baseRowStyle?: CSSProperties
 
   // General col configuration
-  baseColProps?: Partial<ColEx>;
+  baseColProps?: Partial<ColEx>
 
   // Form configuration rules
-  schemas?: FormSchema[];
+  schemas?: FormSchema[]
   // Function values used to merge into dynamic control form items
-  mergeDynamicData?: Recordable;
+  mergeDynamicData?: Recordable
   // Compact mode for search forms
-  compact?: boolean;
+  compact?: boolean
   // Blank line span
-  emptySpan?: number | Partial<ColEx>;
+  emptySpan?: number | Partial<ColEx>
   // Internal component size of the form
-  size?: 'default' | 'small' | 'large';
+  size?: 'default' | 'small' | 'large'
   // Whether to disable
-  disabled?: boolean;
+  disabled?: boolean
   // Time interval fields are mapped into multiple
-  fieldMapToTime?: FieldMapToTime;
+  fieldMapToTime?: FieldMapToTime
   // Placeholder is set automatically
-  autoSetPlaceHolder?: boolean;
+  autoSetPlaceHolder?: boolean
   // Check whether the information is added to the label
-  rulesMessageJoinLabel?: boolean;
+  rulesMessageJoinLabel?: boolean
   // Whether to show collapse and expand buttons
-  showAdvancedButton?: boolean;
+  showAdvancedButton?: boolean
   // Whether to focus on the first input box, only works when the first form item is input
-  autoFocusFirstItem?: boolean;
+  autoFocusFirstItem?: boolean
   // Automatically collapse over the specified number of rows
-  autoAdvancedLine?: number;
+  autoAdvancedLine?: number
   // Whether to show the operation button
-  showActionButtonGroup?: boolean;
+  showActionButtonGroup?: boolean
 
   // Reset button configuration
-  resetButtonOptions?: Partial<ButtonProps>;
+  resetButtonOptions?: Partial<ButtonProps>
 
   // Confirm button configuration
-  submitButtonOptions?: Partial<ButtonProps>;
+  submitButtonOptions?: Partial<ButtonProps>
 
   // Operation column configuration
-  actionColOptions?: Partial<ColEx>;
+  actionColOptions?: Partial<ColEx>
 
   // Show reset button
-  showResetButton?: boolean;
+  showResetButton?: boolean
   // Show confirmation button
-  showSubmitButton?: boolean;
+  showSubmitButton?: boolean
 
-  resetFunc?: () => Promise<void>;
-  submitFunc?: () => Promise<void>;
-  transformDateFunc?: (date: any) => string;
-  colon?: boolean;
+  resetFunc?: () => Promise<void>
+  submitFunc?: () => Promise<void>
+  transformDateFunc?: (date: any) => string
+  colon?: boolean
 }
 export interface FormSchema {
   // Field name
-  field: string;
+  field: string
   // Event name triggered by internal value change, default change
-  changeEvent?: string;
+  changeEvent?: string
   // Variable name bound to v-model Default value
-  valueField?: string;
+  valueField?: string
   // Label name
-  label: string;
+  label: string
   // Auxiliary text
-  subLabel?: string;
+  subLabel?: string
   // Help text on the right side of the text
-  helpMessage?: string | string[];
+  helpMessage?: string | string[]
   // BaseHelp component props
-  helpComponentProps?: Partial<HelpComponentProps>;
+  helpComponentProps?: Partial<HelpComponentProps>
   // Label width, if it is passed, the labelCol and WrapperCol configured by itemProps will be invalid
-  labelWidth?: string | number;
+  labelWidth?: string | number
   // Disable the adjustment of labelWidth with global settings of formModel, and manually set labelCol and wrapperCol by yourself
-  disabledLabelWidth?: boolean;
+  disabledLabelWidth?: boolean
   // render component
-  component: ComponentType;
+  component: ComponentType
   // Component parameters
   componentProps?:
     | ((opt: {
-        schema: FormSchema;
-        tableAction: TableActionType;
-        formActionType: FormActionType;
-        formModel: Recordable;
+        schema: FormSchema
+        tableAction: TableActionType
+        formActionType: FormActionType
+        formModel: Recordable
       }) => Recordable)
-    | object;
+    | object
   // Required
-  required?: boolean;
+  required?: boolean
 
-  suffix?: string | number | ((values: RenderCallbackParams) => string | number);
+  suffix?: string | number | ((values: RenderCallbackParams) => string | number)
 
   // Validation rules
-  rules?: Rule[];
+  rules?: Rule[]
   // Check whether the information is added to the label
-  rulesMessageJoinLabel?: boolean;
+  rulesMessageJoinLabel?: boolean
 
   // Reference formModelItem
-  itemProps?: Partial<FormItem>;
+  itemProps?: Partial<FormItem>
 
   // col configuration outside formModelItem
-  colProps?: Partial<ColEx>;
+  colProps?: Partial<ColEx>
 
   // 默认值
-  defaultValue?: any;
-  isAdvanced?: boolean;
+  defaultValue?: any
+  isAdvanced?: boolean
 
   // Matching details components
-  span?: number;
+  span?: number
 
-  ifShow?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
+  ifShow?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean)
 
-  show?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
+  show?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean)
 
   // Render the content in the form-item tag
-  render?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string;
+  render?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string
 
   // Rendering col content requires outer wrapper form-item
-  renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string;
+  renderColContent?: (renderCallbackParams: RenderCallbackParams) => VNode | VNode[] | string
 
   renderComponentContent?:
     | ((renderCallbackParams: RenderCallbackParams) => any)
     | VNode
     | VNode[]
-    | string;
+    | string
 
   // Custom slot, in from-item
-  slot?: string;
+  slot?: string
 
   // Custom slot, similar to renderColContent
-  colSlot?: string;
+  colSlot?: string
 
-  dynamicDisabled?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean);
+  dynamicDisabled?: boolean | ((renderCallbackParams: RenderCallbackParams) => boolean)
 
-  dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[];
+  dynamicRules?: (renderCallbackParams: RenderCallbackParams) => Rule[]
 }
 export interface HelpComponentProps {
-  maxWidth: string;
+  maxWidth: string
   // Whether to display the serial number
-  showIndex: boolean;
+  showIndex: boolean
   // Text list
-  text: any;
+  text: any
   // colour
-  color: string;
+  color: string
   // font size
-  fontSize: string;
-  icon: string;
-  absolute: boolean;
+  fontSize: string
+  icon: string
+  absolute: boolean
   // Positioning
-  position: any;
+  position: any
 }

src/components/Form/src/types/formItem.ts

@@ -1,6 +1,6 @@
-import type { NamePath } from 'ant-design-vue/lib/form/interface';
-import type { ColProps } from 'ant-design-vue/lib/grid/Col';
-import type { VNodeChild } from 'vue';
+import type { NamePath } from 'ant-design-vue/lib/form/interface'
+import type { ColProps } from 'ant-design-vue/lib/grid/Col'
+import type { VNodeChild } from 'vue'
 
 export interface FormItem {
   /**
@@ -8,84 +8,84 @@ export interface FormItem {
    * @default true
    * @type boolean
    */
-  colon?: boolean;
+  colon?: boolean
 
   /**
    * The extra prompt message. It is similar to help. Usage example: to display error message and prompt message at the same time.
    * @type any (string | slot)
    */
-  extra?: string | VNodeChild | JSX.Element;
+  extra?: string | VNodeChild | JSX.Element
 
   /**
    * Used with validateStatus, this option specifies the validation status icon. Recommended to be used only with Input.
    * @default false
    * @type boolean
    */
-  hasFeedback?: boolean;
+  hasFeedback?: boolean
 
   /**
    * The prompt message. If not provided, the prompt message will be generated by the validation rule.
    * @type any (string | slot)
    */
-  help?: string | VNodeChild | JSX.Element;
+  help?: string | VNodeChild | JSX.Element
 
   /**
    * Label test
    * @type any (string | slot)
    */
-  label?: string | VNodeChild | JSX.Element;
+  label?: string | VNodeChild | JSX.Element
 
   /**
    * The layout of label. You can set span offset to something like {span: 3, offset: 12} or sm: {span: 3, offset: 12} same as with <Col>
    * @type Col
    */
-  labelCol?: ColProps;
+  labelCol?: ColProps
 
   /**
    * Whether provided or not, it will be generated by the validation rule.
    * @default false
    * @type boolean
    */
-  required?: boolean;
+  required?: boolean
 
   /**
    * The validation status. If not provided, it will be generated by validation rule. options: 'success' 'warning' 'error' 'validating'
    * @type string
    */
-  validateStatus?: '' | 'success' | 'warning' | 'error' | 'validating';
+  validateStatus?: '' | 'success' | 'warning' | 'error' | 'validating'
 
   /**
    * The layout for input controls, same as labelCol
    * @type Col
    */
-  wrapperCol?: ColProps;
+  wrapperCol?: ColProps
   /**
    * Set sub label htmlFor.
    */
-  htmlFor?: string;
+  htmlFor?: string
   /**
    * text align of label
    */
-  labelAlign?: 'left' | 'right';
+  labelAlign?: 'left' | 'right'
   /**
    * a key of model. In the setting of validate and resetFields method, the attribute is required
    */
-  name?: NamePath;
+  name?: NamePath
   /**
    * validation rules of form
    */
-  rules?: object | object[];
+  rules?: object | object[]
   /**
    * Whether to automatically associate form fields. In most cases, you can setting automatic association.
    * If the conditions for automatic association are not met, you can manually associate them. See the notes below.
    */
-  autoLink?: boolean;
+  autoLink?: boolean
   /**
    * Whether stop validate on first rule of error for this field.
    */
-  validateFirst?: boolean;
+  validateFirst?: boolean
   /**
    * When to validate the value of children node
    */
-  validateTrigger?: string | string[] | false;
+  validateTrigger?: string | string[] | false
 }

src/components/Form/src/types/hooks.ts

@@ -1,6 +1,6 @@
 export interface AdvanceState {
-  isAdvanced: boolean;
-  hideAdvanceBtn: boolean;
-  isLoad: boolean;
-  actionSpan: number;
+  isAdvanced: boolean
+  hideAdvanceBtn: boolean
+  isLoad: boolean
+  actionSpan: number
 }

src/components/Form/src/types/index.ts

@@ -1,83 +1,83 @@
-type ColSpanType = number | string;
+type ColSpanType = number | string
 export interface ColEx {
-  style?: any;
+  style?: any
   /**
    * raster number of cells to occupy, 0 corresponds to display: none
    * @default none (0)
    * @type ColSpanType
    */
-  span?: ColSpanType;
+  span?: ColSpanType
 
   /**
    * raster order, used in flex layout mode
    * @default 0
    * @type ColSpanType
    */
-  order?: ColSpanType;
+  order?: ColSpanType
 
   /**
    * the layout fill of flex
    * @default none
    * @type ColSpanType
    */
-  flex?: ColSpanType;
+  flex?: ColSpanType
 
   /**
    * the number of cells to offset Col from the left
    * @default 0
    * @type ColSpanType
    */
-  offset?: ColSpanType;
+  offset?: ColSpanType
 
   /**
    * the number of cells that raster is moved to the right
    * @default 0
    * @type ColSpanType
    */
-  push?: ColSpanType;
+  push?: ColSpanType
 
   /**
    * the number of cells that raster is moved to the left
    * @default 0
    * @type ColSpanType
    */
-  pull?: ColSpanType;
+  pull?: ColSpanType
 
   /**
    * <576px and also default setting, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  xs?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  xs?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 
   /**
    * ≥576px, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  sm?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  sm?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 
   /**
    * ≥768px, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  md?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  md?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 
   /**
    * ≥992px, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  lg?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  lg?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 
   /**
    * ≥1200px, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  xl?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  xl?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 
   /**
    * ≥1600px, could be a span value or an object containing above props
    * @type { span: ColSpanType, offset: ColSpanType } | ColSpanType
    */
-  xxl?: { span: ColSpanType; offset: ColSpanType } | ColSpanType;
+  xxl?: { span: ColSpanType; offset: ColSpanType } | ColSpanType
 }
 
 export type ComponentType =
@@ -108,4 +108,4 @@ export type ComponentType =
   | 'StrengthMeter'
   | 'Upload'
   | 'IconPicker'
-  | 'Render';
+  | 'Render'

src/components/Icon/data/icons.data.ts

@@ -788,6 +788,6 @@ export default {
     'zhihu-outlined',
     'zhihu-square-filled',
     'zoom-in-outlined',
-    'zoom-out-outlined',
-  ],
-};
+    'zoom-out-outlined'
+  ]
+}

src/components/Icon/index.ts

@@ -1,7 +1,7 @@
-import Icon from './src/index.vue';
-import SvgIcon from './src/SvgIcon.vue';
-import IconPicker from './src/IconPicker.vue';
+import Icon from './src/index.vue'
+import SvgIcon from './src/SvgIcon.vue'
+import IconPicker from './src/IconPicker.vue'
 
-export { Icon, IconPicker, SvgIcon };
+export { Icon, IconPicker, SvgIcon }
 
-export default Icon;
+export default Icon

src/components/Loading/index.ts

@@ -1,5 +1,5 @@
-import Loading from './src/index.vue';
+import Loading from './src/index.vue'
 
-export { Loading };
-export { useLoading } from './src/useLoading';
-export { createLoading } from './src/createLoading';
+export { Loading }
+export { useLoading } from './src/useLoading'
+export { createLoading } from './src/createLoading'

src/components/Loading/src/createLoading.ts

@@ -1,60 +1,60 @@
-import { VNode, defineComponent } from 'vue';
-import type { LoadingProps } from './types';
+import { VNode, defineComponent } from 'vue'
+import type { LoadingProps } from './types'
 
-import { createVNode, render, reactive, h } from 'vue';
-import Loading from './index.vue';
+import { createVNode, render, reactive, h } from 'vue'
+import Loading from './index.vue'
 
 export function createLoading(props?: Partial<LoadingProps>, target?: HTMLElement) {
-  let vm: Nullable<VNode> = null;
+  let vm: Nullable<VNode> = null
   const data = reactive({
     tip: '',
     loading: true,
-    ...props,
-  });
+    ...props
+  })
 
   const LoadingWrap = defineComponent({
     setup() {
       return () => {
-        return h(Loading, { ...data });
-      };
-    },
-  });
+        return h(Loading, { ...data })
+      }
+    }
+  })
 
-  vm = createVNode(LoadingWrap);
+  vm = createVNode(LoadingWrap)
 
-  render(vm, document.createElement('div'));
+  render(vm, document.createElement('div'))
 
   function close() {
     if (vm?.el && vm.el.parentNode) {
-      vm.el.parentNode.removeChild(vm.el);
+      vm.el.parentNode.removeChild(vm.el)
     }
   }
 
   function open(target: HTMLElement = document.body) {
     if (!vm || !vm.el) {
-      return;
+      return
     }
-    target.appendChild(vm.el as HTMLElement);
+    target.appendChild(vm.el as HTMLElement)
   }
 
   if (target) {
-    open(target);
+    open(target)
   }
   return {
     vm,
     close,
     open,
     setTip: (tip: string) => {
-      data.tip = tip;
+      data.tip = tip
     },
     setLoading: (loading: boolean) => {
-      data.loading = loading;
+      data.loading = loading
     },
     get loading() {
-      return data.loading;
+      return data.loading
     },
     get $el() {
-      return vm?.el as HTMLElement;
-    },
-  };
+      return vm?.el as HTMLElement
+    }
+  }
 }

src/components/Loading/src/types.ts

@@ -1,10 +1,10 @@
-import { SizeEnum } from '/@/enums/sizeEnum';
+import { SizeEnum } from '/@/enums/sizeEnum'
 
 export interface LoadingProps {
-  tip: string;
-  size: SizeEnum;
-  absolute: boolean;
-  loading: boolean;
-  background: string;
-  theme: 'dark' | 'light';
+  tip: string
+  size: SizeEnum
+  absolute: boolean
+  loading: boolean
+  background: string
+  theme: 'dark' | 'light'
 }

src/components/Loading/src/useLoading.ts

@@ -1,43 +1,43 @@
-import { unref } from 'vue';
-import { createLoading } from './createLoading';
-import type { LoadingProps } from './types';
-import type { Ref } from 'vue';
+import { unref } from 'vue'
+import { createLoading } from './createLoading'
+import type { LoadingProps } from './types'
+import type { Ref } from 'vue'
 
 export interface UseLoadingOptions {
-  target?: HTMLElement | Ref<ElRef>;
-  props?: Partial<LoadingProps>;
+  target?: HTMLElement | Ref<ElRef>
+  props?: Partial<LoadingProps>
 }
 
 interface Fn {
-  (): void;
+  (): void
 }
 
-export function useLoading(props: Partial<LoadingProps>): [Fn, Fn];
-export function useLoading(opt: Partial<UseLoadingOptions>): [Fn, Fn];
+export function useLoading(props: Partial<LoadingProps>): [Fn, Fn]
+export function useLoading(opt: Partial<UseLoadingOptions>): [Fn, Fn]
 
 export function useLoading(opt: Partial<LoadingProps> | Partial<UseLoadingOptions>): [Fn, Fn] {
-  let props: Partial<LoadingProps>;
-  let target: HTMLElement | Ref<ElRef> = document.body;
+  let props: Partial<LoadingProps>
+  let target: HTMLElement | Ref<ElRef> = document.body
 
   if (Reflect.has(opt, 'target') || Reflect.has(opt, 'props')) {
-    const options = opt as Partial<UseLoadingOptions>;
-    props = options.props || {};
-    target = options.target || document.body;
+    const options = opt as Partial<UseLoadingOptions>
+    props = options.props || {}
+    target = options.target || document.body
   } else {
-    props = opt as Partial<LoadingProps>;
+    props = opt as Partial<LoadingProps>
   }
 
-  const instance = createLoading(props);
+  const instance = createLoading(props)
 
   const open = (): void => {
-    const t = unref(target);
-    if (!t) return;
-    instance.open(t);
-  };
+    const t = unref(target)
+    if (!t) return
+    instance.open(t)
+  }
 
   const close = (): void => {
-    instance.close();
-  };
+    instance.close()
+  }
 
-  return [open, close];
+  return [open, close]
 }

src/components/Markdown/index.ts

@@ -1,4 +1,4 @@
-import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
-export const MarkDown = createAsyncComponent(() => import('./src/index.vue'));
+import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
+export const MarkDown = createAsyncComponent(() => import('./src/index.vue'))
 
-export * from './src/types';
+export * from './src/types'

src/components/Markdown/src/types.ts

@@ -1,4 +1,4 @@
-import Vditor from 'vditor';
+import Vditor from 'vditor'
 export interface MarkDownActionType {
-  getVditor: () => Vditor;
+  getVditor: () => Vditor
 }

src/components/Menu/index.ts

@@ -1,3 +1,3 @@
-import BasicMenu from './src/BasicMenu.vue';
+import BasicMenu from './src/BasicMenu.vue'
 
-export { BasicMenu };
+export { BasicMenu }

src/components/Menu/src/props.ts

@@ -1,13 +1,13 @@
-import type { Menu } from '/@/router/types';
-import type { PropType } from 'vue';
+import type { Menu } from '/@/router/types'
+import type { PropType } from 'vue'
 
-import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
-import { ThemeEnum } from '/@/enums/appEnum';
-import { propTypes } from '/@/utils/propTypes';
+import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum'
+import { ThemeEnum } from '/@/enums/appEnum'
+import { propTypes } from '/@/utils/propTypes'
 export const basicProps = {
   items: {
     type: Array as PropType<Menu[]>,
-    default: () => [],
+    default: () => []
   },
   collapsedShowTitle: propTypes.bool,
   // 最好是4 倍数
@@ -15,12 +15,12 @@ export const basicProps = {
   // 菜单组件的mode属性
   mode: {
     type: String as PropType<MenuModeEnum>,
-    default: MenuModeEnum.INLINE,
+    default: MenuModeEnum.INLINE
   },
 
   type: {
     type: String as PropType<MenuTypeEnum>,
-    default: MenuTypeEnum.MIX,
+    default: MenuTypeEnum.MIX
   },
   theme: propTypes.string.def(ThemeEnum.DARK),
   inlineCollapsed: propTypes.bool,
@@ -29,27 +29,27 @@ export const basicProps = {
   isHorizontal: propTypes.bool,
   accordion: propTypes.bool.def(true),
   beforeClickFn: {
-    type: Function as PropType<(key: string) => Promise<boolean>>,
-  },
-};
+    type: Function as PropType<(key: string) => Promise<boolean>>
+  }
+}
 
 export const itemProps = {
   item: {
     type: Object as PropType<Menu>,
-    default: {},
+    default: {}
   },
   level: propTypes.number,
   theme: propTypes.oneOf(['dark', 'light']),
   showTitle: propTypes.bool,
-  isHorizontal: propTypes.bool,
-};
+  isHorizontal: propTypes.bool
+}
 
 export const contentProps = {
   item: {
     type: Object as PropType<Menu>,
-    default: null,
+    default: null
   },
   showTitle: propTypes.bool.def(true),
   level: propTypes.number.def(0),
-  isHorizontal: propTypes.bool.def(true),
-};
+  isHorizontal: propTypes.bool.def(true)
+}

src/components/Menu/src/types.ts

@@ -3,7 +3,7 @@
 // import { MenuModeEnum } from '/@/enums/menuEnum';
 export interface MenuState {
   // 默认选中的列表
-  defaultSelectedKeys: string[];
+  defaultSelectedKeys: string[]
 
   // 模式
   // mode: MenuModeEnum;
@@ -12,14 +12,14 @@ export interface MenuState {
   // theme: ComputedRef<ThemeEnum> | ThemeEnum;
 
   // 缩进
-  inlineIndent?: number;
+  inlineIndent?: number
 
   // 展开数组
-  openKeys: string[];
+  openKeys: string[]
 
   // 当前选中的菜单项 key 数组
-  selectedKeys: string[];
+  selectedKeys: string[]
 
   // 收缩状态下展开的数组
-  collapsedOpenKeys: string[];
+  collapsedOpenKeys: string[]
 }

src/components/Menu/src/useOpenKeys.ts

@@ -1,14 +1,14 @@
-import { MenuModeEnum } from '/@/enums/menuEnum';
-import type { Menu as MenuType } from '/@/router/types';
-import type { MenuState } from './types';
+import { MenuModeEnum } from '/@/enums/menuEnum'
+import type { Menu as MenuType } from '/@/router/types'
+import type { MenuState } from './types'
 
-import { computed, Ref, toRaw } from 'vue';
+import { computed, Ref, toRaw } from 'vue'
 
-import { unref } from 'vue';
-import { uniq } from 'lodash-es';
-import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
-import { getAllParentPath } from '/@/router/helper/menuHelper';
-import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+import { unref } from 'vue'
+import { uniq } from 'lodash-es'
+import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'
+import { getAllParentPath } from '/@/router/helper/menuHelper'
+import { useTimeoutFn } from '/@/hooks/core/useTimeout'
 
 export function useOpenKeys(
   menuState: MenuState,
@@ -16,68 +16,68 @@ export function useOpenKeys(
   mode: Ref<MenuModeEnum>,
   accordion: Ref<boolean>
 ) {
-  const { getCollapsed, getIsMixSidebar } = useMenuSetting();
+  const { getCollapsed, getIsMixSidebar } = useMenuSetting()
 
   async function setOpenKeys(path: string) {
     if (mode.value === MenuModeEnum.HORIZONTAL) {
-      return;
+      return
     }
-    const native = unref(getIsMixSidebar);
+    const native = unref(getIsMixSidebar)
     useTimeoutFn(
       () => {
-        const menuList = toRaw(menus.value);
+        const menuList = toRaw(menus.value)
         if (menuList?.length === 0) {
-          menuState.openKeys = [];
-          return;
+          menuState.openKeys = []
+          return
         }
         if (!unref(accordion)) {
-          menuState.openKeys = uniq([...menuState.openKeys, ...getAllParentPath(menuList, path)]);
+          menuState.openKeys = uniq([...menuState.openKeys, ...getAllParentPath(menuList, path)])
         } else {
-          menuState.openKeys = getAllParentPath(menuList, path);
+          menuState.openKeys = getAllParentPath(menuList, path)
         }
       },
       16,
       !native
-    );
+    )
   }
 
   const getOpenKeys = computed(() => {
-    const collapse = unref(getIsMixSidebar) ? false : unref(getCollapsed);
+    const collapse = unref(getIsMixSidebar) ? false : unref(getCollapsed)
 
-    return collapse ? menuState.collapsedOpenKeys : menuState.openKeys;
-  });
+    return collapse ? menuState.collapsedOpenKeys : menuState.openKeys
+  })
 
   /**
    * @description:  重置值
    */
   function resetKeys() {
-    menuState.selectedKeys = [];
-    menuState.openKeys = [];
+    menuState.selectedKeys = []
+    menuState.openKeys = []
   }
 
   function handleOpenChange(openKeys: string[]) {
     if (unref(mode) === MenuModeEnum.HORIZONTAL || !unref(accordion) || unref(getIsMixSidebar)) {
-      menuState.openKeys = openKeys;
+      menuState.openKeys = openKeys
     } else {
       // const menuList = toRaw(menus.value);
       // getAllParentPath(menuList, path);
-      const rootSubMenuKeys: string[] = [];
+      const rootSubMenuKeys: string[] = []
       for (const { children, path } of unref(menus)) {
         if (children && children.length > 0) {
-          rootSubMenuKeys.push(path);
+          rootSubMenuKeys.push(path)
         }
       }
       if (!unref(getCollapsed)) {
-        const latestOpenKey = openKeys.find((key) => menuState.openKeys.indexOf(key) === -1);
+        const latestOpenKey = openKeys.find(key => menuState.openKeys.indexOf(key) === -1)
         if (rootSubMenuKeys.indexOf(latestOpenKey as string) === -1) {
-          menuState.openKeys = openKeys;
+          menuState.openKeys = openKeys
         } else {
-          menuState.openKeys = latestOpenKey ? [latestOpenKey] : [];
+          menuState.openKeys = latestOpenKey ? [latestOpenKey] : []
         }
       } else {
-        menuState.collapsedOpenKeys = openKeys;
+        menuState.collapsedOpenKeys = openKeys
       }
     }
   }
-  return { setOpenKeys, resetKeys, getOpenKeys, handleOpenChange };
+  return { setOpenKeys, resetKeys, getOpenKeys, handleOpenChange }
 }

src/components/Modal/index.ts

@@ -1,7 +1,7 @@
-import './src/index.less';
-import BasicModal from './src/BasicModal.vue';
+import './src/index.less'
+import BasicModal from './src/BasicModal.vue'
 
-export { BasicModal };
-export { useModalContext } from './src/hooks/useModalContext';
-export { useModal, useModalInner } from './src/hooks/useModal';
-export * from './src/types';
+export { BasicModal }
+export { useModalContext } from './src/hooks/useModalContext'
+export { useModal, useModalInner } from './src/hooks/useModal'
+export * from './src/types'

src/components/Modal/src/BasicModal.vue

@@ -31,6 +31,7 @@
       :fullScreen="fullScreenRef"
       ref="modalWrapperRef"
       :loading="getProps.loading"
+      :loading-tip="getProps.loadingTip"
       :minHeight="getProps.minHeight"
       :height="getWrapperHeight"
       :visible="visibleRef"

src/components/Modal/src/hooks/useModal.ts

@@ -3,8 +3,8 @@ import type {
   ModalMethods,
   ModalProps,
   ReturnMethods,
-  UseModalInnerReturnType,
-} from '../types';
+  UseModalInnerReturnType
+} from '../types'
 
 import {
   ref,
@@ -14,142 +14,142 @@ import {
   reactive,
   watchEffect,
   nextTick,
-  toRaw,
-} from 'vue';
-import { isProdMode } from '/@/utils/env';
-import { isFunction } from '/@/utils/is';
-import { isEqual } from 'lodash-es';
-import { tryOnUnmounted } from '@vueuse/core';
+  toRaw
+} from 'vue'
+import { isProdMode } from '/@/utils/env'
+import { isFunction } from '/@/utils/is'
+import { isEqual } from 'lodash-es'
+import { tryOnUnmounted } from '@vueuse/core'
 
-import { error } from '/@/utils/log';
-import { computed } from 'vue';
-const dataTransferRef = reactive<any>({});
+import { error } from '/@/utils/log'
+import { computed } from 'vue'
+const dataTransferRef = reactive<any>({})
 
-const visibleData = reactive<{ [key: number]: boolean }>({});
+const visibleData = reactive<{ [key: number]: boolean }>({})
 
 /**
  * @description: Applicable to independent modal and call outside
  */
 export function useModal(): UseModalReturnType {
-  const modalRef = ref<Nullable<ModalMethods>>(null);
-  const loadedRef = ref<Nullable<boolean>>(false);
-  const uidRef = ref<string>('');
+  const modalRef = ref<Nullable<ModalMethods>>(null)
+  const loadedRef = ref<Nullable<boolean>>(false)
+  const uidRef = ref<string>('')
 
   function register(modalMethod: ModalMethods, uuid: string) {
-    uidRef.value = uuid;
+    uidRef.value = uuid
 
     isProdMode() &&
       onUnmounted(() => {
-        modalRef.value = null;
-        loadedRef.value = false;
-        dataTransferRef[unref(uidRef)] = null;
-      });
-    if (unref(loadedRef) && isProdMode() && modalMethod === unref(modalRef)) return;
+        modalRef.value = null
+        loadedRef.value = false
+        dataTransferRef[unref(uidRef)] = null
+      })
+    if (unref(loadedRef) && isProdMode() && modalMethod === unref(modalRef)) return
 
-    modalRef.value = modalMethod;
+    modalRef.value = modalMethod
     modalMethod.emitVisible = (visible: boolean, uid: number) => {
-      visibleData[uid] = visible;
-    };
+      visibleData[uid] = visible
+    }
   }
 
   const getInstance = () => {
-    const instance = unref(modalRef);
+    const instance = unref(modalRef)
     if (!instance) {
-      error('useModal instance is undefined!');
+      error('useModal instance is undefined!')
     }
-    return instance;
-  };
+    return instance
+  }
 
   const methods: ReturnMethods = {
     setModalProps: (props: Partial<ModalProps>): void => {
-      getInstance()?.setModalProps(props);
+      getInstance()?.setModalProps(props)
     },
 
     getVisible: computed((): boolean => {
-      return visibleData[~~unref(uidRef)];
+      return visibleData[~~unref(uidRef)]
     }),
 
     redoModalHeight: () => {
-      getInstance()?.redoModalHeight?.();
+      getInstance()?.redoModalHeight?.()
     },
 
     openModal: <T = any>(visible = true, data?: T, openOnSet = true): void => {
       getInstance()?.setModalProps({
-        visible: visible,
-      });
+        visible: visible
+      })
 
-      if (!data) return;
+      if (!data) return
 
       if (openOnSet) {
-        dataTransferRef[unref(uidRef)] = null;
-        dataTransferRef[unref(uidRef)] = toRaw(data);
-        return;
+        dataTransferRef[unref(uidRef)] = null
+        dataTransferRef[unref(uidRef)] = toRaw(data)
+        return
       }
-      const equal = isEqual(toRaw(dataTransferRef[unref(uidRef)]), toRaw(data));
+      const equal = isEqual(toRaw(dataTransferRef[unref(uidRef)]), toRaw(data))
       if (!equal) {
-        dataTransferRef[unref(uidRef)] = toRaw(data);
+        dataTransferRef[unref(uidRef)] = toRaw(data)
       }
-    },
-  };
-  return [register, methods];
+    }
+  }
+  return [register, methods]
 }
 
 export const useModalInner = (callbackFn?: Fn): UseModalInnerReturnType => {
-  const modalInstanceRef = ref<Nullable<ModalMethods>>(null);
-  const currentInstance = getCurrentInstance();
-  const uidRef = ref<string>('');
+  const modalInstanceRef = ref<Nullable<ModalMethods>>(null)
+  const currentInstance = getCurrentInstance()
+  const uidRef = ref<string>('')
 
   // currentInstall.type.emits = [...currentInstall.type.emits, 'register'];
   // Object.assign(currentInstall.type.emits, ['register']);
 
   const getInstance = () => {
-    const instance = unref(modalInstanceRef);
+    const instance = unref(modalInstanceRef)
     if (!instance) {
-      error('useModalInner instance is undefined!');
+      error('useModalInner instance is undefined!')
     }
-    return instance;
-  };
+    return instance
+  }
 
   const register = (modalInstance: ModalMethods, uuid: string) => {
     isProdMode() &&
       tryOnUnmounted(() => {
-        modalInstanceRef.value = null;
-      });
-    uidRef.value = uuid;
-    modalInstanceRef.value = modalInstance;
-    currentInstance?.emit('register', modalInstance, uuid);
-  };
+        modalInstanceRef.value = null
+      })
+    uidRef.value = uuid
+    modalInstanceRef.value = modalInstance
+    currentInstance?.emit('register', modalInstance, uuid)
+  }
 
   watchEffect(() => {
-    const data = dataTransferRef[unref(uidRef)];
-    if (!data) return;
-    if (!callbackFn || !isFunction(callbackFn)) return;
+    const data = dataTransferRef[unref(uidRef)]
+    if (!data) return
+    if (!callbackFn || !isFunction(callbackFn)) return
     nextTick(() => {
-      callbackFn(data);
-    });
-  });
+      callbackFn(data)
+    })
+  })
 
   return [
     register,
     {
       changeLoading: (loading = true) => {
-        getInstance()?.setModalProps({ loading });
+        getInstance()?.setModalProps({ loading })
       },
       getVisible: computed((): boolean => {
-        return visibleData[~~unref(uidRef)];
+        return visibleData[~~unref(uidRef)]
       }),
 
       changeOkLoading: (loading = true) => {
-        getInstance()?.setModalProps({ confirmLoading: loading });
+        getInstance()?.setModalProps({ confirmLoading: loading })
       },
 
       closeModal: () => {
-        getInstance()?.setModalProps({ visible: false });
+        getInstance()?.setModalProps({ visible: false })
       },
 
       setModalProps: (props: Partial<ModalProps>) => {
-        getInstance()?.setModalProps(props);
-      },
-    },
-  ];
-};
+        getInstance()?.setModalProps(props)
+      }
+    }
+  ]
+}

src/components/Modal/src/hooks/useModalContext.ts

@@ -1,16 +1,16 @@
-import { InjectionKey } from 'vue';
-import { createContext, useContext } from '/@/hooks/core/useContext';
+import { InjectionKey } from 'vue'
+import { createContext, useContext } from '/@/hooks/core/useContext'
 
 export interface ModalContextProps {
-  redoModalHeight: () => void;
+  redoModalHeight: () => void
 }
 
-const key: InjectionKey<ModalContextProps> = Symbol();
+const key: InjectionKey<ModalContextProps> = Symbol()
 
 export function createModalContext(context: ModalContextProps) {
-  return createContext<ModalContextProps>(context, key);
+  return createContext<ModalContextProps>(context, key)
 }
 
 export function useModalContext() {
-  return useContext<ModalContextProps>(key);
+  return useContext<ModalContextProps>(key)
 }

src/components/Modal/src/hooks/useModalDrag.ts

@@ -1,107 +1,107 @@
-import { Ref, unref, watchEffect } from 'vue';
-import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+import { Ref, unref, watchEffect } from 'vue'
+import { useTimeoutFn } from '/@/hooks/core/useTimeout'
 
 export interface UseModalDragMoveContext {
-  draggable: Ref<boolean>;
-  destroyOnClose: Ref<boolean | undefined> | undefined;
-  visible: Ref<boolean>;
+  draggable: Ref<boolean>
+  destroyOnClose: Ref<boolean | undefined> | undefined
+  visible: Ref<boolean>
 }
 
 export function useModalDragMove(context: UseModalDragMoveContext) {
   const getStyle = (dom: any, attr: any) => {
-    return getComputedStyle(dom)[attr];
-  };
+    return getComputedStyle(dom)[attr]
+  }
   const drag = (wrap: any) => {
-    if (!wrap) return;
-    wrap.setAttribute('data-drag', unref(context.draggable));
-    const dialogHeaderEl = wrap.querySelector('.ant-modal-header');
-    const dragDom = wrap.querySelector('.ant-modal');
+    if (!wrap) return
+    wrap.setAttribute('data-drag', unref(context.draggable))
+    const dialogHeaderEl = wrap.querySelector('.ant-modal-header')
+    const dragDom = wrap.querySelector('.ant-modal')
 
-    if (!dialogHeaderEl || !dragDom || !unref(context.draggable)) return;
+    if (!dialogHeaderEl || !dragDom || !unref(context.draggable)) return
 
-    dialogHeaderEl.style.cursor = 'move';
+    dialogHeaderEl.style.cursor = 'move'
 
     dialogHeaderEl.onmousedown = (e: any) => {
-      if (!e) return;
+      if (!e) return
       // 鼠标按下，计算当前元素距离可视区的距离
-      const disX = e.clientX;
-      const disY = e.clientY;
-      const screenWidth = document.body.clientWidth; // body当前宽度
-      const screenHeight = document.documentElement.clientHeight; // 可见区域高度(应为body高度，可某些环境下无法获取)
+      const disX = e.clientX
+      const disY = e.clientY
+      const screenWidth = document.body.clientWidth // body当前宽度
+      const screenHeight = document.documentElement.clientHeight // 可见区域高度(应为body高度，可某些环境下无法获取)
 
-      const dragDomWidth = dragDom.offsetWidth; // 对话框宽度
-      const dragDomheight = dragDom.offsetHeight; // 对话框高度
+      const dragDomWidth = dragDom.offsetWidth // 对话框宽度
+      const dragDomheight = dragDom.offsetHeight // 对话框高度
 
-      const minDragDomLeft = dragDom.offsetLeft;
+      const minDragDomLeft = dragDom.offsetLeft
 
-      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
-      const minDragDomTop = dragDom.offsetTop;
-      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
+      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth
+      const minDragDomTop = dragDom.offsetTop
+      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight
       // 获取到的值带px 正则匹配替换
-      const domLeft = getStyle(dragDom, 'left');
-      const domTop = getStyle(dragDom, 'top');
-      let styL = +domLeft;
-      let styT = +domTop;
+      const domLeft = getStyle(dragDom, 'left')
+      const domTop = getStyle(dragDom, 'top')
+      let styL = +domLeft
+      let styT = +domTop
 
       // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
       if (domLeft.includes('%')) {
-        styL = +document.body.clientWidth * (+domLeft.replace(/%/g, '') / 100);
-        styT = +document.body.clientHeight * (+domTop.replace(/%/g, '') / 100);
+        styL = +document.body.clientWidth * (+domLeft.replace(/%/g, '') / 100)
+        styT = +document.body.clientHeight * (+domTop.replace(/%/g, '') / 100)
       } else {
-        styL = +domLeft.replace(/px/g, '');
-        styT = +domTop.replace(/px/g, '');
+        styL = +domLeft.replace(/px/g, '')
+        styT = +domTop.replace(/px/g, '')
       }
 
       document.onmousemove = function (e) {
         // 通过事件委托，计算移动的距离
-        let left = e.clientX - disX;
-        let top = e.clientY - disY;
+        let left = e.clientX - disX
+        let top = e.clientY - disY
 
         // 边界处理
         if (-left > minDragDomLeft) {
-          left = -minDragDomLeft;
+          left = -minDragDomLeft
         } else if (left > maxDragDomLeft) {
-          left = maxDragDomLeft;
+          left = maxDragDomLeft
         }
 
         if (-top > minDragDomTop) {
-          top = -minDragDomTop;
+          top = -minDragDomTop
         } else if (top > maxDragDomTop) {
-          top = maxDragDomTop;
+          top = maxDragDomTop
         }
 
         // 移动当前元素
-        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
-      };
+        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`
+      }
 
       document.onmouseup = () => {
-        document.onmousemove = null;
-        document.onmouseup = null;
-      };
-    };
-  };
+        document.onmousemove = null
+        document.onmouseup = null
+      }
+    }
+  }
 
   const handleDrag = () => {
-    const dragWraps = document.querySelectorAll('.ant-modal-wrap');
+    const dragWraps = document.querySelectorAll('.ant-modal-wrap')
     for (const wrap of Array.from(dragWraps)) {
-      if (!wrap) continue;
-      const display = getStyle(wrap, 'display');
-      const draggable = wrap.getAttribute('data-drag');
+      if (!wrap) continue
+      const display = getStyle(wrap, 'display')
+      const draggable = wrap.getAttribute('data-drag')
       if (display !== 'none') {
         // 拖拽位置
         if (draggable === null || unref(context.destroyOnClose)) {
-          drag(wrap);
+          drag(wrap)
         }
       }
     }
-  };
+  }
 
   watchEffect(() => {
     if (!unref(context.visible) || !unref(context.draggable)) {
-      return;
+      return
     }
     useTimeoutFn(() => {
-      handleDrag();
-    }, 30);
-  });
+      handleDrag()
+    }, 30)
+  })
 }

src/components/Modal/src/hooks/useModalFullScreen.ts

@@ -1,24 +1,24 @@
-import { computed, Ref, ref, unref } from 'vue';
+import { computed, Ref, ref, unref } from 'vue'
 
 export interface UseFullScreenContext {
-  wrapClassName: Ref<string | undefined>;
-  modalWrapperRef: Ref<ComponentRef>;
-  extHeightRef: Ref<number>;
+  wrapClassName: Ref<string | undefined>
+  modalWrapperRef: Ref<ComponentRef>
+  extHeightRef: Ref<number>
 }
 
 export function useFullScreen(context: UseFullScreenContext) {
   // const formerHeightRef = ref(0);
-  const fullScreenRef = ref(false);
+  const fullScreenRef = ref(false)
 
   const getWrapClassName = computed(() => {
-    const clsName = unref(context.wrapClassName) || '';
+    const clsName = unref(context.wrapClassName) || ''
 
-    return unref(fullScreenRef) ? `fullscreen-modal ${clsName} ` : unref(clsName);
-  });
+    return unref(fullScreenRef) ? `fullscreen-modal ${clsName} ` : unref(clsName)
+  })
 
   function handleFullScreen(e: Event) {
-    e && e.stopPropagation();
-    fullScreenRef.value = !unref(fullScreenRef);
+    e && e.stopPropagation()
+    fullScreenRef.value = !unref(fullScreenRef)
 
     // const modalWrapper = unref(context.modalWrapperRef);
 
@@ -40,5 +40,5 @@ export function useFullScreen(context: UseFullScreenContext) {
     //   modalWrapSpinEl.style.height = `${unref(formerHeightRef)}px`;
     // }
   }
-  return { getWrapClassName, handleFullScreen, fullScreenRef };
+  return { getWrapClassName, handleFullScreen, fullScreenRef }
 }

src/components/Modal/src/props.ts

@@ -1,10 +1,10 @@
-import type { PropType, CSSProperties } from 'vue';
-import { ButtonProps } from 'ant-design-vue/es/button/buttonTypes';
+import type { PropType, CSSProperties } from 'vue'
+import { ButtonProps } from 'ant-design-vue/es/button/buttonTypes'
 
-import { useI18n } from '/@/hooks/web/useI18n';
-import { propTypes, VueNode } from '/@/utils/propTypes';
-import type { ModalWrapperProps } from './types';
-const { t } = useI18n();
+import { useI18n } from '/@/hooks/web/useI18n'
+import { propTypes, VueNode } from '/@/utils/propTypes'
+import type { ModalWrapperProps } from './types'
+const { t } = useI18n()
 
 export const modalProps = {
   visible: propTypes.bool,
@@ -17,8 +17,8 @@ export const modalProps = {
   cancelText: propTypes.string.def(t('common.cancelText')),
   okText: propTypes.string.def(t('common.okText')),
 
-  closeFunc: Function as PropType<() => Promise<boolean>>,
-};
+  closeFunc: Function as PropType<() => Promise<boolean>>
+}
 
 export const basicProps = Object.assign({}, modalProps, {
   defaultFullscreen: propTypes.bool,
@@ -80,5 +80,5 @@ export const basicProps = Object.assign({}, modalProps, {
 
   wrapClassName: propTypes.string,
 
-  zIndex: propTypes.number,
-});
+  zIndex: propTypes.number
+})

src/components/Modal/src/types.ts

@@ -1,206 +1,206 @@
-import type { ButtonProps } from 'ant-design-vue/lib/button/buttonTypes';
-import type { CSSProperties, VNodeChild, ComputedRef } from 'vue';
+import type { ButtonProps } from 'ant-design-vue/lib/button/buttonTypes'
+import type { CSSProperties, VNodeChild, ComputedRef } from 'vue'
 /**
  * @description: 弹窗对外暴露的方法
  */
 export interface ModalMethods {
-  setModalProps: (props: Partial<ModalProps>) => void;
-  emitVisible?: (visible: boolean, uid: number) => void;
-  redoModalHeight?: () => void;
+  setModalProps: (props: Partial<ModalProps>) => void
+  emitVisible?: (visible: boolean, uid: number) => void
+  redoModalHeight?: () => void
 }
 
-export type RegisterFn = (modalMethods: ModalMethods, uuid?: string) => void;
+export type RegisterFn = (modalMethods: ModalMethods, uuid?: string) => void
 
 export interface ReturnMethods extends ModalMethods {
-  openModal: <T = any>(props?: boolean, data?: T, openOnSet?: boolean) => void;
-  getVisible?: ComputedRef<boolean>;
+  openModal: <T = any>(props?: boolean, data?: T, openOnSet?: boolean) => void
+  getVisible?: ComputedRef<boolean>
 }
 
-export type UseModalReturnType = [RegisterFn, ReturnMethods];
+export type UseModalReturnType = [RegisterFn, ReturnMethods]
 
 export interface ReturnInnerMethods extends ModalMethods {
-  closeModal: () => void;
-  changeLoading: (loading: boolean) => void;
-  changeOkLoading: (loading: boolean) => void;
-  getVisible?: ComputedRef<boolean>;
+  closeModal: () => void
+  changeLoading: (loading: boolean) => void
+  changeOkLoading: (loading: boolean) => void
+  getVisible?: ComputedRef<boolean>
 }
 
-export type UseModalInnerReturnType = [RegisterFn, ReturnInnerMethods];
+export type UseModalInnerReturnType = [RegisterFn, ReturnInnerMethods]
 
 export interface ModalProps {
-  minHeight?: number;
-  height?: number;
+  minHeight?: number
+  height?: number
   // 启用wrapper后 底部可以适当增加高度
-  wrapperFooterOffset?: number;
-  draggable?: boolean;
-  scrollTop?: boolean;
+  wrapperFooterOffset?: number
+  draggable?: boolean
+  scrollTop?: boolean
 
   // 是否可以进行全屏
-  canFullscreen?: boolean;
-  visible?: boolean;
+  canFullscreen?: boolean
+  visible?: boolean
   // 温馨提醒信息
-  helpMessage: string | string[];
+  helpMessage: string | string[]
 
   // 是否使用modalWrapper
-  useWrapper: boolean;
+  useWrapper: boolean
 
-  loading: boolean;
-  loadingTip?: string;
+  loading: boolean
+  loadingTip?: string
 
-  wrapperProps: Omit<ModalWrapperProps, 'loading'>;
+  wrapperProps: Omit<ModalWrapperProps, 'loading'>
 
-  showOkBtn: boolean;
-  showCancelBtn: boolean;
-  closeFunc: () => Promise<any>;
+  showOkBtn: boolean
+  showCancelBtn: boolean
+  closeFunc: () => Promise<any>
 
   /**
    * Specify a function that will be called when modal is closed completely.
    * @type Function
    */
-  afterClose?: () => any;
+  afterClose?: () => any
 
   /**
    * Body style for modal body element. Such as height, padding etc.
    * @default {}
    * @type object
    */
-  bodyStyle?: CSSProperties;
+  bodyStyle?: CSSProperties
 
   /**
    * Text of the Cancel button
    * @default 'cancel'
    * @type string
    */
-  cancelText?: string;
+  cancelText?: string
 
   /**
    * Centered Modal
    * @default false
    * @type boolean
    */
-  centered?: boolean;
+  centered?: boolean
 
   /**
    * Whether a close (x) button is visible on top right of the modal dialog or not
    * @default true
    * @type boolean
    */
-  closable?: boolean;
+  closable?: boolean
   /**
    * Whether a close (x) button is visible on top right of the modal dialog or not
    */
-  closeIcon?: VNodeChild | JSX.Element;
+  closeIcon?: VNodeChild | JSX.Element
 
   /**
    * Whether to apply loading visual effect for OK button or not
    * @default false
    * @type boolean
    */
-  confirmLoading?: boolean;
+  confirmLoading?: boolean
 
   /**
    * Whether to unmount child components on onClose
    * @default false
    * @type boolean
    */
-  destroyOnClose?: boolean;
+  destroyOnClose?: boolean
 
   /**
    * Footer content, set as :footer="null" when you don't need default buttons
    * @default OK and Cancel buttons
    * @type any (string | slot)
    */
-  footer?: VNodeChild | JSX.Element;
+  footer?: VNodeChild | JSX.Element
 
   /**
    * Return the mount node for Modal
    * @default () => document.body
    * @type Function
    */
-  getContainer?: (instance: any) => HTMLElement;
+  getContainer?: (instance: any) => HTMLElement
 
   /**
    * Whether show mask or not.
    * @default true
    * @type boolean
    */
-  mask?: boolean;
+  mask?: boolean
 
   /**
    * Whether to close the modal dialog when the mask (area outside the modal) is clicked
    * @default true
    * @type boolean
    */
-  maskClosable?: boolean;
+  maskClosable?: boolean
 
   /**
    * Style for modal's mask element.
    * @default {}
    * @type object
    */
-  maskStyle?: CSSProperties;
+  maskStyle?: CSSProperties
 
   /**
    * Text of the OK button
    * @default 'OK'
    * @type string
    */
-  okText?: string;
+  okText?: string
 
   /**
    * Button type of the OK button
    * @default 'primary'
    * @type string
    */
-  okType?: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default';
+  okType?: 'primary' | 'danger' | 'dashed' | 'ghost' | 'default'
 
   /**
    * The ok button props, follow jsx rules
    * @type object
    */
-  okButtonProps?: ButtonProps;
+  okButtonProps?: ButtonProps
 
   /**
    * The cancel button props, follow jsx rules
    * @type object
    */
-  cancelButtonProps?: ButtonProps;
+  cancelButtonProps?: ButtonProps
 
   /**
    * The modal dialog's title
    * @type any (string | slot)
    */
-  title?: VNodeChild | JSX.Element;
+  title?: VNodeChild | JSX.Element
 
   /**
    * Width of the modal dialog
    * @default 520
    * @type string | number
    */
-  width?: string | number;
+  width?: string | number
 
   /**
    * The class name of the container of the modal dialog
    * @type string
    */
-  wrapClassName?: string;
+  wrapClassName?: string
 
   /**
    * The z-index of the Modal
    * @default 1000
    * @type number
    */
-  zIndex?: number;
+  zIndex?: number
 }
 
 export interface ModalWrapperProps {
-  footerOffset?: number;
-  loading: boolean;
-  modalHeaderHeight: number;
-  modalFooterHeight: number;
-  minHeight: number;
-  height: number;
-  visible: boolean;
-  fullScreen: boolean;
-  useWrapper: boolean;
+  footerOffset?: number
+  loading: boolean
+  modalHeaderHeight: number
+  modalFooterHeight: number
+  minHeight: number
+  height: number
+  visible: boolean
+  fullScreen: boolean
+  useWrapper: boolean
 }

src/components/Page/index.ts

@@ -1,2 +1,2 @@
-export { default as PageFooter } from './src/PageFooter.vue';
-export { default as PageWrapper } from './src/PageWrapper.vue';
+export { default as PageFooter } from './src/PageFooter.vue'
+export { default as PageWrapper } from './src/PageWrapper.vue'

src/components/Preview/index.ts

@@ -1 +1 @@
-export { default as ImagePreview } from './src/index.vue';
+export { default as ImagePreview } from './src/index.vue'

src/components/Qrcode/index.ts

@@ -1,3 +1,3 @@
-export { default as QrCode } from './src/index.vue';
+export { default as QrCode } from './src/index.vue'
 
-export * from './src/types';
+export * from './src/types'

src/components/Qrcode/src/drawCanvas.ts

@@ -1,29 +1,29 @@
-import { toCanvas } from 'qrcode';
-import type { QRCodeRenderersOptions } from 'qrcode';
-import { RenderQrCodeParams, ContentType } from './types';
+import { toCanvas } from 'qrcode'
+import type { QRCodeRenderersOptions } from 'qrcode'
+import { RenderQrCodeParams, ContentType } from './types'
 export const renderQrCode = ({ canvas, content, width = 0, options = {} }: RenderQrCodeParams) => {
   // 容错率，默认对内容少的二维码采用高容错率，内容多的二维码采用低容错率
-  options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content);
+  options.errorCorrectionLevel = options.errorCorrectionLevel || getErrorCorrectionLevel(content)
 
   return getOriginWidth(content, options).then((_width: number) => {
-    options.scale = width === 0 ? undefined : (width / _width) * 4;
-    return toCanvas(canvas, content, options);
-  });
-};
+    options.scale = width === 0 ? undefined : (width / _width) * 4
+    return toCanvas(canvas, content, options)
+  })
+}
 
 // 得到原QrCode的大小，以便缩放得到正确的QrCode大小
 function getOriginWidth(content: ContentType, options: QRCodeRenderersOptions) {
-  const _canvas = document.createElement('canvas');
-  return toCanvas(_canvas, content, options).then(() => _canvas.width);
+  const _canvas = document.createElement('canvas')
+  return toCanvas(_canvas, content, options).then(() => _canvas.width)
 }
 
 // 对于内容少的QrCode，增大容错率
 function getErrorCorrectionLevel(content: ContentType) {
   if (content.length > 36) {
-    return 'M';
+    return 'M'
   } else if (content.length > 16) {
-    return 'Q';
+    return 'Q'
   } else {
-    return 'H';
+    return 'H'
   }
 }

src/components/Qrcode/src/drawLogo.ts

@@ -1,89 +1,89 @@
-import { isString } from '/@/utils/is';
-import { RenderQrCodeParams, LogoType } from './types';
+import { isString } from '/@/utils/is'
+import { RenderQrCodeParams, LogoType } from './types'
 export const drawLogo = ({ canvas, logo }: RenderQrCodeParams) => {
   if (!logo) {
-    return new Promise((resolve) => {
-      resolve((canvas as HTMLCanvasElement).toDataURL());
-    });
+    return new Promise(resolve => {
+      resolve((canvas as HTMLCanvasElement).toDataURL())
+    })
   }
 
-  const canvasWidth = (canvas as HTMLCanvasElement).width;
+  const canvasWidth = (canvas as HTMLCanvasElement).width
   const {
     logoSize = 0.15,
     bgColor = '#ffffff',
     borderSize = 0.05,
     crossOrigin,
     borderRadius = 8,
-    logoRadius = 0,
-  } = logo as LogoType;
+    logoRadius = 0
+  } = logo as LogoType
 
-  const logoSrc: string = isString(logo) ? logo : logo.src;
-  const logoWidth = canvasWidth * logoSize;
-  const logoXY = (canvasWidth * (1 - logoSize)) / 2;
-  const logoBgWidth = canvasWidth * (logoSize + borderSize);
-  const logoBgXY = (canvasWidth * (1 - logoSize - borderSize)) / 2;
+  const logoSrc: string = isString(logo) ? logo : logo.src
+  const logoWidth = canvasWidth * logoSize
+  const logoXY = (canvasWidth * (1 - logoSize)) / 2
+  const logoBgWidth = canvasWidth * (logoSize + borderSize)
+  const logoBgXY = (canvasWidth * (1 - logoSize - borderSize)) / 2
 
-  const ctx = canvas.getContext('2d');
-  if (!ctx) return;
+  const ctx = canvas.getContext('2d')
+  if (!ctx) return
 
   // logo 底色
-  canvasRoundRect(ctx)(logoBgXY, logoBgXY, logoBgWidth, logoBgWidth, borderRadius);
-  ctx.fillStyle = bgColor;
-  ctx.fill();
+  canvasRoundRect(ctx)(logoBgXY, logoBgXY, logoBgWidth, logoBgWidth, borderRadius)
+  ctx.fillStyle = bgColor
+  ctx.fill()
 
   // logo
-  const image = new Image();
+  const image = new Image()
   if (crossOrigin || logoRadius) {
-    image.setAttribute('crossOrigin', crossOrigin || 'anonymous');
+    image.setAttribute('crossOrigin', crossOrigin || 'anonymous')
   }
-  image.src = logoSrc;
+  image.src = logoSrc
 
   // 使用image绘制可以避免某些跨域情况
   const drawLogoWithImage = (image: CanvasImageSource) => {
-    ctx.drawImage(image, logoXY, logoXY, logoWidth, logoWidth);
-  };
+    ctx.drawImage(image, logoXY, logoXY, logoWidth, logoWidth)
+  }
 
   // 使用canvas绘制以获得更多的功能
   const drawLogoWithCanvas = (image: HTMLImageElement) => {
-    const canvasImage = document.createElement('canvas');
-    canvasImage.width = logoXY + logoWidth;
-    canvasImage.height = logoXY + logoWidth;
-    const imageCanvas = canvasImage.getContext('2d');
-    if (!imageCanvas || !ctx) return;
-    imageCanvas.drawImage(image, logoXY, logoXY, logoWidth, logoWidth);
+    const canvasImage = document.createElement('canvas')
+    canvasImage.width = logoXY + logoWidth
+    canvasImage.height = logoXY + logoWidth
+    const imageCanvas = canvasImage.getContext('2d')
+    if (!imageCanvas || !ctx) return
+    imageCanvas.drawImage(image, logoXY, logoXY, logoWidth, logoWidth)
 
-    canvasRoundRect(ctx)(logoXY, logoXY, logoWidth, logoWidth, logoRadius);
-    if (!ctx) return;
-    const fillStyle = ctx.createPattern(canvasImage, 'no-repeat');
+    canvasRoundRect(ctx)(logoXY, logoXY, logoWidth, logoWidth, logoRadius)
+    if (!ctx) return
+    const fillStyle = ctx.createPattern(canvasImage, 'no-repeat')
     if (fillStyle) {
-      ctx.fillStyle = fillStyle;
-      ctx.fill();
+      ctx.fillStyle = fillStyle
+      ctx.fill()
     }
-  };
+  }
 
   // 将 logo绘制到 canvas上
-  return new Promise((resolve) => {
+  return new Promise(resolve => {
     image.onload = () => {
-      logoRadius ? drawLogoWithCanvas(image) : drawLogoWithImage(image);
-      resolve((canvas as HTMLCanvasElement).toDataURL());
-    };
-  });
-};
+      logoRadius ? drawLogoWithCanvas(image) : drawLogoWithImage(image)
+      resolve((canvas as HTMLCanvasElement).toDataURL())
+    }
+  })
+}
 
 // copy来的方法，用于绘制圆角
 function canvasRoundRect(ctx: CanvasRenderingContext2D) {
   return (x: number, y: number, w: number, h: number, r: number) => {
-    const minSize = Math.min(w, h);
+    const minSize = Math.min(w, h)
     if (r > minSize / 2) {
-      r = minSize / 2;
+      r = minSize / 2
     }
-    ctx.beginPath();
-    ctx.moveTo(x + r, y);
-    ctx.arcTo(x + w, y, x + w, y + h, r);
-    ctx.arcTo(x + w, y + h, x, y + h, r);
-    ctx.arcTo(x, y + h, x, y, r);
-    ctx.arcTo(x, y, x + w, y, r);
-    ctx.closePath();
-    return ctx;
-  };
+    ctx.beginPath()
+    ctx.moveTo(x + r, y)
+    ctx.arcTo(x + w, y, x + w, y + h, r)
+    ctx.arcTo(x + w, y + h, x, y + h, r)
+    ctx.arcTo(x, y + h, x, y, r)
+    ctx.arcTo(x, y, x + w, y, r)
+    ctx.closePath()
+    return ctx
+  }
 }

src/components/Qrcode/src/qrcodePlus.ts

@@ -1,5 +1,5 @@
 // 参考 qr-code-with-logo 进行ts版本修改
-import { toCanvas } from './toCanvas';
-export * from './types';
+import { toCanvas } from './toCanvas'
+export * from './types'
 
-export { toCanvas };
+export { toCanvas }

src/components/Qrcode/src/toCanvas.ts

@@ -1,10 +1,10 @@
-import { renderQrCode } from './drawCanvas';
-import { drawLogo } from './drawLogo';
-import { RenderQrCodeParams } from './types';
+import { renderQrCode } from './drawCanvas'
+import { drawLogo } from './drawLogo'
+import { RenderQrCodeParams } from './types'
 export const toCanvas = (options: RenderQrCodeParams) => {
   return renderQrCode(options)
     .then(() => {
-      return options;
+      return options
     })
-    .then(drawLogo) as Promise<string>;
-};
+    .then(drawLogo) as Promise<string>
+}

src/components/Qrcode/src/types.ts

@@ -1,33 +1,33 @@
-import type { QRCodeSegment, QRCodeRenderersOptions } from 'qrcode';
+import type { QRCodeSegment, QRCodeRenderersOptions } from 'qrcode'
 
-export type ContentType = string | QRCodeSegment[];
+export type ContentType = string | QRCodeSegment[]
 
-export type { QRCodeRenderersOptions };
+export type { QRCodeRenderersOptions }
 
 export type LogoType = {
-  src: string;
-  logoSize: number;
-  borderColor: string;
-  bgColor: string;
-  borderSize: number;
-  crossOrigin: string;
-  borderRadius: number;
-  logoRadius: number;
-};
+  src: string
+  logoSize: number
+  borderColor: string
+  bgColor: string
+  borderSize: number
+  crossOrigin: string
+  borderRadius: number
+  logoRadius: number
+}
 
 export interface RenderQrCodeParams {
-  canvas: any;
-  content: ContentType;
-  width?: number;
-  options?: QRCodeRenderersOptions;
-  logo?: LogoType | string;
-  image?: HTMLImageElement;
-  downloadName?: string;
-  download?: boolean | Fn;
+  canvas: any
+  content: ContentType
+  width?: number
+  options?: QRCodeRenderersOptions
+  logo?: LogoType | string
+  image?: HTMLImageElement
+  downloadName?: string
+  download?: boolean | Fn
 }
 
-export type ToCanvasFn = (options: RenderQrCodeParams) => Promise<unknown>;
+export type ToCanvasFn = (options: RenderQrCodeParams) => Promise<unknown>
 
 export interface QrCodeActionType {
-  download: (fileName?: string) => void;
+  download: (fileName?: string) => void
 }

src/components/Scrollbar/index.ts

@@ -2,7 +2,7 @@
  * copy from element-ui
  */
 
-import Scrollbar from './src/index.vue';
+import Scrollbar from './src/index.vue'
 
-export { Scrollbar };
-export type { ScrollbarType } from './src/types';
+export { Scrollbar }
+export type { ScrollbarType } from './src/types'

src/components/Scrollbar/src/bar.ts

@@ -6,11 +6,11 @@ import {
   getCurrentInstance,
   onUnmounted,
   inject,
-  Ref,
-} from 'vue';
-import { on, off } from '/@/utils/domUtils';
+  Ref
+} from 'vue'
+import { on, off } from '/@/utils/domUtils'
 
-import { renderThumbStyle, BAR_MAP } from './util';
+import { renderThumbStyle, BAR_MAP } from './util'
 
 export default defineComponent({
   name: 'Bar',
@@ -18,81 +18,81 @@ export default defineComponent({
   props: {
     vertical: Boolean,
     size: String,
-    move: Number,
+    move: Number
   },
 
   setup(props) {
-    const instance = getCurrentInstance();
-    const thumb = ref<any>(null);
-    const wrap = inject('scroll-bar-wrap', {} as Ref<Nullable<HTMLElement>>) as any;
+    const instance = getCurrentInstance()
+    const thumb = ref<any>(null)
+    const wrap = inject('scroll-bar-wrap', {} as Ref<Nullable<HTMLElement>>) as any
     const bar = computed(() => {
-      return BAR_MAP[props.vertical ? 'vertical' : 'horizontal'];
-    });
-    const barStore = ref<Indexable>({});
-    const cursorDown = ref<any>(null);
+      return BAR_MAP[props.vertical ? 'vertical' : 'horizontal']
+    })
+    const barStore = ref<Indexable>({})
+    const cursorDown = ref<any>(null)
     const clickThumbHandler = (e: any) => {
       // prevent click event of right button
       if (e.ctrlKey || e.button === 2) {
-        return;
+        return
       }
-      startDrag(e);
+      startDrag(e)
       barStore.value[bar.value.axis] =
         e.currentTarget[bar.value.offset] -
-        (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
-    };
+        (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction])
+    }
 
     const clickTrackHandler = (e: any) => {
       const offset = Math.abs(
         e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]
-      );
-      const thumbHalf = thumb.value[bar.value.offset] / 2;
+      )
+      const thumbHalf = thumb.value[bar.value.offset] / 2
       const thumbPositionPercentage =
-        ((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset];
+        ((offset - thumbHalf) * 100) / instance?.vnode.el?.[bar.value.offset]
 
       wrap.value[bar.value.scroll] =
-        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
-    };
+        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
+    }
     const startDrag = (e: any) => {
-      e.stopImmediatePropagation();
-      cursorDown.value = true;
-      on(document, 'mousemove', mouseMoveDocumentHandler);
-      on(document, 'mouseup', mouseUpDocumentHandler);
-      document.onselectstart = () => false;
-    };
+      e.stopImmediatePropagation()
+      cursorDown.value = true
+      on(document, 'mousemove', mouseMoveDocumentHandler)
+      on(document, 'mouseup', mouseUpDocumentHandler)
+      document.onselectstart = () => false
+    }
 
     const mouseMoveDocumentHandler = (e: any) => {
-      if (cursorDown.value === false) return;
-      const prevPage = barStore.value[bar.value.axis];
+      if (cursorDown.value === false) return
+      const prevPage = barStore.value[bar.value.axis]
 
-      if (!prevPage) return;
+      if (!prevPage) return
 
       const offset =
         (instance?.vnode.el?.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) *
-        -1;
-      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
+        -1
+      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage
       const thumbPositionPercentage =
-        ((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset];
+        ((offset - thumbClickPosition) * 100) / instance?.vnode.el?.[bar.value.offset]
       wrap.value[bar.value.scroll] =
-        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100;
-    };
+        (thumbPositionPercentage * wrap.value[bar.value.scrollSize]) / 100
+    }
 
     function mouseUpDocumentHandler() {
-      cursorDown.value = false;
-      barStore.value[bar.value.axis] = 0;
-      off(document, 'mousemove', mouseMoveDocumentHandler);
-      document.onselectstart = null;
+      cursorDown.value = false
+      barStore.value[bar.value.axis] = 0
+      off(document, 'mousemove', mouseMoveDocumentHandler)
+      document.onselectstart = null
     }
 
     onUnmounted(() => {
-      off(document, 'mouseup', mouseUpDocumentHandler);
-    });
+      off(document, 'mouseup', mouseUpDocumentHandler)
+    })
 
     return () =>
       h(
         'div',
         {
           class: ['scrollbar__bar', 'is-' + bar.value.key],
-          onMousedown: clickTrackHandler,
+          onMousedown: clickTrackHandler
         },
         h('div', {
           ref: thumb,
@@ -101,9 +101,9 @@ export default defineComponent({
           style: renderThumbStyle({
             size: props.size,
             move: props.move,
-            bar: bar.value,
-          }),
+            bar: bar.value
+          })
         })
-      );
-  },
-});
+      )
+  }
+})

src/components/Scrollbar/src/types.d.ts

@@ -1,18 +1,18 @@
 export interface BarMapItem {
-  offset: string;
-  scroll: string;
-  scrollSize: string;
-  size: string;
-  key: string;
-  axis: string;
-  client: string;
-  direction: string;
+  offset: string
+  scroll: string
+  scrollSize: string
+  size: string
+  key: string
+  axis: string
+  client: string
+  direction: string
 }
 export interface BarMap {
-  vertical: BarMapItem;
-  horizontal: BarMapItem;
+  vertical: BarMapItem
+  horizontal: BarMapItem
 }
 
 export interface ScrollbarType {
-  wrap: ElRef;
+  wrap: ElRef
 }

src/components/Scrollbar/src/util.ts

@@ -1,4 +1,4 @@
-import type { BarMap } from './types';
+import type { BarMap } from './types'
 export const BAR_MAP: BarMap = {
   vertical: {
     offset: 'offsetHeight',
@@ -8,7 +8,7 @@ export const BAR_MAP: BarMap = {
     key: 'vertical',
     axis: 'Y',
     client: 'clientY',
-    direction: 'top',
+    direction: 'top'
   },
   horizontal: {
     offset: 'offsetWidth',
@@ -18,33 +18,33 @@ export const BAR_MAP: BarMap = {
     key: 'horizontal',
     axis: 'X',
     client: 'clientX',
-    direction: 'left',
-  },
-};
+    direction: 'left'
+  }
+}
 
 // @ts-ignore
 export function renderThumbStyle({ move, size, bar }) {
-  const style = {} as any;
-  const translate = `translate${bar.axis}(${move}%)`;
+  const style = {} as any
+  const translate = `translate${bar.axis}(${move}%)`
 
-  style[bar.size] = size;
-  style.transform = translate;
-  style.msTransform = translate;
-  style.webkitTransform = translate;
+  style[bar.size] = size
+  style.transform = translate
+  style.msTransform = translate
+  style.webkitTransform = translate
 
-  return style;
+  return style
 }
 
 function extend<T, K>(to: T, _from: K): T & K {
-  return Object.assign(to, _from);
+  return Object.assign(to, _from)
 }
 
 export function toObject<T>(arr: Array<T>): Recordable<T> {
-  const res = {};
+  const res = {}
   for (let i = 0; i < arr.length; i++) {
     if (arr[i]) {
-      extend(res, arr[i]);
+      extend(res, arr[i])
     }
   }
-  return res;
+  return res
 }

src/components/SimpleMenu/index.ts

@@ -1,2 +1,2 @@
-export { default as SimpleMenu } from './src/SimpleMenu.vue';
-export { default as SimpleMenuTag } from './src/SimpleMenuTag.vue';
+export { default as SimpleMenu } from './src/SimpleMenu.vue'
+export { default as SimpleMenuTag } from './src/SimpleMenuTag.vue'

src/components/SimpleMenu/src/components/SubMenuItem.vue

@@ -43,8 +43,8 @@
           :class="`${prefixCls}-submenu-title-icon`"
         />
       </div>
-      <template #content v-show="opened">
-        <div v-bind="getEvents(true)">
+      <template #content>
+        <div v-bind="getEvents(true)" v-show="opened">
           <ul :class="[prefixCls, `${prefixCls}-${getTheme}`, `${prefixCls}-popup`]">
             <slot></slot>
           </ul>

src/components/SimpleMenu/src/components/menu.less

@@ -155,7 +155,7 @@
     &-vertical &-submenu-title {
       position: relative;
       z-index: 1;
-      padding: 12px 24px;
+      padding: 14px 24px;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;

src/components/SimpleMenu/src/components/types.ts

@@ -1,25 +1,25 @@
-import { Ref } from 'vue';
+import { Ref } from 'vue'
 
 export interface Props {
-  theme: string;
-  activeName?: string | number | undefined;
-  openNames: string[];
-  accordion: boolean;
-  width: string;
-  collapsedWidth: string;
-  indentSize: number;
-  collapse: boolean;
-  activeSubMenuNames: (string | number)[];
+  theme: string
+  activeName?: string | number | undefined
+  openNames: string[]
+  accordion: boolean
+  width: string
+  collapsedWidth: string
+  indentSize: number
+  collapse: boolean
+  activeSubMenuNames: (string | number)[]
 }
 
 export interface SubMenuProvider {
-  addSubMenu: (name: string | number, update?: boolean) => void;
-  removeSubMenu: (name: string | number, update?: boolean) => void;
-  removeAll: () => void;
-  sliceIndex: (index: number) => void;
-  isRemoveAllPopup: Ref<boolean>;
-  getOpenNames: () => (string | number)[];
-  handleMouseleave?: Fn;
-  level: number;
-  props: Props;
+  addSubMenu: (name: string | number, update?: boolean) => void
+  removeSubMenu: (name: string | number, update?: boolean) => void
+  removeAll: () => void
+  sliceIndex: (index: number) => void
+  isRemoveAllPopup: Ref<boolean>
+  getOpenNames: () => (string | number)[]
+  handleMouseleave?: Fn
+  level: number
+  props: Props
 }

src/components/SimpleMenu/src/components/useMenu.ts

@@ -1,78 +1,78 @@
-import { computed, ComponentInternalInstance, unref } from 'vue';
-import type { CSSProperties } from 'vue';
+import { computed, ComponentInternalInstance, unref } from 'vue'
+import type { CSSProperties } from 'vue'
 
 export function useMenuItem(instance: ComponentInternalInstance | null) {
   const getParentMenu = computed(() => {
-    return findParentMenu(['Menu', 'SubMenu']);
-  });
+    return findParentMenu(['Menu', 'SubMenu'])
+  })
 
   const getParentRootMenu = computed(() => {
-    return findParentMenu(['Menu']);
-  });
+    return findParentMenu(['Menu'])
+  })
 
   const getParentSubMenu = computed(() => {
-    return findParentMenu(['SubMenu']);
-  });
+    return findParentMenu(['SubMenu'])
+  })
 
   const getItemStyle = computed(
     (): CSSProperties => {
-      let parent = instance?.parent;
-      if (!parent) return {};
-      const indentSize = (unref(getParentRootMenu)?.props.indentSize as number) ?? 20;
-      let padding = indentSize;
+      let parent = instance?.parent
+      if (!parent) return {}
+      const indentSize = (unref(getParentRootMenu)?.props.indentSize as number) ?? 20
+      let padding = indentSize
 
       if (unref(getParentRootMenu)?.props.collapse) {
-        padding = indentSize;
+        padding = indentSize
       } else {
         while (parent && parent.type.name !== 'Menu') {
           if (parent.type.name === 'SubMenu') {
-            padding += indentSize;
+            padding += indentSize
           }
-          parent = parent.parent;
+          parent = parent.parent
         }
       }
-      return { paddingLeft: padding + 'px' };
+      return { paddingLeft: padding + 'px' }
     }
-  );
+  )
 
   function findParentMenu(name: string[]) {
-    let parent = instance?.parent;
-    if (!parent) return null;
+    let parent = instance?.parent
+    if (!parent) return null
     while (parent && name.indexOf(parent.type.name!) === -1) {
-      parent = parent.parent;
+      parent = parent.parent
     }
-    return parent;
+    return parent
   }
 
   function getParentList() {
-    let parent = instance;
+    let parent = instance
     if (!parent)
       return {
         uidList: [],
-        list: [],
-      };
-    const ret = [];
+        list: []
+      }
+    const ret = []
     while (parent && parent.type.name !== 'Menu') {
       if (parent.type.name === 'SubMenu') {
-        ret.push(parent);
+        ret.push(parent)
       }
-      parent = parent.parent;
+      parent = parent.parent
     }
     return {
-      uidList: ret.map((item) => item.uid),
-      list: ret,
-    };
+      uidList: ret.map(item => item.uid),
+      list: ret
+    }
   }
 
   function getParentInstance(instance: ComponentInternalInstance, name = 'SubMenu') {
-    let parent = instance.parent;
+    let parent = instance.parent
     while (parent) {
       if (parent.type.name !== name) {
-        return parent;
+        return parent
       }
-      parent = parent.parent;
+      parent = parent.parent
     }
-    return parent;
+    return parent
   }
 
   return {
@@ -81,6 +81,6 @@ export function useMenuItem(instance: ComponentInternalInstance | null) {
     getParentRootMenu,
     getParentList,
     getParentSubMenu,
-    getItemStyle,
-  };
+    getItemStyle
+  }
 }

src/components/SimpleMenu/src/components/useSimpleMenuContext.ts

@@ -1,18 +1,18 @@
-import type { InjectionKey, Ref } from 'vue';
-import { createContext, useContext } from '/@/hooks/core/useContext';
-import Mitt from '/@/utils/mitt';
+import type { InjectionKey, Ref } from 'vue'
+import { createContext, useContext } from '/@/hooks/core/useContext'
+import Mitt from '/@/utils/mitt'
 
 export interface SimpleRootMenuContextProps {
-  rootMenuEmitter: Mitt;
-  activeName: Ref<string | number>;
+  rootMenuEmitter: Mitt
+  activeName: Ref<string | number>
 }
 
-const key: InjectionKey<SimpleRootMenuContextProps> = Symbol();
+const key: InjectionKey<SimpleRootMenuContextProps> = Symbol()
 
 export function createSimpleRootMenuContext(context: SimpleRootMenuContextProps) {
-  return createContext<SimpleRootMenuContextProps>(context, key, { readonly: false, native: true });
+  return createContext<SimpleRootMenuContextProps>(context, key, { readonly: false, native: true })
 }
 
 export function useSimpleRootMenuContext() {
-  return useContext<SimpleRootMenuContextProps>(key);
+  return useContext<SimpleRootMenuContextProps>(key)
 }

src/components/SimpleMenu/src/types.ts

@@ -1,5 +1,5 @@
 export interface MenuState {
-  activeName: string;
-  openNames: string[];
-  activeSubMenuNames: string[];
+  activeName: string
+  openNames: string[]
+  activeSubMenuNames: string[]
 }

src/components/SimpleMenu/src/useOpenKeys.ts

@@ -1,13 +1,13 @@
-import type { Menu as MenuType } from '/@/router/types';
-import type { MenuState } from './types';
+import type { Menu as MenuType } from '/@/router/types'
+import type { MenuState } from './types'
 
-import { computed, Ref, toRaw } from 'vue';
+import { computed, Ref, toRaw } from 'vue'
 
-import { unref } from 'vue';
-import { uniq } from 'lodash-es';
-import { getAllParentPath } from '/@/router/helper/menuHelper';
+import { unref } from 'vue'
+import { uniq } from 'lodash-es'
+import { getAllParentPath } from '/@/router/helper/menuHelper'
 
-import { useTimeoutFn } from '/@/hooks/core/useTimeout';
+import { useTimeoutFn } from '/@/hooks/core/useTimeout'
 
 export function useOpenKeys(
   menuState: MenuState,
@@ -21,31 +21,31 @@ export function useOpenKeys(
     // if (mode.value === MenuModeEnum.HORIZONTAL) {
     //   return;
     // }
-    const native = !mixSider.value;
+    const native = !mixSider.value
     useTimeoutFn(
       () => {
-        const menuList = toRaw(menus.value);
+        const menuList = toRaw(menus.value)
         if (menuList?.length === 0) {
-          menuState.activeSubMenuNames = [];
-          menuState.openNames = [];
-          return;
+          menuState.activeSubMenuNames = []
+          menuState.openNames = []
+          return
         }
-        const keys = getAllParentPath(menuList, path);
+        const keys = getAllParentPath(menuList, path)
         if (!unref(accordion)) {
-          menuState.openNames = uniq([...menuState.openNames, ...keys]);
+          menuState.openNames = uniq([...menuState.openNames, ...keys])
         } else {
-          menuState.openNames = keys;
+          menuState.openNames = keys
         }
-        menuState.activeSubMenuNames = menuState.openNames;
+        menuState.activeSubMenuNames = menuState.openNames
       },
       16,
       native
-    );
+    )
   }
 
   const getOpenKeys = computed(() => {
-    return unref(collapse) ? [] : menuState.openNames;
-  });
+    return unref(collapse) ? [] : menuState.openNames
+  })
 
-  return { setOpenKeys, getOpenKeys };
+  return { setOpenKeys, getOpenKeys }
 }

src/components/StrengthMeter/index.ts

@@ -1 +1 @@
-export { default as StrengthMeter } from './src/index.vue';
+export { default as StrengthMeter } from './src/index.vue'

src/components/Table/index.ts

@@ -1,14 +1,14 @@
-export { default as BasicTable } from './src/BasicTable.vue';
-export { default as TableAction } from './src/components/TableAction.vue';
-export { default as EditTableHeaderIcon } from './src/components/EditTableHeaderIcon.vue';
-export { default as TableImg } from './src/components/TableImg.vue';
+export { default as BasicTable } from './src/BasicTable.vue'
+export { default as TableAction } from './src/components/TableAction.vue'
+export { default as EditTableHeaderIcon } from './src/components/EditTableHeaderIcon.vue'
+export { default as TableImg } from './src/components/TableImg.vue'
 
-export * from './src/types/table';
-export * from './src/types/pagination';
-export * from './src/types/tableAction';
+export * from './src/types/table'
+export * from './src/types/pagination'
+export * from './src/types/tableAction'
 
-export { useTable } from './src/hooks/useTable';
+export { useTable } from './src/hooks/useTable'
 
-export type { FormSchema, FormProps } from '/@/components/Form/src/types/form';
+export type { FormSchema, FormProps } from '/@/components/Form/src/types/form'
 
-export type { EditRecordRow } from './src/components/editable';
+export type { EditRecordRow } from './src/components/editable'

src/components/Table/src/BasicTable.vue

@@ -1,15 +1,5 @@
 <template>
-  <div
-    ref="wrapRef"
-    :class="[
-      prefixCls,
-      $attrs.class,
-      {
-        [`${prefixCls}-form-container`]: getBindValues.useSearchForm,
-        [`${prefixCls}--inset`]: getBindValues.inset
-      }
-    ]"
-  >
+  <div ref="wrapRef" :class="getWrapperClass">
     <BasicForm
       submitOnReset
       v-bind="getFormProps"
@@ -32,9 +22,10 @@
       v-show="getEmptyDataIsShowTable"
       @change="handleTableChange"
     >
-      <template #[item]="data" v-for="item in Object.keys($slots)">
+      <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
         <slot :name="item" v-bind="data"></slot>
       </template>
+
       <template #[`header-${column.dataIndex}`] v-for="column in columns" :key="column.dataIndex">
         <HeaderCell :column="column" />
       </template>
@@ -47,8 +38,8 @@
   import { defineComponent, ref, computed, unref } from 'vue'
   import { Table } from 'ant-design-vue'
   import { BasicForm, useForm } from '/@/components/Form/index'
-
-  import { omit } from 'lodash-es'
+  import expandIcon from './components/ExpandIcon'
+  import HeaderCell from './components/HeaderCell.vue'
 
   import { usePagination } from './hooks/usePagination'
   import { useColumns } from './hooks/useColumns'
@@ -59,17 +50,16 @@
   import { useCustomRow } from './hooks/useCustomRow'
   import { useTableStyle } from './hooks/useTableStyle'
   import { useTableHeader } from './hooks/useTableHeader'
+  import { useTableExpand } from './hooks/useTableExpand'
   import { createTableContext } from './hooks/useTableContext'
   import { useTableFooter } from './hooks/useTableFooter'
   import { useTableForm } from './hooks/useTableForm'
   import { useExpose } from '/@/hooks/core/useExpose'
   import { useDesign } from '/@/hooks/web/useDesign'
 
+  import { omit } from 'lodash-es'
   import { basicProps } from './props'
-  import expandIcon from './components/ExpandIcon'
-  import HeaderCell from './components/HeaderCell.vue'
 
-  import './style/index.less'
   export default defineComponent({
     components: {
       Table,
@@ -90,7 +80,8 @@
       'edit-end',
       'edit-cancel',
       'edit-row-end',
-      'edit-change'
+      'edit-change',
+      'expanded-rows-change'
     ],
     setup(props, { attrs, emit, slots }) {
       const tableElRef = ref<ComponentRef>(null)
@@ -175,6 +166,8 @@
 
       const { getRowClassName } = useTableStyle(getProps, prefixCls)
 
+      const { getExpandOption, expandAll, collapseAll } = useTableExpand(getProps, tableData, emit)
+
       const { getHeaderProps } = useTableHeader(getProps, slots)
 
       const { getFooterProps } = useTableFooter(
@@ -207,7 +200,8 @@
           columns: unref(getViewColumns),
           pagination: unref(getPaginationInfo),
           dataSource: unref(getDataSourceRef),
-          footer: unref(getFooterProps)
+          footer: unref(getFooterProps),
+          ...unref(getExpandOption)
         }
         if (slots.expandedRowRender) {
           propsData = omit(propsData, 'scroll')
@@ -218,6 +212,18 @@
         return propsData
       })
 
+      const getWrapperClass = computed(() => {
+        const values = unref(getBindValues)
+        return [
+          prefixCls,
+          attrs.class,
+          {
+            [`${prefixCls}-form-container`]: values.useSearchForm,
+            [`${prefixCls}--inset`]: values.inset
+          }
+        ]
+      })
+
       const getEmptyDataIsShowTable = computed(() => {
         const { emptyDataIsShowTable, useSearchForm } = unref(getProps)
         if (emptyDataIsShowTable || !useSearchForm) {
@@ -253,6 +259,8 @@
         setShowPagination,
         getShowPagination,
         setCacheColumnsByField,
+        expandAll,
+        collapseAll,
         getSize: () => {
           return unref(getBindValues).size as SizeType
         }
@@ -278,9 +286,100 @@
         getFormProps,
         replaceFormSlotKey,
         getFormSlotKeys,
-        prefixCls,
+        getWrapperClass,
         columns: getViewColumns
       }
     }
   })
 </script>
+<style lang="less">
+  @border-color: #cecece4d;
+
+  @prefix-cls: ~'@{namespace}-basic-table';
+
+  .@{prefix-cls} {
+    &-form-container {
+      padding: 16px;
+
+      .ant-form {
+        padding: 12px 10px 6px 10px;
+        margin-bottom: 16px;
+        background: #fff;
+        border-radius: 4px;
+      }
+    }
+
+    &-row__striped {
+      td {
+        background: #fafafa;
+      }
+    }
+
+    &--inset {
+      .ant-table-wrapper {
+        padding: 0;
+      }
+    }
+
+    .ant-tag {
+      margin-right: 0;
+    }
+
+    .ant-table-wrapper {
+      padding: 6px;
+      background: #fff;
+      border-radius: 2px;
+
+      .ant-table-title {
+        padding: 0 0 8px 0 !important;
+      }
+
+      .ant-table.ant-table-bordered .ant-table-title {
+        border: none !important;
+      }
+    }
+
+    //
+    .ant-table {
+      width: 100%;
+      overflow-x: hidden;
+
+      &-title {
+        display: flex;
+        padding: 8px 6px;
+        border-bottom: none;
+        justify-content: space-between;
+        align-items: center;
+      }
+
+      .ant-table-tbody > tr.ant-table-row-selected td {
+        background: fade(@primary-color, 8%) !important;
+      }
+    }
+
+    .ant-pagination {
+      margin: 10px 0 0 0;
+    }
+
+    .ant-table-footer {
+      padding: 0;
+
+      .ant-table-wrapper {
+        padding: 0;
+      }
+
+      table {
+        border: none !important;
+      }
+
+      .ant-table-body {
+        overflow-x: hidden !important;
+        overflow-y: scroll !important;
+      }
+
+      td {
+        padding: 12px 8px;
+      }
+    }
+  }
+</style>