Explorar o código

refactor: prettier初始化

lanjianrong %!s(int64=4) %!d(string=hai) anos
pai
achega
5998ab15da
Modificáronse 100 ficheiros con 3291 adicións e 5508 borrados
  1. 2 2
      .env
  2. 2 2
      .env.development
  3. 22 14
      .eslintrc.js
  4. 0 828
      CHANGELOG.en_US.md
  5. 0 508
      CHANGELOG.md
  6. 0 887
      CHANGELOG.zh_CN.md
  7. 5 1
      package.json
  8. 5 5
      prettier.config.js
  9. 12 12
      src/App.vue
  10. 25 25
      src/components/Application/src/AppLocalePicker.vue
  11. 19 19
      src/components/Application/src/AppLogo.vue
  12. 32 32
      src/components/Application/src/AppProvider.vue
  13. 16 16
      src/components/Application/src/search/AppSearch.vue
  14. 10 10
      src/components/Application/src/search/AppSearchFooter.vue
  15. 6 6
      src/components/Application/src/search/AppSearchKeyItem.vue
  16. 35 35
      src/components/Application/src/search/AppSearchModal.vue
  17. 15 15
      src/components/Authority/src/index.vue
  18. 15 15
      src/components/Basic/src/BasicArrow.vue
  19. 32 32
      src/components/Basic/src/BasicHelp.vue
  20. 11 11
      src/components/Basic/src/BasicTitle.vue
  21. 14 14
      src/components/Button/src/BasicButton.vue
  22. 22 22
      src/components/Button/src/PopConfirmButton.vue
  23. 10 10
      src/components/ClickOutSide/src/index.vue
  24. 44 44
      src/components/Container/src/LazyContainer.vue
  25. 28 28
      src/components/Container/src/ScrollContainer.vue
  26. 23 23
      src/components/Container/src/collapse/CollapseContainer.vue
  27. 6 6
      src/components/Container/src/collapse/CollapseHeader.vue
  28. 50 50
      src/components/ContextMenu/src/index.tsx
  29. 22 22
      src/components/CountDown/src/CountButton.vue
  30. 13 13
      src/components/CountDown/src/CountdownInput.vue
  31. 66 66
      src/components/CountTo/src/index.vue
  32. 65 65
      src/components/Description/src/index.vue
  33. 68 68
      src/components/Drawer/src/BasicDrawer.vue
  34. 16 16
      src/components/Drawer/src/components/DrawerFooter.vue
  35. 11 11
      src/components/Drawer/src/components/DrawerHeader.vue
  36. 20 20
      src/components/Dropdown/src/Dropdown.vue
  37. 27 27
      src/components/Excel/src/ExportExcelModel.vue
  38. 48 48
      src/components/Excel/src/ImportExcel.vue
  39. 83 83
      src/components/Form/src/BasicForm.vue
  40. 42 42
      src/components/Form/src/components/ApiSelect.vue
  41. 34 36
      src/components/Form/src/components/FormAction.vue
  42. 129 129
      src/components/Form/src/components/FormItem.vue
  43. 22 22
      src/components/Form/src/components/RadioButtonGroup.vue
  44. 50 50
      src/components/Icon/src/IconPicker.vue
  45. 18 18
      src/components/Icon/src/SvgIcon.vue
  46. 40 40
      src/components/Icon/src/index.vue
  47. 20 20
      src/components/Loading/src/index.vue
  48. 52 52
      src/components/Markdown/src/index.vue
  49. 66 66
      src/components/Menu/src/BasicMenu.vue
  50. 10 10
      src/components/Menu/src/components/BasicMenuItem.vue
  51. 15 15
      src/components/Menu/src/components/BasicSubMenuItem.vue
  52. 14 14
      src/components/Menu/src/components/MenuItemContent.vue
  53. 69 69
      src/components/Modal/src/BasicModal.vue
  54. 15 15
      src/components/Modal/src/components/Modal.tsx
  55. 18 18
      src/components/Modal/src/components/ModalClose.vue
  56. 7 7
      src/components/Modal/src/components/ModalFooter.vue
  57. 8 8
      src/components/Modal/src/components/ModalHeader.vue
  58. 62 62
      src/components/Modal/src/components/ModalWrapper.vue
  59. 8 8
      src/components/Page/src/PageFooter.vue
  60. 62 62
      src/components/Page/src/PageWrapper.vue
  61. 33 33
      src/components/Preview/src/index.vue
  62. 37 37
      src/components/Qrcode/src/index.vue
  63. 48 48
      src/components/Scrollbar/src/index.vue
  64. 53 53
      src/components/SimpleMenu/src/SimpleMenu.vue
  65. 34 34
      src/components/SimpleMenu/src/SimpleMenuTag.vue
  66. 29 29
      src/components/SimpleMenu/src/SimpleSubMenu.vue
  67. 56 56
      src/components/SimpleMenu/src/components/Menu.vue
  68. 40 40
      src/components/SimpleMenu/src/components/MenuCollapseTransition.vue
  69. 39 39
      src/components/SimpleMenu/src/components/MenuItem.vue
  70. 107 109
      src/components/SimpleMenu/src/components/SubMenuItem.vue
  71. 25 25
      src/components/StrengthMeter/src/index.vue
  72. 74 74
      src/components/Table/src/BasicTable.vue
  73. 6 6
      src/components/Table/src/components/EditTableHeaderIcon.vue
  74. 6 6
      src/components/Table/src/components/ExpandIcon.tsx
  75. 19 19
      src/components/Table/src/components/HeaderCell.vue
  76. 35 35
      src/components/Table/src/components/TableAction.vue
  77. 43 43
      src/components/Table/src/components/TableFooter.vue
  78. 17 17
      src/components/Table/src/components/TableHeader.vue
  79. 14 14
      src/components/Table/src/components/TableImg.vue
  80. 18 18
      src/components/Table/src/components/TableTitle.vue
  81. 133 133
      src/components/Table/src/components/editable/EditableCell.vue
  82. 123 123
      src/components/Table/src/components/settings/ColumnSetting.vue
  83. 15 15
      src/components/Table/src/components/settings/FullScreenSetting.vue
  84. 13 13
      src/components/Table/src/components/settings/RedoSetting.vue
  85. 18 18
      src/components/Table/src/components/settings/SizeSetting.vue
  86. 17 17
      src/components/Table/src/components/settings/index.vue
  87. 29 29
      src/components/Table/src/hooks/usePagination.tsx
  88. 45 45
      src/components/Time/src/index.vue
  89. 88 88
      src/components/Tinymce/src/Editor.vue
  90. 23 23
      src/components/Tinymce/src/ImgUpload.vue
  91. 6 6
      src/components/Transition/src/CollapseTransition.tsx
  92. 21 21
      src/components/Transition/src/CreateTransition.tsx
  93. 41 41
      src/components/Transition/src/ExpandTransition.vue
  94. 41 41
      src/components/Tree/src/TreeHeader.vue
  95. 121 121
      src/components/Tree/src/index.vue
  96. 30 30
      src/components/Upload/src/BasicUpload.vue
  97. 28 28
      src/components/Upload/src/FileList.tsx
  98. 6 6
      src/components/Upload/src/ThumbUrl.vue
  99. 99 101
      src/components/Upload/src/UploadModal.vue
  100. 0 0
      src/components/Upload/src/UploadPreviewModal.vue

+ 2 - 2
.env

@@ -2,7 +2,7 @@
 VITE_PORT = 3200
 
 # spa-title
-VITE_GLOB_APP_TITLE = Vben Admin
+VITE_GLOB_APP_TITLE = 设计数量表管理平台
 
 # spa shortname
-VITE_GLOB_APP_SHORT_NAME = vue_vben_admin_thin
+VITE_GLOB_APP_SHORT_NAME = design_quality_console

+ 2 - 2
.env.development

@@ -8,14 +8,14 @@ VITE_PUBLIC_PATH = /
 
 # Cross-domain proxy, you can configure multiple
 # Please note that no line breaks
-VITE_PROXY = [["/basic-api","http://localhost:3000"],["/upload","http://localhost:3001/upload"]]
+VITE_PROXY = [["/api","http://localhost:7070"],["/upload","http://localhost:3001/upload"]]
 # VITE_PROXY=[["/api","https://vvbin.cn/test"]]
 
 # Delete console
 VITE_DROP_CONSOLE = false
 
 # Basic interface address SPA
-VITE_GLOB_API_URL=/basic-api
+VITE_GLOB_API_URL=/api
 
 # File upload address, optional
 VITE_GLOB_UPLOAD_URL=/upload

+ 22 - 14
.eslintrc.js

@@ -3,7 +3,7 @@ module.exports = {
   env: {
     browser: true,
     node: true,
-    es6: true,
+    es6: true
   },
   parser: 'vue-eslint-parser',
   parserOptions: {
@@ -13,16 +13,24 @@ module.exports = {
     jsxPragma: 'React',
     ecmaFeatures: {
       jsx: true,
-      tsx: true,
-    },
+      tsx: true
+    }
   },
   extends: [
     'plugin:vue/vue3-recommended',
     'plugin:@typescript-eslint/recommended',
     'prettier',
-    'plugin:prettier/recommended',
+    'plugin:prettier/recommended'
   ],
   rules: {
+    'prettier/prettier': [
+      'error',
+      {
+        semi: false,
+        trailingComma: 'none',
+        arrowParens: 'avoid'
+      }
+    ],
     '@typescript-eslint/ban-ts-ignore': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
     '@typescript-eslint/no-explicit-any': 'off',
@@ -39,15 +47,15 @@ module.exports = {
       'error',
       {
         argsIgnorePattern: '^_',
-        varsIgnorePattern: '^_',
-      },
+        varsIgnorePattern: '^_'
+      }
     ],
     'no-unused-vars': [
       'error',
       {
         argsIgnorePattern: '^_',
-        varsIgnorePattern: '^_',
-      },
+        varsIgnorePattern: '^_'
+      }
     ],
     'space-before-function-paren': 'off',
 
@@ -66,11 +74,11 @@ module.exports = {
         html: {
           void: 'always',
           normal: 'never',
-          component: 'always',
+          component: 'always'
         },
         svg: 'always',
-        math: 'always',
-      },
-    ],
-  },
-};
+        math: 'always'
+      }
+    ]
+  }
+}

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 0 - 828
CHANGELOG.en_US.md


+ 0 - 508
CHANGELOG.md

@@ -1,508 +0,0 @@
-# [2.1.0](https://github.com/anncwb/vue-vben-admin/compare/v2.0.3...v2.1.0) (2021-03-15)
-
-### Bug Fixes
-
-- **button:** fix button style error close [#312](https://github.com/anncwb/vue-vben-admin/issues/312) ([7a6c87f](https://github.com/anncwb/vue-vben-admin/commit/7a6c87f8c1aa34a7a00506fb89fb231e3a176f6f))
-- **menu:** fix hideMenu not working close [#338](https://github.com/anncwb/vue-vben-admin/issues/338) ([5b2fbfb](https://github.com/anncwb/vue-vben-admin/commit/5b2fbfb6ce4054ece60c851c45baf60f3a07a4db))
-- **page-wraper:** fix PageWrapper the scroll bar on the right side of the content area when the user clicks on the tab page to reload the page ([#341](https://github.com/anncwb/vue-vben-admin/issues/341)) ([fcff2cb](https://github.com/anncwb/vue-vben-admin/commit/fcff2cb1911f1e18017f25b3509d1c67f7e86e81))
-- **page-wrapper:** fix PageWrapper title not showing ([9e3adaa](https://github.com/anncwb/vue-vben-admin/commit/9e3adaa30c7cdaf23855922100e16717856ba1d9))
-- **table:** ensure that editable cell values are echoed correctly close [#335](https://github.com/anncwb/vue-vben-admin/issues/335) ([fab7a6c](https://github.com/anncwb/vue-vben-admin/commit/fab7a6c58d586300d58e1b6837927e1569b57aa5))
-- **table:** ensure that the height calculation is normal close [#349](https://github.com/anncwb/vue-vben-admin/issues/349) ([6095cb5](https://github.com/anncwb/vue-vben-admin/commit/6095cb54afe3f4fcabbfff26ac6704ecfbbddae5))
-- **table:** ensure that the table height is correct when the data is empty ([53867a8](https://github.com/anncwb/vue-vben-admin/commit/53867a846154d9a3529f50d20d92ce5fdb41986f))
-- **table:** ensure that the value of the table action is updated correctly close [#301](https://github.com/anncwb/vue-vben-admin/issues/301) [#313](https://github.com/anncwb/vue-vben-admin/issues/313) ([7156e47](https://github.com/anncwb/vue-vben-admin/commit/7156e47c1813ec01594d9dff4a1e7d593f3c17db))
-- **table:** fix table height calculation problem ([0fe42a0](https://github.com/anncwb/vue-vben-admin/commit/0fe42a06c1f2ef69805dbfeecbcac919ff0aedd0)), closes [#348](https://github.com/anncwb/vue-vben-admin/issues/348)
-- **table:** fix table row misalignment close [#353](https://github.com/anncwb/vue-vben-admin/issues/353) ([e15737b](https://github.com/anncwb/vue-vben-admin/commit/e15737b9d17d8ebea4f4e9897aeae9b250910a15))
-- **table:** fix TableAction row height error close [#350](https://github.com/anncwb/vue-vben-admin/issues/350) ([a759e44](https://github.com/anncwb/vue-vben-admin/commit/a759e44c6e5c223d2fef52c5a9698e571eed2d52))
-- **transition:** fix transition not work close [#334](https://github.com/anncwb/vue-vben-admin/issues/334) ([7d8b8db](https://github.com/anncwb/vue-vben-admin/commit/7d8b8db256f78b228b2b4629a472834a4cce9bd4))
-- **tree:** ebsure the expansion is functioning properly close [#362](https://github.com/anncwb/vue-vben-admin/issues/362) ([a405de8](https://github.com/anncwb/vue-vben-admin/commit/a405de8d202710264e802edb270bbd5cd4a1ab80))
-- **tree:** tree can customize title close [#344](https://github.com/anncwb/vue-vben-admin/issues/344) ([ed422b7](https://github.com/anncwb/vue-vben-admin/commit/ed422b7c56bf9d44be001b8a54358d69c100ff35))
-- **useTableScroll:** query paginationel every time to get the correct height ([#355](https://github.com/anncwb/vue-vben-admin/issues/355)) ([f818bb9](https://github.com/anncwb/vue-vben-admin/commit/f818bb9a107e43adfb8ef2a095635f5fffb5800b))
-
-### Features
-
-- **icon:** added svg icon picker ([1418dc6](https://github.com/anncwb/vue-vben-admin/commit/1418dc6a597a8410711359f07ae66f0fea858977))
-- **map:** added AMap/Baidu/Google Map example close [#81](https://github.com/anncwb/vue-vben-admin/issues/81) ([a9462f0](https://github.com/anncwb/vue-vben-admin/commit/a9462f0d4dacb8db9300c416b2d3f094be624220))
-- **time:** added time compoennt close [#285](https://github.com/anncwb/vue-vben-admin/issues/285) ([a89eeef](https://github.com/anncwb/vue-vben-admin/commit/a89eeef6f3a0b9863d28cf516b126a938eed7361))
-
-### Performance Improvements
-
-- **icon:** icon and SvgIcon integration ([e8fe6a9](https://github.com/anncwb/vue-vben-admin/commit/e8fe6a929be025a889ddec624ff9c2729313c818))
-
-## [2.0.3](https://github.com/anncwb/vue-vben-admin/compare/v2.0.2...v2.0.3) (2021-03-07)
-
-### Bug Fixes
-
-- **breadcrumb:** ensure that the single-level breadcrumbs jump correctly close [#321](https://github.com/anncwb/vue-vben-admin/issues/321) ([e0dc5cf](https://github.com/anncwb/vue-vben-admin/commit/e0dc5cf2f299fd4c1efdf4f00b9f0f72f07d5937))
-- **description:** ensure that props respond ([ce93e46](https://github.com/anncwb/vue-vben-admin/commit/ce93e46faf1d7250dd3acd3fd97ccd6382b2f822))
-- **form:** allow the setFieldsValue method to be null or undefined close [#320](https://github.com/anncwb/vue-vben-admin/issues/320) ([8f76ef4](https://github.com/anncwb/vue-vben-admin/commit/8f76ef4e70de58ba5c4497d8b10a036a54a9ac87))
-- **form:** ensure that the Form component does not verify hidden form items ([43a45b7](https://github.com/anncwb/vue-vben-admin/commit/43a45b7c996c84f19d00cb9754277b943daf9a10))
-- **form:** fix the problem of form props monitoring close [#322](https://github.com/anncwb/vue-vben-admin/issues/322) ([83a3460](https://github.com/anncwb/vue-vben-admin/commit/83a34603562e6358203b834b8feb59b0b44dbbcd))
-- **menu:** fix menu icon missing close [#328](https://github.com/anncwb/vue-vben-admin/issues/328) ([d5d4c4b](https://github.com/anncwb/vue-vben-admin/commit/d5d4c4b4136158e061e4a3b6b306af6d4e8cd621))
-- **table:** fix pagination error ([745fcfc](https://github.com/anncwb/vue-vben-admin/commit/745fcfc014e3e9e13d6a415a8f094cfef68be908))
-- **tree:** fix the logic problem of show attribute of ActionItem under BasicTree ([80b47c8](https://github.com/anncwb/vue-vben-admin/commit/80b47c84cd490388c6db659921f1103c443d7b9d))
-
-### Features
-
-- add SvgIcon component ([9c2a2a0](https://github.com/anncwb/vue-vben-admin/commit/9c2a2a0c00dae6f334c99acc9ab2f571fd8905c0))
-- **tree:** add clickRowToExpand option close [#318](https://github.com/anncwb/vue-vben-admin/issues/318) ([e696089](https://github.com/anncwb/vue-vben-admin/commit/e696089660131786ea24632ed75adc57b6ea58f4))
-
-### Performance Improvements
-
-- optimize local loading speed close [#329](https://github.com/anncwb/vue-vben-admin/issues/329) ([491f1fc](https://github.com/anncwb/vue-vben-admin/commit/491f1fcfff17f2297e3fee00e1542778aed08e56))
-- **login:** enter to log in ([b93f20f](https://github.com/anncwb/vue-vben-admin/commit/b93f20f0df91689191b8414657171e9f17ba5d68))
-- **table:** the table fills the height according to the screen close [#310](https://github.com/anncwb/vue-vben-admin/issues/310) ([551fe50](https://github.com/anncwb/vue-vben-admin/commit/551fe50a44d0b6358cf3861f772ca223ea56f0e2))
-
-## [2.0.2](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0...v2.0.2) (2021-03-03)
-
-### Bug Fixes
-
-- change transition-duration to make animate smoothly ([#294](https://github.com/anncwb/vue-vben-admin/issues/294)) ([5eac9b2](https://github.com/anncwb/vue-vben-admin/commit/5eac9b23d6d8ad91e110169519bfd3ab50f985a9))
-- ensure that storage is deleted correctly close [#292](https://github.com/anncwb/vue-vben-admin/issues/292) ([ec7bef7](https://github.com/anncwb/vue-vben-admin/commit/ec7bef792b2a780736c2b1713af3638fa0b69eed))
-- ensure that the correct components are dynamically imported ([b476e1c](https://github.com/anncwb/vue-vben-admin/commit/b476e1c84c52dab7030fd19b34ecd33e65fadcb2))
-- ensure to request the interface correctly ([11d3f39](https://github.com/anncwb/vue-vben-admin/commit/11d3f395caf7e2268630090eb34f4e5c114a96b7))
-- expose tree information in the event close [#315](https://github.com/anncwb/vue-vben-admin/issues/315) ([b6bb816](https://github.com/anncwb/vue-vben-admin/commit/b6bb81630de728c146bf0e559bef88b69d4b8a21))
-- fix login page style ([7b4fcd2](https://github.com/anncwb/vue-vben-admin/commit/7b4fcd2ecac8107f7d052dee08cb8007dc5e5dd9))
-- improve persistent cache logic ([15567e4](https://github.com/anncwb/vue-vben-admin/commit/15567e478c0f274b0f8f0a7410ea5cb636bacc3d))
-- **dashboard:** fix workbench page style ([#280](https://github.com/anncwb/vue-vben-admin/issues/280)) ([7d9b521](https://github.com/anncwb/vue-vben-admin/commit/7d9b521c693b59da5fa28130b5753afa0914e598))
-- **image:** fix preview style close [#276](https://github.com/anncwb/vue-vben-admin/issues/276) ([f675fff](https://github.com/anncwb/vue-vben-admin/commit/f675fff2e66054b4157b2a330dbf151822b0befd))
-- **login:** fix login style close [#306](https://github.com/anncwb/vue-vben-admin/issues/306) ([a84586e](https://github.com/anncwb/vue-vben-admin/commit/a84586e2f49a2966ac5cb02d945e62e107b247d1))
-- **modal:** ensure that the height is correct in the modal full screen state close [#308](https://github.com/anncwb/vue-vben-admin/issues/308) ([37508ca](https://github.com/anncwb/vue-vben-admin/commit/37508ca4113701458cae84fff64062427ba43898))
-- **style:** fix anticon style ([e250ad5](https://github.com/anncwb/vue-vben-admin/commit/e250ad567f3169d4ef7baec8954be2e18c6932e6))
-- **table:** ensure the table setting button dividing line is hidden ([7c2f851](https://github.com/anncwb/vue-vben-admin/commit/7c2f85169248b369f95c5866ef7e90d4fb1739ef))
-- **table:** fix known errors in editable tables close [#267](https://github.com/anncwb/vue-vben-admin/issues/267) ([4f8e1c1](https://github.com/anncwb/vue-vben-admin/commit/4f8e1c1b5ffc78242b300e85be22b1fa07c7d902))
-- **table:** get the selected rows of the table correctly ([6013689](https://github.com/anncwb/vue-vben-admin/commit/601368921f075aa1870d1c3ce8f4a8330260206a))
-- **watermark:** watermark causes a blank bar ([#297](https://github.com/anncwb/vue-vben-admin/issues/297)) ([66fc1b7](https://github.com/anncwb/vue-vben-admin/commit/66fc1b78450fa7846b0d58e6da5f2135e6456238))
-
-### Features
-
-- added system management sample page ([4628d94](https://github.com/anncwb/vue-vben-admin/commit/4628d94415c1787da8b04499e295967f15c4eef5))
-- **icon-picker:** add icon-picker component ([b6cea4a](https://github.com/anncwb/vue-vben-admin/commit/b6cea4a950e92a0f91e06bcc60b4653e1d2709ef))
-- **moda;:** can switch full screen by double-clicking on the head close [#277](https://github.com/anncwb/vue-vben-admin/issues/277) ([e3851dc](https://github.com/anncwb/vue-vben-admin/commit/e3851dc5ea290ef6eb4d12ce2469311b1bee53cd))
-- **tree:** actionItem added show attribute close [#314](https://github.com/anncwb/vue-vben-admin/issues/314) ([8b62fa0](https://github.com/anncwb/vue-vben-admin/commit/8b62fa0cb0559ec3ea8a1b82a2d44165b2337522))
-- **tree:** add renderIcon props close [#309](https://github.com/anncwb/vue-vben-admin/issues/309) ([72b42d7](https://github.com/anncwb/vue-vben-admin/commit/72b42d7b3539919a9baa4f1a7316842f85991c1e))
-- **ws:** added WebSocket examples and service scripts ([c625462](https://github.com/anncwb/vue-vben-admin/commit/c625462e98eec006aaeeef14280775cafeb72364))
-- add dept management page ([3b8ca42](https://github.com/anncwb/vue-vben-admin/commit/3b8ca420c763fe0e386a8dbc023f4f8eb8742252))
-- added settingButtonPosition configuration close [#275](https://github.com/anncwb/vue-vben-admin/issues/275) ([da04913](https://github.com/anncwb/vue-vben-admin/commit/da04913ef324fff122732b445c1b1d1d662b87a3))
-- axios supports form-data format requests ([c41fa75](https://github.com/anncwb/vue-vben-admin/commit/c41fa75265beb00f629dcda808957cb58b905bc2))
-
-### Performance Improvements
-
-- **tree:** strengthen BasicTree function ([cd8e924](https://github.com/anncwb/vue-vben-admin/commit/cd8e924d4641fc46cacd4a934478d8861e8c3c04))
-- hide table full screen button by default ([500900a](https://github.com/anncwb/vue-vben-admin/commit/500900abe16d3e27e1c9e0446a13386c6129d449))
-- imporve axios logic ([a821d9a](https://github.com/anncwb/vue-vben-admin/commit/a821d9a3a279f0e6a5b7dbb316725d603ce30f74))
-- improve login logic ([a09a0ee](https://github.com/anncwb/vue-vben-admin/commit/a09a0eedd29fdc9a9bd5414bd12c08e37c72982a))
-- improve persistent logic ([f57eb94](https://github.com/anncwb/vue-vben-admin/commit/f57eb944edfd967f5f45566ec5bedbf12f147492))
-- move src/types to root ([fcee7d4](https://github.com/anncwb/vue-vben-admin/commit/fcee7d4eb71471dd40567c8d7c97302eeee80697))
-- remove useless code ([be3a3ed](https://github.com/anncwb/vue-vben-admin/commit/be3a3ed699f73d352d49623ef07288093a3332c4))
-- replace crypto-es with crypto-js ([bba7768](https://github.com/anncwb/vue-vben-admin/commit/bba7768759c5d4dedd6599417154c4cb8ab64920))
-
-## [2.0.1](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0...v2.0.1) (2021-02-21)
-
-### Bug Fixes
-
-- **dashboard:** fix workbench page style ([#280](https://github.com/anncwb/vue-vben-admin/issues/280)) ([7d9b521](https://github.com/anncwb/vue-vben-admin/commit/7d9b521c693b59da5fa28130b5753afa0914e598))
-- **image:** fix preview style close [#276](https://github.com/anncwb/vue-vben-admin/issues/276) ([f675fff](https://github.com/anncwb/vue-vben-admin/commit/f675fff2e66054b4157b2a330dbf151822b0befd))
-- **style:** fix anticon style ([e250ad5](https://github.com/anncwb/vue-vben-admin/commit/e250ad567f3169d4ef7baec8954be2e18c6932e6))
-- **table:** fix known errors in editable tables close [#267](https://github.com/anncwb/vue-vben-admin/issues/267) ([4f8e1c1](https://github.com/anncwb/vue-vben-admin/commit/4f8e1c1b5ffc78242b300e85be22b1fa07c7d902))
-
-### Features
-
-- **moda;:** can switch full screen by double-clicking on the head close [#277](https://github.com/anncwb/vue-vben-admin/issues/277) ([e3851dc](https://github.com/anncwb/vue-vben-admin/commit/e3851dc5ea290ef6eb4d12ce2469311b1bee53cd))
-- added settingButtonPosition configuration close [#275](https://github.com/anncwb/vue-vben-admin/issues/275) ([da04913](https://github.com/anncwb/vue-vben-admin/commit/da04913ef324fff122732b445c1b1d1d662b87a3))
-
-# [2.0.0](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0-rc.18...v2.0.0) (2021-02-17)
-
-### Bug Fixes
-
-- **i18n:** fix useMessage i18n type [#262](https://github.com/anncwb/vue-vben-admin/issues/262) ([d753155](https://github.com/anncwb/vue-vben-admin/commit/d7531554a274ad9d793ea621739dfffdc7f73db8))
-- **table:** fix the table in the editable row status and press Enter to confirm [#258](https://github.com/anncwb/vue-vben-admin/issues/258) ([64533f6](https://github.com/anncwb/vue-vben-admin/commit/64533f6204f96f79c6006d9911e9417cd9800d0d))
-- correct debugger code ([759e532](https://github.com/anncwb/vue-vben-admin/commit/759e5320790504f0d274289001543c1397e8b617))
-- some color error ([33b2365](https://github.com/anncwb/vue-vben-admin/commit/33b2365f6e645edf2a6c1cf38596aaec52b35df6))
-- **description:** not rendering while show method return false ([#253](https://github.com/anncwb/vue-vben-admin/issues/253)) ([23eba27](https://github.com/anncwb/vue-vben-admin/commit/23eba274560a294f50e4b7c529ae8a63a266fb87)), closes [#252](https://github.com/anncwb/vue-vben-admin/issues/252)
-- fix collapse header title not rendering ([#256](https://github.com/anncwb/vue-vben-admin/issues/256)) ([c81d48e](https://github.com/anncwb/vue-vben-admin/commit/c81d48e734b09217fa42df2358e616a970006eab))
-- **pop-confirm-button:** fix responsive failure [#246](https://github.com/anncwb/vue-vben-admin/issues/246) ([c57dea0](https://github.com/anncwb/vue-vben-admin/commit/c57dea0438fc5ba0fbf1716b9e76e2fba1f33f84))
-- fix the problem of mock error under post [#247](https://github.com/anncwb/vue-vben-admin/issues/247) ([9b6f37c](https://github.com/anncwb/vue-vben-admin/commit/9b6f37caef75f8752ea8bd07a78377dcaa59922b))
-- suppoer build sourcemap ([3ba8285](https://github.com/anncwb/vue-vben-admin/commit/3ba828558646a7fa233ebbbda27f71c3121dd7c7))
-- **type:** fix .vue file type error ([22088e8](https://github.com/anncwb/vue-vben-admin/commit/22088e820c79a9832179c8fb7c5cffe30b9b57e9))
-- **upload:** fix maxNumber not work [#240](https://github.com/anncwb/vue-vben-admin/issues/240) ([91e004e](https://github.com/anncwb/vue-vben-admin/commit/91e004e21148c38e572cfbb6b75f0a6f353c15b6))
-
-### Features
-
-- added brotli|gzip compression and related test commands ([993538d](https://github.com/anncwb/vue-vben-admin/commit/993538de21dbb9e54e308afb40ff096ba0ab0e19))
-- support echarts 5.0 ([370b12f](https://github.com/anncwb/vue-vben-admin/commit/370b12f5154f4a531c3a27c3ccc2601845872344))
-- **modal:** exporse redoModalHeight ([a3a903b](https://github.com/anncwb/vue-vben-admin/commit/a3a903bc86e7248424f94f734d21c86c5327ed20))
-
-### Performance Improvements
-
-- adjust the return value of the interface to obtain user information in array format [#259](https://github.com/anncwb/vue-vben-admin/issues/259) ([5894093](https://github.com/anncwb/vue-vben-admin/commit/589409305f58ebc2f6b110bd7b31f924ecd06c16))
-- remove unless code ([2365754](https://github.com/anncwb/vue-vben-admin/commit/23657547ab28fa65c2369ded8e73929dee76c750))
-- update style ([aaae668](https://github.com/anncwb/vue-vben-admin/commit/aaae66835a9f1bdfa316e187c01557e5b54959ab))
-
-# [2.0.0-rc.18](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0-rc.17...v2.0.0-rc.18) (2021-02-04)
-
-### Bug Fixes
-
-- **build:** fix rollup compact not work ([783e658](https://github.com/anncwb/vue-vben-admin/commit/783e65813d41ad9a3030412edede6f25f8f8cb49))
-- **descriotion:** fix type [#228](https://github.com/anncwb/vue-vben-admin/issues/228) ([4909a4c](https://github.com/anncwb/vue-vben-admin/commit/4909a4cb25ee62661e38cac38a8c3a388fdabbdf))
-- **form:** format destructuring assignment error ([#238](https://github.com/anncwb/vue-vben-admin/issues/238)) ([612995a](https://github.com/anncwb/vue-vben-admin/commit/612995a5326ef183d9f454059da6a2914ce5dd2f))
-- **menu:** fix the menu outside link does not jump ([55d4b77](https://github.com/anncwb/vue-vben-admin/commit/55d4b77b04d7a87b416a37019fbf047df1eeec41))
-- **menu:** top submenu disappeared problem [#214](https://github.com/anncwb/vue-vben-admin/issues/214) ([0ec1a62](https://github.com/anncwb/vue-vben-admin/commit/0ec1a62e596c363f3f017d6ac3b374a1b5caa7c5))
-- **modal:** fullscreen height calculation error [#203](https://github.com/anncwb/vue-vben-admin/issues/203) ([b45f8c5](https://github.com/anncwb/vue-vben-admin/commit/b45f8c5021a4225026ed698c083a1af42a08faff))
-- **moment:** fix moment error [#217](https://github.com/anncwb/vue-vben-admin/issues/217) ([61cf0f7](https://github.com/anncwb/vue-vben-admin/commit/61cf0f791e8ee05676fe7fa382b6a2c2b1bea92d))
-- **ripple:** fix ripple style [#211](https://github.com/anncwb/vue-vben-admin/issues/211) ([2201629](https://github.com/anncwb/vue-vben-admin/commit/22016291e4df206dbca351d00ae033c952276ebe))
-- **table:** fix the table: cancel editing and not restore the initial value [#235](https://github.com/anncwb/vue-vben-admin/issues/235) ([1d0ec36](https://github.com/anncwb/vue-vben-admin/commit/1d0ec3629f9cdd40c16b62ce61f9230dcd56a82f))
-- modifyVars not work ([b107b52](https://github.com/anncwb/vue-vben-admin/commit/b107b5288695130592a82951012b743fc825880f))
-- **optimize-deps:** fix resize-observer-polyfill error ([1fac4b4](https://github.com/anncwb/vue-vben-admin/commit/1fac4b4ba76d432b9a56e142a8d56571e825950f))
-- **simple-menu:** collapse openmenus error [#204](https://github.com/anncwb/vue-vben-admin/issues/204) ([ca4f1a8](https://github.com/anncwb/vue-vben-admin/commit/ca4f1a8faf7d588c0d57d0dc81f4dc04cd757380))
-- **table:** cell content does not wrap [#210](https://github.com/anncwb/vue-vben-admin/issues/210) ([ea93553](https://github.com/anncwb/vue-vben-admin/commit/ea9355398fe89235bf2e657c291541bd79a41d98))
-- **table:** fix the initial data display of editable cells ([#218](https://github.com/anncwb/vue-vben-admin/issues/218)) ([9ea257e](https://github.com/anncwb/vue-vben-admin/commit/9ea257e1fbd9e50369b0065eb4db37d4f9c24970))
-- **use-table:** fix types ([c889fb1](https://github.com/anncwb/vue-vben-admin/commit/c889fb174bbd8301479cd67ed99cb5f3552f9988))
-- error action style ([da64c1d](https://github.com/anncwb/vue-vben-admin/commit/da64c1dac95b96984283e496070ab9dc086dca4d))
-
-### Features
-
-- production mode compressed image ([de332ae](https://github.com/anncwb/vue-vben-admin/commit/de332ae3f55afa611e86322753d5a713ea00307d))
-- theme color switch ([3d1681e](https://github.com/anncwb/vue-vben-admin/commit/3d1681ee9ae2b8e8a8f9d7afeaef3b059aa20b48))
-- vite preview ([c1a4600](https://github.com/anncwb/vue-vben-admin/commit/c1a4600b8a0f42c37d90c05198627062eb5742e2))
-- **api-select:** added numberToString prop [#200](https://github.com/anncwb/vue-vben-admin/issues/200) ([5d51d48](https://github.com/anncwb/vue-vben-admin/commit/5d51d48787f7b96637bc6abe5175578e0263092a))
-
-### Performance Improvements
-
-- **form:** perf form in modal ([2882d6e](https://github.com/anncwb/vue-vben-admin/commit/2882d6e937a7d4996ae42ff62148d9a2f893fe47))
-- **mock:** when mock is not used, move mock.js out of the package file ([43503d5](https://github.com/anncwb/vue-vben-admin/commit/43503d597028926c93e4624d999cad4bbccc75fb))
-- **nprocess:** remove nprocess css ([733afdd](https://github.com/anncwb/vue-vben-admin/commit/733afddd19523550d8c7df5c523a0b0929afc608))
-
-### Reverts
-
-- vite previre ([2eb2d2a](https://github.com/anncwb/vue-vben-admin/commit/2eb2d2a07529f7a33d2fbbf1e5fc2e1aac706b0f))
-
-# [2.0.0-rc.17](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0-rc.16...v2.0.0-rc.17) (2021-01-18)
-
-### Bug Fixes
-
-- **menu:** currentActiveMenu fails after refresh [#188](https://github.com/anncwb/vue-vben-admin/issues/188) ([6d5c49f](https://github.com/anncwb/vue-vben-admin/commit/6d5c49f0a208de5b745c36d2320dd4c2cffe7d75))
-- **menu-trigger:** menu-trigger lost ([b803c41](https://github.com/anncwb/vue-vben-admin/commit/b803c4100d5b40c04ae4c3b7153f7f8f32d7da81))
-- **mitt:** logout and clear the mitt ([0aeec5e](https://github.com/anncwb/vue-vben-admin/commit/0aeec5e9d727fc6291fa2d6edaedb4c3e1ef0dad))
-- **table:** index column value error [#187](https://github.com/anncwb/vue-vben-admin/issues/187) ([056fc13](https://github.com/anncwb/vue-vben-admin/commit/056fc131168c4e900e9257c3e03257a390c3d3ba))
-- **table:** tableAction icon [#182](https://github.com/anncwb/vue-vben-admin/issues/182) ([b9d53a7](https://github.com/anncwb/vue-vben-admin/commit/b9d53a7133de70922d6f2a0e16e5b623ffab84fb))
-
-### Features
-
-- css import on demand ([c2f6542](https://github.com/anncwb/vue-vben-admin/commit/c2f6542b48abb85b2c80d13a36882899b11c140b))
-
-### Performance Improvements
-
-- auto import mock file ([df6b5e9](https://github.com/anncwb/vue-vben-admin/commit/df6b5e926f3384a1c56e6607a39efcc4638e8dbc))
-
-# [2.0.0-rc.16](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0-rc.15...v2.0.0-rc.16) (2021-01-12)
-
-### Bug Fixes
-
-- **table:** table setting error [#174](https://github.com/anncwb/vue-vben-admin/issues/174) [#165](https://github.com/anncwb/vue-vben-admin/issues/165) ([c960020](https://github.com/anncwb/vue-vben-admin/commit/c9600208c52e3575fe8741e350833f7952bae3b7))
-- mock plugin error [#171](https://github.com/anncwb/vue-vben-admin/issues/171) ([3509ebe](https://github.com/anncwb/vue-vben-admin/commit/3509ebec165d26651cc02dc233bd9433c544bed5))
-- upload component not work [#169](https://github.com/anncwb/vue-vben-admin/issues/169) ([18ad1bc](https://github.com/anncwb/vue-vben-admin/commit/18ad1bcc6e927f70dc16bf7e3c1627c1f7f376f3))
-- useI18n type ([c22de5c](https://github.com/anncwb/vue-vben-admin/commit/c22de5c35b4781322c9ee17ad375ec0af2fe60a7))
-- **form:** formAction slot not work ([de5bf75](https://github.com/anncwb/vue-vben-admin/commit/de5bf757f241a097d62d61adf4d7346b73a09f92))
-- **layout:** fix layout scale error ([da76f3c](https://github.com/anncwb/vue-vben-admin/commit/da76f3c77bd044caaf65e2c7a5c1c9dd72b4ca44))
-- **modal:** height calc error [#161](https://github.com/anncwb/vue-vben-admin/issues/161) ([144ab57](https://github.com/anncwb/vue-vben-admin/commit/144ab577da06ff0bd1f258d1901b87864f232e45))
-- **table:** fix edit-table not work ([c031163](https://github.com/anncwb/vue-vben-admin/commit/c031163f34d7ec16aa5a7a406d5467a18e527c79))
-- **table:** fix table setting error [#162](https://github.com/anncwb/vue-vben-admin/issues/162) ([a2c89d2](https://github.com/anncwb/vue-vben-admin/commit/a2c89d2e842beb9f15f3fc00d651c42954a57ff7))
-- **table:** restore the property of the table ([5c27353](https://github.com/anncwb/vue-vben-admin/commit/5c2735346745cf91aa9812a0afbf62e4625faf40))
-- **table:** table columns setting error ([af55511](https://github.com/anncwb/vue-vben-admin/commit/af55511bd6e533ab68356aa9038f80f50f53cf26))
-- **table:** table columns setting will uncheck all render columns [#154](https://github.com/anncwb/vue-vben-admin/issues/154) ([aa596af](https://github.com/anncwb/vue-vben-admin/commit/aa596af608a313a5494db8e3ddbf0ef84c7f0c55))
-- **table:** table memory overflow ([7a07b70](https://github.com/anncwb/vue-vben-admin/commit/7a07b703d11afb832daa4bd2b87bf5cab3c61e04))
-- **transition:** fix transition not work ([a7a8b89](https://github.com/anncwb/vue-vben-admin/commit/a7a8b894c1062d8eb05a094fdbb7887044d0d973))
-- invalid error-log page path ([#158](https://github.com/anncwb/vue-vben-admin/issues/158)) ([17ecaea](https://github.com/anncwb/vue-vben-admin/commit/17ecaea97d1d4c61ddb79a23616a49598c9a10aa))
-
-### Features
-
-- **tinymce:** add image upload [#170](https://github.com/anncwb/vue-vben-admin/issues/170) ([3ad1a4f](https://github.com/anncwb/vue-vben-admin/commit/3ad1a4f5a69b4242d55e6bc17aceab7279241e14))
-- added mixSide trigger ([1e5fcd2](https://github.com/anncwb/vue-vben-admin/commit/1e5fcd2cd2981b29f06cff08e588077b2dd02f45))
-- support vite2 ([eba5576](https://github.com/anncwb/vue-vben-admin/commit/eba55769ec765cd4fbf1faefdd4f3df5e38f11d9))
-- **layout:** added setting. Used to fix the left mixed mode menu ([97180e8](https://github.com/anncwb/vue-vben-admin/commit/97180e83f5055ebd138acc2a82c981d8a7399371))
-- **menu:** add mixSideTrigger setting ([0419a07](https://github.com/anncwb/vue-vben-admin/commit/0419a070413be34ea5455ed955fa51d8c522da86))
-- **modal:** add minHeight and height prop [#156](https://github.com/anncwb/vue-vben-admin/issues/156) ([5091a87](https://github.com/anncwb/vue-vben-admin/commit/5091a875ab520c51aec4c57cdd200d68016958ab))
-- **page-wrapper:** added pageWrapper component ([31ff055](https://github.com/anncwb/vue-vben-admin/commit/31ff0559fe3b635fc2091aac0e2f5e340629134c))
-- **table:** add summaryData prop [#163](https://github.com/anncwb/vue-vben-admin/issues/163) ([8d7d083](https://github.com/anncwb/vue-vben-admin/commit/8d7d0835adf4a7d1b8afc5e8bd911a60833006a4))
-- **tabs:** added tab folding ([0e7c57b](https://github.com/anncwb/vue-vben-admin/commit/0e7c57bd5ecafd8283bcc950b24bb63b59b70e5a))
-
-### Performance Improvements
-
-- perf table ([cdf0a60](https://github.com/anncwb/vue-vben-admin/commit/cdf0a600e505daf429446b8a7968269e1034de04))
-- **i18n:** merge common lang ([efbde0d](https://github.com/anncwb/vue-vben-admin/commit/efbde0d57e20d07373d78d1226e2e83f396a74f3))
-- add @ant-design/icons-vue to optimizeDeps ([fb57cf7](https://github.com/anncwb/vue-vben-admin/commit/fb57cf734da31af94f3072c685b778a64fc740a5))
-- **menu:** mixSideTrigger setting ([#155](https://github.com/anncwb/vue-vben-admin/issues/155)) ([e821f4c](https://github.com/anncwb/vue-vben-admin/commit/e821f4c706c4108a4309a0589223e05e718f15cf))
-
-# [2.0.0-rc.15](https://github.com/anncwb/vue-vben-admin/compare/v2.0.0-rc.14...v2.0.0-rc.15) (2020-12-31)
-
-### Bug Fixes
-
-- **build:** fix environment variable configuration file failure ([bd7b53f](https://github.com/anncwb/vue-vben-admin/commit/bd7b53f14adc05fd3d4af5027b5fb85015021ac9))
-- **charts:** fix echarts does not display after refresh [#140](https://github.com/anncwb/vue-vben-admin/issues/140) ([5cbfb2a](https://github.com/anncwb/vue-vben-admin/commit/5cbfb2a1f9ace8b991ac67c5b7d37b64eb2dbac8))
-- **demo:** fix demo error ([a0681cc](https://github.com/anncwb/vue-vben-admin/commit/a0681cca8f9de2e3686001fa715f53f6fc3cf1a1))
-- **form:** fix appendSchemaByField not work ([405d746](https://github.com/anncwb/vue-vben-admin/commit/405d7466dd935a845e91f4c6ece76b1475507eb7))
-- **form:** form validate error ([a305e59](https://github.com/anncwb/vue-vben-admin/commit/a305e59124f4cc88aaf6ec85a13fc998a18b9471))
-- **form:** form-item style error ([08df198](https://github.com/anncwb/vue-vben-admin/commit/08df198710ff597af2cbffa2afbb3a6ca13a1d63))
-- **iframe:** iframe loads early when closing multi-tabs ([73cee06](https://github.com/anncwb/vue-vben-admin/commit/73cee06daa26c056131fb5ec78afd912dd9832f7))
-- **locale:** fix locale.show not work ([10cd4fc](https://github.com/anncwb/vue-vben-admin/commit/10cd4fcdff2fa3961e095285ae7a26b38be52c2a))
-- **menu:** fix scrillbar not work ([de25557](https://github.com/anncwb/vue-vben-admin/commit/de25557f86945a96b89294043796ccf4ab476ad5))
-- **modal:** do not hide the scroll bar when opening the pop-up window [#151](https://github.com/anncwb/vue-vben-admin/issues/151) ([8f332e3](https://github.com/anncwb/vue-vben-admin/commit/8f332e3cd45814a181a24c884edf050936928755))
-- **sider:** mix mode adaptation in the left menu ([ed213d8](https://github.com/anncwb/vue-vben-admin/commit/ed213d878b78697f0bdb69cb474dfab45972b2cb))
-- **table:** Update useDataSource.ts ([#131](https://github.com/anncwb/vue-vben-admin/issues/131)) ([877311f](https://github.com/anncwb/vue-vben-admin/commit/877311f9df70b7d76f8a0f8b5082f061de439ec8))
-- **table:** wrong tag label style [#134](https://github.com/anncwb/vue-vben-admin/issues/134) ([e09e0a1](https://github.com/anncwb/vue-vben-admin/commit/e09e0a12531977d679ab0f4574f4016d4c5b2ad0))
-- **tinymce:** the editor reports an error under keep-alive [#152](https://github.com/anncwb/vue-vben-admin/issues/152) ([09c9f8a](https://github.com/anncwb/vue-vben-admin/commit/09c9f8a881d1f2c76b11fdeff08f3ca2893e0886))
-- **types:** fix routing type error [#145](https://github.com/anncwb/vue-vben-admin/issues/145) ([b6e5c3f](https://github.com/anncwb/vue-vben-admin/commit/b6e5c3f625f3e30b1fa7433e57b1294a8ce8d04b))
-- add an example of markdown embedded in the form [#138](https://github.com/anncwb/vue-vben-admin/issues/138) ([7db0c5c](https://github.com/anncwb/vue-vben-admin/commit/7db0c5c49f23a4ab4958b3f73d47516deafa6166))
-
-### Features
-
-- **breadcrumb:** add breadcrumb demo [#143](https://github.com/anncwb/vue-vben-admin/issues/143) ([819bcbe](https://github.com/anncwb/vue-vben-admin/commit/819bcbe5263c721f1f77cb277d670a9868b229f7))
-- **hook:** add useKeyPress ([3c3e640](https://github.com/anncwb/vue-vben-admin/commit/3c3e640d69b48d8e9382acd25b60d906af038a9d))
-- add mainout page demo ([930383f](https://github.com/anncwb/vue-vben-admin/commit/930383f9ae17b18d697a35ef9c73ad17dbca1e13))
-- **layout:** add mix sidebar mode ([e6db0d3](https://github.com/anncwb/vue-vben-admin/commit/e6db0d39b9ba98f6396866715ed3b6d56994697a))
-- add ripple directive ([2e79c9f](https://github.com/anncwb/vue-vben-admin/commit/2e79c9f37adda4003e6b054561b26da69a762673))
-
-### Performance Improvements
-
-- **form:** improve the form function ([ac1a369](https://github.com/anncwb/vue-vben-admin/commit/ac1a36950259844822c6300a00710b040dfc2640))
-- **import:** perf components import ([2ee01fa](https://github.com/anncwb/vue-vben-admin/commit/2ee01fa6ea3200ec964d4e1b4765e48dfa7aeb3a))
-- **modal-drawer:** replace the scrollbar assembly ([ebf7c8a](https://github.com/anncwb/vue-vben-admin/commit/ebf7c8aa53b7ed11c72734646d558a559e818473))
-- **route:** refactor guard ([3b126e0](https://github.com/anncwb/vue-vben-admin/commit/3b126e011c7ca7ac1b008c37aa2cf617242a2e9c))
-- Update useApexCharts.ts ([#139](https://github.com/anncwb/vue-vben-admin/issues/139)) ([5eecec0](https://github.com/anncwb/vue-vben-admin/commit/5eecec03126d131bd1210d4fcac3acfe3d5aeb40))
-
-# [2.0.0-rc.14](https://github.com/anncwb/vue-vben-admin/compare/2.0.0-beta.3...v2.0.0-rc.14) (2020-12-15)
-
-### Bug Fixes
-
-- **form:** fix the form item setting not taking effect ([6936adb](https://github.com/anncwb/vue-vben-admin/commit/6936adb2c2af3c0bfbd238be1d61933601ff2b88))
-- **router:** reserving `Redirect` after reset ([#126](https://github.com/anncwb/vue-vben-admin/issues/126)) ([ec7efcf](https://github.com/anncwb/vue-vben-admin/commit/ec7efcf0f0161c8e14168bf69ba27ba36e2a1ac8))
-- fix modal and drawer component missing uid ([1293a73](https://github.com/anncwb/vue-vben-admin/commit/1293a7389ea797b1c1dad62e06657c846b1dcb3c))
-- **comp:** fix the memory overflow problem of component containing keywords ([6b3195b](https://github.com/anncwb/vue-vben-admin/commit/6b3195b4ca88a33044bcd014e8c5d090710e7fbb))
-- **form:** fix baseColProps not work ([c8ef82b](https://github.com/anncwb/vue-vben-admin/commit/c8ef82b2c11c9938f0f7a7f6a1a10010b82979dc))
-- **form:** fix form inputNumber verification error ([4ddee05](https://github.com/anncwb/vue-vben-admin/commit/4ddee05dee87c944ba95dca54a754e048b8cfc84))
-- **form:** fix form verification and console error message issues ([bb1b267](https://github.com/anncwb/vue-vben-admin/commit/bb1b267e2fc306608300ec09084b1f3d0cab7e59))
-- **icon:** fix g-icon not work ([f7ec3c9](https://github.com/anncwb/vue-vben-admin/commit/f7ec3c931e780b2b5d35bf65ea5b4ace26f7c356))
-- **keep-alive:** fix the problem that the multi-level routing cache page is rendered multiple times [#123](https://github.com/anncwb/vue-vben-admin/issues/123) ([0daca28](https://github.com/anncwb/vue-vben-admin/commit/0daca28362419911d642e4b3a5111e213eef49d9))
-- **login:** fix the problem of successful login and notify disappearing ([0434030](https://github.com/anncwb/vue-vben-admin/commit/0434030f2777ee65a4255287e1842fcb0b772f87))
-- **menu:** calc 0 不能省略单位 ([#124](https://github.com/anncwb/vue-vben-admin/issues/124)) ([d023fb1](https://github.com/anncwb/vue-vben-admin/commit/d023fb13742cc1f5cc1585b82f1a7b3c576ee66c))
-- **menu:** fix externalLink not work ([7bae4c3](https://github.com/anncwb/vue-vben-admin/commit/7bae4c37525c6534ec0b0c3ea8c1b2257af74a33))
-- **menu:** fix menu icon style ([1bc237d](https://github.com/anncwb/vue-vben-admin/commit/1bc237d77a068e99b0e803ab4f16d8bbcf54ff6b))
-- **menu:** fix menu split mode problem ([1ef49e5](https://github.com/anncwb/vue-vben-admin/commit/1ef49e542d23ca44696ec5dd2f6498a4ea8135aa))
-- **theme:** css filter breaking fixed position ([#125](https://github.com/anncwb/vue-vben-admin/issues/125)) ([c911af4](https://github.com/anncwb/vue-vben-admin/commit/c911af4aca49e6f9fe099e74a4d454286554e181))
-- 整体图标调整 ([5dc8226](https://github.com/anncwb/vue-vben-admin/commit/5dc8226ce14559f48f8b979809f8a054ce7935e5))
-- file upload key loss [#120](https://github.com/anncwb/vue-vben-admin/issues/120) ([29461a8](https://github.com/anncwb/vue-vben-admin/commit/29461a856826fbb7726848982387ea78f8573754))
-- **menu:** fix the calculation error of the top menu width ([de1f006](https://github.com/anncwb/vue-vben-admin/commit/de1f00628479c4d31e6ed904d4b0fd7e312cc030))
-- **table:** fix table setting error ([59ad824](https://github.com/anncwb/vue-vben-admin/commit/59ad82442bf213bac547940086ff4e14d0cd342a))
-- **table:** fix unsuccessful saving of row edit table ([#117](https://github.com/anncwb/vue-vben-admin/issues/117)) ([404db2f](https://github.com/anncwb/vue-vben-admin/commit/404db2fb4975c69851dbf73a9ea8f981fb0ddb56))
-- **upload:** fix file upload key loss [#120](https://github.com/anncwb/vue-vben-admin/issues/120) ([fb5395b](https://github.com/anncwb/vue-vben-admin/commit/fb5395b5401b4b1f9e605d2721784482a76d49cc))
-- **upload:** repair file upload and delete invalidation ([bd6b203](https://github.com/anncwb/vue-vben-admin/commit/bd6b203fa969d173574657940a50b649c778b0b4))
-- fix cssVar hmr error ([2b95be8](https://github.com/anncwb/vue-vben-admin/commit/2b95be8013e70e1b891601cecb6d9e03a56d1ac2))
-- fix descriotions title not work ([819127e](https://github.com/anncwb/vue-vben-admin/commit/819127e807123cccc7ae50f0fdffb43a662465d4))
-- fix form submit error ([94bf854](https://github.com/anncwb/vue-vben-admin/commit/94bf854dd98f37ffb39e9086c565a0610c250205))
-- fix form validate error ([1db72c8](https://github.com/anncwb/vue-vben-admin/commit/1db72c8fe13384f24e9cc1bdc839d5e4176ea9b4))
-- fix keepAlive not work ([b884654](https://github.com/anncwb/vue-vben-admin/commit/b884654761f93455014fd1dcb0e40c030d8fb360))
-- fix menu style not work ([bda3e5d](https://github.com/anncwb/vue-vben-admin/commit/bda3e5da30b434dd3a5879695261422fdd365455))
-- fix mock data error [#109](https://github.com/anncwb/vue-vben-admin/issues/109) ([41a4b82](https://github.com/anncwb/vue-vben-admin/commit/41a4b827a22e785453238da6b9b8b5b1c604b91a))
-- fix notify type error ([cb1ae34](https://github.com/anncwb/vue-vben-admin/commit/cb1ae34f1120d2555ff039fc945235c3f45e13a8))
-- fix spelling errors of i18n words ([68a96b7](https://github.com/anncwb/vue-vben-admin/commit/68a96b7f81a1ad72c93a53c2ebfde046c66c215f))
-- fix spin style ([fca0bb1](https://github.com/anncwb/vue-vben-admin/commit/fca0bb164a0f2e03acb5090bf59634225f5c06ee))
-- fix table column settings not displayed by setting ([54d1405](https://github.com/anncwb/vue-vben-admin/commit/54d14056462566521f2528480c13fb24279156ae))
-- fix the display problem of table icon ([de499a1](https://github.com/anncwb/vue-vben-admin/commit/de499a145556427304abe075b62e6869f44dc640))
-- fix the original page after login expired ([6676c95](https://github.com/anncwb/vue-vben-admin/commit/6676c9506be7b3095c466c83432d40b2a36565fb))
-- fix win system dynamicImport error ([a90d93f](https://github.com/anncwb/vue-vben-admin/commit/a90d93fc4d8dd8491702183f3db700c33dbcc5a8))
-- page switching did not return to the top ([fef3644](https://github.com/anncwb/vue-vben-admin/commit/fef3644067b7ccac96ec9ae122e3f1c8b8fc58ef))
-- pageLoading not working ([3f78b5a](https://github.com/anncwb/vue-vben-admin/commit/3f78b5aa0cd3e7a6f17d58512ca93ee2905d5e2f))
-- style error ([7bfe5f7](https://github.com/anncwb/vue-vben-admin/commit/7bfe5f753d77620027248a6238bccd8a23f7ad7c))
-- **charts:** fix useCharts resize not work ([6d9585b](https://github.com/anncwb/vue-vben-admin/commit/6d9585b46f849ea4cf3dc93d46f15c2c09d04891))
-- **form:** fix updateSchema error [#100](https://github.com/anncwb/vue-vben-admin/issues/100) ([4982786](https://github.com/anncwb/vue-vben-admin/commit/498278660112a52b7c6e608159d20920d6047e04))
-- 修复链接 ([#49](https://github.com/anncwb/vue-vben-admin/issues/49)) ([28392c3](https://github.com/anncwb/vue-vben-admin/commit/28392c3d6efc2fb3298255bc2c466167e8a4e91c))
-- fix editable cells cannot be entered ([4500214](https://github.com/anncwb/vue-vben-admin/commit/4500214b2a158965281e43e673622e4492e8ca26))
-- fix expandTransition ([3355066](https://github.com/anncwb/vue-vben-admin/commit/335506628e15e29e08df55d4b7e7cf6333fe25be))
-- fix fullscreen bg color not work ([#75](https://github.com/anncwb/vue-vben-admin/issues/75)) ([0c28ffa](https://github.com/anncwb/vue-vben-admin/commit/0c28ffa8e6a93e8923b7d3a32292db8ae786242c))
-- **table:** fix table typo ([69af37e](https://github.com/anncwb/vue-vben-admin/commit/69af37ec88e21acf926fdf5969c2189dc7450822))
-- fix menu permission failure ([b8353fe](https://github.com/anncwb/vue-vben-admin/commit/b8353fe1f262b87cc20af56aaf380ae1a5599724))
-- fix message type error ([35d2bfc](https://github.com/anncwb/vue-vben-admin/commit/35d2bfc5623fcf3a608ae12e9781b2e23ff4130d))
-- fix the problem of closing multiple tabs ([275ad9f](https://github.com/anncwb/vue-vben-admin/commit/275ad9f14e8fa75620ff35c906c06c616fb2104f))
-- **mock:** fix mock paging tool error ([b36d948](https://github.com/anncwb/vue-vben-admin/commit/b36d9486a544dd3badea23d86088af98aadad8f4))
-- **table:** fix table search criteria collapse failure ([84b8302](https://github.com/anncwb/vue-vben-admin/commit/84b8302c0921ea7fbcd1c42fa057b94660129857))
-- fix missing cache of refresh page ([02d6a39](https://github.com/anncwb/vue-vben-admin/commit/02d6a3940277a5939d25d16fda58e09346821e0e))
-- fix npm build error ([a3b7a65](https://github.com/anncwb/vue-vben-admin/commit/a3b7a6537ae25af076fdcccb50dd6967f0def40b))
-- fix table small style ([#67](https://github.com/anncwb/vue-vben-admin/issues/67)) ([da4aea1](https://github.com/anncwb/vue-vben-admin/commit/da4aea1399f67759b06266aa410036f69fde9521))
-- **table:** fix table type error ([05980a8](https://github.com/anncwb/vue-vben-admin/commit/05980a817e68c2a57eed2db7cf23bd7eb4ec10ba))
-- build error ([7bd0b8e](https://github.com/anncwb/vue-vben-admin/commit/7bd0b8eb6ffb143b4f341efeeb60b4e90f0e4ddf))
-- fix abnormal breadcrumb status ([144fde8](https://github.com/anncwb/vue-vben-admin/commit/144fde8a688217440071c7b0ac70e46f6832635a))
-- fix base-help style not work ([1fb759e](https://github.com/anncwb/vue-vben-admin/commit/1fb759ec7cf2c6104670025073920ca352413b10))
-- fix drawer autoHeight ([88de82c](https://github.com/anncwb/vue-vben-admin/commit/88de82c493b068b6d9bb5e29475350ed092fe482))
-- fix missing page refresh parameters ([349d197](https://github.com/anncwb/vue-vben-admin/commit/349d1978b154f6e9e74e36de7cc56a2ca261d0b0))
-- fix modal dragging failure when destroyOnClose=true ([#51](https://github.com/anncwb/vue-vben-admin/issues/51)) ([9c02d8e](https://github.com/anncwb/vue-vben-admin/commit/9c02d8ec08b309e7f982f417a4c907f33ccc96f0))
-- fix npm script ([b84de1a](https://github.com/anncwb/vue-vben-admin/commit/b84de1a515600d2ead1c2b5f6db949e7bf6ab923))
-- fix require error ([06e1d38](https://github.com/anncwb/vue-vben-admin/commit/06e1d3879be187f99f5142e054884e1c09ac8dfa))
-- fix routing switch, tab is not activated ([beb4c3a](https://github.com/anncwb/vue-vben-admin/commit/beb4c3a37f314b97657a1d85e7db2abf40dbe6c3))
-- fix script preview no build ([c2333f5](https://github.com/anncwb/vue-vben-admin/commit/c2333f5d044c74c9df82c6c3134681ba21e0d0cd))
-- fix table auto height ([ddc3786](https://github.com/anncwb/vue-vben-admin/commit/ddc3786b168a2931200ef61cc68dd80a18d714cc))
-- fix the failure of table expansion icon animation ([8e885d6](https://github.com/anncwb/vue-vben-admin/commit/8e885d6967747f3204e61ca85bde25ac2b8ba2a4))
-- fix the failure of table expansion icon animation ([db06289](https://github.com/anncwb/vue-vben-admin/commit/db06289481965524f42ed36a056bd54ba1a46dfe))
-- fix the problem of folding display name of the first level menu ([e3cbc93](https://github.com/anncwb/vue-vben-admin/commit/e3cbc9326ecedf386919f344df5dbdef8eb3d78c))
-- fix the problem of page blank caused by page refresh ([7653610](https://github.com/anncwb/vue-vben-admin/commit/7653610c7bc45e97cb744994835cf7fb5074ff7b))
-- fix the style problem of the table border in the production environment ([f2c7638](https://github.com/anncwb/vue-vben-admin/commit/f2c7638bd7789bddacd56ea2ab809f4a0b3b86cb))
-- fix the top menu adaptive failure ([2f12556](https://github.com/anncwb/vue-vben-admin/commit/2f12556d26ba386d9dca2ecf8a88e3764abab870))
-- fix window npm script ([a0b09e7](https://github.com/anncwb/vue-vben-admin/commit/a0b09e74baf1f4e514da85ed9b1859ca2820fb37))
-- form col style ([840332a](https://github.com/anncwb/vue-vben-admin/commit/840332abf733dd1dc404523d38c5377114f4b6c2))
-- some error ([2407b33](https://github.com/anncwb/vue-vben-admin/commit/2407b3368c3fc5128bbfced98a1d2c70fa3e02e0))
-- **modal:** fix modal not showing footer ([fb0c776](https://github.com/anncwb/vue-vben-admin/commit/fb0c7763eddde38d3746cb424ebe9662ac576c86))
-- **tree:** fix tree style ([#99](https://github.com/anncwb/vue-vben-admin/issues/99)) ([e8ccdc7](https://github.com/anncwb/vue-vben-admin/commit/e8ccdc7f34891ea31768aea9ebcfc33227d37eb7))
-- **use-redo:** refresh the page to keep the parameters([#104](https://github.com/anncwb/vue-vben-admin/issues/104)) ([e04aaa0](https://github.com/anncwb/vue-vben-admin/commit/e04aaa06459c6613e59aa6ae5906b998b0685bdb))
-- fix the disappearance of tab switching parameters ([#56](https://github.com/anncwb/vue-vben-admin/issues/56)) ([6bffdb5](https://github.com/anncwb/vue-vben-admin/commit/6bffdb5c64aa139cf6119b50aeed42629a65f07b))
-- fix the occupancy problem of the folding button ([#90](https://github.com/anncwb/vue-vben-admin/issues/90)) ([cd35d3e](https://github.com/anncwb/vue-vben-admin/commit/cd35d3e0d16cb57cb15c2ca20c8a663f21e4bfbf))
-- fix the problem of collapsed display when the menu has no child nodes ([5cff73b](https://github.com/anncwb/vue-vben-admin/commit/5cff73bcafc27a36f111949d33f463dd2bb52571))
-- fix topMenu align not work ([25d43a5](https://github.com/anncwb/vue-vben-admin/commit/25d43a5f7c9182f2ca620f1daf0d5f47d2e4fb2d))
-- fix useTimeoutFn not work ([b49950a](https://github.com/anncwb/vue-vben-admin/commit/b49950a3906de6626eedb973590d02e4d95b98b9))
-- hmr multiple registered components ([7a6181e](https://github.com/anncwb/vue-vben-admin/commit/7a6181e8c72cd110cdfc09f624f8be43e76ef74c))
-- repair local development post request proxy to https error problem ([#63](https://github.com/anncwb/vue-vben-admin/issues/63)) ([34c09fc](https://github.com/anncwb/vue-vben-admin/commit/34c09fcea82e3529519a5acc563a22adcd5faae1))
-- repair packaging error ([526e6ce](https://github.com/anncwb/vue-vben-admin/commit/526e6ce22bf15cd04a09faf53a08ac43da491534))
-- Repair tree component click to select ([#33](https://github.com/anncwb/vue-vben-admin/issues/33)) ([67df9b8](https://github.com/anncwb/vue-vben-admin/commit/67df9b8c93a26b0edb4f3d5d5c589d355803cea0))
-- replace taskfile module ([e828baa](https://github.com/anncwb/vue-vben-admin/commit/e828baa67b5f8e6fa28354d85563d127b6b70d6b))
-- reset back to default value after fixing form query ([1c075a7](https://github.com/anncwb/vue-vben-admin/commit/1c075a7a32dd05454bc45d4eb686e2234c3c6175))
-- the action column appears repeatedly in the table ([#53](https://github.com/anncwb/vue-vben-admin/issues/53)) ([74d4742](https://github.com/anncwb/vue-vben-admin/commit/74d47424069c4dca71579637916431aa80014fd8))
-- the login tab page in tabs ([#60](https://github.com/anncwb/vue-vben-admin/issues/60)) ([bfac425](https://github.com/anncwb/vue-vben-admin/commit/bfac425d1e12943b55e9afb732a36d84f6a02404))
-- the useMessage icon style problem ([a2c413a](https://github.com/anncwb/vue-vben-admin/commit/a2c413a838bb3f737e28e95302ccf0a0171c91b6))
-- type error ([ecfb702](https://github.com/anncwb/vue-vben-admin/commit/ecfb702b09e296efd5bf095d65840147d47b7923))
-- typo ([7658f4d](https://github.com/anncwb/vue-vben-admin/commit/7658f4d6e82dc532b378ec13157756f0e1cd78de))
-- update account page demo ([#92](https://github.com/anncwb/vue-vben-admin/issues/92)) ([9f8796e](https://github.com/anncwb/vue-vben-admin/commit/9f8796ee586a5f33e20713f53d2aa447b6aa312e))
-- update upload component ([815250e](https://github.com/anncwb/vue-vben-admin/commit/815250ed341ccaec23e7ea34db6cc478a47ad065))
-- **excel:** update excel demo ([a207caf](https://github.com/anncwb/vue-vben-admin/commit/a207cafec98461b39882f352f2bf5c7d3c21716a))
-- **table:** fix table actionColOptions not work ([5a6db8c](https://github.com/anncwb/vue-vben-admin/commit/5a6db8c640376ca67b451a9647b9958946e5c3ab))
-- **table:** fix table type error ([db0bfc8](https://github.com/anncwb/vue-vben-admin/commit/db0bfc886314b193e7cb86a80b6c13b2743aa652))
-- **table:** fix the problem that multi-level header configuration does not take effect ([cdf2c59](https://github.com/anncwb/vue-vben-admin/commit/cdf2c59e5c3b070d039c04fb746b53147f5e0ced))
-- **tinymce:** fixed multiple editors showing only one ([#83](https://github.com/anncwb/vue-vben-admin/issues/83)) ([1093ec3](https://github.com/anncwb/vue-vben-admin/commit/1093ec3e6e4fe1f49b7458c29e518744fe56532f))
-
-### Features
-
-- add account center page ([#86](https://github.com/anncwb/vue-vben-admin/issues/86)) ([78d4d41](https://github.com/anncwb/vue-vben-admin/commit/78d4d41c85f5341bb5dfd2a1cbb6e60d6858b084))
-- add accountSetting page ([#85](https://github.com/anncwb/vue-vben-admin/issues/85)) ([7ad4cee](https://github.com/anncwb/vue-vben-admin/commit/7ad4cee79ade617a13358f7417ce3e1182c1027f))
-- add basic-list page ([2f75a94](https://github.com/anncwb/vue-vben-admin/commit/2f75a948899713e10b200e0f39a48d4b62ef231e))
-- add card-list page ([3a132f3](https://github.com/anncwb/vue-vben-admin/commit/3a132f3f4f4e08b4675c157548aa093b3a1c3c94))
-- add collapsedShowTitle setting ([5737e47](https://github.com/anncwb/vue-vben-admin/commit/5737e478f671e7f1c60f7db08a0007f154b6f4b8))
-- add count-to component and demo ([afc7263](https://github.com/anncwb/vue-vben-admin/commit/afc7263efb90c0410041358a9dd5f10ec685ac2f))
-- add design setting ([bae53f3](https://github.com/anncwb/vue-vben-admin/commit/bae53f3e2c62b3fca246432307f45a6363c4c176))
-- add error handle ([7101587](https://github.com/anncwb/vue-vben-admin/commit/7101587b9676c91e9079044a096df08848f1f602))
-- add file download demo ([db3092d](https://github.com/anncwb/vue-vben-admin/commit/db3092db2eb7d5346778847757adb2b9c4041ed5))
-- add lazyContainer comp and demo ([fdeaa00](https://github.com/anncwb/vue-vben-admin/commit/fdeaa00bf24b0710ca341fafba8327c786ab9879))
-- add markdown component ([5fb069f](https://github.com/anncwb/vue-vben-admin/commit/5fb069f432799e0d17a7102fae70757e320dc0c5))
-- add notice ([#47](https://github.com/anncwb/vue-vben-admin/issues/47)) ([7a1e94c](https://github.com/anncwb/vue-vben-admin/commit/7a1e94c49d546e155d8c17b492ff6b1e5fb55121))
-- add permissionCacheType setting ([26b6109](https://github.com/anncwb/vue-vben-admin/commit/26b6109ca08a28c37355474bf8593f2e2b741ef6))
-- add pwa ([a1b9902](https://github.com/anncwb/vue-vben-admin/commit/a1b9902b97da03d0ee1e99a021fc6497b8f51fa6))
-- add README.en-US.md ([#37](https://github.com/anncwb/vue-vben-admin/issues/37)) ([7437896](https://github.com/anncwb/vue-vben-admin/commit/74378960345e706b45fab1f39fba045a1e95a547))
-- add result page demo ([21e0548](https://github.com/anncwb/vue-vben-admin/commit/21e0548e34cf70ebf97967089f458e759ca326d9))
-- add search page ([dddda5b](https://github.com/anncwb/vue-vben-admin/commit/dddda5b296025d1d6b37ec15930a02722b8e1b0c))
-- add search-list page ([4cb3784](https://github.com/anncwb/vue-vben-admin/commit/4cb3784f13fc516c6343798e8bf8a435e14d774c))
-- add tab drag and drop sort ([cedba37](https://github.com/anncwb/vue-vben-admin/commit/cedba37e4cf63456c97f7e391761f176137e0165))
-- add table setting ([8b3a4d3](https://github.com/anncwb/vue-vben-admin/commit/8b3a4d37a8addd151b918cf64bce6361376dec9e))
-- add tag display to the menu ([a3887f8](https://github.com/anncwb/vue-vben-admin/commit/a3887f8cd99546cde8882d77271cc430eb7a83f5))
-- add the parameter sortFn to the table ([491ba9a](https://github.com/anncwb/vue-vben-admin/commit/491ba9a3cc19ceb97dd9a6448831b64c86e1e475))
-- add the parameter submitOnReset to the form ([#54](https://github.com/anncwb/vue-vben-admin/issues/54)) ([d09406e](https://github.com/anncwb/vue-vben-admin/commit/d09406e3cb8cfc069ce79b5f4194f7d959f63daf))
-- add tinymce embedded form example ([58f988a](https://github.com/anncwb/vue-vben-admin/commit/58f988a7184dd7bdec415627e16b56b80f36b661))
-- add useDesign ([74e62cb](https://github.com/anncwb/vue-vben-admin/commit/74e62cbc712bdd4d4826e5fe80f537d87e44ffce))
-- added base64 file stream download ([a161bfa](https://github.com/anncwb/vue-vben-admin/commit/a161bfa818cb63d9cc0b00ae062eb16b1efaf74f))
-- auto import route ([8a1bfdf](https://github.com/anncwb/vue-vben-admin/commit/8a1bfdf13de966acc5eb41718ccb085d3efc4581))
-- axios add joinTime field ([f646e37](https://github.com/anncwb/vue-vben-admin/commit/f646e37754d21ba7c89437176bd9e375924dee03))
-- first screen loading waiting animation ([4811cce](https://github.com/anncwb/vue-vben-admin/commit/4811cce809453df78dc2c25cd9805eae483297fc))
-- global loading add text ([4f98978](https://github.com/anncwb/vue-vben-admin/commit/4f98978edacbe72610a226267628ab20b57cfc4e))
-- integrate upload components into form by default ([be2b8a7](https://github.com/anncwb/vue-vben-admin/commit/be2b8a7e175033dace7a521ab26cd319c5cfdea6))
-- multi-language component ([dc09de1](https://github.com/anncwb/vue-vben-admin/commit/dc09de1e052d6b104c5af3a426af6b0e7bb147c7))
-- multi-language layout ([e5f8ce3](https://github.com/anncwb/vue-vben-admin/commit/e5f8ce3fd8ec25c6fdb122867cd33e4e84a6f43f))
-- multi-language support ([1901129](https://github.com/anncwb/vue-vben-admin/commit/19011296ed61f820356f6b201cbb274d57dcb7d3))
-- new menu and top bar color selection color matching ([7692ffb](https://github.com/anncwb/vue-vben-admin/commit/7692ffb95b94672b6fbc8c25fd43d9dd1a1da81e))
-- projectSetting add closeMessageOnSwitch and removeAllHttpPending ([e83cb06](https://github.com/anncwb/vue-vben-admin/commit/e83cb06bb93544369c8934d1065bf46835e3f003))
-- restore the breadcrumb display icon function ([f65bed7](https://github.com/anncwb/vue-vben-admin/commit/f65bed72ac8c63aaed640d59703f73e83de80da5))
-- right-click menu supports multiple levels ([f645680](https://github.com/anncwb/vue-vben-admin/commit/f645680a3b9a1f75395329970551d9e5d6bd845b))
-- routes with parameters can be cached ([90b3fab](https://github.com/anncwb/vue-vben-admin/commit/90b3fab28ef53135f3cab1f69a4675f98a130857))
-- support mobile layout adaptation ([c774a6d](https://github.com/anncwb/vue-vben-admin/commit/c774a6d3a03d9507a9023d600aa9dd9592f52fb3))
-- support vscode i18n-ally plugin ([962f90d](https://github.com/anncwb/vue-vben-admin/commit/962f90de445d7935ad76ea7b74a98f12ce9a7498))
-- the cache can be configured to be encrypted ([234c1d1](https://github.com/anncwb/vue-vben-admin/commit/234c1d1fae6a7f2c78e456f992f91622ca599060))
-- **analysis:** add analysis page ([52ee35c](https://github.com/anncwb/vue-vben-admin/commit/52ee35c4beca8fc07737aa28328663e86ba797d4))
-- **breadcrumb:** support showIcon ([#48](https://github.com/anncwb/vue-vben-admin/issues/48)) ([d8b25b4](https://github.com/anncwb/vue-vben-admin/commit/d8b25b488ba4c6626d3b94ed84270e96f403d859))
-- **chart:** add useEcharts and useApexChart demo ([21d0ed9](https://github.com/anncwb/vue-vben-admin/commit/21d0ed92dffd28f45c98afee547d25d9b40dde7f))
-- **desc-page:** add desc page demo ([7a00036](https://github.com/anncwb/vue-vben-admin/commit/7a000366b92b942727dd2cd7c0aec193f8c1a7b0))
-- **excel:** import/export ([#40](https://github.com/anncwb/vue-vben-admin/issues/40)) ([c0692b0](https://github.com/anncwb/vue-vben-admin/commit/c0692b0f43b50be56e399c4aa07c0c4244080e9f))
-- **form:** support function type of form item ([5832ee6](https://github.com/anncwb/vue-vben-admin/commit/5832ee6697e23afefc25ba2aa4df9476b5034bf4))
-- **form-page:** add form page demo ([0b6110a](https://github.com/anncwb/vue-vben-admin/commit/0b6110a8fc92a11df6501346e093246a5abe2b0e))
-- **from:** add required in schema ([2859067](https://github.com/anncwb/vue-vben-admin/commit/28590676214b1c5fdbf6878e40da45a7bc0c5874))
-- **tinymce:** add line height ([#58](https://github.com/anncwb/vue-vben-admin/issues/58)) ([adffefd](https://github.com/anncwb/vue-vben-admin/commit/adffefd702688ba5fa8c5df616b8f3685a0fb778))
-- **tinymce:** add rich editor ([c0e4c9e](https://github.com/anncwb/vue-vben-admin/commit/c0e4c9e5a55524840e9598d24d84dcada8b57102))
-- **transition:** add transition comp and demo ([3713487](https://github.com/anncwb/vue-vben-admin/commit/3713487c85f4b512ab3e13fcb4c89a14b9ee8d50))
-- **trigger:** add trigger config ([4f6b65b](https://github.com/anncwb/vue-vben-admin/commit/4f6b65b8a1b7e694718b4aa42aced1e59e90ec9e))
-- the Button component extends the and attributes ([8f5016e](https://github.com/anncwb/vue-vben-admin/commit/8f5016e3f3476539a763162ea235cf2aac230eea))
-- the production environment can be dynamically configured ([bb3b8f8](https://github.com/anncwb/vue-vben-admin/commit/bb3b8f817de15d336968354515649f7142cd5683))
-- **workbench:** add workbench page ([1cd75fc](https://github.com/anncwb/vue-vben-admin/commit/1cd75fcf5ba7a3114399db8f22cf8eb6f2e4d783))
-
-### Performance Improvements
-
-- **setting-drawer:** perf setting-drawer ([ed41e50](https://github.com/anncwb/vue-vben-admin/commit/ed41e5082fd2e6109c2ad3ff77199d15ac14342a))
-- **tabs:** perf multiple-tabs ([f81c401](https://github.com/anncwb/vue-vben-admin/commit/f81c401959dda4b8d568c00786b691c21abbb59c))
-- **tabs:** perf multiple-tabs ([27e50b4](https://github.com/anncwb/vue-vben-admin/commit/27e50b47479af8eaeb4be020aeb0fcbdb4308295))
-- Add the style injection of the top row to the form. ([#102](https://github.com/anncwb/vue-vben-admin/issues/102)) ([b9d3d60](https://github.com/anncwb/vue-vben-admin/commit/b9d3d60e0f8fe1166a0addcc8295365cbe65a7bf))
-- adjust the logic of ([b350098](https://github.com/anncwb/vue-vben-admin/commit/b350098f442be1b8143b44e09e735179676f755c))
-- code style ([f96d6b2](https://github.com/anncwb/vue-vben-admin/commit/f96d6b221c7ad97e0ed80250acb192b6be92c4a6))
-- enhance openModal and openDrawer ([b6d5e5c](https://github.com/anncwb/vue-vben-admin/commit/b6d5e5c96f89c31d4df11e71f2d4cb5ecf8f0b92))
-- layout code adjustment ([4392917](https://github.com/anncwb/vue-vben-admin/commit/439291746fe237410140575be2a634a74e8ef382))
-- layout style optimization ([7702832](https://github.com/anncwb/vue-vben-admin/commit/77028321816f00799cc3f70d3f0d6bde27c34522))
-- mobile style adjustment ([1899146](https://github.com/anncwb/vue-vben-admin/commit/1899146f71ab2020dc01bd84b282e6b614ad3d57))
-- optimize lazy loading components ([87fcd0d](https://github.com/anncwb/vue-vben-admin/commit/87fcd0d21ea78ce916a4f2b9cdcceda5e7866eee))
-- optimize multiple-tab switching effect ([f2bdf0b](https://github.com/anncwb/vue-vben-admin/commit/f2bdf0b86dd818f3cc59fdb0c55eb1b53b222f7f))
-- optimize preview and ContextMenu functions ([bbfb06f](https://github.com/anncwb/vue-vben-admin/commit/bbfb06f0ad1e345b0e716da730acaf7c0a778e4b))
-- optimize settingDrawer code ([4ff6b73](https://github.com/anncwb/vue-vben-admin/commit/4ff6b73c2bb57764db2bcd8212d82f028e25e36d))
-- optimize tab switching speed ([4baf90a](https://github.com/anncwb/vue-vben-admin/commit/4baf90a5c87493939830129efaa146624faabbcc))
-- optimize the size of the first screen ([968f791](https://github.com/anncwb/vue-vben-admin/commit/968f791f4b7112730813c8c990379051c3f8340d))
-- optimized page switching effect ([5f2a927](https://github.com/anncwb/vue-vben-admin/commit/5f2a927cd50a5efe4c9576528d944553c5243277))
-- perf component ([73c8e0c](https://github.com/anncwb/vue-vben-admin/commit/73c8e0c1583afa83353ff36d1d9ec847776d3016))
-- perf context menu ([6e03e05](https://github.com/anncwb/vue-vben-admin/commit/6e03e05032474c858151b3835eb5318486a56729))
-- perf excel comp code ([eecde4c](https://github.com/anncwb/vue-vben-admin/commit/eecde4c7e947cf392dbd8eace2db8ed9aea417b1))
-- perf loading logic ([f4621cc](https://github.com/anncwb/vue-vben-admin/commit/f4621cc66411d8ff4ca852b548a79cd3da9be1ce))
-- perf menu ([88f4a3f](https://github.com/anncwb/vue-vben-admin/commit/88f4a3f02a0c0f35953c93427fe700d414b6ec50))
-- perf menu mini style ([66acb21](https://github.com/anncwb/vue-vben-admin/commit/66acb21edda3fcac61849c7c03c6b396992d8d06))
-- perf modal and drawer ([81baf1d](https://github.com/anncwb/vue-vben-admin/commit/81baf1d5c4606aab83c0e65397ce4b090c2e4e08))
-- tsx use useExpose ([9bb7514](https://github.com/anncwb/vue-vben-admin/commit/9bb751475dc212d4e2829468cf1a11502137071e))
-- **button:** delete the button component useless code ([bdce845](https://github.com/anncwb/vue-vben-admin/commit/bdce84537aa58b9507744a3a14c8d598e88e95fc))
-- **drawer:** perf drawer ([28f7f7b](https://github.com/anncwb/vue-vben-admin/commit/28f7f7bf7f3ae49759b44395f6b06c2c61359d04))
-- **lazy-container:** optimize lazyContainer code ([0f4b847](https://github.com/anncwb/vue-vben-admin/commit/0f4b847d69e90e5bbb4fb0883fb5ea1dd1daf1e7))
-- **logo:** optimize logo code ([e79e540](https://github.com/anncwb/vue-vben-admin/commit/e79e540b48be80fb08b67a99e64bede3816b2c9e))
-- **menu:** optimize layout menu ([96c10d6](https://github.com/anncwb/vue-vben-admin/commit/96c10d6c0fb46b56b0e74e09a8e20bcfc9f54cde))
-- **modal:** optimize table embedding height calculation problem ([9abf176](https://github.com/anncwb/vue-vben-admin/commit/9abf1763c78ead7de21ece6d328337a6a1da5f05))
-- **strength-meter:** modify name word ([#38](https://github.com/anncwb/vue-vben-admin/issues/38)) ([19477cd](https://github.com/anncwb/vue-vben-admin/commit/19477cd980661ace337ec6e3295f76c44d05763c))
-- **table:** optimize effect performance ([a1ffb61](https://github.com/anncwb/vue-vben-admin/commit/a1ffb61804940f1ebaea741b0df41485ad95d5f2))
-- **upload:** improve upload component ([661db0c](https://github.com/anncwb/vue-vben-admin/commit/661db0c767772bb7a30da9d3eeaf2b47858ccf0b))
-- **use-message:** fix typo ([bcab4b7](https://github.com/anncwb/vue-vben-admin/commit/bcab4b774d384a5de9b87a0c700a9937c79eb5cd))
-- perf TableAction ([4b384b1](https://github.com/anncwb/vue-vben-admin/commit/4b384b137c58428f0cf28621e183250da4576479))
-- performance optimization ([70fba7e](https://github.com/anncwb/vue-vben-admin/commit/70fba7ecac80a1cd8ec08052e8265641f2b56204))
-- pwa icon ([404c73d](https://github.com/anncwb/vue-vben-admin/commit/404c73de450c165ffe623ca2969322bae1786a73))
-- remove optional chain ([e034d1b](https://github.com/anncwb/vue-vben-admin/commit/e034d1bacc5501a83188d20129951422bc127e3b))
-- review tinymce code ([f75425d](https://github.com/anncwb/vue-vben-admin/commit/f75425d13bc9f6003021fd4b5d6451ae096c09b7))
-- set cache default time ([c620f82](https://github.com/anncwb/vue-vben-admin/commit/c620f8279f1056ddab84b3907fb50b3af4fe9247))
-- tabs optimization ([6e40051](https://github.com/anncwb/vue-vben-admin/commit/6e4005111db58ca10f10e9aa4bca4aec57363736))
-- the existing tab switching no longer displays animation and processbar ([e9536b5](https://github.com/anncwb/vue-vben-admin/commit/e9536b5b7ccc5f667496c4ec7ab838738f804a71))
-- the routeModule can ignore the layou configuration without writing ([4c658f4](https://github.com/anncwb/vue-vben-admin/commit/4c658f4868c7df6e0b8f18728c5d5ae53b04448a))
-- update form types ([a0c3197](https://github.com/anncwb/vue-vben-admin/commit/a0c3197454b59a231cf6d27048b2e9c0bd7bf77f))
-
-### Reverts
-
-- **table:** revert form type annotation ([261936b](https://github.com/anncwb/vue-vben-admin/commit/261936b117d1d261ecb8fafc0f6c839cb2913918))
-
-# [2.0.0-beta.3](https://github.com/anncwb/vue-vben-admin/compare/2.0.0-beta.2...2.0.0-beta.3) (2020-10-07)
-
-### Features
-
-- **setting:** add openNProgress setting ([67d0ff0](https://github.com/anncwb/vue-vben-admin/commit/67d0ff0e251f584883d50fd71b2413b6ca94729d))
-- **table:** add table component ([faf3f46](https://github.com/anncwb/vue-vben-admin/commit/faf3f4602ecf4b16ff57994668edc8433a43945d))
-
-# [2.0.0-beta.2](https://github.com/anncwb/vue-vben-admin/compare/2.0.0-beta.1...2.0.0-beta.2) (2020-10-07)
-
-### Features
-
-- **img-preview:** add imgPreview componnt ([e6093aa](https://github.com/anncwb/vue-vben-admin/commit/e6093aa4f48f3b3c16b1640c56512e6e3cf84c4b))
-
-# [2.0.0-beta.1](https://github.com/anncwb/vue-vben-admin/compare/2f268ca8f43d98687ffd809e2c1d140d29033bd6...2.0.0-beta.1) (2020-09-30)
-
-### Bug Fixes
-
-- fix form,transition,build bug ([2f268ca](https://github.com/anncwb/vue-vben-admin/commit/2f268ca8f43d98687ffd809e2c1d140d29033bd6))

+ 0 - 887
CHANGELOG.zh_CN.md

@@ -1,887 +0,0 @@
-## 2.1.0 (2021-03-15)
-
-### ✨ Refactor
-
-- 重构路由多层模式,解决嵌套 keepalive 执行多次问题
-
-## 2.1.0 (2021-03-15)
-
-### ✨ Refactor
-
-- 重构路由多层模式,解决嵌套 keepalive 执行多次问题
-
-### 🐛 Bug Fixes
-
-- 确保 CountDownInput 组件重置清空值
-- 修复分割模式下在小屏幕中显示问题
-
-## 2.1.0 (2021-03-15)
-
-### ✨ Features
-
-- 图标选择器新增 svg 模式
-- 新增时间组件
-- 新增高德/百度/谷歌地图示例
-
-### ✨ Refactor
-
-- 重构项目以解决循环依赖项导致的热更新问题
-- 移除 vueHelper/useClickoutside,使用@vueuse/core 代替
-
-### 🐛 Bug Fixes
-
-- 确保 `table action` 的值被正确更新
-- 修复页面切换的动画无法关闭
-- 修复`PageWrapper`title 不显示
-- 修复表格已知问题
-- 修复 BasicTree 组件不能自定义 title 问题
-- 修复主题切换后按钮样式问题
-
-## 2.0.3 (2021-03-07)
-
-### ✨ Features
-
-- `BasicTree` 新增`clickRowToExpand`,用于单击树节点展开
-- 新增 SvgIcon 插件及示例
-- 账号管理界面增加左侧部门树·
-
-### ⚡ Performance Improvements
-
-- 表格关闭分页时不再携带分页参数
-- 登录页监听回车事件进行登录
-- 当表格设置自适应大小时,根据屏幕来铺满了高度.
-- Tree 滚动条优化
-- 优化本地开发加载速度
-
-### 🐛 Bug Fixes
-
-- 修复`Description`已知问题
-- 修复`BasicForm`已知问题
-- 修复`BasicTree`下 ActionItem 的 show 属性逻辑问题
-- 修复树组件 demo 示例样式错误
-- 修复账号管理新增未清空旧数据
-- form 组件应允许 setFieldsValue 方法值为 null 或者 undefined
-- 确保单级面包屑正确跳转
-- 确保 Form 组件不校验隐藏的表单项
-
-## 2.0.2 (2021-03-04)
-
-### ✨ Refactor
-
-- 重构多语言模块,支持懒加载及远程加载
-
-### ✨ Features
-
-- axios 支持 form-data 格式请求
-- 新增图标选择器组件(支持本地和在线方式)
-- 新增 WebSocket 示例和服务脚本
-- Tree 组件新增 `renderIcon` 属性用于控制层级图标显示
-- Tree->actionItem 新增 show 属性,用于动态控制按钮显示
-- Tree 新增工具栏/title/搜索功能
-- 新增部门管理/修改密码/账号管理/角色管理/菜单管理示例界面
-
-### ⚡ Performance Improvements
-
-- 登录界面动画优化
-- 修复 github 仓库体积过大问题.
-- 默认隐藏表格全屏按钮
-- `crypto-es`改为`crypto-js`,减小打包体积
-- `types`目录移动到根目录,兼容其他目录全局类型
-
-### 🐛 Bug Fixes
-
-- 修复验证码组件警告问题
-- 修复表格不能正确的获取选中行
-- 修复全屏状态下 modal 高度计算错误
-- 修复部分表格样式问题
-- 修复树形表格 `indentSize`设置失效
-
-## 2.0.1 (2021-02-21)
-
-### ✨ Refactor
-
-- 登录页重构,新增注册页面/重置密码页面/手机登录/二维码登录
-
-### ✨ Features
-
-- 新增 `settingButtonPosition`配置项,用于配置`设置`按钮位置
-- `modal`可以通过双击头部切换全屏
-- 新增`CountDownInput`组件
-
-### ⚡ Performance Improvements
-
-- 优化可编辑居中样式及下拉框宽度过短
-- 表格新增编辑时`edit-change`事件监听
-
-### 🐛 Bug Fixes
-
-- 修复图片预览样式错误
-- 修复图标样式问题
-- 修复可编辑表格下拉回显问题
-
-## 2.0.0 (2021-02-18)
-
-## (破坏性更新) Breaking changes
-
-- `echarts` 升级到 5.0,并且进行按需引入(只需使用 `useECharts` 即可).
-
-### ✨ Refactor
-
-- 移除`global.less`,`mixin.less`,`design/helper`,由`windicss`代替,有用到的需要修改对应的样式
-
-### ✨ Features
-
-- useModal 新增返回值函数 `redoModalHeight`,用于在 modal 内为动态内容时刷新 modal 高度
-- 升级 husky 到 5.0
-- 新增 `brotli`|`gzip`压缩及相关测试命令
-- 重新引入 `windicss` (与`tailwind`一样).在速度上更快
-
-### ⚡ Performance Improvements
-
-- 调整获取用户信息接口返回值为数组格式
-- 将 error-log 列表固定为系统路由
-
-### 🐛 Bug Fixes
-
-- 修复 Upload 组件 maxNumber 失效问题
-- 修复打包 sourcemap 报错
-- 修复代码 debugger 位置显示错误
-- 修复 mock 插件 post 请求错误问题
-- 修复部分主题颜色值错误
-- 修复表格在可编辑行状态回车确认
-
-### 🎫 Chores
-
-- 文档更新
-- 升级 ant-design-vue 到 `2.0.0`
-- 升级 vite 到 `2.0.0`
-
-## 2.0.0-rc.18 (2021-02-05)
-
-### ✨ Features
-
-- `ApiSelect`新增 `numberToString`属性,用于将 value 为`number`的值全部转化为`string`
-- 新增主题色切换
-- 打包图片压缩
-
-### ⚡ Performance Improvements
-
-当不使用 mock 时,将 `mock.js` 移出打包文件
-
-### 🐛 Bug Fixes
-
-- 修复 modal 高度计算错误
-- 修复菜单折叠状态下点击标签页弹出菜单
-- 修复 form 表单初始化值为 0 问题
-- 修复表格换行问题
-- 修复菜单外链不跳转
-- 修复菜单顶部显示问题
-- 修复`modifyVars`配置失效问题
-
-## 2.0.0-rc.17 (2021-01-18)
-
-### ✨ Refactor
-
-- 新增 `SimpleMenu`组件替代左侧菜单组件(顶部菜单没有替换,功能尽量做到简单不卡)。解决菜单卡顿问题。
-- `ant-design-vue`组件不再全局注册。以便于更好配合 css 按需引入。如果需要全局注册,需要自己加
-
-### ✨ Features
-
-- `css` 按需引入
-
-### 🐛 Bug Fixes
-
-- 修复 `TableAction`图标问题
-- 修复菜单折叠按钮丢失问题
-- 修复菜单相关问题
-- 修复 moment 多语言问题
-
-## 2.0.0-rc.16 (2021-01-12)
-
-### ✨ Refactor
-
-- 独立组件配置到 `/@/settings/componentsSetting`
-- `colorSetting`和`designSetting`现在合并为`designSetting`
-- `ant-design-vue`组件注册移动到`components/registerComponent`
-- 移除 `setup` 文件夹
-- 升级到`vite2`
-- 图片预览改为`Image`组件实现,暂时移除函数式使用方式
-
-### ✨ Features
-
-- 新增`mixSideTrigger`配置。用于配置左侧混合模式菜单打开方式。可选`hover`,默认`click`
-- 新增`mixSideFixed`配置。用于固定左侧混合模式菜单
-- modal 组件新增`height`和`min-height`属性
-- 新增`PageWrapper`组件。并应用于示例页面
-- 新增标签页折叠功能
-- 兼容旧版浏览器
-- tinymce 新增图片上传
-
-### 🐛 Bug Fixes
-
-- 修复表格列配置已知问题
-- 恢复 table 的`isTreeTable`属性
-- 修复表格内存溢出问题
-- 修复`layout` 收缩展开功能在分割模式下失效
-- 修复 modal 高度计算错误
-- 修复文件上传错误
-- 修复表格已知问题
-
-### 🎫 Chores
-
-- 文档更新
-
-## 2.0.0-rc.15 (2020-12-31)
-
-### ✨ 表格破坏性更新
-
-- 重构了可编辑单元格及可编辑行。具体看示例。写法已改变。针对可编辑表格。
-
-- 表格编辑支持表单校验
-
-- 在表格列配置增加了以下配置
-
-```bash
-{
-
-  # 默认是否显示列。不显示的可以在列配置打开
-  defaultHidden?: boolean;
-  # 列头右侧帮助文本
-  helpMessage?: string | string[];
-  # 自定义格式化 单元格内容。 支持时间/枚举自动转化
-  format?: CellFormat;
-
-  # Editable
-  # 是否是可编辑单元格
-  edit?: boolean;
-  # 是否是可编辑行
-  editRow?: boolean;
-  # 编辑状态。
-  editable?: boolean;
-  #  编辑组件
-  editComponent?: ComponentType;
-  # 所对应组件的参数
-  editComponentProps?: Recordable;
-  # 校验
-  editRule?: boolean | ((text: string, record: Recordable) => Promise<string>);
-  # 值枚举转化
-  editValueMap?: (value: any) => string;
-  # 触发编辑正航
-  record.onEditRow?: () => void;
-}
-
-```
-
-### ✨ 表格重构
-
-- 新增`clickToRowSelect`属性。用于控制点击行是否选中勾选框
-- 监听行点击事件
-- 表格列配置按钮增加 列拖拽,列固定功能。
-- 表格列配置新增`defaultHidden` 属性。用于默认隐藏。可在表格列配置勾选显示
-- 更强大的列配置
-- useTable:支持动态改变参数。可以传入`Ref`类型与`Computed`类型进行动态更改
-- useTable:新增返回 `getForm`函数。可以用于操作表格内的表单
-- 修复表格已知的问题
-
-### ✨ Features
-
-- 新增 `v-ripple`水波纹指令
-- 新增左侧菜单混合模式
-- 新增 markdown 嵌入表单内示例
-- 新增主框架外页面示例
-- `route.meta` 新增`currentActiveMenu`,`hideTab`,`hideMenu`参数 用于控制详情页面包屑级菜单显示隐藏。
-- 新增面包屑导航示例
-- form: 新增`suffix`属性,用于配置后缀内容
-- form: 新增远程下拉`ApiSelect`及示例
-- form: 新增`autoFocusFirstItem`配置。用于配置是否聚焦表单第一个输入框
-- useForm: 支持动态改变参数。可以传入`Ref`类型与`Computed`类型进行动态更改
-
-### ⚡ Performance Improvements
-
-- 优化`modal`与`drawer`滚动条组件
-- table: 移除 `isTreeTable`属性
-- 全局引入`less`文件。无需手动在组件再次引入
-
-### 🎫 Chores
-
-- 升级`ant-design-vue`到`2.0.0-rc.7`
-- 升级`vue`到`3.0.5`
-
-### 🐛 Bug Fixes
-
-- 修复混合模式下滚动条丢失问题
-- 修复环境变量配置失效以及 history 模式下 logo 地址问题
-- 修复图表库切换页面导致宽高计算错误
-- 修复多语言配置 `Locale.show`导致配置不生效
-- 修复路由类型错误
-- 修复菜单分割时权限失效问题
-- 关闭多标签页时 iframe 提前加载
-- 修复`modal`与`drawer`已知问题
-- 修复左侧菜单混合模式适配问题
-
-## 2.0.0-rc.14 (2020-12-15)
-
-### ✨ Features
-
-- 移除左侧菜单搜索,新增顶部菜单搜索功能
-- layout 移动端适配。业务页面未适配
-- axios 加入 joinTime 配置。控制响应是否加入时间戳
-
-### ⚡ Performance Improvements
-
-- 异步引入组件
-- 优化整体结构
-- 替换菜单默认滚动条为滚动组件
-- 菜单性能优化
-
-### 🎫 Chores
-
-- 返回顶部样式调整,避免遮住其他元素
-- 升级`ant-design-vue`到`2.0.0-rc.5`
-- 刷新按钮布局调整
-- `route.meta` 移除 `externalLink` 属性
-
-### ✨ Refactor
-
-- `openModal`与`openDrawer`第三个参数`openOnSet`默认设置为 true
-
-### 🐛 Bug Fixes
-
-- 修复多级路由缓存导致组件渲染多次的问题
-- 修复地图图表切换后消失问题
-- 修复登录成功 notify 消失问题
-- 修改 `VirtualScroll`和`ImportExcel`组件名为`VScroll`与`ImpExcel`,暂时解决含有关键字的组件在 vue 模版内使用内存溢出
-- 修复 axios 大小写问题
-- 修复按钮样式问题
-- 修复菜单分割模式问题
-- 修复 `Modal`与`Drawer`组件在使用 emits 数据传递失效问题
-- 修复菜单已知问题
-- 修复上传组件 api 失效问题
-- 修复菜单权限过滤失效问题
-
-## 2.0.0-rc.13 (2020-12-10)
-
-## (破坏性更新) Breaking changes
-
-- 路由重构, 不再支持以前的格式。改为支持 vue-router 最初的默认结构,具体格式可以参考示例更改。实现多级路由缓存,不再将路由转化为 2 级。
-- 重构面包屑,使用 antd 的面包屑组件。之前的组件已删除
-
-### ✨ Features
-
-- 还原 antdv 默认 loading,重构 `Loading` 组件,增加`useLoading`和`v-loading`指令。并增加示例
-- i18n 支持 vscode `i18n-ally`插件
-- 新增多级路由缓存示例
-- 打包代码拆分(试验)
-- 提取上传地址到全局变量,打包可以动态配置
-
-### ✨ Refactor
-
-- tree 组件 ref 函数调用删除 `$`
-- 锁屏界面重构美化,删除不必要的背景图片
-
-### ⚡ Performance Improvements
-
-- 页面切换 loading 逻辑修改。对于已经加载过的页面不管有没有关闭,再次打开不会在显示 loading(已经打开过的页面再次打开速度比较快,可以不需要 loading,同理顶部进度条逻辑也一样),刷新后恢复。
-
-### 🎫 Chores
-
-- 首屏 loading 修改
-- 升级`vue`到`3.0.4`
-- 升级`ant-design-vue`到`2.0.0-rc.3`
-- 重新引入`vueuse`
-- 移除 route meta 内的`afterCloseLoading`属性
-- 文档更新
-
-### 🐛 Bug Fixes
-
-- 修复表格 i18n 错误
-- 修复菜单图标大小不一致
-- 修复顶部菜单宽度计算问题
-- 修复表格 tabSetting 问题
-- 修复文件上传删除失效
-- 修复表格行编辑保存错误问题
-
-## 2.0.0-rc.12 (2020-11-30)
-
-## (破坏性更新) Breaking changes
-
-- ClickOutSide 组件引入方式由 `import ClickOutSide from '/@/components/ClickOutSide/index.vue'`变更为`import { ClickOutSide } from '/@/components/ClickOutSide'`
-- Button 组件引入方式由 `import Button from '/@/components/Button/index.vue'`变更为`import { Button } from '/@/components/Button'`
-- StrengthMeter 组件引入方式由 `import StrengthMeter from '/@/components/StrengthMeter'`变更为`import { StrengthMeter } from '/@/components/StrengthMeter'`
-- 除示例外加入全局国际化功能,支持中文与英文
-
-### ✨ Refactor
-
-- 重构整体 layout。更改代码实现方式。代码更精简
-- 配置项重构
-- 移除 messageSetting 配置
-- BasicTitle 组件 `showSpan`=> `span`
-
-### ✨ Features
-
-- 缓存可以配置是否加密,默认生产环境开启 Aes 加密
-- 新增标签页拖拽排序
-- 新增 LayoutFooter.默认显示,可以在配置内关闭
-
-### ⚡ Performance Improvements
-
-- 优化`Modal`组件全屏动画不流畅问题
-
-### 🐛 Bug Fixes
-
-- tree: 修复文本超出挡住操作按钮问题
-- useRedo: 修复通过 useRedo 刷新页面参数丢失问题
-- form: 修复表单校验先设置在校验及控制台错误信息问题
-- `modal`&`drawer` 修复组件传递数组参数问题
-- form: 修复`updateSchema`赋值含有`[]`时不生效
-- table: 修复表格 `TableAction` 图标显示问题
-- table: 修复表格列设置通过`setColumns`设置不显示
-
-### 🎫 Chores
-
-- 更新 antdv 到`2.0.0-rc.2`
-- 更新 vue 到`3.0.3`
-- 更新 vite 到`1.0.0.rc13`
-- 暂时删除 `@vueuse/core`.等稳定后在集成。目前不太稳定。
-
-## 2.0.0-rc.11 (2020-11-18)
-
-### ✨ Features
-
-- 新增 base64 文件流下载
-- 优化上传组件及示例
-- 新增可编辑行示例
-- 新增个人页
-- 新增表单页
-- 新增详情页
-- 将上传组件默认集成到 form
-
-### 🎫 Chores
-
-- 更新 antdv 到`2.0.0-rc.1`(暂时还原到 beta15,rc1 菜单卡顿太严重.)
-- 添加部分注释
-
-### ✨ Refactor
-
-- 移除`useModal`与`useDrawer`的`receiveDrawerDataRef`和`transferDrawerData`属性
-- `useModal`与`useDrawer`对应的`openModal`与`openDrawer`扩展第三个参数。用于再次打开触发回调
-
-### 🐛 Bug Fixes
-
-- 修复表单 inputNumber 校验错误
-- 修复表单默认值设置错误
-- 修复菜单折叠按钮隐藏时占位问题
-- 修复表单 baseColProps 不生效
-
-## 2.0.0-rc.10 (2020-11-13)
-
-### ✨ Refactor
-
-- 重构 hook,引入 `@vueuse`,删除其中已有的`hook`,优化现有的 hook
-- `useEvent` 更名->`useEventListener`
-- 表单`ComponentType`删除 `SelectOptGroup`,`SelectOption`,`Transfer`,`Radio`,四个类型。修改`RadioButtonGroup`组件
-
-### ✨ Features
-
-- 表单项的`componentsProps`支持函数类型
-- 菜单新增 tag 显示,支持 4 中类型颜色及 dot 圆点显示
-- 新增菜单及顶栏颜色选择配色
-- 增加示例结果页
-- 新增文件下载示例
-
-### ⚡ Wip
-
-- 上传组件(未完成,测试中...)
-
-### ⚡ Performance Improvements
-
-- 优化 settingDrawer 代码
-- 优化多标签页切换速度
-- 增加表单自定义及动态能力
-
-### 🐛 Bug Fixes
-
-- 修复多个富文本编辑器只显示一个
-- 修复登录过期后重新登录未跳转原来页面的
-- 修复 window 系统动态引入错误
-- 修复页面类型错误
-- 修复表单 switch 和 checkBox 单独使用报错
-
-## 2.0.0-rc.9 (2020-11-9)
-
-### ✨ Features
-
-- 菜单 trigger 可以选择位置
-- 增加富文本嵌入表单的示例
-- 表单组件 schema 增加 `required`属性。简化配置
-- openModal 和 openDrawer 第二个参数可以代替`transferModalData`传参到内部
-- 带参路由可以被缓存
-
-### ✨ Refactor
-
-- 重构由后台生成菜单的逻辑
-- Route Module 结构改造
-
-### ⚡ Performance Improvements
-
-- 菜单性能继续优化,更流畅
-- 优化懒加载组件及示例
-- layout 样式微调
-
-### 🎫 Chores
-
-- 删除菜单背景图
-- 更新`ant-design-vue`版本为`beta15`
-- 更新`vite`版本为`rc.9`
-- 异常页调整
-- `BasicTitle` 色块默认不显示
-
-### 🐛 Bug Fixes
-
-- 修复升级之后 table 类型问题
-- 修复分割菜单且左侧菜单没有数据时候,继续展示上一次子菜单的问题
-- 修复`useMessage`类型问题
-- 修复表单项设置`disabled`不生效问题
-- 修复`useECharts`在`resize`时不能自适应,报错
-- 修复`useWatermark`在清空后`resize`未删除
-- 修复表单校验问题
-- 修复多级表头配置不生效问题
-
-## 2.0.0-rc.8 (2020-11-2)
-
-### ✨ Features
-
-- 全局 loading 添加文本
-- 右键菜单支持多级
-
-### 🎫 Chores
-
-- 登录缓存从 sessionStorage 改为 LocalStorage
-
-### ⚡ Performance Improvements
-
-- 更新`ant-design-vue`到`beta.12`
-- Layout 界面布局样式调整
-- 优化懒加载组件
-- 优化表格渲染性能
-- 表单折叠搜索添图标添加动画
-- routeModule 可以忽略 layout 配置不写。方便配置一级菜单
-
-### 🐛 Bug Fixes
-
-- 修复表格类型错误
-- 修复 mock 分页工具错误
-- 修复表格开启搜索表单折叠问题
-- 修复表格 size 为 samll 时候,fixed 列样式问题
-- 修复多标签页关闭报错问题
-- 修复 message 类型错误
-
-## 2.0.0-rc.7 (2020-10-31)
-
-### ✨ Features
-
-- 表单组件现在支持直接传入 model 直接进行 set 操作,参考**组件->弹窗扩展->打开弹窗并传递数据**
-
-- modal 的 useModalInner 现在支持传入回调函数,用于接收外部`transferModalData`传进来的值,
-
-  - 用于处理打开弹窗对表单等组件的设置值。参考**组件->弹窗扩展->打开弹窗并传递数据**
-  - `receiveModalDataRef`这个值暂时保留。尽量少用。后续可能会删除。
-
-- drawer 的 useDrawerInner 现在支持传入回调函数,用于接收外部`transferModalData`传进来的值,
-  - 用于处理打开抽屉对表单等组件的设置值。参考**组件->抽屉扩展->打开抽屉并传递数据**
-  - `receiveModalDataRef`这个值暂时保留。尽量少用。后续可能会删除。
-
-### ✨ Refactor
-
-- 表单代码优化重构
-
-### ⚡ Performance Improvements
-
-- Modal slot 可以覆盖
-- 优化表格嵌入高度计算问题
-
-### 🎫 Chores
-
-- 添加部分注释
-- pwa 图标补充
-- types 类型调整
-- 升级`ant-design-vue`到`beta.11`,并修改带来的已知问题,部分问题发现后在解决
-
-### 🐛 Bug Fixes
-
-- 修复本地代理 post 接口到 https 地址超时错误
-- 修复 modal 在不显示 footer 的时候全屏高度计算问题
-- 修复表单重置未删除校验信息错误
-- 修复顶部菜单分割模式样式问题
-- 修复表格展开图标动画失效
-
-## 2.0.0-rc.6 (2020-10-28)
-
-### ✨ Features
-
-- 新增`pwa`功能,可在`.env.production`开启
-- Button 组件扩展 `preIcon`和`postIcon`属性用于在文本前后添加图标
-- 恢复面包屑显示图标功能
-
-### 🎫 Chores
-
-- 升级 vite 版本为`v1.0.0.rc8`
-- vite.config.ts 内部 plugins 抽取
-- build 目录结构调整
-- 依赖更新
-- 文档更新
-- 修改默认路由切换动画
-
-### ⚡ Performance Improvements
-
-- `setTitle`逻辑调整
-- 将系统用到的 sessionStorage 及 LocalStorage 缓存设置默认 `7` 天过期
-
-### ✨ Refactor
-
-- 独立出`vite-plugin-html`,并修改相关插入 html 的逻辑
-
-### 🐛 Bug Fixes
-
-- 修复热更新时多次注册组件警告问题
-- 修复登录后出现登录标签页
-- 修复路由切换参数消失问题
-- 修复 useMessage 图标样式问题
-
-## 2.0.0-rc.5 (2020-10-26)
-
-### ✨ Features
-
-- 更新组件文档
-- 面包屑支持显示图标
-- 新增 tinymce 富文本组件
-- 表单新增 submitOnReset 控制是否在重置时重新发起请求
-- 表格新增`sortFn`支持自定义排序
-- 新增动画组件及示例
-- 新增懒加载/延时加载组件及示例
-
-### ✨ Refactor
-
-- Drawer 组件的 detailType 修改为 isDetail
-
-### 🎫 Chores
-
-- 删除代码内的可选链语法
-- 表单重置逻辑修改
-- 关闭多标签页 tabs 动画
-- 升级 vite 版本为`v1.0.0.rc6`
-- 删除中文路径警告。rc6 已修复
-
-### 🐛 Bug Fixes
-
-- 修复抽屉组件自动高度及显示 footer 显示问题
-- 修复表单查询后重置回默认值
-- 修复菜单没有子节点时显示折叠的问题
-- 修复面包屑显示样式问题
-- 修复 modal 在 destroyOnClose=true 时多次打开拖拽失效
-- 修复表格出现多个 action 列
-
-# 2.0.0-rc.4 (2020-10-21)
-
-### ✨ Features
-
-- 表格新增配置工具栏
-- 新增消息通知模块
-
-### 🎫 Chores
-
-- 表格默认不显示边框
-- 依赖更新
-- 更新 vue 为`v3.0.2`
-- 界面样式微调
-
-### ⚡ Performance Improvements
-
-- 优化首屏体积大小
-- 优化 TableAction 组件
-- 减小菜单折叠宽度
-
-### 🐛 Bug Fixes
-
-- 修复一级菜单折叠显示菜单名问题
-- 修复预览命令不打包问题
-- 修复表格 actionColOptions 参数不生效问题
-- 修复表格刷新表单 loading 不生效问题
-- 修复带参界面刷新参数丢失问题
-
-# 2.0.0-rc.3 (2020-10-19)
-
-### ✨ Features
-
-- 新增 excel 组件及 excel/xml/csv/html 导出示例
-- 新增 excel 导入示例
-- 新增全局错误处理
-- 新增 markdown 组件及示例
-- 新增折叠菜单时可显示菜单名
-
-### Docs
-
-- 添加项目文档
-
-### 🎫 Chores
-
-- 升级依赖
-- 其他细节优化
-
-### 🐛 Bug Fixes
-
-- 修复顶部菜单自适应问题
-- 修复 window 系统打包报错问题
-
-# 2.0.0-rc.2 (2020-10-17)
-
-### ✨ Features
-
-- 打包可以配置输出`gizp`
-- 打包可以配置删除`console`
-- 路由及菜单不需要在手动引入,改为自动引入
-
-### 🎫 Chores
-
-- 升级 vue 到`3.0.1`
-- 将`vite`版本改为每日构建版本
-
-### 🐛 Bug Fixes
-
-- 修复菜单报错
-- 修复表格自适应高度问题
-- 修复`window系统`执行 script 报错问题
-- 修复折叠组件问题
-
-### ⚡ Performance Improvements
-
-- 删除菜单最小化背景
-- 阻止页面刷新重新渲染菜单
-- 其他一些细节优化
-
-# 2.0.0-rc.1 (2020-10-14)
-
-### ✨ Features
-
-- 添加带参 tab
-
-### ⚡ Performance Improvements
-
-- 菜单折叠优化
-- 页面细节优化
-- 打包后压缩 html
-- 预览组件及右键菜单函数化重构
-- 预览组件操作列居中
-
-### 🎫 Chores
-
-- 更新依赖
-- 添加`README.en-US.md`
-- 添加`CHANGELOG.en-US.md`
-
-### 🐛 Bug Fixes
-
-- 修复页面刷新跳转到登陆页
-
-# 2.0.0-beta.7 (2020-10-12)
-
-### ⚡ Performance Improvements
-
-- 现有的选项卡切换不再显示动画和和进度条
-
-### ✨ Features
-
-- 新增 `CountTo`组件及示例 demo
-- 项目配置文件新增 `closeMessageOnSwitch`和`removeAllHttpPending`
-- 生产环境独立出配置文件,用于动态配置项目配置
-- 新增 `useEcharts`和`useApexChart`来方便图表使用,同时新增相关 demo
-- 新增工作台界面
-- 新增分析页界面
-
-### 🎫 Chores
-
-- 更新依赖
-
-### 🐛 Bug Fixes
-
-- 修复路由切换,tab 未激活问题
-
-# 2.0.0-beta.56 (2020-10-11)
-
-### 💄 Styles
-
-- 菜单样式调整
-
-### 🐛 Bug Fixes
-
-- 修复可编辑表格不能输入问题
-- 修复打包报错,生产环境不需要设计 proxy
-
-### ⚡ Performance Improvements
-
-- 优化多标签页切换速度
-- 首屏加载动画
-
-# 2.0.0-beta.5 (2020-10-10)
-
-### ♻ Code Refactoring
-
-- 删除`tailwind css`
-
-### ⚡ Performance Improvements
-
-- 优化页面切换速度
-
-### 🎫 Chores
-
-- 添加 `.vscode`和`.github`配置
-- 更改菜单图标
-- 新增`.env`配置文件
-- 更新 readme.md
-
-### 🐛 Bug Fixes
-
-- 修复`Tree`组件勾选事件失效问题
-
-# 2.0.0-beta.4 (2020-10-08)
-
-### 🎫 Chores
-
-- 删除多余依赖
-
-### 🐛 Bug Fixes
-
-- 修复页面刷新空白
-- 修复表格在生产环境样式失效
-
-# 2.0.0-beta.3 (2020-10-07)
-
-### ✨ Features
-
-- 项目配置文件新增`openNProgress`用于控制是否开启顶部控制条
-- 添加`table`组件及 demo
-
-### 🎫 Chores
-
-- 添加` github workflows`
-
-# 2.0.0-beta.2 (2020-10-07)
-
-### ✨ Features
-
-- 新增图片预览组件
-
-### 🔧 Continuous Integration
-
-- 增加 githubAction 脚本
-
-# 2.0.0-beta.1(2020-09-30)
-
-### 🎫 Chores
-
-- 从 1.0 迁移部分代码
-- 添加 README.md 描述文件
-
-### 🐛 Bug Fixes
-
-- 修复表单,动画及打包失败问题

+ 5 - 1
package.json

@@ -38,11 +38,11 @@
     "ant-design-vue": "2.0.1",
     "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",
@@ -82,7 +82,11 @@
     "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",
     "esno": "^0.5.0",
     "fs-extra": "^9.1.0",

+ 5 - 5
prettier.config.js

@@ -2,19 +2,19 @@ module.exports = {
   printWidth: 100,
   tabWidth: 2,
   useTabs: false,
-  semi: true,
+  semi: false,
   vueIndentScriptAndStyle: true,
   singleQuote: true,
   quoteProps: 'as-needed',
   bracketSpacing: true,
-  trailingComma: 'es5',
+  trailingComma: 'none',
   jsxBracketSameLine: false,
   jsxSingleQuote: false,
-  arrowParens: 'always',
+  arrowParens: 'avoid',
   insertPragma: false,
   requirePragma: false,
   proseWrap: 'never',
   htmlWhitespaceSensitivity: 'strict',
   endOfLine: 'lf',
-  rangeStart: 0,
-};
+  rangeStart: 0
+}

+ 12 - 12
src/App.vue

@@ -7,29 +7,29 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { ConfigProvider } from 'ant-design-vue';
-  import { AppProvider } from '/@/components/Application';
+  import { defineComponent } from 'vue'
+  import { ConfigProvider } from 'ant-design-vue'
+  import { AppProvider } from '/@/components/Application'
 
-  import { initAppConfigStore } from '/@/logics/initAppConfig';
+  import { initAppConfigStore } from '/@/logics/initAppConfig'
 
-  import { useLockPage } from '/@/hooks/web/useLockPage';
-  import { useLocale } from '/@/locales/useLocale';
+  import { useLockPage } from '/@/hooks/web/useLockPage'
+  import { useLocale } from '/@/locales/useLocale'
 
   export default defineComponent({
     name: 'App',
     components: { ConfigProvider, AppProvider },
     setup() {
       // support Multi-language
-      const { getAntdLocale } = useLocale();
+      const { getAntdLocale } = useLocale()
 
       // Initialize vuex internal system configuration
-      initAppConfigStore();
+      initAppConfigStore()
 
       // Create a lock screen monitor
-      const lockEvent = useLockPage();
+      const lockEvent = useLockPage()
 
-      return { getAntdLocale, lockEvent };
-    },
-  });
+      return { getAntdLocale, lockEvent }
+    }
+  })
 </script>

+ 25 - 25
src/components/Application/src/AppLocalePicker.vue

@@ -18,16 +18,16 @@
   </Dropdown>
 </template>
 <script lang="ts">
-  import type { LocaleType } from '/#/config';
-  import type { DropMenu } from '/@/components/Dropdown';
+  import type { LocaleType } from '/#/config'
+  import type { DropMenu } from '/@/components/Dropdown'
 
-  import { defineComponent, ref, watchEffect, unref, computed } from 'vue';
-  import { Dropdown } from '/@/components/Dropdown';
-  import Icon from '/@/components/Icon';
+  import { defineComponent, ref, watchEffect, unref, computed } from 'vue'
+  import { Dropdown } from '/@/components/Dropdown'
+  import Icon from '/@/components/Icon'
 
-  import { useLocale } from '/@/locales/useLocale';
-  import { localeList } from '/@/settings/localeSetting';
-  import { propTypes } from '/@/utils/propTypes';
+  import { useLocale } from '/@/locales/useLocale'
+  import { localeList } from '/@/settings/localeSetting'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'AppLocalPicker',
@@ -36,37 +36,37 @@
       // Whether to display text
       showText: propTypes.bool.def(true),
       // Whether to refresh the interface when changing
-      reload: propTypes.bool,
+      reload: propTypes.bool
     },
     setup(props) {
-      const selectedKeys = ref<string[]>([]);
+      const selectedKeys = ref<string[]>([])
 
-      const { changeLocale, getLocale } = useLocale();
+      const { changeLocale, getLocale } = useLocale()
 
       const getLangText = computed(() => {
-        const key = selectedKeys.value[0];
-        if (!key) return '';
-        return localeList.find((item) => item.event === key)?.text;
-      });
+        const key = selectedKeys.value[0]
+        if (!key) return ''
+        return localeList.find(item => item.event === key)?.text
+      })
 
       watchEffect(() => {
-        selectedKeys.value = [unref(getLocale)];
-      });
+        selectedKeys.value = [unref(getLocale)]
+      })
 
       async function toggleLocale(lang: LocaleType | string) {
-        await changeLocale(lang as LocaleType);
-        selectedKeys.value = [lang as string];
-        props.reload && location.reload();
+        await changeLocale(lang as LocaleType)
+        selectedKeys.value = [lang as string]
+        props.reload && location.reload()
       }
 
       function handleMenuEvent(menu: DropMenu) {
-        if (unref(getLocale) === menu.event) return;
-        toggleLocale(menu.event as string);
+        if (unref(getLocale) === menu.event) return
+        toggleLocale(menu.event as string)
       }
 
-      return { localeList, handleMenuEvent, selectedKeys, getLangText };
-    },
-  });
+      return { localeList, handleMenuEvent, selectedKeys, getLangText }
+    }
+  })
 </script>
 
 <style lang="less" scoped>

+ 19 - 19
src/components/Application/src/AppLogo.vue

@@ -14,8 +14,8 @@
       :class="[
         `${prefixCls}__title`,
         {
-          'xs:opacity-0': !alwaysShowTitle,
-        },
+          'xs:opacity-0': !alwaysShowTitle
+        }
       ]"
       v-show="showTitle"
     >
@@ -24,15 +24,15 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  import { useGlobSetting } from '/@/hooks/setting';
-  import { useGo } from '/@/hooks/web/usePage';
-  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useGlobSetting } from '/@/hooks/setting'
+  import { useGo } from '/@/hooks/web/usePage'
+  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { PageEnum } from '/@/enums/pageEnum';
-  import { propTypes } from '/@/utils/propTypes';
+  import { PageEnum } from '/@/enums/pageEnum'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'AppLogo',
@@ -43,26 +43,26 @@
       theme: propTypes.oneOf(['light', 'dark']),
       // Whether to show title
       showTitle: propTypes.bool.def(true),
-      alwaysShowTitle: propTypes.bool.def(false),
+      alwaysShowTitle: propTypes.bool.def(false)
     },
     setup() {
-      const { prefixCls } = useDesign('app-logo');
-      const { getCollapsedShowTitle } = useMenuSetting();
-      const { title } = useGlobSetting();
-      const go = useGo();
+      const { prefixCls } = useDesign('app-logo')
+      const { getCollapsedShowTitle } = useMenuSetting()
+      const { title } = useGlobSetting()
+      const go = useGo()
 
       function handleGoHome(): void {
-        go(PageEnum.BASE_HOME);
+        go(PageEnum.BASE_HOME)
       }
 
       return {
         handleGoHome,
         title,
         prefixCls,
-        getCollapsedShowTitle,
-      };
-    },
-  });
+        getCollapsedShowTitle
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-app-logo';

+ 32 - 32
src/components/Application/src/AppProvider.vue

@@ -1,72 +1,72 @@
 <script lang="ts">
-  import { defineComponent, toRefs, ref, unref } from 'vue';
+  import { defineComponent, toRefs, ref, unref } from 'vue'
 
-  import { createAppProviderContext } from './useAppContext';
+  import { createAppProviderContext } from './useAppContext'
 
-  import designSetting from '/@/settings/designSetting';
-  import { createBreakpointListen } from '/@/hooks/event/useBreakpoint';
-  import { propTypes } from '/@/utils/propTypes';
-  import { appStore } from '/@/store/modules/app';
-  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
+  import designSetting from '/@/settings/designSetting'
+  import { createBreakpointListen } from '/@/hooks/event/useBreakpoint'
+  import { propTypes } from '/@/utils/propTypes'
+  import { appStore } from '/@/store/modules/app'
+  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum'
 
   export default defineComponent({
     name: 'AppProvider',
     inheritAttrs: false,
     props: {
-      prefixCls: propTypes.string.def(designSetting.prefixCls),
+      prefixCls: propTypes.string.def(designSetting.prefixCls)
     },
     setup(props, { slots }) {
-      const isMobile = ref(false);
-      const isSetState = ref(false);
+      const isMobile = ref(false)
+      const isSetState = ref(false)
 
       createBreakpointListen(({ screenMap, sizeEnum, width }) => {
-        const lgWidth = screenMap.get(sizeEnum.LG);
+        const lgWidth = screenMap.get(sizeEnum.LG)
         if (lgWidth) {
-          isMobile.value = width.value - 1 < lgWidth;
+          isMobile.value = width.value - 1 < lgWidth
         }
-        handleRestoreState();
-      });
+        handleRestoreState()
+      })
 
-      const { prefixCls } = toRefs(props);
-      createAppProviderContext({ prefixCls, isMobile });
+      const { prefixCls } = toRefs(props)
+      createAppProviderContext({ prefixCls, isMobile })
 
       function handleRestoreState() {
         if (unref(isMobile)) {
           if (!unref(isSetState)) {
-            isSetState.value = true;
+            isSetState.value = true
             const {
               menuSetting: {
                 type: menuType,
                 mode: menuMode,
                 collapsed: menuCollapsed,
-                split: menuSplit,
-              },
-            } = appStore.getProjectConfig;
+                split: menuSplit
+              }
+            } = appStore.getProjectConfig
             appStore.commitProjectConfigState({
               menuSetting: {
                 type: MenuTypeEnum.SIDEBAR,
                 mode: MenuModeEnum.INLINE,
-                split: false,
-              },
-            });
-            appStore.commitBeforeMiniState({ menuMode, menuCollapsed, menuType, menuSplit });
+                split: false
+              }
+            })
+            appStore.commitBeforeMiniState({ menuMode, menuCollapsed, menuType, menuSplit })
           }
         } else {
           if (unref(isSetState)) {
-            isSetState.value = false;
-            const { menuMode, menuCollapsed, menuType, menuSplit } = appStore.getBeforeMiniState;
+            isSetState.value = false
+            const { menuMode, menuCollapsed, menuType, menuSplit } = appStore.getBeforeMiniState
             appStore.commitProjectConfigState({
               menuSetting: {
                 type: menuType,
                 mode: menuMode,
                 collapsed: menuCollapsed,
-                split: menuSplit,
-              },
-            });
+                split: menuSplit
+              }
+            })
           }
         }
       }
-      return () => slots.default?.();
-    },
-  });
+      return () => slots.default?.()
+    }
+  })
 </script>

+ 16 - 16
src/components/Application/src/search/AppSearch.vue

@@ -1,42 +1,42 @@
 <script lang="tsx">
-  import { defineComponent, ref, unref } from 'vue';
+  import { defineComponent, ref, unref } from 'vue'
 
-  import { Tooltip } from 'ant-design-vue';
-  import { SearchOutlined } from '@ant-design/icons-vue';
-  import AppSearchModal from './AppSearchModal.vue';
+  import { Tooltip } from 'ant-design-vue'
+  import { SearchOutlined } from '@ant-design/icons-vue'
+  import AppSearchModal from './AppSearchModal.vue'
 
-  import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useHeaderSetting } from '/@/hooks/setting/useHeaderSetting'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'AppSearch',
     components: { AppSearchModal, Tooltip },
     setup() {
-      const showModal = ref(false);
+      const showModal = ref(false)
 
-      const { getShowSearch } = useHeaderSetting();
-      const { t } = useI18n();
+      const { getShowSearch } = useHeaderSetting()
+      const { t } = useI18n()
 
       function changeModal(show: boolean) {
-        showModal.value = show;
+        showModal.value = show
       }
 
       return () => {
         if (!unref(getShowSearch)) {
-          return null;
+          return null
         }
         return (
           <div class="p-1" onClick={changeModal.bind(null, true)}>
             <Tooltip>
               {{
                 title: () => t('common.searchText'),
-                default: () => <SearchOutlined />,
+                default: () => <SearchOutlined />
               }}
             </Tooltip>
             <AppSearchModal onClose={changeModal.bind(null, false)} visible={unref(showModal)} />
           </div>
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 </script>

+ 10 - 10
src/components/Application/src/search/AppSearchFooter.vue

@@ -13,23 +13,23 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import AppSearchKeyItem from './AppSearchKeyItem.vue';
+  import { defineComponent } from 'vue'
+  import AppSearchKeyItem from './AppSearchKeyItem.vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useI18n } from '/@/hooks/web/useI18n'
   export default defineComponent({
     name: 'AppSearchFooter',
     components: { AppSearchKeyItem },
     setup() {
-      const { prefixCls } = useDesign('app-search-footer');
-      const { t } = useI18n();
+      const { prefixCls } = useDesign('app-search-footer')
+      const { t } = useI18n()
       return {
         prefixCls,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-app-search-footer';

+ 6 - 6
src/components/Application/src/search/AppSearchKeyItem.vue

@@ -4,14 +4,14 @@
   </span>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import Icon from '/@/components/Icon';
-  import { propTypes } from '/@/utils/propTypes';
+  import { defineComponent } from 'vue'
+  import Icon from '/@/components/Icon'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     components: { Icon },
     props: {
-      icon: propTypes.string,
-    },
-  });
+      icon: propTypes.string
+    }
+  })
 </script>

+ 35 - 35
src/components/Application/src/search/AppSearchModal.vue

@@ -35,8 +35,8 @@
               :class="[
                 `${prefixCls}-list__item`,
                 {
-                  [`${prefixCls}-list__item--active`]: activeIndex === index,
-                },
+                  [`${prefixCls}-list__item--active`]: activeIndex === index
+                }
               ]"
             >
               <div :class="`${prefixCls}-list__item-icon`">
@@ -57,39 +57,39 @@
   </Teleport>
 </template>
 <script lang="ts">
-  import { defineComponent, computed, unref, ref } from 'vue';
+  import { defineComponent, computed, unref, ref } from 'vue'
 
-  import { SearchOutlined } from '@ant-design/icons-vue';
-  import { Input } from 'ant-design-vue';
-  import AppSearchFooter from './AppSearchFooter.vue';
-  import Icon from '/@/components/Icon';
+  import { SearchOutlined } from '@ant-design/icons-vue'
+  import { Input } from 'ant-design-vue'
+  import AppSearchFooter from './AppSearchFooter.vue'
+  import Icon from '/@/components/Icon'
 
-  import clickOutside from '/@/directives/clickOutside';
+  import clickOutside from '/@/directives/clickOutside'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useRefs } from '/@/hooks/core/useRefs';
-  import { useMenuSearch } from './useMenuSearch';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useAppInject } from '/@/hooks/web/useAppInject';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useRefs } from '/@/hooks/core/useRefs'
+  import { useMenuSearch } from './useMenuSearch'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useAppInject } from '/@/hooks/web/useAppInject'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'AppSearchModal',
     components: { Icon, SearchOutlined, AppSearchFooter, [Input.name]: Input },
     directives: {
-      clickOutside,
+      clickOutside
     },
     props: {
-      visible: propTypes.bool,
+      visible: propTypes.bool
     },
     emits: ['close'],
     setup(_, { emit }) {
-      const scrollWrap = ref<ElRef>(null);
-      const { prefixCls } = useDesign('app-search-modal');
-      const { t } = useI18n();
-      const [refs, setRefs] = useRefs();
-      const { getIsMobile } = useAppInject();
+      const scrollWrap = ref<ElRef>(null)
+      const { prefixCls } = useDesign('app-search-modal')
+      const { t } = useI18n()
+      const [refs, setRefs] = useRefs()
+      const { getIsMobile } = useAppInject()
 
       const {
         handleSearch,
@@ -97,25 +97,25 @@
         keyword,
         activeIndex,
         handleEnter,
-        handleMouseenter,
-      } = useMenuSearch(refs, scrollWrap, emit);
+        handleMouseenter
+      } = useMenuSearch(refs, scrollWrap, emit)
 
       const getIsNotData = computed(() => {
-        return !keyword || unref(searchResult).length === 0;
-      });
+        return !keyword || unref(searchResult).length === 0
+      })
 
       const getClass = computed(() => {
         return [
           prefixCls,
           {
-            [`${prefixCls}--mobile`]: unref(getIsMobile),
-          },
-        ];
-      });
+            [`${prefixCls}--mobile`]: unref(getIsMobile)
+          }
+        ]
+      })
 
       function handleClose() {
-        searchResult.value = [];
-        emit('close');
+        searchResult.value = []
+        emit('close')
       }
 
       return {
@@ -130,10 +130,10 @@
         setRefs,
         scrollWrap,
         handleMouseenter,
-        handleClose,
-      };
-    },
-  });
+        handleClose
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-app-search-modal';

+ 15 - 15
src/components/Authority/src/index.vue

@@ -2,14 +2,14 @@
  Access control component for fine-grained access control.
 -->
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import { defineComponent } from 'vue';
+  import type { PropType } from 'vue'
+  import { defineComponent } from 'vue'
 
-  import { RoleEnum } from '/@/enums/roleEnum';
+  import { RoleEnum } from '/@/enums/roleEnum'
 
-  import { usePermission } from '/@/hooks/web/usePermission';
+  import { usePermission } from '/@/hooks/web/usePermission'
 
-  import { getSlot } from '/@/utils/helper/tsxHelper';
+  import { getSlot } from '/@/utils/helper/tsxHelper'
 
   export default defineComponent({
     name: 'Authority',
@@ -22,27 +22,27 @@
        */
       value: {
         type: [Number, Array, String] as PropType<RoleEnum | RoleEnum[] | string | string[]>,
-        default: '',
-      },
+        default: ''
+      }
     },
     setup(props, { slots }) {
-      const { hasPermission } = usePermission();
+      const { hasPermission } = usePermission()
 
       /**
        * Render role button
        */
       function renderAuth() {
-        const { value } = props;
+        const { value } = props
         if (!value) {
-          return getSlot(slots);
+          return getSlot(slots)
         }
-        return hasPermission(value) ? getSlot(slots) : null;
+        return hasPermission(value) ? getSlot(slots) : null
       }
 
       return () => {
         // Role-based value control
-        return renderAuth();
-      };
-    },
-  });
+        return renderAuth()
+      }
+    }
+  })
 </script>

+ 15 - 15
src/components/Basic/src/BasicArrow.vue

@@ -8,13 +8,13 @@
   </span>
 </template>
 <script lang="ts">
-  import { defineComponent, computed } from 'vue';
+  import { defineComponent, computed } from 'vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
 
-  import { Icon } from '/@/components/Icon';
+  import { Icon } from '/@/components/Icon'
 
   export default defineComponent({
     name: 'BasicArrow',
@@ -23,29 +23,29 @@
       expand: propTypes.bool,
       top: propTypes.bool,
       bottom: propTypes.bool,
-      inset: propTypes.bool,
+      inset: propTypes.bool
     },
     setup(props) {
-      const { prefixCls } = useDesign('basic-arrow');
+      const { prefixCls } = useDesign('basic-arrow')
 
       const getClass = computed(() => {
-        const { expand, top, bottom, inset } = props;
+        const { expand, top, bottom, inset } = props
         return [
           prefixCls,
           {
             [`${prefixCls}--active`]: expand,
             top,
             inset,
-            bottom,
-          },
-        ];
-      });
+            bottom
+          }
+        ]
+      })
 
       return {
-        getClass,
-      };
-    },
-  });
+        getClass
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-basic-arrow';

+ 32 - 32
src/components/Basic/src/BasicHelp.vue

@@ -1,16 +1,16 @@
 <script lang="tsx">
-  import type { CSSProperties, PropType } from 'vue';
-  import { defineComponent, computed, unref } from 'vue';
+  import type { CSSProperties, PropType } from 'vue'
+  import { defineComponent, computed, unref } from 'vue'
 
-  import { Tooltip } from 'ant-design-vue';
-  import { InfoCircleOutlined } from '@ant-design/icons-vue';
+  import { Tooltip } from 'ant-design-vue'
+  import { InfoCircleOutlined } from '@ant-design/icons-vue'
 
-  import { getPopupContainer } from '/@/utils';
-  import { isString, isArray } from '/@/utils/is';
-  import { getSlot } from '/@/utils/helper/tsxHelper';
-  import { propTypes } from '/@/utils/propTypes';
+  import { getPopupContainer } from '/@/utils'
+  import { isString, isArray } from '/@/utils/is'
+  import { getSlot } from '/@/utils/helper/tsxHelper'
+  import { propTypes } from '/@/utils/propTypes'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   export default defineComponent({
     name: 'BasicHelp',
@@ -27,7 +27,7 @@
       absolute: propTypes.bool,
       // Text list
       text: {
-        type: [Array, String] as PropType<string[] | string>,
+        type: [Array, String] as PropType<string[] | string>
       },
       // 定位
       position: {
@@ -35,39 +35,39 @@
         default: () => ({
           position: 'absolute',
           left: 0,
-          bottom: 0,
-        }),
-      },
+          bottom: 0
+        })
+      }
     },
     setup(props, { slots }) {
-      const { prefixCls } = useDesign('basic-help');
+      const { prefixCls } = useDesign('basic-help')
 
       const getOverlayStyle = computed(
         (): CSSProperties => {
           return {
-            maxWidth: props.maxWidth,
-          };
+            maxWidth: props.maxWidth
+          }
         }
-      );
+      )
 
       const getWrapStyle = computed(
         (): CSSProperties => {
           return {
             color: props.color,
-            fontSize: props.fontSize,
-          };
+            fontSize: props.fontSize
+          }
         }
-      );
+      )
 
       const getMainStyleRef = computed(() => {
-        return props.absolute ? props.position : {};
-      });
+        return props.absolute ? props.position : {}
+      })
 
       const renderTitle = () => {
-        const list = props.text;
+        const list = props.text
 
         if (isString(list)) {
-          return <p>{list}</p>;
+          return <p>{list}</p>
         }
 
         if (isArray(list)) {
@@ -79,12 +79,12 @@
                   {item}
                 </>
               </p>
-            );
-          });
+            )
+          })
         }
 
-        return null;
-      };
+        return null
+      }
 
       return () => {
         return (
@@ -100,10 +100,10 @@
               {getSlot(slots) || <InfoCircleOutlined />}
             </span>
           </Tooltip>
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-help';

+ 11 - 11
src/components/Basic/src/BasicTitle.vue

@@ -5,14 +5,14 @@
   </span>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import type { PropType } from 'vue'
 
-  import { defineComponent } from 'vue';
-  import BasicHelp from './BasicHelp.vue';
+  import { defineComponent } from 'vue'
+  import BasicHelp from './BasicHelp.vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'BasicTitle',
@@ -20,15 +20,15 @@
     props: {
       helpMessage: {
         type: [String, Array] as PropType<string | string[]>,
-        default: '',
+        default: ''
       },
-      span: propTypes.bool,
+      span: propTypes.bool
     },
     setup() {
-      const { prefixCls } = useDesign('basic-title');
-      return { prefixCls };
-    },
-  });
+      const { prefixCls } = useDesign('basic-title')
+      return { prefixCls }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-basic-title';

+ 14 - 14
src/components/Button/src/BasicButton.vue

@@ -8,12 +8,12 @@
   </Button>
 </template>
 <script lang="ts">
-  import { defineComponent, computed } from 'vue';
+  import { defineComponent, computed } from 'vue'
 
-  import { Button } from 'ant-design-vue';
-  import Icon from '/@/components/Icon';
+  import { Button } from 'ant-design-vue'
+  import Icon from '/@/components/Icon'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'AButton',
@@ -26,22 +26,22 @@
       disabled: propTypes.bool,
       preIcon: propTypes.string,
       postIcon: propTypes.string,
-      onClick: propTypes.func,
+      onClick: propTypes.func
     },
     setup(props, { attrs }) {
       const getColor = computed(() => {
-        const { color, disabled } = props;
+        const { color, disabled } = props
         return {
           [`ant-btn-${color}`]: !!color,
-          [`is-disabled`]: disabled,
-        };
-      });
+          [`is-disabled`]: disabled
+        }
+      })
 
       const getBindValue = computed((): any => {
-        return { ...attrs, ...props };
-      });
+        return { ...attrs, ...props }
+      })
 
-      return { getBindValue, getColor };
-    },
-  });
+      return { getBindValue, getColor }
+    }
+  })
 </script>

+ 22 - 22
src/components/Button/src/PopConfirmButton.vue

@@ -1,16 +1,16 @@
 <script lang="ts">
-  import { defineComponent, h, unref, computed } from 'vue';
+  import { defineComponent, h, unref, computed } from 'vue'
 
-  import { Popconfirm } from 'ant-design-vue';
+  import { Popconfirm } from 'ant-design-vue'
 
-  import BasicButton from './BasicButton.vue';
+  import BasicButton from './BasicButton.vue'
 
-  import { propTypes } from '/@/utils/propTypes';
-  import { extendSlots } from '/@/utils/helper/tsxHelper';
-  import { omit } from 'lodash-es';
+  import { propTypes } from '/@/utils/propTypes'
+  import { extendSlots } from '/@/utils/helper/tsxHelper'
+  import { omit } from 'lodash-es'
 
-  import { useAttrs } from '/@/hooks/core/useAttrs';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useAttrs } from '/@/hooks/core/useAttrs'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'PopButton',
@@ -20,31 +20,31 @@
       size: propTypes.oneOf(['large', 'default', 'small']).def(),
       enable: propTypes.bool.def(true),
       okText: propTypes.string,
-      cancelText: propTypes.string,
+      cancelText: propTypes.string
     },
     setup(props, { slots }) {
-      const { t } = useI18n();
-      const attrs = useAttrs();
+      const { t } = useI18n()
+      const attrs = useAttrs()
 
       const getBindValues = computed(() => {
         const popValues = Object.assign(
           {
             okText: t('common.okText'),
-            cancelText: t('common.cancelText'),
+            cancelText: t('common.cancelText')
           },
           { ...props, ...unref(attrs) }
-        );
-        return popValues;
-      });
+        )
+        return popValues
+      })
       return () => {
-        const values = omit(unref(getBindValues), 'icon');
-        const Button = h(BasicButton, values, extendSlots(slots));
+        const values = omit(unref(getBindValues), 'icon')
+        const Button = h(BasicButton, values, extendSlots(slots))
         if (!props.enable) {
-          return Button;
+          return Button
         }
 
-        return h(Popconfirm, values, { default: () => Button });
-      };
-    },
-  });
+        return h(Popconfirm, values, { default: () => Button })
+      }
+    }
+  })
 </script>

+ 10 - 10
src/components/ClickOutSide/src/index.vue

@@ -4,24 +4,24 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, onMounted } from 'vue';
+  import { defineComponent, ref, onMounted } from 'vue'
 
-  import { onClickOutside } from '@vueuse/core';
+  import { onClickOutside } from '@vueuse/core'
   export default defineComponent({
     name: 'ClickOutSide',
     emits: ['mounted', 'clickOutside'],
     setup(_, { emit }) {
-      const wrap = ref<ElRef>(null);
+      const wrap = ref<ElRef>(null)
 
       onClickOutside(wrap, () => {
-        emit('clickOutside');
-      });
+        emit('clickOutside')
+      })
 
       onMounted(() => {
-        emit('mounted');
-      });
+        emit('mounted')
+      })
 
-      return { wrap };
-    },
-  });
+      return { wrap }
+    }
+  })
 </script>

+ 44 - 44
src/components/Container/src/LazyContainer.vue

@@ -17,20 +17,20 @@
   </transition-group>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import type { PropType } from 'vue'
 
-  import { defineComponent, reactive, onMounted, ref, toRef, toRefs } from 'vue';
+  import { defineComponent, reactive, onMounted, ref, toRef, toRefs } from 'vue'
 
-  import { Skeleton } from 'ant-design-vue';
-  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
-  import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { Skeleton } from 'ant-design-vue'
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout'
+  import { useIntersectionObserver } from '/@/hooks/event/useIntersectionObserver'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   interface State {
-    isInit: boolean;
-    loading: boolean;
-    intersectionObserverInstance: IntersectionObserver | null;
+    isInit: boolean
+    loading: boolean
+    intersectionObserverInstance: IntersectionObserver | null
   }
 
   export default defineComponent({
@@ -46,7 +46,7 @@
         type: (typeof window !== 'undefined'
           ? window.HTMLElement
           : Object) as PropType<HTMLElement>,
-        default: () => null,
+        default: () => null
       },
 
       // Preload threshold, css unit
@@ -61,55 +61,55 @@
       maxWaitingTime: propTypes.number.def(80),
 
       // transition name
-      transitionName: propTypes.string.def('lazy-container'),
+      transitionName: propTypes.string.def('lazy-container')
     },
     emits: ['init'],
     setup(props, { emit }) {
-      const elRef = ref<any>(null);
+      const elRef = ref<any>(null)
       const state = reactive<State>({
         isInit: false,
         loading: false,
-        intersectionObserverInstance: null,
-      });
+        intersectionObserverInstance: null
+      })
 
-      const { prefixCls } = useDesign('lazy-container');
+      const { prefixCls } = useDesign('lazy-container')
 
       onMounted(() => {
-        immediateInit();
-        initIntersectionObserver();
-      });
+        immediateInit()
+        initIntersectionObserver()
+      })
 
       // If there is a set delay time, it will be executed immediately
       function immediateInit() {
-        const { timeout } = props;
+        const { timeout } = props
         timeout &&
           useTimeoutFn(() => {
-            init();
-          }, timeout);
+            init()
+          }, timeout)
       }
 
       function init() {
-        state.loading = true;
+        state.loading = true
 
         useTimeoutFn(() => {
-          if (state.isInit) return;
-          state.isInit = true;
-          emit('init');
-        }, props.maxWaitingTime || 80);
+          if (state.isInit) return
+          state.isInit = true
+          emit('init')
+        }, props.maxWaitingTime || 80)
       }
 
       function initIntersectionObserver() {
-        const { timeout, direction, threshold } = props;
-        if (timeout) return;
+        const { timeout, direction, threshold } = props
+        if (timeout) return
         // According to the scrolling direction to construct the viewport margin, used to load in advance
-        let rootMargin = '0px';
+        let rootMargin = '0px'
         switch (direction) {
           case 'vertical':
-            rootMargin = `${threshold} 0px`;
-            break;
+            rootMargin = `${threshold} 0px`
+            break
           case 'horizontal':
-            rootMargin = `0px ${threshold}`;
-            break;
+            rootMargin = `0px ${threshold}`
+            break
         }
 
         try {
@@ -117,27 +117,27 @@
             rootMargin,
             target: toRef(elRef.value, '$el'),
             onIntersect: (entries: any[]) => {
-              const isIntersecting = entries[0].isIntersecting || entries[0].intersectionRatio;
+              const isIntersecting = entries[0].isIntersecting || entries[0].intersectionRatio
               if (isIntersecting) {
-                init();
+                init()
                 if (observer) {
-                  stop();
+                  stop()
                 }
               }
             },
-            root: toRef(props, 'viewport'),
-          });
+            root: toRef(props, 'viewport')
+          })
         } catch (e) {
-          init();
+          init()
         }
       }
       return {
         elRef,
         prefixCls,
-        ...toRefs(state),
-      };
-    },
-  });
+        ...toRefs(state)
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-lazy-container';

+ 28 - 28
src/components/Container/src/ScrollContainer.vue

@@ -5,64 +5,64 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, ref, unref, nextTick } from 'vue';
-  import { Scrollbar, ScrollbarType } from '/@/components/Scrollbar';
+  import { defineComponent, ref, unref, nextTick } from 'vue'
+  import { Scrollbar, ScrollbarType } from '/@/components/Scrollbar'
 
-  import { useScrollTo } from '/@/hooks/event/useScrollTo';
+  import { useScrollTo } from '/@/hooks/event/useScrollTo'
 
   export default defineComponent({
     name: 'ScrollContainer',
     // inheritAttrs: false,
     components: { Scrollbar },
     setup() {
-      const scrollbarRef = ref<Nullable<ScrollbarType>>(null);
+      const scrollbarRef = ref<Nullable<ScrollbarType>>(null)
 
       function scrollTo(to: number, duration = 500) {
-        const scrollbar = unref(scrollbarRef);
-        if (!scrollbar) return;
+        const scrollbar = unref(scrollbarRef)
+        if (!scrollbar) return
 
         nextTick(() => {
-          const wrap = unref(scrollbar.wrap);
-          if (!wrap) return;
+          const wrap = unref(scrollbar.wrap)
+          if (!wrap) return
           const { start } = useScrollTo({
             el: wrap,
             to,
-            duration,
-          });
-          start();
-        });
+            duration
+          })
+          start()
+        })
       }
 
       function getScrollWrap() {
-        const scrollbar = unref(scrollbarRef);
-        if (!scrollbar) return null;
-        return scrollbar.wrap;
+        const scrollbar = unref(scrollbarRef)
+        if (!scrollbar) return null
+        return scrollbar.wrap
       }
 
       function scrollBottom() {
-        const scrollbar = unref(scrollbarRef);
-        if (!scrollbar) return;
+        const scrollbar = unref(scrollbarRef)
+        if (!scrollbar) return
 
         nextTick(() => {
-          const wrap = unref(scrollbar.wrap);
-          if (!wrap) return;
-          const scrollHeight = wrap.scrollHeight as number;
+          const wrap = unref(scrollbar.wrap)
+          if (!wrap) return
+          const scrollHeight = wrap.scrollHeight as number
           const { start } = useScrollTo({
             el: wrap,
-            to: scrollHeight,
-          });
-          start();
-        });
+            to: scrollHeight
+          })
+          start()
+        })
       }
 
       return {
         scrollbarRef,
         scrollTo,
         scrollBottom,
-        getScrollWrap,
-      };
-    },
-  });
+        getScrollWrap
+      }
+    }
+  })
 </script>
 <style lang="less">
   .scroll-container {

+ 23 - 23
src/components/Container/src/collapse/CollapseContainer.vue

@@ -27,21 +27,21 @@
   </div>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import type { PropType } from 'vue'
 
-  import { defineComponent, ref, computed } from 'vue';
+  import { defineComponent, ref, computed } from 'vue'
 
   // component
-  import { Skeleton } from 'ant-design-vue';
-  import { CollapseTransition } from '/@/components/Transition/index';
-  import CollapseHeader from './CollapseHeader.vue';
-  import LazyContainer from '../LazyContainer.vue';
+  import { Skeleton } from 'ant-design-vue'
+  import { CollapseTransition } from '/@/components/Transition/index'
+  import CollapseHeader from './CollapseHeader.vue'
+  import LazyContainer from '../LazyContainer.vue'
 
-  import { triggerWindowResize } from '/@/utils/event';
+  import { triggerWindowResize } from '/@/utils/event'
   // hook
-  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   export default defineComponent({
     name: 'CollapseContainer',
@@ -49,7 +49,7 @@
       Skeleton,
       LazyContainer,
       CollapseHeader,
-      CollapseTransition,
+      CollapseTransition
     },
     props: {
       title: propTypes.string.def(''),
@@ -58,7 +58,7 @@
       // Warm reminder on the right side of the title
       helpMessage: {
         type: [Array, String] as PropType<string[] | string>,
-        default: '',
+        default: ''
       },
       // Whether to trigger window.resize when expanding and contracting,
       // Can adapt to tables and forms, when the form shrinks, the form triggers resize to adapt to the height
@@ -67,36 +67,36 @@
       // Delayed loading
       lazy: propTypes.bool,
       // Delayed loading time
-      lazyTime: propTypes.number.def(0),
+      lazyTime: propTypes.number.def(0)
     },
     setup(props) {
-      const show = ref(true);
+      const show = ref(true)
 
-      const { prefixCls } = useDesign('collapse-container');
+      const { prefixCls } = useDesign('collapse-container')
 
       /**
        * @description: Handling development events
        */
       function handleExpand() {
-        show.value = !show.value;
+        show.value = !show.value
         if (props.triggerWindowResize) {
           // 200 milliseconds here is because the expansion has animation,
-          useTimeoutFn(triggerWindowResize, 200);
+          useTimeoutFn(triggerWindowResize, 200)
         }
       }
 
       const getBindValues = computed((): any => {
-        return props;
-      });
+        return props
+      })
 
       return {
         show,
         handleExpand,
         prefixCls,
-        getBindValues,
-      };
-    },
-  });
+        getBindValues
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-collapse-container';

+ 6 - 6
src/components/Container/src/collapse/CollapseHeader.vue

@@ -16,9 +16,9 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { BasicArrow, BasicTitle } from '/@/components/Basic';
-  import { propTypes } from '/@/utils/propTypes';
+  import { defineComponent } from 'vue'
+  import { BasicArrow, BasicTitle } from '/@/components/Basic'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     components: { BasicArrow, BasicTitle },
@@ -28,8 +28,8 @@
       helpMessage: propTypes.string,
       title: propTypes.string,
       show: propTypes.bool,
-      canExpan: propTypes.bool,
+      canExpan: propTypes.bool
     },
-    emits: ['expand'],
-  });
+    emits: ['expand']
+  })
 </script>

+ 50 - 50
src/components/ContextMenu/src/index.tsx

@@ -1,77 +1,77 @@
-import './index.less';
+import './index.less'
 
-import type { ContextMenuItem, ItemContentProps } from './types';
-import type { FunctionalComponent, CSSProperties } from 'vue';
+import type { ContextMenuItem, ItemContentProps } from './types'
+import type { FunctionalComponent, CSSProperties } from 'vue'
 
-import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue';
+import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue'
 
-import Icon from '/@/components/Icon';
-import { Menu, Divider } from 'ant-design-vue';
+import Icon from '/@/components/Icon'
+import { Menu, Divider } from 'ant-design-vue'
 
-import { contextMenuProps } from './props';
+import { contextMenuProps } from './props'
 
-const prefixCls = 'context-menu';
+const prefixCls = 'context-menu'
 
-const ItemContent: FunctionalComponent<ItemContentProps> = (props) => {
-  const { item } = props;
+const ItemContent: FunctionalComponent<ItemContentProps> = props => {
+  const { item } = props
   return (
     <span style="display: inline-block; width: 100%;" onClick={props.handler.bind(null, item)}>
       {props.showIcon && item.icon && <Icon class="mr-2" icon={item.icon} />}
       <span>{item.label}</span>
     </span>
-  );
-};
+  )
+}
 
 export default defineComponent({
   name: 'ContextMenu',
   props: contextMenuProps,
   setup(props) {
-    const wrapRef = ref<ElRef>(null);
-    const showRef = ref(false);
+    const wrapRef = ref<ElRef>(null)
+    const showRef = ref(false)
 
     const getStyle = computed(
       (): CSSProperties => {
-        const { axis, items, styles, width } = props;
-        const { x, y } = axis || { x: 0, y: 0 };
-        const menuHeight = (items || []).length * 40;
-        const menuWidth = width;
-        const body = document.body;
-
-        const left = body.clientWidth < x + menuWidth ? x - menuWidth : x;
-        const top = body.clientHeight < y + menuHeight ? y - menuHeight : y;
+        const { axis, items, styles, width } = props
+        const { x, y } = axis || { x: 0, y: 0 }
+        const menuHeight = (items || []).length * 40
+        const menuWidth = width
+        const body = document.body
+
+        const left = body.clientWidth < x + menuWidth ? x - menuWidth : x
+        const top = body.clientHeight < y + menuHeight ? y - menuHeight : y
         return {
           ...styles,
           width: `${width}px`,
           left: `${left + 1}px`,
-          top: `${top + 1}px`,
-        };
+          top: `${top + 1}px`
+        }
       }
-    );
+    )
 
     onMounted(() => {
-      nextTick(() => (showRef.value = true));
-    });
+      nextTick(() => (showRef.value = true))
+    })
 
     onUnmounted(() => {
-      const el = unref(wrapRef);
-      el && document.body.removeChild(el);
-    });
+      const el = unref(wrapRef)
+      el && document.body.removeChild(el)
+    })
 
     function handleAction(item: ContextMenuItem, e: MouseEvent) {
-      const { handler, disabled } = item;
-      if (disabled) return;
-      showRef.value = false;
+      const { handler, disabled } = item
+      if (disabled) return
+      showRef.value = false
 
-      e?.stopPropagation();
-      e?.preventDefault();
-      handler?.();
+      e?.stopPropagation()
+      e?.preventDefault()
+      handler?.()
     }
 
     function renderMenuItem(items: ContextMenuItem[]) {
-      return items.map((item) => {
-        const { disabled, label, children, divider = false } = item;
+      return items.map(item => {
+        const { disabled, label, children, divider = false } = item
 
-        const DividerComp = divider ? <Divider key={`d-${label}`} /> : null;
+        const DividerComp = divider ? <Divider key={`d-${label}`} /> : null
         if (!children || children.length === 0) {
           return (
             <>
@@ -80,9 +80,9 @@ export default defineComponent({
               </Menu.Item>
               {DividerComp}
             </>
-          );
+          )
         }
-        if (!unref(showRef)) return null;
+        if (!unref(showRef)) return null
 
         return (
           <Menu.SubMenu key={label} disabled={disabled} popupClassName={`${prefixCls}__popup`}>
@@ -90,15 +90,15 @@ export default defineComponent({
               title: () => (
                 <ItemContent showIcon={props.showIcon} item={item} handler={handleAction} />
               ),
-              default: () => renderMenuItem(children),
+              default: () => renderMenuItem(children)
             }}
           </Menu.SubMenu>
-        );
-      });
+        )
+      })
     }
     return () => {
-      const { items } = props;
-      if (!unref(showRef)) return null;
+      const { items } = props
+      if (!unref(showRef)) return null
       return (
         <Menu
           inlineIndent={12}
@@ -109,7 +109,7 @@ export default defineComponent({
         >
           {renderMenuItem(items)}
         </Menu>
-      );
-    };
-  },
-});
+      )
+    }
+  }
+})

+ 22 - 22
src/components/CountDown/src/CountButton.vue

@@ -8,14 +8,14 @@
   </Button>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, PropType, watchEffect } from 'vue';
+  import { defineComponent, ref, PropType, watchEffect } from 'vue'
 
-  import { Button } from 'ant-design-vue';
+  import { Button } from 'ant-design-vue'
 
-  import { useCountdown } from './useCountdown';
-  import { isFunction } from '/@/utils/is';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { propTypes } from '/@/utils/propTypes';
+  import { useCountdown } from './useCountdown'
+  import { isFunction } from '/@/utils/is'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'CountButton',
@@ -25,36 +25,36 @@
       count: propTypes.number.def(60),
       beforeStartFunc: {
         type: Function as PropType<() => boolean>,
-        default: null,
-      },
+        default: null
+      }
     },
     setup(props) {
-      const loading = ref(false);
+      const loading = ref(false)
 
-      const { currentCount, isStart, start, reset } = useCountdown(props.count);
-      const { t } = useI18n();
+      const { currentCount, isStart, start, reset } = useCountdown(props.count)
+      const { t } = useI18n()
 
       watchEffect(() => {
-        props.value === undefined && reset();
-      });
+        props.value === undefined && reset()
+      })
       /**
        * @description: Judge whether there is an external function before execution, and decide whether to start after execution
        */
       async function handleStart() {
-        const { beforeStartFunc } = props;
+        const { beforeStartFunc } = props
         if (beforeStartFunc && isFunction(beforeStartFunc)) {
-          loading.value = true;
+          loading.value = true
           try {
-            const canStart = await beforeStartFunc();
-            canStart && start();
+            const canStart = await beforeStartFunc()
+            canStart && start()
           } finally {
-            loading.value = false;
+            loading.value = false
           }
         } else {
-          start();
+          start()
         }
       }
-      return { handleStart, isStart, currentCount, loading, t };
-    },
-  });
+      return { handleStart, isStart, currentCount, loading, t }
+    }
+  })
 </script>

+ 13 - 13
src/components/CountDown/src/CountdownInput.vue

@@ -6,15 +6,15 @@
   </AInput>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType } from 'vue';
+  import { defineComponent, PropType } from 'vue'
 
-  import { Input } from 'ant-design-vue';
-  import CountButton from './CountButton.vue';
+  import { Input } from 'ant-design-vue'
+  import CountButton from './CountButton.vue'
 
-  import { propTypes } from '/@/utils/propTypes';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { propTypes } from '/@/utils/propTypes'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem'
 
   export default defineComponent({
     name: 'CountDownInput',
@@ -26,15 +26,15 @@
       count: propTypes.number.def(60),
       sendCodeApi: {
         type: Function as PropType<() => boolean>,
-        default: null,
-      },
+        default: null
+      }
     },
     setup(props) {
-      const { prefixCls } = useDesign('countdown-input');
-      const [state] = useRuleFormItem(props);
-      return { prefixCls, state };
-    },
-  });
+      const { prefixCls } = useDesign('countdown-input')
+      const [state] = useRuleFormItem(props)
+      return { prefixCls, state }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-countdown-input';

+ 66 - 66
src/components/CountTo/src/index.vue

@@ -4,24 +4,24 @@
   </span>
 </template>
 <script lang="ts">
-  import { defineComponent, reactive, computed, watch, onMounted, unref, toRef } from 'vue';
-  import { countToProps } from './props';
-  import { isNumber } from '/@/utils/is';
+  import { defineComponent, reactive, computed, watch, onMounted, unref, toRef } from 'vue'
+  import { countToProps } from './props'
+  import { isNumber } from '/@/utils/is'
   export default defineComponent({
     name: 'CountTo',
     props: countToProps,
     emits: ['mounted', 'callback'],
     setup(props, { emit }) {
       const state = reactive<{
-        localStartVal: number;
-        printVal: number | null;
-        displayValue: string;
-        paused: boolean;
-        localDuration: number | null;
-        startTime: number | null;
-        timestamp: number | null;
-        rAF: any;
-        remaining: number | null;
+        localStartVal: number
+        printVal: number | null
+        displayValue: string
+        paused: boolean
+        localDuration: number | null
+        startTime: number | null
+        timestamp: number | null
+        rAF: any
+        remaining: number | null
       }>({
         localStartVal: props.startVal,
         displayValue: formatNumber(props.startVal),
@@ -31,119 +31,119 @@
         startTime: null,
         timestamp: null,
         remaining: null,
-        rAF: null,
-      });
+        rAF: null
+      })
 
       onMounted(() => {
         if (props.autoplay) {
-          start();
+          start()
         }
-        emit('mounted');
-      });
+        emit('mounted')
+      })
 
       const getCountDown = computed(() => {
-        return props.startVal > props.endVal;
-      });
+        return props.startVal > props.endVal
+      })
 
       watch([() => props.startVal, () => props.endVal], () => {
         if (props.autoplay) {
-          start();
+          start()
         }
-      });
+      })
 
       function start() {
-        const { startVal, duration } = props;
-        state.localStartVal = startVal;
-        state.startTime = null;
-        state.localDuration = duration;
-        state.paused = false;
-        state.rAF = requestAnimationFrame(count);
+        const { startVal, duration } = props
+        state.localStartVal = startVal
+        state.startTime = null
+        state.localDuration = duration
+        state.paused = false
+        state.rAF = requestAnimationFrame(count)
       }
 
       function pauseResume() {
         if (state.paused) {
-          resume();
-          state.paused = false;
+          resume()
+          state.paused = false
         } else {
-          pause();
-          state.paused = true;
+          pause()
+          state.paused = true
         }
       }
 
       function pause() {
-        cancelAnimationFrame(state.rAF);
+        cancelAnimationFrame(state.rAF)
       }
 
       function resume() {
-        state.startTime = null;
-        state.localDuration = +(state.remaining as number);
-        state.localStartVal = +(state.printVal as number);
-        requestAnimationFrame(count);
+        state.startTime = null
+        state.localDuration = +(state.remaining as number)
+        state.localStartVal = +(state.printVal as number)
+        requestAnimationFrame(count)
       }
 
       function reset() {
-        state.startTime = null;
-        cancelAnimationFrame(state.rAF);
-        state.displayValue = formatNumber(props.startVal);
+        state.startTime = null
+        cancelAnimationFrame(state.rAF)
+        state.displayValue = formatNumber(props.startVal)
       }
 
       function count(timestamp: number) {
-        const { useEasing, easingFn, endVal } = props;
-        if (!state.startTime) state.startTime = timestamp;
-        state.timestamp = timestamp;
-        const progress = timestamp - state.startTime;
-        state.remaining = (state.localDuration as number) - progress;
+        const { useEasing, easingFn, endVal } = props
+        if (!state.startTime) state.startTime = timestamp
+        state.timestamp = timestamp
+        const progress = timestamp - state.startTime
+        state.remaining = (state.localDuration as number) - progress
         if (useEasing) {
           if (unref(getCountDown)) {
             state.printVal =
               state.localStartVal -
-              easingFn(progress, 0, state.localStartVal - endVal, state.localDuration as number);
+              easingFn(progress, 0, state.localStartVal - endVal, state.localDuration as number)
           } else {
             state.printVal = easingFn(
               progress,
               state.localStartVal,
               endVal - state.localStartVal,
               state.localDuration as number
-            );
+            )
           }
         } else {
           if (unref(getCountDown)) {
             state.printVal =
               state.localStartVal -
-              (state.localStartVal - endVal) * (progress / (state.localDuration as number));
+              (state.localStartVal - endVal) * (progress / (state.localDuration as number))
           } else {
             state.printVal =
               state.localStartVal +
-              (endVal - state.localStartVal) * (progress / (state.localDuration as number));
+              (endVal - state.localStartVal) * (progress / (state.localDuration as number))
           }
         }
         if (unref(getCountDown)) {
-          state.printVal = state.printVal < endVal ? endVal : state.printVal;
+          state.printVal = state.printVal < endVal ? endVal : state.printVal
         } else {
-          state.printVal = state.printVal > endVal ? endVal : state.printVal;
+          state.printVal = state.printVal > endVal ? endVal : state.printVal
         }
-        state.displayValue = formatNumber(state.printVal);
+        state.displayValue = formatNumber(state.printVal)
         if (progress < (state.localDuration as number)) {
-          state.rAF = requestAnimationFrame(count);
+          state.rAF = requestAnimationFrame(count)
         } else {
-          emit('callback');
+          emit('callback')
         }
       }
 
       function formatNumber(num: number | string) {
-        const { decimals, decimal, separator, suffix, prefix } = props;
-        num = Number(num).toFixed(decimals);
-        num += '';
-        const x = num.split('.');
-        let x1 = x[0];
-        const x2 = x.length > 1 ? decimal + x[1] : '';
-        const rgx = /(\d+)(\d{3})/;
+        const { decimals, decimal, separator, suffix, prefix } = props
+        num = Number(num).toFixed(decimals)
+        num += ''
+        const x = num.split('.')
+        let x1 = x[0]
+        const x2 = x.length > 1 ? decimal + x[1] : ''
+        const rgx = /(\d+)(\d{3})/
         if (separator && !isNumber(separator)) {
           while (rgx.test(x1)) {
-            x1 = x1.replace(rgx, '$1' + separator + '$2');
+            x1 = x1.replace(rgx, '$1' + separator + '$2')
           }
         }
-        return prefix + x1 + x2 + suffix;
+        return prefix + x1 + x2 + suffix
       }
 
       return {
@@ -152,8 +152,8 @@
         resume,
         start,
         pauseResume,
-        displayValue: toRef(state, 'displayValue'),
-      };
-    },
-  });
+        displayValue: toRef(state, 'displayValue')
+      }
+    }
+  })
 </script>

+ 65 - 65
src/components/Description/src/index.vue

@@ -1,52 +1,52 @@
 <script lang="tsx">
-  import type { DescOptions, DescInstance, DescItem } from './types';
-  import type { DescriptionsProps } from 'ant-design-vue/es/descriptions/index';
-  import type { CSSProperties } from 'vue';
-  import type { CollapseContainerOptions } from '/@/components/Container/index';
+  import type { DescOptions, DescInstance, DescItem } from './types'
+  import type { DescriptionsProps } from 'ant-design-vue/es/descriptions/index'
+  import type { CSSProperties } from 'vue'
+  import type { CollapseContainerOptions } from '/@/components/Container/index'
 
-  import { defineComponent, computed, ref, unref } from 'vue';
-  import { get } from 'lodash-es';
-  import { Descriptions } from 'ant-design-vue';
-  import { CollapseContainer } from '/@/components/Container/index';
+  import { defineComponent, computed, ref, unref } from 'vue'
+  import { get } from 'lodash-es'
+  import { Descriptions } from 'ant-design-vue'
+  import { CollapseContainer } from '/@/components/Container/index'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { isFunction } from '/@/utils/is';
-  import { getSlot } from '/@/utils/helper/tsxHelper';
+  import { isFunction } from '/@/utils/is'
+  import { getSlot } from '/@/utils/helper/tsxHelper'
 
-  import descProps from './props';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import descProps from './props'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
 
   export default defineComponent({
     name: 'Description',
     props: descProps,
     emits: ['register'],
     setup(props, { slots, emit }) {
-      const propsRef = ref<Partial<DescOptions> | null>(null);
+      const propsRef = ref<Partial<DescOptions> | null>(null)
 
-      const { prefixCls } = useDesign('description');
-      const attrs = useAttrs();
+      const { prefixCls } = useDesign('description')
+      const attrs = useAttrs()
 
       // Custom title component: get title
       const getMergeProps = computed(() => {
         return {
           ...props,
-          ...(unref(propsRef) as Recordable),
-        } as DescOptions;
-      });
+          ...(unref(propsRef) as Recordable)
+        } as DescOptions
+      })
 
       const getProps = computed(() => {
         const opt = {
           ...unref(getMergeProps),
-          title: undefined,
-        };
-        return opt as DescOptions;
-      });
+          title: undefined
+        }
+        return opt as DescOptions
+      })
 
       /**
        * @description: Whether to setting title
        */
-      const useWrapper = computed(() => !!unref(getMergeProps).title);
+      const useWrapper = computed(() => !!unref(getMergeProps).title)
 
       /**
        * @description: Get configuration Collapse
@@ -56,70 +56,70 @@
           return {
             // Cannot be expanded by default
             canExpand: false,
-            ...unref(getProps).collapseOptions,
-          };
+            ...unref(getProps).collapseOptions
+          }
         }
-      );
+      )
 
       const getDescriptionsProps = computed(() => {
-        return { ...unref(attrs), ...unref(getProps) } as DescriptionsProps;
-      });
+        return { ...unref(attrs), ...unref(getProps) } as DescriptionsProps
+      })
 
       /**
        * @description:设置desc
        */
       function setDescProps(descProps: Partial<DescOptions>): void {
         // Keep the last setDrawerProps
-        propsRef.value = { ...(unref(propsRef) as Recordable), ...descProps } as Recordable;
+        propsRef.value = { ...(unref(propsRef) as Recordable), ...descProps } as Recordable
       }
 
       // Prevent line breaks
       function renderLabel({ label, labelMinWidth, labelStyle }: DescItem) {
         if (!labelStyle && !labelMinWidth) {
-          return label;
+          return label
         }
 
         const labelStyles: CSSProperties = {
           ...labelStyle,
 
-          minWidth: `${labelMinWidth}px `,
-        };
-        return <div style={labelStyles}>{label}</div>;
+          minWidth: `${labelMinWidth}px `
+        }
+        return <div style={labelStyles}>{label}</div>
       }
 
       function renderItem() {
-        const { schema, data } = unref(getProps);
+        const { schema, data } = unref(getProps)
         return unref(schema)
-          .map((item) => {
-            const { render, field, span, show, contentMinWidth } = item;
+          .map(item => {
+            const { render, field, span, show, contentMinWidth } = item
 
             if (show && isFunction(show) && !show(data)) {
-              return null;
+              return null
             }
 
             const getContent = () => {
-              const _data = unref(getProps)?.data;
-              if (!_data) return null;
-              const getField = get(_data, field);
-              return isFunction(render) ? render(getField, _data) : getField ?? '';
-            };
+              const _data = unref(getProps)?.data
+              if (!_data) return null
+              const getField = get(_data, field)
+              return isFunction(render) ? render(getField, _data) : getField ?? ''
+            }
 
-            const width = contentMinWidth;
+            const width = contentMinWidth
             return (
               <Descriptions.Item label={renderLabel(item)} key={field} span={span}>
                 {() => {
                   if (!contentMinWidth) {
-                    return getContent();
+                    return getContent()
                   }
                   const style: CSSProperties = {
-                    minWidth: `${width}px`,
-                  };
-                  return <div style={style}>{getContent()}</div>;
+                    minWidth: `${width}px`
+                  }
+                  return <div style={style}>{getContent()}</div>
                 }}
               </Descriptions.Item>
-            );
+            )
           })
-          .filter((item) => !!item);
+          .filter(item => !!item)
       }
 
       const renderDesc = () => {
@@ -127,36 +127,36 @@
           <Descriptions class={`${prefixCls}`} {...(unref(getDescriptionsProps) as any)}>
             {renderItem()}
           </Descriptions>
-        );
-      };
+        )
+      }
 
       const renderContainer = () => {
-        const content = props.useCollapse ? renderDesc() : <div>{renderDesc()}</div>;
+        const content = props.useCollapse ? renderDesc() : <div>{renderDesc()}</div>
         // Reduce the dom level
 
         if (!props.useCollapse) {
-          return content;
+          return content
         }
 
-        const { canExpand, helpMessage } = unref(getCollapseOptions);
-        const { title } = unref(getMergeProps);
+        const { canExpand, helpMessage } = unref(getCollapseOptions)
+        const { title } = unref(getMergeProps)
 
         return (
           <CollapseContainer title={title} canExpan={canExpand} helpMessage={helpMessage}>
             {{
               default: () => content,
-              action: () => getSlot(slots, 'action'),
+              action: () => getSlot(slots, 'action')
             }}
           </CollapseContainer>
-        );
-      };
+        )
+      }
 
       const methods: DescInstance = {
-        setDescProps,
-      };
+        setDescProps
+      }
 
-      emit('register', methods);
-      return () => (unref(useWrapper) ? renderContainer() : renderDesc());
-    },
-  });
+      emit('register', methods)
+      return () => (unref(useWrapper) ? renderContainer() : renderDesc())
+    }
+  })
 </script>

+ 68 - 68
src/components/Drawer/src/BasicDrawer.vue

@@ -28,8 +28,8 @@
   </Drawer>
 </template>
 <script lang="ts">
-  import type { DrawerInstance, DrawerProps } from './types';
-  import type { CSSProperties } from 'vue';
+  import type { DrawerInstance, DrawerProps } from './types'
+  import type { CSSProperties } from 'vue'
 
   import {
     defineComponent,
@@ -40,21 +40,21 @@
     unref,
     nextTick,
     toRaw,
-    getCurrentInstance,
-  } from 'vue';
-  import { Drawer } from 'ant-design-vue';
+    getCurrentInstance
+  } from 'vue'
+  import { Drawer } from 'ant-design-vue'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useI18n } from '/@/hooks/web/useI18n'
 
-  import { isFunction, isNumber } from '/@/utils/is';
-  import { deepMerge } from '/@/utils';
-  import DrawerFooter from './components/DrawerFooter.vue';
-  import DrawerHeader from './components/DrawerHeader.vue';
-  import { ScrollContainer } from '/@/components/Container';
+  import { isFunction, isNumber } from '/@/utils/is'
+  import { deepMerge } from '/@/utils'
+  import DrawerFooter from './components/DrawerFooter.vue'
+  import DrawerHeader from './components/DrawerHeader.vue'
+  import { ScrollContainer } from '/@/components/Container'
 
-  import { basicProps } from './props';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { basicProps } from './props'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
 
   export default defineComponent({
     components: { Drawer, ScrollContainer, DrawerFooter, DrawerHeader },
@@ -62,27 +62,27 @@
     props: basicProps,
     emits: ['visible-change', 'ok', 'close', 'register'],
     setup(props, { emit }) {
-      const visibleRef = ref(false);
-      const attrs = useAttrs();
-      const propsRef = ref<Partial<Nullable<DrawerProps>>>(null);
+      const visibleRef = ref(false)
+      const attrs = useAttrs()
+      const propsRef = ref<Partial<Nullable<DrawerProps>>>(null)
 
-      const { t } = useI18n();
-      const { prefixVar, prefixCls } = useDesign('basic-drawer');
+      const { t } = useI18n()
+      const { prefixVar, prefixCls } = useDesign('basic-drawer')
 
       const drawerInstance: DrawerInstance = {
         setDrawerProps: setDrawerProps,
-        emitVisible: undefined,
-      };
+        emitVisible: undefined
+      }
 
-      const instance = getCurrentInstance();
+      const instance = getCurrentInstance()
 
-      instance && emit('register', drawerInstance, instance.uid);
+      instance && emit('register', drawerInstance, instance.uid)
 
       const getMergeProps = computed(
         (): DrawerProps => {
-          return deepMerge(toRaw(props), unref(propsRef));
+          return deepMerge(toRaw(props), unref(propsRef))
         }
-      );
+      )
 
       const getProps = computed(
         (): DrawerProps => {
@@ -90,97 +90,97 @@
             placement: 'right',
             ...unref(attrs),
             ...unref(getMergeProps),
-            visible: unref(visibleRef),
-          };
-          opt.title = undefined;
-          const { isDetail, width, wrapClassName, getContainer } = opt;
+            visible: unref(visibleRef)
+          }
+          opt.title = undefined
+          const { isDetail, width, wrapClassName, getContainer } = opt
           if (isDetail) {
             if (!width) {
-              opt.width = '100%';
+              opt.width = '100%'
             }
-            const detailCls = `${prefixCls}__detail`;
-            opt.wrapClassName = wrapClassName ? `${wrapClassName} ${detailCls}` : detailCls;
+            const detailCls = `${prefixCls}__detail`
+            opt.wrapClassName = wrapClassName ? `${wrapClassName} ${detailCls}` : detailCls
 
             if (!getContainer) {
               // TODO type error?
-              opt.getContainer = `.${prefixVar}-layout-content` as any;
+              opt.getContainer = `.${prefixVar}-layout-content` as any
             }
           }
-          return opt as DrawerProps;
+          return opt as DrawerProps
         }
-      );
+      )
 
       const getBindValues = computed(
         (): DrawerProps => {
           return {
             ...attrs,
-            ...unref(getProps),
-          };
+            ...unref(getProps)
+          }
         }
-      );
+      )
 
       // Custom implementation of the bottom button,
       const getFooterHeight = computed(() => {
-        const { footerHeight, showFooter } = unref(getProps);
+        const { footerHeight, showFooter } = unref(getProps)
         if (showFooter && footerHeight) {
           return isNumber(footerHeight)
             ? `${footerHeight}px`
-            : `${footerHeight.replace('px', '')}px`;
+            : `${footerHeight.replace('px', '')}px`
         }
-        return `0px`;
-      });
+        return `0px`
+      })
 
       const getScrollContentStyle = computed(
         (): CSSProperties => {
-          const footerHeight = unref(getFooterHeight);
+          const footerHeight = unref(getFooterHeight)
           return {
             position: 'relative',
-            height: `calc(100% - ${footerHeight})`,
-          };
+            height: `calc(100% - ${footerHeight})`
+          }
         }
-      );
+      )
 
       const getLoading = computed(() => {
-        return !!unref(getProps)?.loading;
-      });
+        return !!unref(getProps)?.loading
+      })
 
       watchEffect(() => {
-        visibleRef.value = props.visible;
-      });
+        visibleRef.value = props.visible
+      })
 
       watch(
         () => visibleRef.value,
-        (visible) => {
+        visible => {
           nextTick(() => {
-            emit('visible-change', visible);
-            instance && drawerInstance.emitVisible?.(visible, instance.uid);
-          });
+            emit('visible-change', visible)
+            instance && drawerInstance.emitVisible?.(visible, instance.uid)
+          })
         }
-      );
+      )
 
       // Cancel event
       async function onClose(e: Recordable) {
-        const { closeFunc } = unref(getProps);
-        emit('close', e);
+        const { closeFunc } = unref(getProps)
+        emit('close', e)
         if (closeFunc && isFunction(closeFunc)) {
-          const res = await closeFunc();
-          visibleRef.value = !res;
-          return;
+          const res = await closeFunc()
+          visibleRef.value = !res
+          return
         }
-        visibleRef.value = false;
+        visibleRef.value = false
       }
 
       function setDrawerProps(props: Partial<DrawerProps>): void {
         // Keep the last setDrawerProps
-        propsRef.value = deepMerge(unref(propsRef) || {}, props);
+        propsRef.value = deepMerge(unref(propsRef) || {}, props)
 
         if (Reflect.has(props, 'visible')) {
-          visibleRef.value = !!props.visible;
+          visibleRef.value = !!props.visible
         }
       }
 
       function handleOk() {
-        emit('ok');
+        emit('ok')
       }
 
       return {
@@ -193,10 +193,10 @@
         getLoading,
         getBindValues,
         getFooterHeight,
-        handleOk,
-      };
-    },
-  });
+        handleOk
+      }
+    }
+  })
 </script>
 <style lang="less">
   @header-height: 60px;

+ 16 - 16
src/components/Drawer/src/components/DrawerFooter.vue

@@ -25,44 +25,44 @@
   </div>
 </template>
 <script lang="ts">
-  import type { CSSProperties } from 'vue';
-  import { defineComponent, computed } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import type { CSSProperties } from 'vue'
+  import { defineComponent, computed } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { footerProps } from '../props';
+  import { footerProps } from '../props'
   export default defineComponent({
     name: 'BasicDrawerFooter',
     props: {
       ...footerProps,
       height: {
         type: String,
-        default: '60px',
-      },
+        default: '60px'
+      }
     },
     emits: ['ok', 'close'],
     setup(props, { emit }) {
-      const { prefixCls } = useDesign('basic-drawer-footer');
+      const { prefixCls } = useDesign('basic-drawer-footer')
 
       const getStyle = computed(
         (): CSSProperties => {
-          const heightStr = `${props.height}`;
+          const heightStr = `${props.height}`
           return {
             height: heightStr,
-            lineHeight: heightStr,
-          };
+            lineHeight: heightStr
+          }
         }
-      );
+      )
 
       function handleOk() {
-        emit('ok');
+        emit('ok')
       }
 
       function handleClose() {
-        emit('close');
+        emit('close')
       }
-      return { handleOk, prefixCls, handleClose, getStyle };
-    },
-  });
+      return { handleOk, prefixCls, handleClose, getStyle }
+    }
+  })
 </script>
 
 <style lang="less">

+ 11 - 11
src/components/Drawer/src/components/DrawerHeader.vue

@@ -18,31 +18,31 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { BasicTitle } from '/@/components/Basic';
-  import { ArrowLeftOutlined } from '@ant-design/icons-vue';
+  import { defineComponent } from 'vue'
+  import { BasicTitle } from '/@/components/Basic'
+  import { ArrowLeftOutlined } from '@ant-design/icons-vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
   export default defineComponent({
     name: 'BasicDrawerHeader',
     components: { BasicTitle, ArrowLeftOutlined },
     props: {
       isDetail: propTypes.bool,
       showDetailBack: propTypes.bool,
-      title: propTypes.string,
+      title: propTypes.string
     },
     emits: ['close'],
     setup(_, { emit }) {
-      const { prefixCls } = useDesign('basic-drawer-header');
+      const { prefixCls } = useDesign('basic-drawer-header')
 
       function handleClose() {
-        emit('close');
+        emit('close')
       }
-      return { prefixCls, handleClose };
-    },
-  });
+      return { prefixCls, handleClose }
+    }
+  })
 </script>
 
 <style lang="less">

+ 20 - 20
src/components/Dropdown/src/Dropdown.vue

@@ -22,12 +22,12 @@
 </template>
 
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import type { DropMenu } from './types';
+  import type { PropType } from 'vue'
+  import type { DropMenu } from './types'
 
-  import { defineComponent, computed, unref } from 'vue';
-  import { Dropdown, Menu } from 'ant-design-vue';
-  import Icon from '/@/components/Icon/index';
+  import { defineComponent, computed, unref } from 'vue'
+  import { Dropdown, Menu } from 'ant-design-vue'
+  import Icon from '/@/components/Icon/index'
 
   export default defineComponent({
     name: 'BasicDropdown',
@@ -36,7 +36,7 @@
       [Menu.name]: Menu,
       [Menu.Item.name]: Menu.Item,
       [Menu.Divider.name]: Menu.Divider,
-      Icon,
+      Icon
     },
     props: {
       /**
@@ -47,34 +47,34 @@
       trigger: {
         type: [Array] as PropType<string[]>,
         default: () => {
-          return ['contextmenu'];
-        },
+          return ['contextmenu']
+        }
       },
       dropMenuList: {
         type: Array as PropType<DropMenu[]>,
-        default: () => [],
+        default: () => []
       },
       selectedKeys: {
         type: Array as PropType<string[]>,
-        default: () => [],
-      },
+        default: () => []
+      }
     },
     emits: ['menuEvent'],
     setup(props, { emit }) {
-      const getMenuList = computed(() => props.dropMenuList);
+      const getMenuList = computed(() => props.dropMenuList)
 
       function handleClickMenu(item: DropMenu) {
-        const { event } = item;
-        const menu = unref(getMenuList).find((item) => `${item.event}` === `${event}`);
-        emit('menuEvent', menu);
-        item.onClick?.();
+        const { event } = item
+        const menu = unref(getMenuList).find(item => `${item.event}` === `${event}`)
+        emit('menuEvent', menu)
+        item.onClick?.()
       }
 
       return {
         handleClickMenu,
         getMenuList,
-        getAttr: (key: string) => ({ key }),
-      };
-    },
-  });
+        getAttr: (key: string) => ({ key })
+      }
+    }
+  })
 </script>

+ 27 - 27
src/components/Excel/src/ExportExcelModel.vue

@@ -14,21 +14,21 @@
   </BasicModal>
 </template>
 <script lang="ts">
-  import type { ExportModalResult } from './types';
-  import { defineComponent } from 'vue';
-  import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index';
+  import type { ExportModalResult } from './types'
+  import { defineComponent } from 'vue'
+  import { BasicModal, useModalInner } from '/@/components/Modal'
+  import { BasicForm, FormSchema, useForm } from '/@/components/Form/index'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useI18n } from '/@/hooks/web/useI18n'
 
-  const { t } = useI18n();
+  const { t } = useI18n()
 
   const schemas: FormSchema[] = [
     {
       field: 'filename',
       component: 'Input',
       label: t('component.excel.fileName'),
-      rules: [{ required: true }],
+      rules: [{ required: true }]
     },
     {
       field: 'bookType',
@@ -41,42 +41,42 @@
           {
             label: 'xlsx',
             value: 'xlsx',
-            key: 'xlsx',
+            key: 'xlsx'
           },
           {
             label: 'html',
             value: 'html',
-            key: 'html',
+            key: 'html'
           },
           {
             label: 'csv',
             value: 'csv',
-            key: 'csv',
+            key: 'csv'
           },
           {
             label: 'txt',
             value: 'txt',
-            key: 'txt',
-          },
-        ],
-      },
-    },
-  ];
+            key: 'txt'
+          }
+        ]
+      }
+    }
+  ]
   export default defineComponent({
     components: { BasicModal, BasicForm },
     emits: ['success', 'register'],
     setup(_, { emit }) {
-      const [registerForm, { validateFields }] = useForm();
-      const [registerModal, { closeModal }] = useModalInner();
+      const [registerForm, { validateFields }] = useForm()
+      const [registerModal, { closeModal }] = useModalInner()
 
       async function handleOk() {
-        const res = (await validateFields()) as ExportModalResult;
-        const { filename, bookType } = res;
+        const res = (await validateFields()) as ExportModalResult
+        const { filename, bookType } = res
         emit('success', {
           filename: `${filename.split('.').shift()}.${bookType}`,
-          bookType,
-        });
-        closeModal();
+          bookType
+        })
+        closeModal()
       }
 
       return {
@@ -84,8 +84,8 @@
         handleOk,
         registerForm,
         registerModal,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>

+ 48 - 48
src/components/Excel/src/ImportExcel.vue

@@ -13,114 +13,114 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, unref } from 'vue';
-  import XLSX from 'xlsx';
+  import { defineComponent, ref, unref } from 'vue'
+  import XLSX from 'xlsx'
 
-  import type { ExcelData } from './types';
+  import type { ExcelData } from './types'
   export default defineComponent({
     name: 'ImportExcel',
     emits: ['success', 'error'],
     setup(_, { emit }) {
-      const inputRef = ref<HTMLInputElement | null>(null);
-      const loadingRef = ref<Boolean>(false);
+      const inputRef = ref<HTMLInputElement | null>(null)
+      const loadingRef = ref<Boolean>(false)
 
       /**
        * @description: 第一行作为头部
        */
       function getHeaderRow(sheet: XLSX.WorkSheet) {
-        if (!sheet || !sheet['!ref']) return [];
-        const headers: string[] = [];
+        if (!sheet || !sheet['!ref']) return []
+        const headers: string[] = []
         // A3:B7=>{s:{c:0, r:2}, e:{c:1, r:6}}
-        const range = XLSX.utils.decode_range(sheet['!ref']);
+        const range = XLSX.utils.decode_range(sheet['!ref'])
 
-        const R = range.s.r;
+        const R = range.s.r
         /* start in the first row */
         for (let C = range.s.c; C <= range.e.c; ++C) {
           /* walk every column in the range */
-          const cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })];
+          const cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })]
           /* find the cell in the first row */
-          let hdr = 'UNKNOWN ' + C; // <-- replace with your desired default
-          if (cell && cell.t) hdr = XLSX.utils.format_cell(cell);
-          headers.push(hdr);
+          let hdr = 'UNKNOWN ' + C // <-- replace with your desired default
+          if (cell && cell.t) hdr = XLSX.utils.format_cell(cell)
+          headers.push(hdr)
         }
-        return headers;
+        return headers
       }
 
       /**
        * @description: 获得excel数据
        */
       function getExcelData(workbook: XLSX.WorkBook) {
-        const excelData: ExcelData[] = [];
+        const excelData: ExcelData[] = []
         for (const sheetName of workbook.SheetNames) {
-          const worksheet = workbook.Sheets[sheetName];
-          const header: string[] = getHeaderRow(worksheet);
-          const results = XLSX.utils.sheet_to_json(worksheet);
+          const worksheet = workbook.Sheets[sheetName]
+          const header: string[] = getHeaderRow(worksheet)
+          const results = XLSX.utils.sheet_to_json(worksheet)
           excelData.push({
             header,
             results,
             meta: {
-              sheetName,
-            },
-          });
+              sheetName
+            }
+          })
         }
-        return excelData;
+        return excelData
       }
 
       /**
        * @description: 读取excel数据
        */
       function readerData(rawFile: File) {
-        loadingRef.value = true;
+        loadingRef.value = true
         return new Promise((resolve, reject) => {
-          const reader = new FileReader();
-          reader.onload = async (e) => {
+          const reader = new FileReader()
+          reader.onload = async e => {
             try {
-              const data = e.target && e.target.result;
-              const workbook = XLSX.read(data, { type: 'array' });
+              const data = e.target && e.target.result
+              const workbook = XLSX.read(data, { type: 'array' })
               // console.log(workbook);
               /* DO SOMETHING WITH workbook HERE */
-              const excelData = getExcelData(workbook);
-              emit('success', excelData);
-              resolve('');
+              const excelData = getExcelData(workbook)
+              emit('success', excelData)
+              resolve('')
             } catch (error) {
-              reject(error);
-              emit('error');
+              reject(error)
+              emit('error')
             } finally {
-              loadingRef.value = false;
+              loadingRef.value = false
             }
-          };
-          reader.readAsArrayBuffer(rawFile);
-        });
+          }
+          reader.readAsArrayBuffer(rawFile)
+        })
       }
 
       async function upload(rawFile: File) {
-        const inputRefDom = unref(inputRef);
+        const inputRefDom = unref(inputRef)
         if (inputRefDom) {
           // fix can't select the same excel
-          inputRefDom.value = '';
+          inputRefDom.value = ''
         }
-        await readerData(rawFile);
+        await readerData(rawFile)
       }
 
       /**
        * @description: 触发选择文件管理器
        */
       function handleInputClick(e: Event) {
-        const files = e && (e.target as HTMLInputElement).files;
-        const rawFile = files && files[0]; // only setting files[0]
-        if (!rawFile) return;
-        upload(rawFile);
+        const files = e && (e.target as HTMLInputElement).files
+        const rawFile = files && files[0] // only setting files[0]
+        if (!rawFile) return
+        upload(rawFile)
       }
 
       /**
        * @description: 点击上传按钮
        */
       function handleUpload() {
-        const inputRefDom = unref(inputRef);
-        inputRefDom && inputRefDom.click();
+        const inputRefDom = unref(inputRef)
+        inputRefDom && inputRefDom.click()
       }
 
-      return { handleUpload, handleInputClick, inputRef };
-    },
-  });
+      return { handleUpload, handleInputClick, inputRef }
+    }
+  })
 </script>

+ 83 - 83
src/components/Form/src/BasicForm.vue

@@ -31,9 +31,9 @@
   </Form>
 </template>
 <script lang="ts">
-  import type { FormActionType, FormProps, FormSchema } from './types/form';
-  import type { AdvanceState } from './types/hooks';
-  import type { CSSProperties, Ref } from 'vue';
+  import type { FormActionType, FormProps, FormSchema } from './types/form'
+  import type { AdvanceState } from './types/hooks'
+  import type { CSSProperties, Ref } from 'vue'
 
   import {
     defineComponent,
@@ -44,27 +44,27 @@
     onMounted,
     watch,
     toRefs,
-    nextTick,
-  } from 'vue';
-  import { Form, Row } from 'ant-design-vue';
-  import FormItem from './components/FormItem.vue';
-  import FormAction from './components/FormAction.vue';
+    nextTick
+  } from 'vue'
+  import { Form, Row } from 'ant-design-vue'
+  import FormItem from './components/FormItem.vue'
+  import FormAction from './components/FormAction.vue'
 
-  import { dateItemType } from './helper';
-  import { dateUtil } from '/@/utils/dateUtil';
+  import { dateItemType } from './helper'
+  import { dateUtil } from '/@/utils/dateUtil'
 
   // import { cloneDeep } from 'lodash-es';
-  import { deepMerge } from '/@/utils';
+  import { deepMerge } from '/@/utils'
 
-  import { useFormValues } from './hooks/useFormValues';
-  import useAdvanced from './hooks/useAdvanced';
-  import { useFormEvents } from './hooks/useFormEvents';
-  import { createFormContext } from './hooks/useFormContext';
-  import { useAutoFocus } from './hooks/useAutoFocus';
-  import { useModalContext } from '/@/components/Modal';
+  import { useFormValues } from './hooks/useFormValues'
+  import useAdvanced from './hooks/useAdvanced'
+  import { useFormEvents } from './hooks/useFormEvents'
+  import { createFormContext } from './hooks/useFormContext'
+  import { useAutoFocus } from './hooks/useAutoFocus'
+  import { useModalContext } from '/@/components/Modal'
 
-  import { basicProps } from './props';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { basicProps } from './props'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   export default defineComponent({
     name: 'BasicForm',
@@ -72,67 +72,67 @@
     props: basicProps,
     emits: ['advanced-change', 'reset', 'submit', 'register'],
     setup(props, { emit }) {
-      const formModel = reactive<Recordable>({});
-      const modalFn = useModalContext();
+      const formModel = reactive<Recordable>({})
+      const modalFn = useModalContext()
 
       const advanceState = reactive<AdvanceState>({
         isAdvanced: true,
         hideAdvanceBtn: false,
         isLoad: false,
-        actionSpan: 6,
-      });
+        actionSpan: 6
+      })
 
-      const defaultValueRef = ref<Recordable>({});
-      const isInitedDefaultRef = ref(false);
-      const propsRef = ref<Partial<FormProps>>({});
-      const schemaRef = ref<Nullable<FormSchema[]>>(null);
-      const formElRef = ref<Nullable<FormActionType>>(null);
+      const defaultValueRef = ref<Recordable>({})
+      const isInitedDefaultRef = ref(false)
+      const propsRef = ref<Partial<FormProps>>({})
+      const schemaRef = ref<Nullable<FormSchema[]>>(null)
+      const formElRef = ref<Nullable<FormActionType>>(null)
 
-      const { prefixCls } = useDesign('basic-form');
+      const { prefixCls } = useDesign('basic-form')
 
       // Get the basic configuration of the form
       const getProps = computed(
         (): FormProps => {
-          return { ...props, ...unref(propsRef) } as FormProps;
+          return { ...props, ...unref(propsRef) } as FormProps
         }
-      );
+      )
 
       const getFormClass = computed(() => {
         return [
           prefixCls,
           {
-            [`${prefixCls}--compact`]: unref(getProps).compact,
-          },
-        ];
-      });
+            [`${prefixCls}--compact`]: unref(getProps).compact
+          }
+        ]
+      })
 
       // Get uniform row style
       const getRowWrapStyle = computed(
         (): CSSProperties => {
-          const { baseRowStyle = {} } = unref(getProps);
-          return baseRowStyle;
+          const { baseRowStyle = {} } = unref(getProps)
+          return baseRowStyle
         }
-      );
+      )
 
       const getSchema = computed((): FormSchema[] => {
-        const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any);
+        const schemas: FormSchema[] = unref(schemaRef) || (unref(getProps).schemas as any)
         for (const schema of schemas) {
-          const { defaultValue, component } = schema;
+          const { defaultValue, component } = schema
           // handle date type
           if (defaultValue && dateItemType.includes(component)) {
             if (!Array.isArray(defaultValue)) {
-              schema.defaultValue = dateUtil(defaultValue);
+              schema.defaultValue = dateUtil(defaultValue)
             } else {
-              const def: moment.Moment[] = [];
-              defaultValue.forEach((item) => {
-                def.push(dateUtil(item));
-              });
-              schema.defaultValue = def;
+              const def: moment.Moment[] = []
+              defaultValue.forEach(item => {
+                def.push(dateUtil(item))
+              })
+              schema.defaultValue = def
             }
           }
         }
-        return schemas as FormSchema[];
-      });
+        return schemas as FormSchema[]
+      })
 
       const { handleToggleAdvanced } = useAdvanced({
         advanceState,
@@ -140,25 +140,25 @@
         getProps,
         getSchema,
         formModel,
-        defaultValueRef,
-      });
+        defaultValueRef
+      })
 
-      const { transformDateFunc, fieldMapToTime, autoFocusFirstItem } = toRefs(props);
+      const { transformDateFunc, fieldMapToTime, autoFocusFirstItem } = toRefs(props)
 
       const { handleFormValues, initDefault } = useFormValues({
         transformDateFuncRef: transformDateFunc,
         fieldMapToTimeRef: fieldMapToTime,
         defaultValueRef,
         getSchema,
-        formModel,
-      });
+        formModel
+      })
 
       useAutoFocus({
         getSchema,
         autoFocusFirstItem,
         isInitedDefault: isInitedDefaultRef,
-        formElRef: formElRef as Ref<FormActionType>,
-      });
+        formElRef: formElRef as Ref<FormActionType>
+      })
 
       const {
         handleSubmit,
@@ -171,7 +171,7 @@
         appendSchemaByField,
         removeSchemaByFiled,
         resetFields,
-        scrollToField,
+        scrollToField
       } = useFormEvents({
         emit,
         getProps,
@@ -180,49 +180,49 @@
         defaultValueRef,
         formElRef: formElRef as Ref<FormActionType>,
         schemaRef: schemaRef as Ref<FormSchema[]>,
-        handleFormValues,
-      });
+        handleFormValues
+      })
 
       createFormContext({
         resetAction: resetFields,
-        submitAction: handleSubmit,
-      });
+        submitAction: handleSubmit
+      })
 
       watch(
         () => unref(getProps).model,
         () => {
-          const { model } = unref(getProps);
-          if (!model) return;
-          setFieldsValue(model);
+          const { model } = unref(getProps)
+          if (!model) return
+          setFieldsValue(model)
         },
         {
-          immediate: true,
+          immediate: true
         }
-      );
+      )
 
       watch(
         () => getSchema.value,
-        (schema) => {
+        schema => {
           nextTick(() => {
             //  Solve the problem of modal adaptive height calculation when the form is placed in the modal
-            modalFn?.redoModalHeight?.();
-          });
+            modalFn?.redoModalHeight?.()
+          })
           if (unref(isInitedDefaultRef)) {
-            return;
+            return
           }
           if (schema?.length) {
-            initDefault();
-            isInitedDefaultRef.value = true;
+            initDefault()
+            isInitedDefaultRef.value = true
           }
         }
-      );
+      )
 
       async function setProps(formProps: Partial<FormProps>): Promise<void> {
-        propsRef.value = deepMerge(unref(propsRef) || {}, formProps);
+        propsRef.value = deepMerge(unref(propsRef) || {}, formProps)
       }
 
       function setFormModel(key: string, value: any) {
-        formModel[key] = value;
+        formModel[key] = value
       }
 
       const formActionType: Partial<FormActionType> = {
@@ -237,13 +237,13 @@
         validateFields,
         validate,
         submit: handleSubmit,
-        scrollToField: scrollToField,
-      };
+        scrollToField: scrollToField
+      }
 
       onMounted(() => {
-        initDefault();
-        emit('register', formActionType);
-      });
+        initDefault()
+        emit('register', formActionType)
+      })
 
       return {
         handleToggleAdvanced,
@@ -258,10 +258,10 @@
         setFormModel,
         prefixCls,
         getFormClass,
-        ...formActionType,
-      };
-    },
-  });
+        ...formActionType
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-form';

+ 42 - 42
src/components/Form/src/components/ApiSelect.vue

@@ -15,24 +15,24 @@
   </Select>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, ref, watchEffect, computed, unref } from 'vue';
-  import { Select } from 'ant-design-vue';
-  import { isFunction } from '/@/utils/is';
-  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
-  import { get } from 'lodash-es';
+  import { defineComponent, PropType, ref, watchEffect, computed, unref } from 'vue'
+  import { Select } from 'ant-design-vue'
+  import { isFunction } from '/@/utils/is'
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
+  import { get } from 'lodash-es'
 
-  import { LoadingOutlined } from '@ant-design/icons-vue';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { propTypes } from '/@/utils/propTypes';
+  import { LoadingOutlined } from '@ant-design/icons-vue'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { propTypes } from '/@/utils/propTypes'
 
-  type OptionsItem = { label: string; value: string; disabled?: boolean };
+  type OptionsItem = { label: string; value: string; disabled?: boolean }
 
   export default defineComponent({
     name: 'ApiSelect',
     components: {
       Select,
-      LoadingOutlined,
+      LoadingOutlined
     },
     inheritAttrs: false,
     props: {
@@ -40,70 +40,70 @@
       numberToString: propTypes.bool,
       api: {
         type: Function as PropType<(arg?: Recordable) => Promise<OptionsItem[]>>,
-        default: null,
+        default: null
       },
       // api params
       params: {
         type: Object as PropType<Recordable>,
-        default: () => {},
+        default: () => {}
       },
       // support xxx.xxx.xx
       resultField: propTypes.string.def(''),
       labelField: propTypes.string.def('label'),
-      valueField: propTypes.string.def('value'),
+      valueField: propTypes.string.def('value')
     },
     emits: ['options-change', 'change'],
     setup(props, { emit }) {
-      const options = ref<OptionsItem[]>([]);
-      const loading = ref(false);
-      const attrs = useAttrs();
-      const { t } = useI18n();
+      const options = ref<OptionsItem[]>([])
+      const loading = ref(false)
+      const attrs = useAttrs()
+      const { t } = useI18n()
 
       // Embedded in the form, just use the hook binding to perform form verification
-      const [state] = useRuleFormItem(props);
+      const [state] = useRuleFormItem(props)
 
       const getOptions = computed(() => {
-        const { labelField, valueField, numberToString } = props;
+        const { labelField, valueField, numberToString } = props
 
         return unref(options).reduce((prev, next: Recordable) => {
           if (next) {
-            const value = next[valueField];
+            const value = next[valueField]
             prev.push({
               label: next[labelField],
-              value: numberToString ? `${value}` : value,
-            });
+              value: numberToString ? `${value}` : value
+            })
           }
-          return prev;
-        }, [] as OptionsItem[]);
-      });
+          return prev
+        }, [] as OptionsItem[])
+      })
 
       watchEffect(() => {
-        fetch();
-      });
+        fetch()
+      })
 
       async function fetch() {
-        const api = props.api;
-        if (!api || !isFunction(api)) return;
+        const api = props.api
+        if (!api || !isFunction(api)) return
 
         try {
-          loading.value = true;
-          const res = await api(props.params);
+          loading.value = true
+          const res = await api(props.params)
           if (Array.isArray(res)) {
-            options.value = res;
-            emit('options-change', unref(options));
-            return;
+            options.value = res
+            emit('options-change', unref(options))
+            return
           }
           if (props.resultField) {
-            options.value = get(res, props.resultField) || [];
+            options.value = get(res, props.resultField) || []
           }
-          emit('options-change', unref(options));
+          emit('options-change', unref(options))
         } catch (error) {
-          console.warn(error);
+          console.warn(error)
         } finally {
-          loading.value = false;
+          loading.value = false
         }
       }
-      return { state, attrs, getOptions, loading, t };
-    },
-  });
+      return { state, attrs, getOptions, loading, t }
+    }
+  })
 </script>

+ 34 - 36
src/components/Form/src/components/FormAction.vue

@@ -38,19 +38,19 @@
   </a-col>
 </template>
 <script lang="ts">
-  import type { ColEx } from '../types/index';
-  import type { ButtonProps } from 'ant-design-vue/es/button/buttonTypes';
+  import type { ColEx } from '../types/index'
+  import type { ButtonProps } from 'ant-design-vue/es/button/buttonTypes'
 
-  import { defineComponent, computed, PropType } from 'vue';
-  import { Form, Col } from 'ant-design-vue';
-  import { Button } from '/@/components/Button';
-  import { BasicArrow } from '/@/components/Basic/index';
-  import { useFormContext } from '../hooks/useFormContext';
+  import { defineComponent, computed, PropType } from 'vue'
+  import { Form, Col } from 'ant-design-vue'
+  import { Button } from '/@/components/Button'
+  import { BasicArrow } from '/@/components/Basic/index'
+  import { useFormContext } from '../hooks/useFormContext'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { propTypes } from '/@/utils/propTypes';
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { propTypes } from '/@/utils/propTypes'
 
-  type ButtonOptions = Partial<ButtonProps> & { text: string };
+  type ButtonOptions = Partial<ButtonProps> & { text: string }
 
   export default defineComponent({
     name: 'BasicFormAction',
@@ -58,7 +58,7 @@
       FormItem: Form.Item,
       Button,
       BasicArrow,
-      [Col.name]: Col,
+      [Col.name]: Col
     },
     props: {
       showActionButtonGroup: propTypes.bool.def(true),
@@ -67,60 +67,58 @@
       showAdvancedButton: propTypes.bool.def(true),
       resetButtonOptions: {
         type: Object as PropType<ButtonOptions>,
-        default: {},
+        default: {}
       },
       submitButtonOptions: {
         type: Object as PropType<ButtonOptions>,
-        default: {},
+        default: {}
       },
       actionColOptions: {
         type: Object as PropType<Partial<ColEx>>,
-        default: {},
+        default: {}
       },
       actionSpan: propTypes.number.def(6),
       isAdvanced: propTypes.bool,
-      hideAdvanceBtn: propTypes.bool,
+      hideAdvanceBtn: propTypes.bool
     },
     emits: ['toggle-advanced'],
     setup(props, { emit }) {
-      const { t } = useI18n();
+      const { t } = useI18n()
 
       const actionColOpt = computed(() => {
-        const { showAdvancedButton, actionSpan: span, actionColOptions } = props;
-        const actionSpan = 24 - span;
-        const advancedSpanObj = showAdvancedButton
-          ? { span: actionSpan < 6 ? 24 : actionSpan }
-          : {};
+        const { showAdvancedButton, actionSpan: span, actionColOptions } = props
+        const actionSpan = 24 - span
+        const advancedSpanObj = showAdvancedButton ? { span: actionSpan < 6 ? 24 : actionSpan } : {}
         const actionColOpt: Partial<ColEx> = {
           span: showAdvancedButton ? 6 : 4,
           ...advancedSpanObj,
-          ...actionColOptions,
-        };
-        return actionColOpt;
-      });
+          ...actionColOptions
+        }
+        return actionColOpt
+      })
 
       const getResetBtnOptions = computed(
         (): ButtonOptions => {
           return Object.assign(
             {
-              text: t('common.resetText'),
+              text: t('common.resetText')
             },
             props.resetButtonOptions
-          );
+          )
         }
-      );
+      )
 
       const getSubmitBtnOptions = computed(() => {
         return Object.assign(
           {
-            text: t('common.queryText'),
+            text: t('common.queryText')
           },
           props.submitButtonOptions
-        );
-      });
+        )
+      })
 
       function toggleAdvanced() {
-        emit('toggle-advanced');
+        emit('toggle-advanced')
       }
 
       return {
@@ -129,8 +127,8 @@
         getResetBtnOptions,
         getSubmitBtnOptions,
         toggleAdvanced,
-        ...useFormContext(),
-      };
-    },
-  });
+        ...useFormContext()
+      }
+    }
+  })
 </script>

+ 129 - 129
src/components/Form/src/components/FormItem.vue

@@ -1,22 +1,22 @@
 <script lang="tsx">
-  import type { PropType, Ref } from 'vue';
-  import type { FormActionType, FormProps } from '../types/form';
-  import type { FormSchema } from '../types/form';
-  import type { ValidationRule } from 'ant-design-vue/lib/form/Form';
-  import type { TableActionType } from '/@/components/Table';
+  import type { PropType, Ref } from 'vue'
+  import type { FormActionType, FormProps } from '../types/form'
+  import type { FormSchema } from '../types/form'
+  import type { ValidationRule } from 'ant-design-vue/lib/form/Form'
+  import type { TableActionType } from '/@/components/Table'
 
-  import { defineComponent, computed, unref, toRefs } from 'vue';
-  import { Form, Col } from 'ant-design-vue';
-  import { componentMap } from '../componentMap';
-  import { BasicHelp } from '/@/components/Basic';
+  import { defineComponent, computed, unref, toRefs } from 'vue'
+  import { Form, Col } from 'ant-design-vue'
+  import { componentMap } from '../componentMap'
+  import { BasicHelp } from '/@/components/Basic'
 
-  import { isBoolean, isFunction } from '/@/utils/is';
-  import { getSlot } from '/@/utils/helper/tsxHelper';
-  import { createPlaceholderMessage, setComponentRuleType } from '../helper';
-  import { upperFirst, cloneDeep } from 'lodash-es';
+  import { isBoolean, isFunction } from '/@/utils/is'
+  import { getSlot } from '/@/utils/helper/tsxHelper'
+  import { createPlaceholderMessage, setComponentRuleType } from '../helper'
+  import { upperFirst, cloneDeep } from 'lodash-es'
 
-  import { useItemLabelWidth } from '../hooks/useLabelWidth';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useItemLabelWidth } from '../hooks/useLabelWidth'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'BasicFormItem',
@@ -24,106 +24,106 @@
     props: {
       schema: {
         type: Object as PropType<FormSchema>,
-        default: () => {},
+        default: () => {}
       },
       formProps: {
         type: Object as PropType<FormProps>,
-        default: {},
+        default: {}
       },
       allDefaultValues: {
         type: Object as PropType<Recordable>,
-        default: {},
+        default: {}
       },
       formModel: {
         type: Object as PropType<Recordable>,
-        default: {},
+        default: {}
       },
       setFormModel: {
         type: Function as PropType<(key: string, value: any) => void>,
-        default: null,
+        default: null
       },
       tableAction: {
-        type: Object as PropType<TableActionType>,
+        type: Object as PropType<TableActionType>
       },
       formActionType: {
-        type: Object as PropType<FormActionType>,
-      },
+        type: Object as PropType<FormActionType>
+      }
     },
     setup(props, { slots }) {
-      const { t } = useI18n();
+      const { t } = useI18n()
 
       const { schema, formProps } = toRefs(props) as {
-        schema: Ref<FormSchema>;
-        formProps: Ref<FormProps>;
-      };
+        schema: Ref<FormSchema>
+        formProps: Ref<FormProps>
+      }
 
-      const itemLabelWidthProp = useItemLabelWidth(schema, formProps);
+      const itemLabelWidthProp = useItemLabelWidth(schema, formProps)
 
       const getValues = computed(() => {
-        const { allDefaultValues, formModel, schema } = props;
-        const { mergeDynamicData } = props.formProps;
+        const { allDefaultValues, formModel, schema } = props
+        const { mergeDynamicData } = props.formProps
         return {
           field: schema.field,
           model: formModel,
           values: {
             ...mergeDynamicData,
             ...allDefaultValues,
-            ...formModel,
+            ...formModel
           } as Recordable,
-          schema: schema,
-        };
-      });
+          schema: schema
+        }
+      })
 
       const getComponentsProps = computed(() => {
-        const { schema, tableAction, formModel, formActionType } = props;
-        const { componentProps = {} } = schema;
+        const { schema, tableAction, formModel, formActionType } = props
+        const { componentProps = {} } = schema
         if (!isFunction(componentProps)) {
-          return componentProps;
+          return componentProps
         }
-        return componentProps({ schema, tableAction, formModel, formActionType }) ?? {};
-      });
+        return componentProps({ schema, tableAction, formModel, formActionType }) ?? {}
+      })
 
       const getDisable = computed(() => {
-        const { disabled: globDisabled } = props.formProps;
-        const { dynamicDisabled } = props.schema;
-        const { disabled: itemDisabled = false } = unref(getComponentsProps);
-        let disabled = !!globDisabled || itemDisabled;
+        const { disabled: globDisabled } = props.formProps
+        const { dynamicDisabled } = props.schema
+        const { disabled: itemDisabled = false } = unref(getComponentsProps)
+        let disabled = !!globDisabled || itemDisabled
         if (isBoolean(dynamicDisabled)) {
-          disabled = dynamicDisabled;
+          disabled = dynamicDisabled
         }
 
         if (isFunction(dynamicDisabled)) {
-          disabled = dynamicDisabled(unref(getValues));
+          disabled = dynamicDisabled(unref(getValues))
         }
-        return disabled;
-      });
+        return disabled
+      })
 
       function getShow(): { isShow: boolean; isIfShow: boolean } {
-        const { show, ifShow } = props.schema;
-        const { showAdvancedButton } = props.formProps;
+        const { show, ifShow } = props.schema
+        const { showAdvancedButton } = props.formProps
         const itemIsAdvanced = showAdvancedButton
           ? isBoolean(props.schema.isAdvanced)
             ? props.schema.isAdvanced
             : true
-          : true;
+          : true
 
-        let isShow = true;
-        let isIfShow = true;
+        let isShow = true
+        let isIfShow = true
 
         if (isBoolean(show)) {
-          isShow = show;
+          isShow = show
         }
         if (isBoolean(ifShow)) {
-          isIfShow = ifShow;
+          isIfShow = ifShow
         }
         if (isFunction(show)) {
-          isShow = show(unref(getValues));
+          isShow = show(unref(getValues))
         }
         if (isFunction(ifShow)) {
-          isIfShow = ifShow(unref(getValues));
+          isIfShow = ifShow(unref(getValues))
         }
-        isShow = isShow && itemIsAdvanced;
-        return { isShow, isIfShow };
+        isShow = isShow && itemIsAdvanced
+        return { isShow, isIfShow }
       }
 
       function handleRules(): ValidationRule[] {
@@ -133,56 +133,56 @@
           rulesMessageJoinLabel,
           label,
           dynamicRules,
-          required,
-        } = props.schema;
+          required
+        } = props.schema
 
         if (isFunction(dynamicRules)) {
-          return dynamicRules(unref(getValues)) as ValidationRule[];
+          return dynamicRules(unref(getValues)) as ValidationRule[]
         }
 
-        let rules: ValidationRule[] = cloneDeep(defRules) as ValidationRule[];
+        let rules: ValidationRule[] = cloneDeep(defRules) as ValidationRule[]
 
         if ((!rules || rules.length === 0) && required) {
-          rules = [{ required, type: 'string' }];
+          rules = [{ required, type: 'string' }]
         }
 
         const requiredRuleIndex: number = rules.findIndex(
-          (rule) => Reflect.has(rule, 'required') && !Reflect.has(rule, 'validator')
-        );
-        const { rulesMessageJoinLabel: globalRulesMessageJoinLabel } = props.formProps;
+          rule => Reflect.has(rule, 'required') && !Reflect.has(rule, 'validator')
+        )
+        const { rulesMessageJoinLabel: globalRulesMessageJoinLabel } = props.formProps
         if (requiredRuleIndex !== -1) {
-          const rule = rules[requiredRuleIndex];
-          const { isShow } = getShow();
+          const rule = rules[requiredRuleIndex]
+          const { isShow } = getShow()
           if (!isShow) {
-            rule.required = false;
+            rule.required = false
           }
           if (rule.required && component) {
             if (!Reflect.has(rule, 'type')) {
-              rule.type = 'string';
+              rule.type = 'string'
             }
             const joinLabel = Reflect.has(props.schema, 'rulesMessageJoinLabel')
               ? rulesMessageJoinLabel
-              : globalRulesMessageJoinLabel;
+              : globalRulesMessageJoinLabel
 
             rule.message =
-              rule.message || createPlaceholderMessage(component) + `${joinLabel ? label : ''}`;
+              rule.message || createPlaceholderMessage(component) + `${joinLabel ? label : ''}`
 
             if (component.includes('Input') || component.includes('Textarea')) {
-              rule.whitespace = true;
+              rule.whitespace = true
             }
 
-            setComponentRuleType(rule, component);
+            setComponentRuleType(rule, component)
           }
         }
 
         // Maximum input length rule check
-        const characterInx = rules.findIndex((val) => val.max);
+        const characterInx = rules.findIndex(val => val.max)
         if (characterInx !== -1 && !rules[characterInx].validator) {
           rules[characterInx].message =
             rules[characterInx].message ||
-            t('component.form.maxTip', [rules[characterInx].max] as Recordable);
+            t('component.form.maxTip', [rules[characterInx].max] as Recordable)
         }
-        return rules;
+        return rules
       }
 
       function renderComponent() {
@@ -191,105 +191,105 @@
           component,
           field,
           changeEvent = 'change',
-          valueField,
-        } = props.schema;
+          valueField
+        } = props.schema
 
-        const isCheck = component && ['Switch', 'Checkbox'].includes(component);
+        const isCheck = component && ['Switch', 'Checkbox'].includes(component)
 
-        const eventKey = `on${upperFirst(changeEvent)}`;
+        const eventKey = `on${upperFirst(changeEvent)}`
 
         const on = {
           [eventKey]: (e: Nullable<Recordable>) => {
             if (propsData[eventKey]) {
-              propsData[eventKey](e);
+              propsData[eventKey](e)
             }
 
-            const target = e ? e.target : null;
+            const target = e ? e.target : null
 
-            const value = target ? (isCheck ? target.checked : target.value) : e;
-            props.setFormModel(field, value);
-          },
-        };
-        const Comp = componentMap.get(component) as typeof defineComponent;
+            const value = target ? (isCheck ? target.checked : target.value) : e
+            props.setFormModel(field, value)
+          }
+        }
+        const Comp = componentMap.get(component) as typeof defineComponent
 
-        const { autoSetPlaceHolder, size } = props.formProps;
+        const { autoSetPlaceHolder, size } = props.formProps
         const propsData: Recordable = {
           allowClear: true,
           getPopupContainer: (trigger: Element) => trigger.parentNode,
           size,
           ...unref(getComponentsProps),
-          disabled: unref(getDisable),
-        };
+          disabled: unref(getDisable)
+        }
 
-        const isCreatePlaceholder = !propsData.disabled && autoSetPlaceHolder;
-        let placeholder;
+        const isCreatePlaceholder = !propsData.disabled && autoSetPlaceHolder
+        let placeholder
         // RangePicker place is an array
         if (isCreatePlaceholder && component !== 'RangePicker' && component) {
           placeholder =
-            unref(getComponentsProps)?.placeholder || createPlaceholderMessage(component);
+            unref(getComponentsProps)?.placeholder || createPlaceholderMessage(component)
         }
-        propsData.placeholder = placeholder;
-        propsData.codeField = field;
-        propsData.formValues = unref(getValues);
+        propsData.placeholder = placeholder
+        propsData.codeField = field
+        propsData.formValues = unref(getValues)
 
         const bindValue: Recordable = {
-          [valueField || (isCheck ? 'checked' : 'value')]: props.formModel[field],
-        };
+          [valueField || (isCheck ? 'checked' : 'value')]: props.formModel[field]
+        }
 
         const compAttr: Recordable = {
           ...propsData,
           ...on,
-          ...bindValue,
-        };
+          ...bindValue
+        }
 
         if (!renderComponentContent) {
-          return <Comp {...compAttr} />;
+          return <Comp {...compAttr} />
         }
         const compSlot = isFunction(renderComponentContent)
           ? { ...renderComponentContent(unref(getValues)) }
           : {
-              default: () => renderComponentContent,
-            };
+              default: () => renderComponentContent
+            }
 
-        return <Comp {...compAttr}>{compSlot}</Comp>;
+        return <Comp {...compAttr}>{compSlot}</Comp>
       }
 
       function renderLabelHelpMessage() {
-        const { label, helpMessage, helpComponentProps, subLabel } = props.schema;
+        const { label, helpMessage, helpComponentProps, subLabel } = props.schema
         const renderLabel = subLabel ? (
           <span>
             {label} <span style="color:#00000073">{subLabel}</span>
           </span>
         ) : (
           label
-        );
+        )
         if (!helpMessage || (Array.isArray(helpMessage) && helpMessage.length === 0)) {
-          return renderLabel;
+          return renderLabel
         }
         return (
           <span>
             {renderLabel}
             <BasicHelp placement="top" class="mx-1" text={helpMessage} {...helpComponentProps} />
           </span>
-        );
+        )
       }
 
       function renderItem() {
-        const { itemProps, slot, render, field, suffix } = props.schema;
-        const { labelCol, wrapperCol } = unref(itemLabelWidthProp);
-        const { colon } = props.formProps;
+        const { itemProps, slot, render, field, suffix } = props.schema
+        const { labelCol, wrapperCol } = unref(itemLabelWidthProp)
+        const { colon } = props.formProps
 
         const getContent = () => {
           return slot
             ? getSlot(slots, slot, unref(getValues))
             : render
             ? render(unref(getValues))
-            : renderComponent();
-        };
+            : renderComponent()
+        }
 
-        const showSuffix = !!suffix;
+        const showSuffix = !!suffix
 
-        const getSuffix = isFunction(suffix) ? suffix(unref(getValues)) : suffix;
+        const getSuffix = isFunction(suffix) ? suffix(unref(getValues)) : suffix
 
         return (
           <Form.Item
@@ -307,25 +307,25 @@
               {showSuffix && <span class="suffix">{getSuffix}</span>}
             </>
           </Form.Item>
-        );
+        )
       }
       return () => {
-        const { colProps = {}, colSlot, renderColContent, component } = props.schema;
-        if (!componentMap.has(component)) return null;
+        const { colProps = {}, colSlot, renderColContent, component } = props.schema
+        if (!componentMap.has(component)) return null
 
-        const { baseColProps = {} } = props.formProps;
+        const { baseColProps = {} } = props.formProps
 
-        const realColProps = { ...baseColProps, ...colProps };
-        const { isIfShow, isShow } = getShow();
+        const realColProps = { ...baseColProps, ...colProps }
+        const { isIfShow, isShow } = getShow()
 
-        const values = unref(getValues);
+        const values = unref(getValues)
         const getContent = () => {
           return colSlot
             ? getSlot(slots, colSlot, values)
             : renderColContent
             ? renderColContent(values)
-            : renderItem();
-        };
+            : renderItem()
+        }
 
         return (
           isIfShow && (
@@ -333,8 +333,8 @@
               {getContent()}
             </Col>
           )
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 </script>

+ 22 - 22
src/components/Form/src/components/RadioButtonGroup.vue

@@ -12,45 +12,45 @@
   </RadioGroup>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, computed } from 'vue';
-  import { Radio } from 'ant-design-vue';
-  import { isString } from '/@/utils/is';
-  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
-  type OptionsItem = { label: string; value: string; disabled?: boolean };
-  type RadioItem = string | OptionsItem;
+  import { defineComponent, PropType, computed } from 'vue'
+  import { Radio } from 'ant-design-vue'
+  import { isString } from '/@/utils/is'
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
+  type OptionsItem = { label: string; value: string; disabled?: boolean }
+  type RadioItem = string | OptionsItem
 
   export default defineComponent({
     name: 'RadioButtonGroup',
     components: {
       RadioGroup: Radio.Group,
-      RadioButton: Radio.Button,
+      RadioButton: Radio.Button
     },
     props: {
       value: {
-        type: String as PropType<string>,
+        type: String as PropType<string>
       },
       options: {
         type: Array as PropType<RadioItem[]>,
-        default: () => [],
-      },
+        default: () => []
+      }
     },
     setup(props) {
-      const attrs = useAttrs();
+      const attrs = useAttrs()
       // Embedded in the form, just use the hook binding to perform form verification
-      const [state] = useRuleFormItem(props);
+      const [state] = useRuleFormItem(props)
       // Processing options value
       const getOptions = computed((): OptionsItem[] => {
-        const { options } = props;
-        if (!options || options?.length === 0) return [];
+        const { options } = props
+        if (!options || options?.length === 0) return []
 
-        const isStringArr = options.some((item) => isString(item));
-        if (!isStringArr) return options as OptionsItem[];
+        const isStringArr = options.some(item => isString(item))
+        if (!isStringArr) return options as OptionsItem[]
 
-        return options.map((item) => ({ label: item, value: item })) as OptionsItem[];
-      });
+        return options.map(item => ({ label: item, value: item })) as OptionsItem[]
+      })
 
-      return { state, getOptions, attrs };
-    },
-  });
+      return { state, getOptions, attrs }
+    }
+  })
 </script>

+ 50 - 50
src/components/Icon/src/IconPicker.vue

@@ -64,38 +64,38 @@
   </a-input>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, watchEffect, watch, unref } from 'vue';
+  import { defineComponent, ref, watchEffect, watch, unref } from 'vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { ScrollContainer } from '/@/components/Container';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { ScrollContainer } from '/@/components/Container'
 
-  import { Input, Popover, Pagination, Empty } from 'ant-design-vue';
-  import Icon from './index.vue';
-  import SvgIcon from './SvgIcon.vue';
+  import { Input, Popover, Pagination, Empty } from 'ant-design-vue'
+  import Icon from './index.vue'
+  import SvgIcon from './SvgIcon.vue'
 
-  import iconsData from '../data/icons.data';
-  import { propTypes } from '/@/utils/propTypes';
-  import { usePagination } from '/@/hooks/web/usePagination';
-  import { useDebounce } from '/@/hooks/core/useDebounce';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import svgIcons from 'vite-plugin-svg-icons/client';
+  import iconsData from '../data/icons.data'
+  import { propTypes } from '/@/utils/propTypes'
+  import { usePagination } from '/@/hooks/web/usePagination'
+  import { useDebounce } from '/@/hooks/core/useDebounce'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useCopyToClipboard } from '/@/hooks/web/useCopyToClipboard'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import svgIcons from 'vite-plugin-svg-icons/client'
 
   function getIcons() {
-    const data = iconsData as any;
-    const prefix: string = data?.prefix ?? '';
-    let result: string[] = [];
+    const data = iconsData as any
+    const prefix: string = data?.prefix ?? ''
+    let result: string[] = []
     if (prefix) {
-      result = (data?.icons ?? []).map((item) => `${prefix}:${item}`);
+      result = (data?.icons ?? []).map(item => `${prefix}:${item}`)
     } else if (Array.isArray(iconsData)) {
-      result = iconsData as string[];
+      result = iconsData as string[]
     }
-    return result;
+    return result
   }
 
   function getSvgIcons() {
-    return svgIcons.map((icon) => icon.replace('icon-', ''));
+    return svgIcons.map(icon => icon.replace('icon-', ''))
   }
 
   export default defineComponent({
@@ -109,60 +109,60 @@
       copy: propTypes.bool.def(false),
       mode: propTypes
         .oneOf<('svg' | 'iconify')[]>(['svg', 'iconify'])
-        .def('iconify'),
+        .def('iconify')
     },
     emits: ['change'],
     setup(props, { emit }) {
-      const isSvgMode = props.mode === 'svg';
-      const icons = isSvgMode ? getSvgIcons() : getIcons();
+      const isSvgMode = props.mode === 'svg'
+      const icons = isSvgMode ? getSvgIcons() : getIcons()
 
-      const currentSelect = ref('');
-      const visible = ref(false);
-      const currentList = ref(icons);
+      const currentSelect = ref('')
+      const visible = ref(false)
+      const currentList = ref(icons)
 
-      const { t } = useI18n();
-      const { prefixCls } = useDesign('icon-picker');
+      const { t } = useI18n()
+      const { prefixCls } = useDesign('icon-picker')
 
-      const [debounceHandleSearchChange] = useDebounce(handleSearchChange, 100);
-      const { clipboardRef, isSuccessRef } = useCopyToClipboard(props.value);
-      const { createMessage } = useMessage();
+      const [debounceHandleSearchChange] = useDebounce(handleSearchChange, 100)
+      const { clipboardRef, isSuccessRef } = useCopyToClipboard(props.value)
+      const { createMessage } = useMessage()
 
       const { getPaginationList, getTotal, setCurrentPage } = usePagination(
         currentList,
         props.pageSize
-      );
+      )
 
       watchEffect(() => {
-        currentSelect.value = props.value;
-      });
+        currentSelect.value = props.value
+      })
 
       watch(
         () => currentSelect.value,
-        (v) => emit('change', v)
-      );
+        v => emit('change', v)
+      )
 
       function handlePageChange(page: number) {
-        setCurrentPage(page);
+        setCurrentPage(page)
       }
 
       function handleClick(icon: string) {
-        currentSelect.value = icon;
+        currentSelect.value = icon
         if (props.copy) {
-          clipboardRef.value = icon;
+          clipboardRef.value = icon
           if (unref(isSuccessRef)) {
-            createMessage.success(t('component.icon.copy'));
+            createMessage.success(t('component.icon.copy'))
           }
         }
       }
 
       function handleSearchChange(e: ChangeEvent) {
-        const value = e.target.value;
+        const value = e.target.value
         if (!value) {
-          setCurrentPage(1);
-          currentList.value = icons;
-          return;
+          setCurrentPage(1)
+          currentList.value = icons
+          return
         }
-        currentList.value = icons.filter((item) => item.includes(value));
+        currentList.value = icons.filter(item => item.includes(value))
       }
 
       return {
@@ -175,10 +175,10 @@
         handlePageChange,
         handleClick,
         currentSelect,
-        handleSearchChange: debounceHandleSearchChange,
-      };
-    },
-  });
+        handleSearchChange: debounceHandleSearchChange
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-icon-picker';

+ 18 - 18
src/components/Icon/src/SvgIcon.vue

@@ -4,44 +4,44 @@
   </svg>
 </template>
 <script lang="ts">
-  import type { CSSProperties } from 'vue';
-  import { defineComponent, computed } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import type { CSSProperties } from 'vue'
+  import { defineComponent, computed } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   export default defineComponent({
     name: 'SvgIcon',
     props: {
       prefix: {
         type: String,
-        default: 'icon',
+        default: 'icon'
       },
       name: {
         type: String,
-        required: true,
+        required: true
       },
       size: {
         type: [Number, String],
-        default: 16,
-      },
+        default: 16
+      }
     },
     setup(props) {
-      const { prefixCls } = useDesign('svg-icon');
-      const symbolId = computed(() => `#${props.prefix}-${props.name}`);
+      const { prefixCls } = useDesign('svg-icon')
+      const symbolId = computed(() => `#${props.prefix}-${props.name}`)
 
       const getStyle = computed(
         (): CSSProperties => {
-          const { size } = props;
-          let s = `${size}`;
-          s = `${s.replace('px', '')}px`;
+          const { size } = props
+          let s = `${size}`
+          s = `${s.replace('px', '')}px`
           return {
             width: s,
-            height: s,
-          };
+            height: s
+          }
         }
-      );
-      return { symbolId, prefixCls, getStyle };
-    },
-  });
+      )
+      return { symbolId, prefixCls, getStyle }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-svg-icon';

+ 40 - 40
src/components/Icon/src/index.vue

@@ -8,7 +8,7 @@
   ></span>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import type { PropType } from 'vue'
   import {
     defineComponent,
     ref,
@@ -17,15 +17,15 @@
     nextTick,
     unref,
     computed,
-    CSSProperties,
-  } from 'vue';
+    CSSProperties
+  } from 'vue'
 
-  import SvgIcon from './SvgIcon.vue';
-  import Iconify from '@purge-icons/generated';
-  import { isString } from '/@/utils/is';
-  import { propTypes } from '/@/utils/propTypes';
+  import SvgIcon from './SvgIcon.vue'
+  import Iconify from '@purge-icons/generated'
+  import { isString } from '/@/utils/is'
+  import { propTypes } from '/@/utils/propTypes'
 
-  const SVG_END_WITH_FLAG = '|svg';
+  const SVG_END_WITH_FLAG = '|svg'
   export default defineComponent({
     name: 'GIcon',
     components: { SvgIcon },
@@ -37,62 +37,62 @@
       // icon size
       size: {
         type: [String, Number] as PropType<string | number>,
-        default: 16,
+        default: 16
       },
-      prefix: propTypes.string.def(''),
+      prefix: propTypes.string.def('')
     },
     setup(props) {
-      const elRef = ref<ElRef>(null);
+      const elRef = ref<ElRef>(null)
 
-      const isSvgIcon = computed(() => props.icon?.endsWith(SVG_END_WITH_FLAG));
-      const getSvgIcon = computed(() => props.icon.replace(SVG_END_WITH_FLAG, ''));
-      const getIconRef = computed(() => `${props.prefix ? props.prefix + ':' : ''}${props.icon}`);
+      const isSvgIcon = computed(() => props.icon?.endsWith(SVG_END_WITH_FLAG))
+      const getSvgIcon = computed(() => props.icon.replace(SVG_END_WITH_FLAG, ''))
+      const getIconRef = computed(() => `${props.prefix ? props.prefix + ':' : ''}${props.icon}`)
 
       const update = async () => {
-        if (unref(isSvgIcon)) return;
+        if (unref(isSvgIcon)) return
 
-        const el = unref(elRef);
-        if (!el) return;
+        const el = unref(elRef)
+        if (!el) return
 
-        await nextTick();
-        const icon = unref(getIconRef);
-        if (!icon) return;
+        await nextTick()
+        const icon = unref(getIconRef)
+        if (!icon) return
 
-        const svg = Iconify.renderSVG(icon, {});
+        const svg = Iconify.renderSVG(icon, {})
         if (svg) {
-          el.textContent = '';
-          el.appendChild(svg);
+          el.textContent = ''
+          el.appendChild(svg)
         } else {
-          const span = document.createElement('span');
-          span.className = 'iconify';
-          span.dataset.icon = icon;
-          el.textContent = '';
-          el.appendChild(span);
+          const span = document.createElement('span')
+          span.className = 'iconify'
+          span.dataset.icon = icon
+          el.textContent = ''
+          el.appendChild(span)
         }
-      };
+      }
 
       const getWrapStyle = computed(
         (): CSSProperties => {
-          const { size, color } = props;
-          let fs = size;
+          const { size, color } = props
+          let fs = size
           if (isString(size)) {
-            fs = parseInt(size, 10);
+            fs = parseInt(size, 10)
           }
           return {
             fontSize: `${fs}px`,
             color,
-            display: 'inline-flex',
-          };
+            display: 'inline-flex'
+          }
         }
-      );
+      )
 
-      watch(() => props.icon, update, { flush: 'post' });
+      watch(() => props.icon, update, { flush: 'post' })
 
-      onMounted(update);
+      onMounted(update)
 
-      return { elRef, getWrapStyle, isSvgIcon, getSvgIcon };
-    },
-  });
+      return { elRef, getWrapStyle, isSvgIcon, getSvgIcon }
+    }
+  })
 </script>
 <style lang="less">
   .app-iconify {

+ 20 - 20
src/components/Loading/src/index.vue

@@ -4,13 +4,13 @@
   </section>
 </template>
 <script lang="ts">
-  import { computed, CSSProperties, PropType } from 'vue';
+  import { computed, CSSProperties, PropType } from 'vue'
 
-  import { defineComponent } from 'vue';
-  import { Spin } from 'ant-design-vue';
+  import { defineComponent } from 'vue'
+  import { Spin } from 'ant-design-vue'
 
-  import { SizeEnum } from '/@/enums/sizeEnum';
-  import { ThemeEnum } from '/@/enums/appEnum';
+  import { SizeEnum } from '/@/enums/sizeEnum'
+  import { ThemeEnum } from '/@/enums/appEnum'
 
   export default defineComponent({
     name: 'Loading',
@@ -18,47 +18,47 @@
     props: {
       tip: {
         type: String as PropType<string>,
-        default: '',
+        default: ''
       },
       size: {
         type: String as PropType<SizeEnum>,
         default: SizeEnum.LARGE,
         validator: (v: SizeEnum): boolean => {
-          return [SizeEnum.DEFAULT, SizeEnum.SMALL, SizeEnum.LARGE].includes(v);
-        },
+          return [SizeEnum.DEFAULT, SizeEnum.SMALL, SizeEnum.LARGE].includes(v)
+        }
       },
       absolute: {
         type: Boolean as PropType<boolean>,
-        default: false,
+        default: false
       },
       loading: {
         type: Boolean as PropType<boolean>,
-        default: false,
+        default: false
       },
       background: {
-        type: String as PropType<string>,
+        type: String as PropType<string>
       },
       theme: {
         type: String as PropType<'dark' | 'light'>,
-        default: 'light',
-      },
+        default: 'light'
+      }
     },
     setup(props) {
       const getStyle = computed(
         (): CSSProperties => {
-          const { background, theme } = props;
+          const { background, theme } = props
           const bgColor = background
             ? background
             : theme === ThemeEnum.DARK
             ? 'rgba(0, 0, 0, 0.2)'
-            : 'rgba(240, 242, 245, 0.4)';
-          return { background: bgColor };
+            : 'rgba(240, 242, 245, 0.4)'
+          return { background: bgColor }
         }
-      );
+      )
 
-      return { getStyle };
-    },
-  });
+      return { getStyle }
+    }
+  })
 </script>
 <style lang="less" scoped>
   .full-loading {

+ 52 - 52
src/components/Markdown/src/index.vue

@@ -10,103 +10,103 @@
     onUnmounted,
     nextTick,
     computed,
-    watchEffect,
-  } from 'vue';
-  import Vditor from 'vditor';
-  import 'vditor/dist/index.css';
+    watchEffect
+  } from 'vue'
+  import Vditor from 'vditor'
+  import 'vditor/dist/index.css'
 
-  import { propTypes } from '/@/utils/propTypes';
-  import { useLocale } from '/@/locales/useLocale';
-  import { useModalContext } from '../../Modal';
+  import { propTypes } from '/@/utils/propTypes'
+  import { useLocale } from '/@/locales/useLocale'
+  import { useModalContext } from '../../Modal'
 
-  type Lang = 'zh_CN' | 'en_US' | 'ja_JP' | 'ko_KR' | undefined;
+  type Lang = 'zh_CN' | 'en_US' | 'ja_JP' | 'ko_KR' | undefined
   export default defineComponent({
     inheritAttrs: false,
     props: {
       height: propTypes.number.def(360),
-      value: propTypes.string.def(''),
+      value: propTypes.string.def('')
     },
     emits: ['change', 'get'],
     setup(props, { attrs, emit }) {
-      const wrapRef = ref<ElRef>(null);
-      const vditorRef = ref<Nullable<Vditor>>(null);
-      const initedRef = ref(false);
+      const wrapRef = ref<ElRef>(null)
+      const vditorRef = ref<Nullable<Vditor>>(null)
+      const initedRef = ref(false)
 
-      const modalFn = useModalContext();
+      const modalFn = useModalContext()
 
-      const { getLocale } = useLocale();
+      const { getLocale } = useLocale()
 
-      watchEffect(() => {});
+      watchEffect(() => {})
 
       const getCurrentLang = computed((): 'zh_CN' | 'en_US' | 'ja_JP' | 'ko_KR' => {
-        let lang: Lang;
+        let lang: Lang
         switch (unref(getLocale)) {
           case 'en':
-            lang = 'en_US';
-            break;
+            lang = 'en_US'
+            break
           case 'ja':
-            lang = 'ja_JP';
-            break;
+            lang = 'ja_JP'
+            break
           case 'ko':
-            lang = 'ko_KR';
-            break;
+            lang = 'ko_KR'
+            break
           default:
-            lang = 'zh_CN';
+            lang = 'zh_CN'
         }
-        return lang;
-      });
+        return lang
+      })
       function init() {
-        const wrapEl = unref(wrapRef);
-        if (!wrapEl) return;
-        const bindValue = { ...attrs, ...props };
+        const wrapEl = unref(wrapRef)
+        if (!wrapEl) return
+        const bindValue = { ...attrs, ...props }
         vditorRef.value = new Vditor(wrapEl, {
           lang: unref(getCurrentLang),
           mode: 'sv',
           preview: {
-            actions: [],
+            actions: []
           },
-          input: (v) => {
+          input: v => {
             // emit('update:value', v);
-            emit('change', v);
+            emit('change', v)
           },
           blur: () => {
-            unref(vditorRef)?.setValue(props.value);
+            unref(vditorRef)?.setValue(props.value)
           },
           ...bindValue,
           cache: {
-            enable: false,
-          },
-        });
-        initedRef.value = true;
+            enable: false
+          }
+        })
+        initedRef.value = true
       }
 
       const instance = {
-        getVditor: (): Vditor => vditorRef.value!,
-      };
+        getVditor: (): Vditor => vditorRef.value!
+      }
 
       onMounted(() => {
         nextTick(() => {
-          init();
+          init()
           setTimeout(() => {
-            modalFn?.redoModalHeight?.();
-          }, 200);
-        });
+            modalFn?.redoModalHeight?.()
+          }, 200)
+        })
 
-        emit('get', instance);
-      });
+        emit('get', instance)
+      })
 
       onUnmounted(() => {
-        const vditorInstance = unref(vditorRef);
-        if (!vditorInstance) return;
+        const vditorInstance = unref(vditorRef)
+        if (!vditorInstance) return
         try {
-          vditorInstance?.destroy?.();
+          vditorInstance?.destroy?.()
         } catch (error) {}
-      });
+      })
 
       return {
         wrapRef,
-        ...instance,
-      };
-    },
-  });
+        ...instance
+      }
+    }
+  })
 </script>

+ 66 - 66
src/components/Menu/src/BasicMenu.vue

@@ -18,141 +18,141 @@
   </Menu>
 </template>
 <script lang="ts">
-  import type { MenuState } from './types';
+  import type { MenuState } from './types'
 
-  import { computed, defineComponent, unref, reactive, watch, toRefs, ref } from 'vue';
-  import { Menu } from 'ant-design-vue';
-  import BasicSubMenuItem from './components/BasicSubMenuItem.vue';
+  import { computed, defineComponent, unref, reactive, watch, toRefs, ref } from 'vue'
+  import { Menu } from 'ant-design-vue'
+  import BasicSubMenuItem from './components/BasicSubMenuItem.vue'
 
-  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
+  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum'
 
-  import { useOpenKeys } from './useOpenKeys';
-  import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router';
+  import { useOpenKeys } from './useOpenKeys'
+  import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router'
 
-  import { isFunction } from '/@/utils/is';
+  import { isFunction } from '/@/utils/is'
 
-  import { basicProps } from './props';
-  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
-  import { REDIRECT_NAME } from '/@/router/constant';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { basicProps } from './props'
+  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'
+  import { REDIRECT_NAME } from '/@/router/constant'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { getCurrentParentPath } from '/@/router/menus';
+  import { getCurrentParentPath } from '/@/router/menus'
 
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
-  import { getAllParentPath } from '/@/router/helper/menuHelper';
+  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange'
+  import { getAllParentPath } from '/@/router/helper/menuHelper'
 
   export default defineComponent({
     name: 'BasicMenu',
     components: {
       Menu,
-      BasicSubMenuItem,
+      BasicSubMenuItem
     },
     props: basicProps,
     emits: ['menuClick'],
     setup(props, { emit }) {
-      const isClickGo = ref(false);
-      const currentActiveMenu = ref('');
+      const isClickGo = ref(false)
+      const currentActiveMenu = ref('')
 
       const menuState = reactive<MenuState>({
         defaultSelectedKeys: [],
         openKeys: [],
         selectedKeys: [],
-        collapsedOpenKeys: [],
-      });
+        collapsedOpenKeys: []
+      })
 
-      const { prefixCls } = useDesign('basic-menu');
-      const { items, mode, accordion } = toRefs(props);
+      const { prefixCls } = useDesign('basic-menu')
+      const { items, mode, accordion } = toRefs(props)
 
-      const { getCollapsed, getIsHorizontal, getTopMenuAlign, getSplit } = useMenuSetting();
+      const { getCollapsed, getIsHorizontal, getTopMenuAlign, getSplit } = useMenuSetting()
 
-      const { currentRoute } = useRouter();
+      const { currentRoute } = useRouter()
 
       const { handleOpenChange, setOpenKeys, getOpenKeys } = useOpenKeys(
         menuState,
         items,
         mode,
         accordion
-      );
+      )
 
       const getIsTopMenu = computed(() => {
-        const { type, mode } = props;
+        const { type, mode } = props
 
         return (
           (type === MenuTypeEnum.TOP_MENU && mode === MenuModeEnum.HORIZONTAL) ||
           (props.isHorizontal && unref(getSplit))
-        );
-      });
+        )
+      })
 
       const getMenuClass = computed(() => {
-        const align = props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign);
+        const align = props.isHorizontal && unref(getSplit) ? 'start' : unref(getTopMenuAlign)
         return [
           prefixCls,
           `justify-${align}`,
           {
             [`${prefixCls}__second`]: !props.isHorizontal && unref(getSplit),
-            [`${prefixCls}__sidebar-hor`]: unref(getIsTopMenu),
-          },
-        ];
-      });
+            [`${prefixCls}__sidebar-hor`]: unref(getIsTopMenu)
+          }
+        ]
+      })
 
       const getInlineCollapseOptions = computed(() => {
-        const isInline = props.mode === MenuModeEnum.INLINE;
+        const isInline = props.mode === MenuModeEnum.INLINE
 
-        const inlineCollapseOptions: { inlineCollapsed?: boolean } = {};
+        const inlineCollapseOptions: { inlineCollapsed?: boolean } = {}
         if (isInline) {
-          inlineCollapseOptions.inlineCollapsed = props.mixSider ? false : unref(getCollapsed);
+          inlineCollapseOptions.inlineCollapsed = props.mixSider ? false : unref(getCollapsed)
         }
-        return inlineCollapseOptions;
-      });
+        return inlineCollapseOptions
+      })
 
-      listenerLastChangeTab((route) => {
-        if (route.name === REDIRECT_NAME) return;
-        handleMenuChange(route);
-        currentActiveMenu.value = route.meta?.currentActiveMenu as string;
+      listenerLastChangeTab(route => {
+        if (route.name === REDIRECT_NAME) return
+        handleMenuChange(route)
+        currentActiveMenu.value = route.meta?.currentActiveMenu as string
 
         if (unref(currentActiveMenu)) {
-          menuState.selectedKeys = [unref(currentActiveMenu)];
-          setOpenKeys(unref(currentActiveMenu));
+          menuState.selectedKeys = [unref(currentActiveMenu)]
+          setOpenKeys(unref(currentActiveMenu))
         }
-      });
+      })
 
       !props.mixSider &&
         watch(
           () => props.items,
           () => {
-            handleMenuChange();
+            handleMenuChange()
           }
-        );
+        )
 
       async function handleMenuClick({ key }: { key: string; keyPath: string[] }) {
-        const { beforeClickFn } = props;
+        const { beforeClickFn } = props
         if (beforeClickFn && isFunction(beforeClickFn)) {
-          const flag = await beforeClickFn(key);
-          if (!flag) return;
+          const flag = await beforeClickFn(key)
+          if (!flag) return
         }
-        emit('menuClick', key);
+        emit('menuClick', key)
 
-        isClickGo.value = true;
+        isClickGo.value = true
         // const parentPath = await getCurrentParentPath(key);
 
         // menuState.openKeys = [parentPath];
-        menuState.selectedKeys = [key];
+        menuState.selectedKeys = [key]
       }
 
       async function handleMenuChange(route?: RouteLocationNormalizedLoaded) {
         if (unref(isClickGo)) {
-          isClickGo.value = false;
-          return;
+          isClickGo.value = false
+          return
         }
-        const path = (route || unref(currentRoute)).path;
-        setOpenKeys(path);
-        if (unref(currentActiveMenu)) return;
+        const path = (route || unref(currentRoute)).path
+        setOpenKeys(path)
+        if (unref(currentActiveMenu)) return
         if (props.isHorizontal && unref(getSplit)) {
-          const parentPath = await getCurrentParentPath(path);
-          menuState.selectedKeys = [parentPath];
+          const parentPath = await getCurrentParentPath(path)
+          menuState.selectedKeys = [parentPath]
         } else {
-          const parentPaths = await getAllParentPath(props.items, path);
-          menuState.selectedKeys = parentPaths;
+          const parentPaths = await getAllParentPath(props.items, path)
+          menuState.selectedKeys = parentPaths
         }
       }
 
@@ -164,10 +164,10 @@
         getMenuClass,
         handleOpenChange,
         getOpenKeys,
-        ...toRefs(menuState),
-      };
-    },
-  });
+        ...toRefs(menuState)
+      }
+    }
+  })
 </script>
 <style lang="less">
   @import './index.less';

+ 10 - 10
src/components/Menu/src/components/BasicMenuItem.vue

@@ -5,19 +5,19 @@
   </MenuItem>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { Menu } from 'ant-design-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { itemProps } from '../props';
+  import { defineComponent } from 'vue'
+  import { Menu } from 'ant-design-vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { itemProps } from '../props'
 
-  import MenuItemContent from './MenuItemContent.vue';
+  import MenuItemContent from './MenuItemContent.vue'
   export default defineComponent({
     name: 'BasicMenuItem',
     components: { MenuItem: Menu.Item, MenuItemContent },
     props: itemProps,
     setup() // props
     {
-      const { prefixCls } = useDesign('basic-menu-item');
+      const { prefixCls } = useDesign('basic-menu-item')
 
       // const getLevelClass = computed(() => {
       //   const { level, theme } = props;
@@ -26,9 +26,9 @@
       //   return levelCls;
       // });
       return {
-        prefixCls,
+        prefixCls
         // getLevelClass,
-      };
-    },
-  });
+      }
+    }
+  })
 </script>

+ 15 - 15
src/components/Menu/src/components/BasicSubMenuItem.vue

@@ -15,14 +15,14 @@
   </SubMenu>
 </template>
 <script lang="ts">
-  import type { Menu as MenuType } from '/@/router/types';
+  import type { Menu as MenuType } from '/@/router/types'
 
-  import { defineComponent, computed } from 'vue';
-  import { Menu } from 'ant-design-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { itemProps } from '../props';
-  import BasicMenuItem from './BasicMenuItem.vue';
-  import MenuItemContent from './MenuItemContent.vue';
+  import { defineComponent, computed } from 'vue'
+  import { Menu } from 'ant-design-vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { itemProps } from '../props'
+  import BasicMenuItem from './BasicMenuItem.vue'
+  import MenuItemContent from './MenuItemContent.vue'
 
   export default defineComponent({
     name: 'BasicSubMenuItem',
@@ -30,26 +30,26 @@
     components: {
       BasicMenuItem,
       SubMenu: Menu.SubMenu,
-      MenuItemContent,
+      MenuItemContent
     },
     props: itemProps,
     setup(props) {
-      const { prefixCls } = useDesign('basic-menu-item');
+      const { prefixCls } = useDesign('basic-menu-item')
 
-      const getShowMenu = computed(() => !props.item.meta?.hideMenu);
+      const getShowMenu = computed(() => !props.item.meta?.hideMenu)
       function menuHasChildren(menuTreeItem: MenuType): boolean {
         return (
           !menuTreeItem.meta?.hideChildrenInMenu &&
           Reflect.has(menuTreeItem, 'children') &&
           !!menuTreeItem.children &&
           menuTreeItem.children.length > 0
-        );
+        )
       }
       return {
         prefixCls,
         menuHasChildren,
-        getShowMenu,
-      };
-    },
-  });
+        getShowMenu
+      }
+    }
+  })
 </script>

+ 14 - 14
src/components/Menu/src/components/MenuItemContent.vue

@@ -5,30 +5,30 @@
   </span>
 </template>
 <script lang="ts">
-  import { computed, defineComponent } from 'vue';
+  import { computed, defineComponent } from 'vue'
 
-  import Icon from '/@/components/Icon/index';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { contentProps } from '../props';
-  const { t } = useI18n();
+  import Icon from '/@/components/Icon/index'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { contentProps } from '../props'
+  const { t } = useI18n()
 
   export default defineComponent({
     name: 'MenuItemContent',
     components: {
-      Icon,
+      Icon
     },
     props: contentProps,
     setup(props) {
-      const { prefixCls } = useDesign('basic-menu-item-content');
-      const getI18nName = computed(() => t(props.item?.name));
-      const getIcon = computed(() => props.item?.icon);
+      const { prefixCls } = useDesign('basic-menu-item-content')
+      const getI18nName = computed(() => t(props.item?.name))
+      const getIcon = computed(() => props.item?.icon)
 
       return {
         prefixCls,
         getI18nName,
-        getIcon,
-      };
-    },
-  });
+        getIcon
+      }
+    }
+  })
 </script>

+ 69 - 69
src/components/Modal/src/BasicModal.vue

@@ -48,7 +48,7 @@
   </Modal>
 </template>
 <script lang="ts">
-  import type { ModalProps, ModalMethods } from './types';
+  import type { ModalProps, ModalMethods } from './types'
 
   import {
     defineComponent,
@@ -59,22 +59,22 @@
     watchEffect,
     toRef,
     getCurrentInstance,
-    nextTick,
-  } from 'vue';
+    nextTick
+  } from 'vue'
 
-  import Modal from './components/Modal';
-  import ModalWrapper from './components/ModalWrapper.vue';
-  import ModalClose from './components/ModalClose.vue';
-  import ModalFooter from './components/ModalFooter.vue';
-  import ModalHeader from './components/ModalHeader.vue';
+  import Modal from './components/Modal'
+  import ModalWrapper from './components/ModalWrapper.vue'
+  import ModalClose from './components/ModalClose.vue'
+  import ModalFooter from './components/ModalFooter.vue'
+  import ModalHeader from './components/ModalHeader.vue'
 
-  import { isFunction } from '/@/utils/is';
-  import { deepMerge } from '/@/utils';
+  import { isFunction } from '/@/utils/is'
+  import { deepMerge } from '/@/utils'
 
-  import { basicProps } from './props';
-  import { useFullScreen } from './hooks/useModalFullScreen';
+  import { basicProps } from './props'
+  import { useFullScreen } from './hooks/useModalFullScreen'
 
-  import { omit } from 'lodash-es';
+  import { omit } from 'lodash-es'
   export default defineComponent({
     name: 'BasicModal',
     components: { Modal, ModalWrapper, ModalClose, ModalFooter, ModalHeader },
@@ -82,27 +82,27 @@
     props: basicProps,
     emits: ['visible-change', 'height-change', 'cancel', 'ok', 'register'],
     setup(props, { emit, attrs }) {
-      const visibleRef = ref(false);
-      const propsRef = ref<Partial<ModalProps> | null>(null);
-      const modalWrapperRef = ref<ComponentRef>(null);
+      const visibleRef = ref(false)
+      const propsRef = ref<Partial<ModalProps> | null>(null)
+      const modalWrapperRef = ref<ComponentRef>(null)
 
       // modal   Bottom and top height
-      const extHeightRef = ref(0);
+      const extHeightRef = ref(0)
       const modalMethods: ModalMethods = {
         setModalProps,
         emitVisible: undefined,
         redoModalHeight: () => {
           nextTick(() => {
             if (unref(modalWrapperRef)) {
-              (unref(modalWrapperRef) as any).setModalHeight();
+              ;(unref(modalWrapperRef) as any).setModalHeight()
             }
-          });
-        },
-      };
+          })
+        }
+      }
 
-      const instance = getCurrentInstance();
+      const instance = getCurrentInstance()
       if (instance) {
-        emit('register', modalMethods, instance.uid);
+        emit('register', modalMethods, instance.uid)
       }
 
       // Custom title component: get title
@@ -110,16 +110,16 @@
         (): ModalProps => {
           return {
             ...props,
-            ...(unref(propsRef) as any),
-          };
+            ...(unref(propsRef) as any)
+          }
         }
-      );
+      )
 
       const { handleFullScreen, getWrapClassName, fullScreenRef } = useFullScreen({
         modalWrapperRef,
         extHeightRef,
-        wrapClassName: toRef(getMergeProps.value, 'wrapClassName'),
-      });
+        wrapClassName: toRef(getMergeProps.value, 'wrapClassName')
+      })
 
       // modal component does not need title
       const getProps = computed(
@@ -127,63 +127,63 @@
           const opt = {
             ...unref(getMergeProps),
             visible: unref(visibleRef),
-            title: undefined,
-          };
+            title: undefined
+          }
           return {
             ...opt,
-            wrapClassName: unref(getWrapClassName),
-          };
+            wrapClassName: unref(getWrapClassName)
+          }
         }
-      );
+      )
 
       const getBindValue = computed(
         (): Recordable => {
-          const attr = { ...attrs, ...unref(getProps) };
+          const attr = { ...attrs, ...unref(getProps) }
           if (unref(fullScreenRef)) {
-            return omit(attr, 'height');
+            return omit(attr, 'height')
           }
-          return attr;
+          return attr
         }
-      );
+      )
 
       const getWrapperHeight = computed(() => {
-        if (unref(fullScreenRef)) return undefined;
-        return unref(getProps).height;
-      });
+        if (unref(fullScreenRef)) return undefined
+        return unref(getProps).height
+      })
 
       watchEffect(() => {
-        visibleRef.value = !!props.visible;
-        fullScreenRef.value = !!props.defaultFullscreen;
-      });
+        visibleRef.value = !!props.visible
+        fullScreenRef.value = !!props.defaultFullscreen
+      })
 
       watch(
         () => unref(visibleRef),
-        (v) => {
-          emit('visible-change', v);
-          instance && modalMethods.emitVisible?.(v, instance.uid);
+        v => {
+          emit('visible-change', v)
+          instance && modalMethods.emitVisible?.(v, instance.uid)
           nextTick(() => {
             if (props.scrollTop && v && unref(modalWrapperRef)) {
-              (unref(modalWrapperRef) as any).scrollTop();
+              ;(unref(modalWrapperRef) as any).scrollTop()
             }
-          });
+          })
         },
         {
-          immediate: false,
+          immediate: false
         }
-      );
+      )
 
       // 取消事件
       async function handleCancel(e: Event) {
-        e?.stopPropagation();
+        e?.stopPropagation()
 
         if (props.closeFunc && isFunction(props.closeFunc)) {
-          const isClose: boolean = await props.closeFunc();
-          visibleRef.value = !isClose;
-          return;
+          const isClose: boolean = await props.closeFunc()
+          visibleRef.value = !isClose
+          return
         }
 
-        visibleRef.value = false;
-        emit('cancel');
+        visibleRef.value = false
+        emit('cancel')
       }
 
       /**
@@ -191,27 +191,27 @@
        */
       function setModalProps(props: Partial<ModalProps>): void {
         // Keep the last setModalProps
-        propsRef.value = deepMerge(unref(propsRef) || {}, props);
-        if (!Reflect.has(props, 'visible')) return;
-        visibleRef.value = !!props.visible;
+        propsRef.value = deepMerge(unref(propsRef) || {}, props)
+        if (!Reflect.has(props, 'visible')) return
+        visibleRef.value = !!props.visible
       }
 
       function handleOk() {
-        emit('ok');
+        emit('ok')
       }
 
       function handleHeightChange(height: string) {
-        emit('height-change', height);
+        emit('height-change', height)
       }
 
       function handleExtHeight(height: number) {
-        extHeightRef.value = height;
+        extHeightRef.value = height
       }
 
       function handleTitleDbClick(e: ChangeEvent) {
-        if (!props.canFullscreen) return;
-        e.stopPropagation();
-        handleFullScreen(e);
+        if (!props.canFullscreen) return
+        e.stopPropagation()
+        handleFullScreen(e)
       }
 
       return {
@@ -228,8 +228,8 @@
         handleExtHeight,
         handleHeightChange,
         handleTitleDbClick,
-        getWrapperHeight,
-      };
-    },
-  });
+        getWrapperHeight
+      }
+    }
+  })
 </script>

+ 15 - 15
src/components/Modal/src/components/Modal.tsx

@@ -1,27 +1,27 @@
-import { Modal } from 'ant-design-vue';
-import { defineComponent, toRefs, unref } from 'vue';
-import { basicProps } from '../props';
-import { useModalDragMove } from '../hooks/useModalDrag';
-import { useAttrs } from '/@/hooks/core/useAttrs';
-import { extendSlots } from '/@/utils/helper/tsxHelper';
+import { Modal } from 'ant-design-vue'
+import { defineComponent, toRefs, unref } from 'vue'
+import { basicProps } from '../props'
+import { useModalDragMove } from '../hooks/useModalDrag'
+import { useAttrs } from '/@/hooks/core/useAttrs'
+import { extendSlots } from '/@/utils/helper/tsxHelper'
 
 export default defineComponent({
   name: 'Modal',
   inheritAttrs: false,
   props: basicProps,
   setup(props, { slots }) {
-    const { visible, draggable, destroyOnClose } = toRefs(props);
-    const attrs = useAttrs();
+    const { visible, draggable, destroyOnClose } = toRefs(props)
+    const attrs = useAttrs()
     useModalDragMove({
       visible,
       destroyOnClose,
-      draggable,
-    });
+      draggable
+    })
 
     return () => {
-      const propsData = { ...unref(attrs), ...props } as Recordable;
+      const propsData = { ...unref(attrs), ...props } as Recordable
 
-      return <Modal {...propsData}>{extendSlots(slots)}</Modal>;
-    };
-  },
-});
+      return <Modal {...propsData}>{extendSlots(slots)}</Modal>
+    }
+  }
+})

+ 18 - 18
src/components/Modal/src/components/ModalClose.vue

@@ -9,49 +9,49 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, computed } from 'vue';
-  import { FullscreenExitOutlined, FullscreenOutlined, CloseOutlined } from '@ant-design/icons-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
+  import { defineComponent, computed } from 'vue'
+  import { FullscreenExitOutlined, FullscreenOutlined, CloseOutlined } from '@ant-design/icons-vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'ModalClose',
     components: { FullscreenExitOutlined, FullscreenOutlined, CloseOutlined },
     props: {
       canFullscreen: propTypes.bool.def(true),
-      fullScreen: propTypes.bool,
+      fullScreen: propTypes.bool
     },
     emits: ['cancel', 'fullscreen'],
     setup(props, { emit }) {
-      const { prefixCls } = useDesign('basic-modal-close');
+      const { prefixCls } = useDesign('basic-modal-close')
 
       const getClass = computed(() => {
         return [
           prefixCls,
           `${prefixCls}--custom`,
           {
-            [`${prefixCls}--can-full`]: props.canFullscreen,
-          },
-        ];
-      });
+            [`${prefixCls}--can-full`]: props.canFullscreen
+          }
+        ]
+      })
 
       function handleCancel() {
-        emit('cancel');
+        emit('cancel')
       }
       function handleFullScreen(e: Event) {
-        e?.stopPropagation();
-        e?.preventDefault();
-        emit('fullscreen');
+        e?.stopPropagation()
+        e?.preventDefault()
+        emit('fullscreen')
       }
 
       return {
         getClass,
         prefixCls,
         handleCancel,
-        handleFullScreen,
-      };
-    },
-  });
+        handleFullScreen
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-modal-close';

+ 7 - 7
src/components/Modal/src/components/ModalFooter.vue

@@ -18,22 +18,22 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  import { basicProps } from '../props';
+  import { basicProps } from '../props'
   export default defineComponent({
     name: 'BasicModalFooter',
     props: basicProps,
     emits: ['ok', 'cancel'],
     setup(_, { emit }) {
       function handleOk() {
-        emit('ok');
+        emit('ok')
       }
 
       function handleCancel() {
-        emit('cancel');
+        emit('cancel')
       }
-      return { handleOk, handleCancel };
-    },
-  });
+      return { handleOk, handleCancel }
+    }
+  })
 </script>

+ 8 - 8
src/components/Modal/src/components/ModalHeader.vue

@@ -4,19 +4,19 @@
   </BasicTitle>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import { defineComponent } from 'vue';
-  import { BasicTitle } from '/@/components/Basic';
+  import type { PropType } from 'vue'
+  import { defineComponent } from 'vue'
+  import { BasicTitle } from '/@/components/Basic'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
   export default defineComponent({
     name: 'BasicModalHeader',
     components: { BasicTitle },
     props: {
       helpMessage: {
-        type: [String, Array] as PropType<string | string[]>,
+        type: [String, Array] as PropType<string | string[]>
       },
-      title: propTypes.string,
-    },
-  });
+      title: propTypes.string
+    }
+  })
 </script>

+ 62 - 62
src/components/Modal/src/components/ModalWrapper.vue

@@ -6,8 +6,8 @@
   </ScrollContainer>
 </template>
 <script lang="ts">
-  import type { ModalWrapperProps } from '../types';
-  import type { CSSProperties } from 'vue';
+  import type { ModalWrapperProps } from '../types'
+  import type { CSSProperties } from 'vue'
 
   import {
     defineComponent,
@@ -18,15 +18,15 @@
     watch,
     onMounted,
     nextTick,
-    onUnmounted,
-  } from 'vue';
+    onUnmounted
+  } from 'vue'
 
-  import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
-  import { ScrollContainer } from '/@/components/Container';
+  import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn'
+  import { ScrollContainer } from '/@/components/Container'
 
   // import { useElResize } from '/@/hooks/event/useElResize';
-  import { propTypes } from '/@/utils/propTypes';
-  import { createModalContext } from '../hooks/useModalContext';
+  import { propTypes } from '/@/utils/propTypes'
+  import { createModalContext } from '../hooks/useModalContext'
 
   export default defineComponent({
     name: 'ModalWrapper',
@@ -42,124 +42,124 @@
       footerOffset: propTypes.number.def(0),
       visible: propTypes.bool,
       fullScreen: propTypes.bool,
-      loadingTip: propTypes.string,
+      loadingTip: propTypes.string
     },
     emits: ['height-change', 'ext-height'],
     setup(props: ModalWrapperProps, { emit }) {
-      const wrapperRef = ref<ComponentRef>(null);
-      const spinRef = ref<ElRef>(null);
-      const realHeightRef = ref(0);
-      const minRealHeightRef = ref(0);
+      const wrapperRef = ref<ComponentRef>(null)
+      const spinRef = ref<ElRef>(null)
+      const realHeightRef = ref(0)
+      const minRealHeightRef = ref(0)
 
-      let realHeight = 0;
+      let realHeight = 0
 
-      let stopElResizeFn: Fn = () => {};
+      let stopElResizeFn: Fn = () => {}
 
-      useWindowSizeFn(setModalHeight.bind(null, false));
+      useWindowSizeFn(setModalHeight.bind(null, false))
 
       createModalContext({
-        redoModalHeight: setModalHeight,
-      });
+        redoModalHeight: setModalHeight
+      })
 
       const spinStyle = computed(
         (): CSSProperties => {
           return {
             minHeight: `${props.minHeight}px`,
             // padding 28
-            height: `${unref(realHeightRef)}px`,
-          };
+            height: `${unref(realHeightRef)}px`
+          }
         }
-      );
+      )
 
       watchEffect(() => {
-        props.useWrapper && setModalHeight();
-      });
+        props.useWrapper && setModalHeight()
+      })
 
       watch(
         () => props.fullScreen,
-        (v) => {
-          setModalHeight();
+        v => {
+          setModalHeight()
           if (!v) {
-            realHeightRef.value = minRealHeightRef.value;
+            realHeightRef.value = minRealHeightRef.value
           } else {
-            minRealHeightRef.value = realHeightRef.value;
+            minRealHeightRef.value = realHeightRef.value
           }
         }
-      );
+      )
 
       onMounted(() => {
-        const { modalHeaderHeight, modalFooterHeight } = props;
-        emit('ext-height', modalHeaderHeight + modalFooterHeight);
+        const { modalHeaderHeight, modalFooterHeight } = props
+        emit('ext-height', modalHeaderHeight + modalFooterHeight)
         // listenElResize();
-      });
+      })
 
       onUnmounted(() => {
-        stopElResizeFn && stopElResizeFn();
-      });
+        stopElResizeFn && stopElResizeFn()
+      })
 
       async function scrollTop() {
         nextTick(() => {
-          const wrapperRefDom = unref(wrapperRef);
-          if (!wrapperRefDom) return;
-          (wrapperRefDom as any)?.scrollTo?.(0);
-        });
+          const wrapperRefDom = unref(wrapperRef)
+          if (!wrapperRefDom) return
+          ;(wrapperRefDom as any)?.scrollTo?.(0)
+        })
       }
 
       async function setModalHeight() {
         // 解决在弹窗关闭的时候监听还存在,导致再次打开弹窗没有高度
         // 加上这个,就必须在使用的时候传递父级的visible
-        if (!props.visible) return;
-        const wrapperRefDom = unref(wrapperRef);
-        if (!wrapperRefDom) return;
+        if (!props.visible) return
+        const wrapperRefDom = unref(wrapperRef)
+        if (!wrapperRefDom) return
 
-        const bodyDom = wrapperRefDom.$el.parentElement;
-        if (!bodyDom) return;
-        bodyDom.style.padding = '0';
-        await nextTick();
+        const bodyDom = wrapperRefDom.$el.parentElement
+        if (!bodyDom) return
+        bodyDom.style.padding = '0'
+        await nextTick()
 
         try {
-          const modalDom = bodyDom.parentElement && bodyDom.parentElement.parentElement;
-          if (!modalDom) return;
+          const modalDom = bodyDom.parentElement && bodyDom.parentElement.parentElement
+          if (!modalDom) return
 
-          const modalRect = getComputedStyle(modalDom).top;
-          const modalTop = Number.parseInt(modalRect);
+          const modalRect = getComputedStyle(modalDom).top
+          const modalTop = Number.parseInt(modalRect)
           let maxHeight =
             window.innerHeight -
             modalTop * 2 +
             (props.footerOffset! || 0) -
             props.modalFooterHeight -
-            props.modalHeaderHeight;
+            props.modalHeaderHeight
 
           // 距离顶部过进会出现滚动条
           if (modalTop < 40) {
-            maxHeight -= 26;
+            maxHeight -= 26
           }
-          await nextTick();
-          const spinEl = unref(spinRef);
+          await nextTick()
+          const spinEl = unref(spinRef)
 
-          if (!spinEl) return;
-          await nextTick();
+          if (!spinEl) return
+          await nextTick()
           // if (!realHeight) {
-          realHeight = spinEl.scrollHeight;
+          realHeight = spinEl.scrollHeight
           // }
 
           if (props.fullScreen) {
             realHeightRef.value =
-              window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 28;
+              window.innerHeight - props.modalFooterHeight - props.modalHeaderHeight - 28
           } else {
             realHeightRef.value = props.height
               ? props.height
               : realHeight > maxHeight
               ? maxHeight
-              : realHeight;
+              : realHeight
           }
-          emit('height-change', unref(realHeightRef));
+          emit('height-change', unref(realHeightRef))
         } catch (error) {
-          console.log(error);
+          console.log(error)
         }
       }
 
-      return { wrapperRef, spinRef, spinStyle, scrollTop, setModalHeight };
-    },
-  });
+      return { wrapperRef, spinRef, spinStyle, scrollTop, setModalHeight }
+    }
+  })
 </script>

+ 8 - 8
src/components/Page/src/PageFooter.vue

@@ -10,20 +10,20 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useMenuSetting } from '/@/hooks/setting/useMenuSetting'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   export default defineComponent({
     name: 'PageFooter',
     inheritAttrs: false,
     setup() {
-      const { prefixCls } = useDesign('page-footer');
-      const { getCalcContentWidth } = useMenuSetting();
-      return { prefixCls, getCalcContentWidth };
-    },
-  });
+      const { prefixCls } = useDesign('page-footer')
+      const { getCalcContentWidth } = useMenuSetting()
+      return { prefixCls, getCalcContentWidth }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-page-footer';

+ 62 - 62
src/components/Page/src/PageWrapper.vue

@@ -35,17 +35,17 @@
   </div>
 </template>
 <script lang="ts">
-  import type { CSSProperties, PropType } from 'vue';
+  import type { CSSProperties, PropType } from 'vue'
 
-  import { defineComponent, computed, watch, nextTick, ref, unref } from 'vue';
-  import PageFooter from './PageFooter.vue';
-  import { usePageContext } from '/@/hooks/component/usePageContext';
+  import { defineComponent, computed, watch, nextTick, ref, unref } from 'vue'
+  import PageFooter from './PageFooter.vue'
+  import { usePageContext } from '/@/hooks/component/usePageContext'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
-  import { omit } from 'lodash-es';
-  import { PageHeader } from 'ant-design-vue';
-  import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
+  import { omit } from 'lodash-es'
+  import { PageHeader } from 'ant-design-vue'
+  import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated'
   export default defineComponent({
     name: 'PageWrapper',
     components: { PageFooter, PageHeader },
@@ -56,108 +56,108 @@
       ghost: propTypes.bool,
       content: propTypes.string,
       contentStyle: {
-        type: Object as PropType<CSSProperties>,
+        type: Object as PropType<CSSProperties>
       },
       contentBackground: propTypes.bool,
       contentFullHeight: propTypes.bool,
       contentClass: propTypes.string,
-      fixedHeight: propTypes.bool,
+      fixedHeight: propTypes.bool
     },
     setup(props, { slots }) {
-      const headerRef = ref<ComponentRef>(null);
-      const footerRef = ref<ComponentRef>(null);
-      const footerHeight = ref(0);
-      const { prefixCls, prefixVar } = useDesign('page-wrapper');
-      const { contentHeight, setPageHeight, pageHeight } = usePageContext();
+      const headerRef = ref<ComponentRef>(null)
+      const footerRef = ref<ComponentRef>(null)
+      const footerHeight = ref(0)
+      const { prefixCls, prefixVar } = useDesign('page-wrapper')
+      const { contentHeight, setPageHeight, pageHeight } = usePageContext()
 
       const getClass = computed(() => {
         return [
           prefixCls,
           {
-            [`${prefixCls}--dense`]: props.dense,
-          },
-        ];
-      });
+            [`${prefixCls}--dense`]: props.dense
+          }
+        ]
+      })
 
-      const getShowFooter = computed(() => slots?.leftFooter || slots?.rightFooter);
+      const getShowFooter = computed(() => slots?.leftFooter || slots?.rightFooter)
 
       const getHeaderSlots = computed(() => {
-        return Object.keys(omit(slots, 'default', 'leftFooter', 'rightFooter', 'headerContent'));
-      });
+        return Object.keys(omit(slots, 'default', 'leftFooter', 'rightFooter', 'headerContent'))
+      })
 
       const getContentStyle = computed(
         (): CSSProperties => {
-          const { contentBackground, contentFullHeight, contentStyle, fixedHeight } = props;
-          const bg = contentBackground ? { backgroundColor: '#fff' } : {};
+          const { contentBackground, contentFullHeight, contentStyle, fixedHeight } = props
+          const bg = contentBackground ? { backgroundColor: '#fff' } : {}
           if (!contentFullHeight) {
-            return { ...bg, ...contentStyle };
+            return { ...bg, ...contentStyle }
           }
-          const height = `${unref(pageHeight)}px`;
+          const height = `${unref(pageHeight)}px`
           return {
             ...bg,
             ...contentStyle,
             minHeight: height,
             ...(fixedHeight ? { height } : {}),
-            paddingBottom: `${unref(footerHeight)}px`,
-          };
+            paddingBottom: `${unref(footerHeight)}px`
+          }
         }
-      );
+      )
 
       watch(
         () => [contentHeight?.value, getShowFooter.value],
         () => {
-          calcContentHeight();
+          calcContentHeight()
         },
         {
           flush: 'post',
-          immediate: true,
+          immediate: true
         }
-      );
+      )
 
       onMountedOrActivated(() => {
         nextTick(() => {
-          calcContentHeight();
-        });
-      });
+          calcContentHeight()
+        })
+      })
 
       function calcContentHeight() {
         if (!props.contentFullHeight) {
-          return;
+          return
         }
         //fix:in contentHeight mode: delay getting footer and header dom element to get the correct height
-        const footer = unref(footerRef);
-        const header = unref(headerRef);
-        footerHeight.value = 0;
-        const footerEl = footer?.$el;
+        const footer = unref(footerRef)
+        const header = unref(headerRef)
+        footerHeight.value = 0
+        const footerEl = footer?.$el
 
         if (footerEl) {
-          footerHeight.value += footerEl?.offsetHeight ?? 0;
+          footerHeight.value += footerEl?.offsetHeight ?? 0
         }
-        let headerHeight = 0;
-        const headerEl = header?.$el;
+        let headerHeight = 0
+        const headerEl = header?.$el
         if (headerEl) {
-          headerHeight += headerEl?.offsetHeight ?? 0;
+          headerHeight += headerEl?.offsetHeight ?? 0
         }
         // fix:subtract content's marginTop and marginBottom value
-        let subtractHeight = 0;
-        let marginBottom = '0px';
-        let marginTop = '0px';
-        const classElments = document.querySelectorAll(`.${prefixVar}-page-wrapper-content`);
+        let subtractHeight = 0
+        let marginBottom = '0px'
+        let marginTop = '0px'
+        const classElments = document.querySelectorAll(`.${prefixVar}-page-wrapper-content`)
         if (classElments && classElments.length > 0) {
-          const contentEl = classElments[0];
-          const cssStyle = getComputedStyle(contentEl);
-          marginBottom = cssStyle?.marginBottom;
-          marginTop = cssStyle?.marginTop;
+          const contentEl = classElments[0]
+          const cssStyle = getComputedStyle(contentEl)
+          marginBottom = cssStyle?.marginBottom
+          marginTop = cssStyle?.marginTop
         }
         if (marginBottom) {
-          const contentMarginBottom = Number(marginBottom.replace(/[^\d]/g, ''));
-          subtractHeight += contentMarginBottom;
+          const contentMarginBottom = Number(marginBottom.replace(/[^\d]/g, ''))
+          subtractHeight += contentMarginBottom
         }
         if (marginTop) {
-          const contentMarginTop = Number(marginTop.replace(/[^\d]/g, ''));
-          subtractHeight += contentMarginTop;
+          const contentMarginTop = Number(marginTop.replace(/[^\d]/g, ''))
+          subtractHeight += contentMarginTop
         }
-        setPageHeight?.(unref(contentHeight) - unref(footerHeight) - headerHeight - subtractHeight);
+        setPageHeight?.(unref(contentHeight) - unref(footerHeight) - headerHeight - subtractHeight)
       }
 
       return {
@@ -169,10 +169,10 @@
         prefixCls,
         getShowFooter,
         pageHeight,
-        omit,
-      };
-    },
-  });
+        omit
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-page-wrapper';

+ 33 - 33
src/components/Preview/src/index.vue

@@ -15,69 +15,69 @@
   </div>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import { defineComponent, computed } from 'vue';
+  import type { PropType } from 'vue'
+  import { defineComponent, computed } from 'vue'
 
-  import { Image } from 'ant-design-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
-  import { isString } from '/@/utils/is';
+  import { Image } from 'ant-design-vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
+  import { isString } from '/@/utils/is'
 
   interface ImageProps {
-    alt?: string;
-    fallback?: string;
-    src: string;
-    width: string | number;
-    height?: string | number;
-    placeholder?: string | boolean;
+    alt?: string
+    fallback?: string
+    src: string
+    width: string | number
+    height?: string | number
+    placeholder?: string | boolean
     preview?:
       | boolean
       | {
-          visible?: boolean;
-          onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
-          getContainer: string | HTMLElement | (() => HTMLElement);
-        };
+          visible?: boolean
+          onVisibleChange?: (visible: boolean, prevVisible: boolean) => void
+          getContainer: string | HTMLElement | (() => HTMLElement)
+        }
   }
 
-  type ImageItem = string | ImageProps;
+  type ImageItem = string | ImageProps
 
   export default defineComponent({
     name: 'ImagePreview',
     components: {
       Image,
-      PreviewGroup: Image.PreviewGroup,
+      PreviewGroup: Image.PreviewGroup
     },
     props: {
       functional: propTypes.bool,
       imageList: {
-        type: Array as PropType<ImageItem[]>,
-      },
+        type: Array as PropType<ImageItem[]>
+      }
     },
     setup(props) {
-      const { prefixCls } = useDesign('image-preview');
+      const { prefixCls } = useDesign('image-preview')
 
       const getImageList = computed(() => {
-        const { imageList } = props;
+        const { imageList } = props
         if (!imageList) {
-          return [];
+          return []
         }
-        return imageList.map((item) => {
+        return imageList.map(item => {
           if (isString(item)) {
             return {
               src: item,
-              placeholder: false,
-            };
+              placeholder: false
+            }
           }
-          return item;
-        });
-      });
+          return item
+        })
+      })
 
       return {
         prefixCls,
-        getImageList,
-      };
-    },
-  });
+        getImageList
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-image-preview';

+ 37 - 37
src/components/Qrcode/src/index.vue

@@ -4,51 +4,51 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, watchEffect, PropType, ref, unref } from 'vue';
-  import { toCanvas, QRCodeRenderersOptions, LogoType } from './qrcodePlus';
-  import { toDataURL } from 'qrcode';
-  import { downloadByUrl } from '/@/utils/file/download';
+  import { defineComponent, watchEffect, PropType, ref, unref } from 'vue'
+  import { toCanvas, QRCodeRenderersOptions, LogoType } from './qrcodePlus'
+  import { toDataURL } from 'qrcode'
+  import { downloadByUrl } from '/@/utils/file/download'
 
   export default defineComponent({
     name: 'QrCode',
     props: {
       value: {
         type: [String, Array] as PropType<string | any[]>,
-        default: null,
+        default: null
       },
       // 参数
       options: {
         type: Object as PropType<QRCodeRenderersOptions>,
-        default: null,
+        default: null
       },
       // 宽度
       width: {
         type: Number as PropType<number>,
-        default: 200,
+        default: 200
       },
       // 中间logo图标
       logo: {
         type: [String, Object] as PropType<Partial<LogoType> | string>,
-        default: '',
+        default: ''
       },
       // img 不支持内嵌logo
       tag: {
         type: String as PropType<'canvas' | 'img'>,
         default: 'canvas',
-        validator: (v: string) => ['canvas', 'img'].includes(v),
-      },
+        validator: (v: string) => ['canvas', 'img'].includes(v)
+      }
     },
     emits: { done: (url: string) => !!url, error: (error: any) => !!error },
     setup(props, { emit }) {
-      const wrapRef = ref<HTMLCanvasElement | HTMLImageElement | null>(null);
-      const urlRef = ref<string>('');
+      const wrapRef = ref<HTMLCanvasElement | HTMLImageElement | null>(null)
+      const urlRef = ref<string>('')
       async function createQrcode() {
         try {
-          const { tag, value, options = {}, width, logo } = props;
-          const renderValue = String(value);
-          const wrapEl = unref(wrapRef);
+          const { tag, value, options = {}, width, logo } = props
+          const renderValue = String(value)
+          const wrapEl = unref(wrapRef)
 
-          if (!wrapEl) return;
+          if (!wrapEl) return
 
           if (tag === 'canvas') {
             const url: string = await toCanvas({
@@ -56,46 +56,46 @@
               width,
               logo: logo as any,
               content: renderValue,
-              options: options || {},
-            });
-            urlRef.value = url;
-            emit('done', url);
-            return;
+              options: options || {}
+            })
+            urlRef.value = url
+            emit('done', url)
+            return
           }
 
           if (tag === 'img') {
             const url = await toDataURL(renderValue, {
               errorCorrectionLevel: 'H',
               width,
-              ...options,
-            });
-            (unref(wrapRef) as HTMLImageElement).src = url;
-            urlRef.value = url;
-            emit('done', url);
+              ...options
+            })
+            ;(unref(wrapRef) as HTMLImageElement).src = url
+            urlRef.value = url
+            emit('done', url)
           }
         } catch (error) {
-          emit('error', error);
+          emit('error', error)
         }
       }
       /**
        * file download
        */
       function download(fileName?: string) {
-        const url = unref(urlRef);
-        if (!url) return;
+        const url = unref(urlRef)
+        if (!url) return
         downloadByUrl({
           url,
-          fileName,
-        });
+          fileName
+        })
       }
 
       watchEffect(() => {
         setTimeout(() => {
-          createQrcode();
-        }, 30);
-      });
+          createQrcode()
+        }, 30)
+      })
 
-      return { wrapRef, download };
-    },
-  });
+      return { wrapRef, download }
+    }
+  })
 </script>

+ 48 - 48
src/components/Scrollbar/src/index.vue

@@ -17,10 +17,10 @@
   </div>
 </template>
 <script lang="ts">
-  import { addResizeListener, removeResizeListener } from '/@/utils/event';
-  import componentSetting from '/@/settings/componentSetting';
-  const { scrollbar } = componentSetting;
-  import { toObject } from './util';
+  import { addResizeListener, removeResizeListener } from '/@/utils/event'
+  import componentSetting from '/@/settings/componentSetting'
+  const { scrollbar } = componentSetting
+  import { toObject } from './util'
   import {
     defineComponent,
     ref,
@@ -29,9 +29,9 @@
     nextTick,
     provide,
     computed,
-    unref,
-  } from 'vue';
-  import Bar from './bar';
+    unref
+  } from 'vue'
+  import Bar from './bar'
 
   export default defineComponent({
     name: 'Scrollbar',
@@ -40,82 +40,82 @@
     props: {
       native: {
         type: Boolean,
-        default: scrollbar?.native ?? false,
+        default: scrollbar?.native ?? false
       },
       wrapStyle: {
         type: [String, Array],
-        default: '',
+        default: ''
       },
       wrapClass: {
         type: [String, Array],
-        default: '',
+        default: ''
       },
       viewClass: {
         type: [String, Array],
-        default: '',
+        default: ''
       },
       viewStyle: {
         type: [String, Array],
-        default: '',
+        default: ''
       },
       noresize: Boolean, // 如果 container 尺寸不会发生变化,最好设置它可以优化性能
       tag: {
         type: String,
-        default: 'div',
-      },
+        default: 'div'
+      }
     },
     setup(props) {
-      const sizeWidth = ref('0');
-      const sizeHeight = ref('0');
-      const moveX = ref(0);
-      const moveY = ref(0);
-      const wrap = ref<any>(null);
-      const resize = ref<any>(null);
+      const sizeWidth = ref('0')
+      const sizeHeight = ref('0')
+      const moveX = ref(0)
+      const moveY = ref(0)
+      const wrap = ref<any>(null)
+      const resize = ref<any>(null)
 
-      provide('scroll-bar-wrap', wrap);
+      provide('scroll-bar-wrap', wrap)
 
       const style = computed(() => {
         if (Array.isArray(props.wrapStyle)) {
-          return toObject(props.wrapStyle);
+          return toObject(props.wrapStyle)
         }
-        return props.wrapStyle;
-      });
+        return props.wrapStyle
+      })
 
       const handleScroll = () => {
         if (!props.native) {
-          moveY.value = (unref(wrap).scrollTop * 100) / unref(wrap).clientHeight;
-          moveX.value = (unref(wrap).scrollLeft * 100) / unref(wrap).clientWidth;
+          moveY.value = (unref(wrap).scrollTop * 100) / unref(wrap).clientHeight
+          moveX.value = (unref(wrap).scrollLeft * 100) / unref(wrap).clientWidth
         }
-      };
+      }
 
       const update = () => {
-        if (!unref(wrap)) return;
+        if (!unref(wrap)) return
 
-        const heightPercentage = (unref(wrap).clientHeight * 100) / unref(wrap).scrollHeight;
-        const widthPercentage = (unref(wrap).clientWidth * 100) / unref(wrap).scrollWidth;
+        const heightPercentage = (unref(wrap).clientHeight * 100) / unref(wrap).scrollHeight
+        const widthPercentage = (unref(wrap).clientWidth * 100) / unref(wrap).scrollWidth
 
-        sizeHeight.value = heightPercentage < 100 ? heightPercentage + '%' : '';
-        sizeWidth.value = widthPercentage < 100 ? widthPercentage + '%' : '';
-      };
+        sizeHeight.value = heightPercentage < 100 ? heightPercentage + '%' : ''
+        sizeWidth.value = widthPercentage < 100 ? widthPercentage + '%' : ''
+      }
 
       onMounted(() => {
-        if (props.native) return;
-        nextTick(update);
+        if (props.native) return
+        nextTick(update)
         if (!props.noresize) {
-          addResizeListener(unref(resize), update);
-          addResizeListener(unref(wrap), update);
-          addEventListener('resize', update);
+          addResizeListener(unref(resize), update)
+          addResizeListener(unref(wrap), update)
+          addEventListener('resize', update)
         }
-      });
+      })
 
       onBeforeUnmount(() => {
-        if (props.native) return;
+        if (props.native) return
         if (!props.noresize) {
-          removeResizeListener(unref(resize), update);
-          removeResizeListener(unref(wrap), update);
-          removeEventListener('resize', update);
+          removeResizeListener(unref(resize), update)
+          removeResizeListener(unref(wrap), update)
+          removeEventListener('resize', update)
         }
-      });
+      })
 
       return {
         moveX,
@@ -126,10 +126,10 @@
         wrap,
         resize,
         update,
-        handleScroll,
-      };
-    },
-  });
+        handleScroll
+      }
+    }
+  })
 </script>
 <style lang="less">
   .scrollbar {

+ 53 - 53
src/components/SimpleMenu/src/SimpleMenu.vue

@@ -18,33 +18,33 @@
   </Menu>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import type { MenuState } from './types';
-  import type { Menu as MenuType } from '/@/router/types';
+  import type { PropType } from 'vue'
+  import type { MenuState } from './types'
+  import type { Menu as MenuType } from '/@/router/types'
 
-  import { defineComponent, computed, ref, unref, reactive, toRefs, watch } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { defineComponent, computed, ref, unref, reactive, toRefs, watch } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import Menu from './components/Menu.vue';
-  import SimpleSubMenu from './SimpleSubMenu.vue';
-  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange';
-  import { propTypes } from '/@/utils/propTypes';
-  import { REDIRECT_NAME } from '/@/router/constant';
-  import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router';
-  import { isFunction } from '/@/utils/is';
+  import Menu from './components/Menu.vue'
+  import SimpleSubMenu from './SimpleSubMenu.vue'
+  import { listenerLastChangeTab } from '/@/logics/mitt/tabChange'
+  import { propTypes } from '/@/utils/propTypes'
+  import { REDIRECT_NAME } from '/@/router/constant'
+  import { RouteLocationNormalizedLoaded, useRouter } from 'vue-router'
+  import { isFunction } from '/@/utils/is'
 
-  import { useOpenKeys } from './useOpenKeys';
+  import { useOpenKeys } from './useOpenKeys'
   export default defineComponent({
     name: 'SimpleMenu',
     components: {
       Menu,
-      SimpleSubMenu,
+      SimpleSubMenu
     },
     inheritAttrs: false,
     props: {
       items: {
         type: Array as PropType<MenuType[]>,
-        default: () => [],
+        default: () => []
       },
       collapse: propTypes.bool,
       mixSider: propTypes.bool,
@@ -52,80 +52,80 @@
       accordion: propTypes.bool.def(true),
       collapsedShowTitle: propTypes.bool,
       beforeClickFn: {
-        type: Function as PropType<(key: string) => Promise<boolean>>,
-      },
+        type: Function as PropType<(key: string) => Promise<boolean>>
+      }
     },
     emits: ['menuClick'],
     setup(props, { attrs, emit }) {
-      const currentActiveMenu = ref('');
-      const isClickGo = ref(false);
+      const currentActiveMenu = ref('')
+      const isClickGo = ref(false)
 
       const menuState = reactive<MenuState>({
         activeName: '',
         openNames: [],
-        activeSubMenuNames: [],
-      });
+        activeSubMenuNames: []
+      })
 
-      const { currentRoute } = useRouter();
-      const { prefixCls } = useDesign('simple-menu');
-      const { items, accordion, mixSider, collapse } = toRefs(props);
+      const { currentRoute } = useRouter()
+      const { prefixCls } = useDesign('simple-menu')
+      const { items, accordion, mixSider, collapse } = toRefs(props)
       const { setOpenKeys, getOpenKeys } = useOpenKeys(
         menuState,
         items,
         accordion,
         mixSider,
         collapse
-      );
+      )
 
-      const getBindValues = computed(() => ({ ...attrs, ...props }));
+      const getBindValues = computed(() => ({ ...attrs, ...props }))
 
       watch(
         () => props.collapse,
-        (collapse) => {
+        collapse => {
           if (collapse) {
-            menuState.openNames = [];
+            menuState.openNames = []
           } else {
-            setOpenKeys(currentRoute.value.path);
+            setOpenKeys(currentRoute.value.path)
           }
         },
         { immediate: true }
-      );
+      )
 
-      listenerLastChangeTab((route) => {
-        if (route.name === REDIRECT_NAME) return;
+      listenerLastChangeTab(route => {
+        if (route.name === REDIRECT_NAME) return
 
-        currentActiveMenu.value = route.meta?.currentActiveMenu as string;
-        handleMenuChange(route);
+        currentActiveMenu.value = route.meta?.currentActiveMenu as string
+        handleMenuChange(route)
 
         if (unref(currentActiveMenu)) {
-          menuState.activeName = unref(currentActiveMenu);
-          setOpenKeys(unref(currentActiveMenu));
+          menuState.activeName = unref(currentActiveMenu)
+          setOpenKeys(unref(currentActiveMenu))
         }
-      });
+      })
 
       async function handleMenuChange(route?: RouteLocationNormalizedLoaded) {
         if (unref(isClickGo)) {
-          isClickGo.value = false;
-          return;
+          isClickGo.value = false
+          return
         }
-        const path = (route || unref(currentRoute)).path;
-        menuState.activeName = path;
+        const path = (route || unref(currentRoute)).path
+        menuState.activeName = path
 
-        setOpenKeys(path);
+        setOpenKeys(path)
         // if (unref(currentActiveMenu)) return;
       }
 
       async function handleSelect(key: string) {
-        const { beforeClickFn } = props;
+        const { beforeClickFn } = props
         if (beforeClickFn && isFunction(beforeClickFn)) {
-          const flag = await beforeClickFn(key);
-          if (!flag) return;
+          const flag = await beforeClickFn(key)
+          if (!flag) return
         }
-        emit('menuClick', key);
+        emit('menuClick', key)
 
-        isClickGo.value = true;
-        setOpenKeys(key);
-        menuState.activeName = key;
+        isClickGo.value = true
+        setOpenKeys(key)
+        menuState.activeName = key
       }
 
       return {
@@ -133,10 +133,10 @@
         getBindValues,
         handleSelect,
         getOpenKeys,
-        ...toRefs(menuState),
-      };
-    },
-  });
+        ...toRefs(menuState)
+      }
+    }
+  })
 </script>
 <style lang="less">
   @import './index.less';

+ 34 - 34
src/components/SimpleMenu/src/SimpleMenuTag.vue

@@ -2,68 +2,68 @@
   <span :class="getTagClass" v-if="getShowTag">{{ getContent }}</span>
 </template>
 <script lang="ts">
-  import type { Menu } from '/@/router/types';
-  import type { PropType } from 'vue';
+  import type { Menu } from '/@/router/types'
+  import type { PropType } from 'vue'
 
-  import { defineComponent, computed } from 'vue';
+  import { defineComponent, computed } from 'vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'SimpleMenuTag',
     props: {
       item: {
         type: Object as PropType<Menu>,
-        default: {},
+        default: {}
       },
       dot: propTypes.bool,
-      collapseParent: propTypes.bool,
+      collapseParent: propTypes.bool
     },
     setup(props) {
-      const { prefixCls } = useDesign('simple-menu');
+      const { prefixCls } = useDesign('simple-menu')
 
       const getShowTag = computed(() => {
-        const { item } = props;
+        const { item } = props
 
-        if (!item) return false;
+        if (!item) return false
 
-        const { tag } = item;
-        if (!tag) return false;
+        const { tag } = item
+        if (!tag) return false
 
-        const { dot, content } = tag;
-        if (!dot && !content) return false;
-        return true;
-      });
+        const { dot, content } = tag
+        if (!dot && !content) return false
+        return true
+      })
 
       const getContent = computed(() => {
-        if (!getShowTag.value) return '';
-        const { item, collapseParent } = props;
-        const { tag } = item;
-        const { dot, content } = tag!;
-        return dot || collapseParent ? '' : content;
-      });
+        if (!getShowTag.value) return ''
+        const { item, collapseParent } = props
+        const { tag } = item
+        const { dot, content } = tag!
+        return dot || collapseParent ? '' : content
+      })
 
       const getTagClass = computed(() => {
-        const { item, collapseParent } = props;
-        const { tag = {} } = item || {};
-        const { dot, type = 'error' } = tag;
-        const tagCls = `${prefixCls}-tag`;
+        const { item, collapseParent } = props
+        const { tag = {} } = item || {}
+        const { dot, type = 'error' } = tag
+        const tagCls = `${prefixCls}-tag`
         return [
           tagCls,
 
           [`${tagCls}--${type}`],
           {
             [`${tagCls}--collapse`]: collapseParent,
-            [`${tagCls}--dot`]: dot || props.dot,
-          },
-        ];
-      });
+            [`${tagCls}--dot`]: dot || props.dot
+          }
+        ]
+      })
       return {
         getTagClass,
         getShowTag,
-        getContent,
-      };
-    },
-  });
+        getContent
+      }
+    }
+  })
 </script>

+ 29 - 29
src/components/SimpleMenu/src/SimpleSubMenu.vue

@@ -40,18 +40,18 @@
   </SubMenu>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import type { Menu } from '/@/router/types';
+  import type { PropType } from 'vue'
+  import type { Menu } from '/@/router/types'
 
-  import { defineComponent, computed } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import Icon from '/@/components/Icon/index';
+  import { defineComponent, computed } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import Icon from '/@/components/Icon/index'
 
-  import MenuItem from './components/MenuItem.vue';
-  import SubMenu from './components/SubMenuItem.vue';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent';
+  import MenuItem from './components/MenuItem.vue'
+  import SubMenu from './components/SubMenuItem.vue'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { createAsyncComponent } from '/@/utils/factory/createAsyncComponent'
 
   export default defineComponent({
     name: 'SimpleSubMenu',
@@ -59,35 +59,35 @@
       SubMenu,
       MenuItem,
       SimpleMenuTag: createAsyncComponent(() => import('./SimpleMenuTag.vue')),
-      Icon,
+      Icon
     },
     props: {
       item: {
         type: Object as PropType<Menu>,
-        default: {},
+        default: {}
       },
       parent: propTypes.bool,
       collapsedShowTitle: propTypes.bool,
       collapse: propTypes.bool,
-      theme: propTypes.oneOf(['dark', 'light']),
+      theme: propTypes.oneOf(['dark', 'light'])
     },
     setup(props) {
-      const { t } = useI18n();
-      const { prefixCls } = useDesign('simple-menu');
+      const { t } = useI18n()
+      const { prefixCls } = useDesign('simple-menu')
 
-      const getShowMenu = computed(() => !props.item?.meta?.hideMenu);
-      const getIcon = computed(() => props.item?.icon);
-      const getI18nName = computed(() => t(props.item?.name));
-      const getShowSubTitle = computed(() => !props.collapse || !props.parent);
-      const getIsCollapseParent = computed(() => !!props.collapse && !!props.parent);
+      const getShowMenu = computed(() => !props.item?.meta?.hideMenu)
+      const getIcon = computed(() => props.item?.icon)
+      const getI18nName = computed(() => t(props.item?.name))
+      const getShowSubTitle = computed(() => !props.collapse || !props.parent)
+      const getIsCollapseParent = computed(() => !!props.collapse && !!props.parent)
       const getLevelClass = computed(() => {
         return [
           {
             [`${prefixCls}__parent`]: props.parent,
-            [`${prefixCls}__children`]: !props.parent,
-          },
-        ];
-      });
+            [`${prefixCls}__children`]: !props.parent
+          }
+        ]
+      })
 
       function menuHasChildren(menuTreeItem: Menu): boolean {
         return (
@@ -95,7 +95,7 @@
           Reflect.has(menuTreeItem, 'children') &&
           !!menuTreeItem.children &&
           menuTreeItem.children.length > 0
-        );
+        )
       }
 
       return {
@@ -106,8 +106,8 @@
         getI18nName,
         getShowSubTitle,
         getLevelClass,
-        getIsCollapseParent,
-      };
-    },
-  });
+        getIsCollapseParent
+      }
+    }
+  })
 </script>

+ 56 - 56
src/components/SimpleMenu/src/components/Menu.vue

@@ -5,8 +5,8 @@
 </template>
 
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import type { SubMenuProvider } from './types';
+  import type { PropType } from 'vue'
+  import type { SubMenuProvider } from './types'
   import {
     defineComponent,
     ref,
@@ -16,12 +16,12 @@
     watch,
     nextTick,
     getCurrentInstance,
-    provide,
-  } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
-  import { createSimpleRootMenuContext } from './useSimpleMenuContext';
-  import Mitt from '/@/utils/mitt';
+    provide
+  } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
+  import { createSimpleRootMenuContext } from './useSimpleMenuContext'
+  import Mitt from '/@/utils/mitt'
   export default defineComponent({
     name: 'Menu',
     props: {
@@ -29,7 +29,7 @@
       activeName: propTypes.oneOfType([propTypes.string, propTypes.number]),
       openNames: {
         type: Array as PropType<string[]>,
-        default: [],
+        default: []
       },
       accordion: propTypes.bool.def(true),
       width: propTypes.string.def('100%'),
@@ -38,81 +38,81 @@
       collapse: propTypes.bool.def(true),
       activeSubMenuNames: {
         type: Array as PropType<(string | number)[]>,
-        default: [],
-      },
+        default: []
+      }
     },
     emits: ['select', 'open-change'],
     setup(props, { emit }) {
-      const rootMenuEmitter = new Mitt();
-      const instance = getCurrentInstance();
+      const rootMenuEmitter = new Mitt()
+      const instance = getCurrentInstance()
 
-      const currentActiveName = ref<string | number>('');
-      const openedNames = ref<string[]>([]);
+      const currentActiveName = ref<string | number>('')
+      const openedNames = ref<string[]>([])
 
-      const { prefixCls } = useDesign('menu');
+      const { prefixCls } = useDesign('menu')
 
-      const isRemoveAllPopup = ref(false);
+      const isRemoveAllPopup = ref(false)
 
       createSimpleRootMenuContext({
         rootMenuEmitter: rootMenuEmitter,
-        activeName: currentActiveName,
-      });
+        activeName: currentActiveName
+      })
 
       const getClass = computed(() => {
-        const { theme } = props;
+        const { theme } = props
         return [
           prefixCls,
           `${prefixCls}-${theme}`,
           `${prefixCls}-vertical`,
           {
-            [`${prefixCls}-collapse`]: props.collapse,
-          },
-        ];
-      });
+            [`${prefixCls}-collapse`]: props.collapse
+          }
+        ]
+      })
 
       watchEffect(() => {
-        openedNames.value = props.openNames;
-      });
+        openedNames.value = props.openNames
+      })
 
       watchEffect(() => {
         if (props.activeName) {
-          currentActiveName.value = props.activeName;
+          currentActiveName.value = props.activeName
         }
-      });
+      })
 
       watch(
         () => props.openNames,
         () => {
           nextTick(() => {
-            updateOpened();
-          });
+            updateOpened()
+          })
         }
-      );
+      )
 
       function updateOpened() {
-        rootMenuEmitter.emit('on-update-opened', openedNames.value);
+        rootMenuEmitter.emit('on-update-opened', openedNames.value)
       }
 
       function addSubMenu(name: string) {
-        if (openedNames.value.includes(name)) return;
-        openedNames.value.push(name);
-        updateOpened();
+        if (openedNames.value.includes(name)) return
+        openedNames.value.push(name)
+        updateOpened()
       }
 
       function removeSubMenu(name: string) {
-        openedNames.value = openedNames.value.filter((item) => item !== name);
-        updateOpened();
+        openedNames.value = openedNames.value.filter(item => item !== name)
+        updateOpened()
       }
 
       function removeAll() {
-        openedNames.value = [];
-        updateOpened();
+        openedNames.value = []
+        updateOpened()
       }
 
       function sliceIndex(index: number) {
-        if (index === -1) return;
-        openedNames.value = openedNames.value.slice(0, index + 1);
-        updateOpened();
+        if (index === -1) return
+        openedNames.value = openedNames.value.slice(0, index + 1)
+        updateOpened()
       }
 
       provide<SubMenuProvider>(`subMenu:${instance?.uid}`, {
@@ -123,25 +123,25 @@
         isRemoveAllPopup,
         sliceIndex,
         level: 0,
-        props,
-      });
+        props
+      })
 
       onMounted(() => {
-        openedNames.value = !props.collapse ? [...props.openNames] : [];
-        updateOpened();
+        openedNames.value = !props.collapse ? [...props.openNames] : []
+        updateOpened()
         rootMenuEmitter.on('on-menu-item-select', (name: string) => {
-          currentActiveName.value = name;
+          currentActiveName.value = name
 
           nextTick(() => {
-            props.collapse && removeAll();
-          });
-          emit('select', name);
-        });
-      });
-
-      return { getClass, openedNames };
-    },
-  });
+            props.collapse && removeAll()
+          })
+          emit('select', name)
+        })
+      })
+
+      return { getClass, openedNames }
+    }
+  })
 </script>
 <style lang="less">
   @import './menu.less';

+ 40 - 40
src/components/SimpleMenu/src/components/MenuCollapseTransition.vue

@@ -4,8 +4,8 @@
   </transition>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { addClass, removeClass } from '/@/utils/domUtils';
+  import { defineComponent } from 'vue'
+  import { addClass, removeClass } from '/@/utils/domUtils'
 
   export default defineComponent({
     name: 'MenuCollapseTransition',
@@ -13,66 +13,66 @@
       return {
         on: {
           beforeEnter(el: any) {
-            addClass(el, 'collapse-transition');
-            if (!el.dataset) el.dataset = {};
+            addClass(el, 'collapse-transition')
+            if (!el.dataset) el.dataset = {}
 
-            el.dataset.oldPaddingTop = el.style.paddingTop;
-            el.dataset.oldPaddingBottom = el.style.paddingBottom;
+            el.dataset.oldPaddingTop = el.style.paddingTop
+            el.dataset.oldPaddingBottom = el.style.paddingBottom
 
-            el.style.height = '0';
-            el.style.paddingTop = 0;
-            el.style.paddingBottom = 0;
+            el.style.height = '0'
+            el.style.paddingTop = 0
+            el.style.paddingBottom = 0
           },
 
           enter(el: any) {
-            el.dataset.oldOverflow = el.style.overflow;
+            el.dataset.oldOverflow = el.style.overflow
             if (el.scrollHeight !== 0) {
-              el.style.height = el.scrollHeight + 'px';
-              el.style.paddingTop = el.dataset.oldPaddingTop;
-              el.style.paddingBottom = el.dataset.oldPaddingBottom;
+              el.style.height = el.scrollHeight + 'px'
+              el.style.paddingTop = el.dataset.oldPaddingTop
+              el.style.paddingBottom = el.dataset.oldPaddingBottom
             } else {
-              el.style.height = '';
-              el.style.paddingTop = el.dataset.oldPaddingTop;
-              el.style.paddingBottom = el.dataset.oldPaddingBottom;
+              el.style.height = ''
+              el.style.paddingTop = el.dataset.oldPaddingTop
+              el.style.paddingBottom = el.dataset.oldPaddingBottom
             }
 
-            el.style.overflow = 'hidden';
+            el.style.overflow = 'hidden'
           },
 
           afterEnter(el: any) {
-            removeClass(el, 'collapse-transition');
-            el.style.height = '';
-            el.style.overflow = el.dataset.oldOverflow;
+            removeClass(el, 'collapse-transition')
+            el.style.height = ''
+            el.style.overflow = el.dataset.oldOverflow
           },
 
           beforeLeave(el: any) {
-            if (!el.dataset) el.dataset = {};
-            el.dataset.oldPaddingTop = el.style.paddingTop;
-            el.dataset.oldPaddingBottom = el.style.paddingBottom;
-            el.dataset.oldOverflow = el.style.overflow;
+            if (!el.dataset) el.dataset = {}
+            el.dataset.oldPaddingTop = el.style.paddingTop
+            el.dataset.oldPaddingBottom = el.style.paddingBottom
+            el.dataset.oldOverflow = el.style.overflow
 
-            el.style.height = el.scrollHeight + 'px';
-            el.style.overflow = 'hidden';
+            el.style.height = el.scrollHeight + 'px'
+            el.style.overflow = 'hidden'
           },
 
           leave(el: any) {
             if (el.scrollHeight !== 0) {
-              addClass(el, 'collapse-transition');
-              el.style.height = 0;
-              el.style.paddingTop = 0;
-              el.style.paddingBottom = 0;
+              addClass(el, 'collapse-transition')
+              el.style.height = 0
+              el.style.paddingTop = 0
+              el.style.paddingBottom = 0
             }
           },
 
           afterLeave(el: any) {
-            removeClass(el, 'collapse-transition');
-            el.style.height = '';
-            el.style.overflow = el.dataset.oldOverflow;
-            el.style.paddingTop = el.dataset.oldPaddingTop;
-            el.style.paddingBottom = el.dataset.oldPaddingBottom;
-          },
-        },
-      };
-    },
-  });
+            removeClass(el, 'collapse-transition')
+            el.style.height = ''
+            el.style.overflow = el.dataset.oldOverflow
+            el.style.paddingTop = el.dataset.oldPaddingTop
+            el.style.paddingBottom = el.dataset.oldPaddingBottom
+          }
+        }
+      }
+    }
+  })
 </script>

+ 39 - 39
src/components/SimpleMenu/src/components/MenuItem.vue

@@ -17,35 +17,35 @@
 </template>
 
 <script lang="ts">
-  import { PropType } from 'vue';
-  import { defineComponent, ref, computed, unref, getCurrentInstance, watch } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useMenuItem } from './useMenu';
-  import { Tooltip } from 'ant-design-vue';
-  import { useSimpleRootMenuContext } from './useSimpleMenuContext';
+  import { PropType } from 'vue'
+  import { defineComponent, ref, computed, unref, getCurrentInstance, watch } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useMenuItem } from './useMenu'
+  import { Tooltip } from 'ant-design-vue'
+  import { useSimpleRootMenuContext } from './useSimpleMenuContext'
   export default defineComponent({
     name: 'MenuItem',
     components: { Tooltip },
     props: {
       name: {
         type: [String, Number] as PropType<string | number>,
-        required: true,
+        required: true
       },
-      disabled: propTypes.bool,
+      disabled: propTypes.bool
     },
     setup(props, { slots }) {
-      const instance = getCurrentInstance();
+      const instance = getCurrentInstance()
 
-      const active = ref(false);
+      const active = ref(false)
 
       const { getItemStyle, getParentList, getParentMenu, getParentRootMenu } = useMenuItem(
         instance
-      );
+      )
 
-      const { prefixCls } = useDesign('menu');
+      const { prefixCls } = useDesign('menu')
 
-      const { rootMenuEmitter, activeName } = useSimpleRootMenuContext();
+      const { rootMenuEmitter, activeName } = useSimpleRootMenuContext()
 
       const getClass = computed(() => {
         return [
@@ -53,51 +53,51 @@
           {
             [`${prefixCls}-item-active`]: unref(active),
             [`${prefixCls}-item-selected`]: unref(active),
-            [`${prefixCls}-item-disabled`]: !!props.disabled,
-          },
-        ];
-      });
+            [`${prefixCls}-item-disabled`]: !!props.disabled
+          }
+        ]
+      })
 
-      const getCollapse = computed(() => unref(getParentRootMenu)?.props.collapse);
+      const getCollapse = computed(() => unref(getParentRootMenu)?.props.collapse)
 
       const showTooptip = computed(() => {
-        return unref(getParentMenu)?.type.name === 'Menu' && unref(getCollapse) && slots.title;
-      });
+        return unref(getParentMenu)?.type.name === 'Menu' && unref(getCollapse) && slots.title
+      })
 
       function handleClickItem() {
-        const { disabled } = props;
-        if (disabled) return;
+        const { disabled } = props
+        if (disabled) return
 
-        rootMenuEmitter.emit('on-menu-item-select', props.name);
-        if (unref(getCollapse)) return;
-        const { uidList } = getParentList();
+        rootMenuEmitter.emit('on-menu-item-select', props.name)
+        if (unref(getCollapse)) return
+        const { uidList } = getParentList()
         rootMenuEmitter.emit('on-update-opened', {
           opend: false,
           parent: instance?.parent,
-          uidList: uidList,
-        });
+          uidList: uidList
+        })
       }
       watch(
         () => activeName.value,
         (name: string) => {
           if (name === props.name) {
-            const { list, uidList } = getParentList();
-            active.value = true;
-            list.forEach((item) => {
+            const { list, uidList } = getParentList()
+            active.value = true
+            list.forEach(item => {
               if (item.proxy) {
-                (item.proxy as any).active = true;
+                ;(item.proxy as any).active = true
               }
-            });
+            })
 
-            rootMenuEmitter.emit('on-update-active-name:submenu', uidList);
+            rootMenuEmitter.emit('on-update-active-name:submenu', uidList)
           } else {
-            active.value = false;
+            active.value = false
           }
         },
         { immediate: true }
-      );
+      )
 
-      return { getClass, prefixCls, getItemStyle, getCollapse, handleClickItem, showTooptip };
-    },
-  });
+      return { getClass, prefixCls, getItemStyle, getCollapse, handleClickItem, showTooptip }
+    }
+  })
 </script>

+ 107 - 109
src/components/SimpleMenu/src/components/SubMenuItem.vue

@@ -30,8 +30,8 @@
           :class="[
             {
               [`${prefixCls}-submenu-popup`]: !getParentSubMenu,
-              [`${prefixCls}-submenu-collapsed-show-tit`]: collapsedShowTitle,
-            },
+              [`${prefixCls}-submenu-collapsed-show-tit`]: collapsedShowTitle
+            }
           ]"
         >
           <slot name="title"></slot>
@@ -55,8 +55,8 @@
 </template>
 
 <script lang="ts">
-  import type { CSSProperties, PropType } from 'vue';
-  import type { SubMenuProvider } from './types';
+  import type { CSSProperties, PropType } from 'vue'
+  import type { SubMenuProvider } from './types'
   import {
     defineComponent,
     computed,
@@ -66,57 +66,55 @@
     reactive,
     provide,
     onBeforeMount,
-    inject,
-  } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useMenuItem } from './useMenu';
-  import { useSimpleRootMenuContext } from './useSimpleMenuContext';
-  import MenuCollapseTransition from './MenuCollapseTransition.vue';
-  import Icon from '/@/components/Icon';
-  import { Popover } from 'ant-design-vue';
-  import { isBoolean, isObject } from '/@/utils/is';
-  import Mitt from '/@/utils/mitt';
-
-  const DELAY = 200;
+    inject
+  } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useMenuItem } from './useMenu'
+  import { useSimpleRootMenuContext } from './useSimpleMenuContext'
+  import MenuCollapseTransition from './MenuCollapseTransition.vue'
+  import Icon from '/@/components/Icon'
+  import { Popover } from 'ant-design-vue'
+  import { isBoolean, isObject } from '/@/utils/is'
+  import Mitt from '/@/utils/mitt'
+
+  const DELAY = 200
   export default defineComponent({
     name: 'SubMenu',
     components: {
       Icon,
       MenuCollapseTransition,
-      Popover,
+      Popover
     },
     props: {
       name: {
         type: [String, Number] as PropType<string | number>,
-        required: true,
+        required: true
       },
       disabled: propTypes.bool,
-      collapsedShowTitle: propTypes.bool,
+      collapsedShowTitle: propTypes.bool
     },
     setup(props) {
-      const instance = getCurrentInstance();
+      const instance = getCurrentInstance()
 
       const state = reactive({
         active: false,
-        opened: false,
-      });
+        opened: false
+      })
 
       const data = reactive({
         timeout: null as TimeoutHandle | null,
         mouseInChild: false,
-        isChild: false,
-      });
+        isChild: false
+      })
 
-      const { getParentSubMenu, getItemStyle, getParentMenu, getParentList } = useMenuItem(
-        instance
-      );
+      const { getParentSubMenu, getItemStyle, getParentMenu, getParentList } = useMenuItem(instance)
 
-      const { prefixCls } = useDesign('menu');
+      const { prefixCls } = useDesign('menu')
 
-      const subMenuEmitter = new Mitt();
+      const subMenuEmitter = new Mitt()
 
-      const { rootMenuEmitter } = useSimpleRootMenuContext();
+      const { rootMenuEmitter } = useSimpleRootMenuContext()
 
       const {
         addSubMenu: parentAddSubmenu,
@@ -127,8 +125,8 @@
         sliceIndex,
         level,
         props: rootProps,
-        handleMouseleave: parentHandleMouseleave,
-      } = inject<SubMenuProvider>(`subMenu:${getParentMenu.value?.uid}`)!;
+        handleMouseleave: parentHandleMouseleave
+      } = inject<SubMenuProvider>(`subMenu:${getParentMenu.value?.uid}`)!
 
       const getClass = computed(() => {
         return [
@@ -138,163 +136,163 @@
             [`${prefixCls}-opened`]: state.opened,
             [`${prefixCls}-submenu-disabled`]: props.disabled,
             [`${prefixCls}-submenu-has-parent-submenu`]: unref(getParentSubMenu),
-            [`${prefixCls}-child-item-active`]: state.active,
-          },
-        ];
-      });
+            [`${prefixCls}-child-item-active`]: state.active
+          }
+        ]
+      })
 
-      const getAccordion = computed(() => rootProps.accordion);
-      const getCollapse = computed(() => rootProps.collapse);
-      const getTheme = computed(() => rootProps.theme);
+      const getAccordion = computed(() => rootProps.accordion)
+      const getCollapse = computed(() => rootProps.collapse)
+      const getTheme = computed(() => rootProps.theme)
 
       const getOverlayStyle = computed(
         (): CSSProperties => {
           return {
-            minWidth: '200px',
-          };
+            minWidth: '200px'
+          }
         }
-      );
+      )
 
       const getIsOpend = computed(() => {
-        const name = props.name;
+        const name = props.name
         if (unref(getCollapse)) {
-          return parentGetOpenNames().includes(name);
+          return parentGetOpenNames().includes(name)
         }
-        return state.opened;
-      });
+        return state.opened
+      })
 
       const getSubClass = computed(() => {
-        const isActive = rootProps.activeSubMenuNames.includes(props.name);
+        const isActive = rootProps.activeSubMenuNames.includes(props.name)
         return [
           `${prefixCls}-submenu-title`,
           {
             [`${prefixCls}-submenu-active`]: isActive,
             [`${prefixCls}-submenu-active-border`]: isActive && level === 0,
-            [`${prefixCls}-submenu-collapse`]: unref(getCollapse) && level === 0,
-          },
-        ];
-      });
+            [`${prefixCls}-submenu-collapse`]: unref(getCollapse) && level === 0
+          }
+        ]
+      })
 
       function getEvents(deep: boolean) {
         if (!unref(getCollapse)) {
-          return {};
+          return {}
         }
         return {
           onMouseenter: handleMouseenter,
-          onMouseleave: () => handleMouseleave(deep),
-        };
+          onMouseleave: () => handleMouseleave(deep)
+        }
       }
 
       function handleClick() {
-        const { disabled } = props;
-        if (disabled || unref(getCollapse)) return;
-        const opened = state.opened;
+        const { disabled } = props
+        if (disabled || unref(getCollapse)) return
+        const opened = state.opened
         if (unref(getAccordion)) {
-          const { uidList } = getParentList();
+          const { uidList } = getParentList()
           rootMenuEmitter.emit('on-update-opened', {
             opend: false,
             parent: instance?.parent,
-            uidList: uidList,
-          });
+            uidList: uidList
+          })
         }
-        state.opened = !opened;
+        state.opened = !opened
       }
 
       function handleMouseenter() {
-        const disabled = props.disabled;
-        if (disabled) return;
+        const disabled = props.disabled
+        if (disabled) return
 
-        subMenuEmitter.emit('submenu:mouse-enter-child');
+        subMenuEmitter.emit('submenu:mouse-enter-child')
 
-        const index = parentGetOpenNames().findIndex((item) => item === props.name);
+        const index = parentGetOpenNames().findIndex(item => item === props.name)
 
-        sliceIndex(index);
+        sliceIndex(index)
 
-        const isRoot = level === 0 && parentGetOpenNames().length === 2;
+        const isRoot = level === 0 && parentGetOpenNames().length === 2
         if (isRoot) {
-          parentRemoveAll();
+          parentRemoveAll()
         }
-        data.isChild = parentGetOpenNames().includes(props.name);
-        clearTimeout(data.timeout!);
+        data.isChild = parentGetOpenNames().includes(props.name)
+        clearTimeout(data.timeout!)
         data.timeout = setTimeout(() => {
-          parentAddSubmenu(props.name);
-        }, DELAY);
+          parentAddSubmenu(props.name)
+        }, DELAY)
       }
 
       function handleMouseleave(deepDispatch = false) {
-        const parentName = getParentMenu.value?.props.name;
+        const parentName = getParentMenu.value?.props.name
         if (!parentName) {
-          isRemoveAllPopup.value = true;
+          isRemoveAllPopup.value = true
         }
 
         if (parentGetOpenNames().slice(-1)[0] === props.name) {
-          data.isChild = false;
+          data.isChild = false
         }
 
-        subMenuEmitter.emit('submenu:mouse-leave-child');
+        subMenuEmitter.emit('submenu:mouse-leave-child')
         if (data.timeout) {
-          clearTimeout(data.timeout!);
+          clearTimeout(data.timeout!)
           data.timeout = setTimeout(() => {
             if (isRemoveAllPopup.value) {
-              parentRemoveAll();
+              parentRemoveAll()
             } else if (!data.mouseInChild) {
-              parentRemoveSubmenu(props.name);
+              parentRemoveSubmenu(props.name)
             }
-          }, DELAY);
+          }, DELAY)
         }
         if (deepDispatch) {
           if (getParentSubMenu.value) {
-            parentHandleMouseleave?.(true);
+            parentHandleMouseleave?.(true)
           }
         }
       }
 
       onBeforeMount(() => {
         subMenuEmitter.on('submenu:mouse-enter-child', () => {
-          data.mouseInChild = true;
-          isRemoveAllPopup.value = false;
-          clearTimeout(data.timeout!);
-        });
+          data.mouseInChild = true
+          isRemoveAllPopup.value = false
+          clearTimeout(data.timeout!)
+        })
         subMenuEmitter.on('submenu:mouse-leave-child', () => {
-          if (data.isChild) return;
-          data.mouseInChild = false;
-          clearTimeout(data.timeout!);
-        });
+          if (data.isChild) return
+          data.mouseInChild = false
+          clearTimeout(data.timeout!)
+        })
 
         rootMenuEmitter.on(
           'on-update-opened',
           (data: boolean | (string | number)[] | Recordable) => {
-            if (unref(getCollapse)) return;
+            if (unref(getCollapse)) return
             if (isBoolean(data)) {
-              state.opened = data;
-              return;
+              state.opened = data
+              return
             }
 
             if (isObject(data)) {
-              const { opend, parent, uidList } = data as Recordable;
+              const { opend, parent, uidList } = data as Recordable
               if (parent === instance?.parent) {
-                state.opened = opend;
+                state.opened = opend
               } else if (!uidList.includes(instance?.uid)) {
-                state.opened = false;
+                state.opened = false
               }
-              return;
+              return
             }
 
             if (props.name && Array.isArray(data)) {
-              state.opened = (data as (string | number)[]).includes(props.name);
+              state.opened = (data as (string | number)[]).includes(props.name)
             }
           }
-        );
+        )
 
         rootMenuEmitter.on('on-update-active-name:submenu', (data: number[]) => {
           if (instance?.uid) {
-            state.active = data.includes(instance?.uid);
+            state.active = data.includes(instance?.uid)
           }
-        });
-      });
+        })
+      })
 
       function handleVisibleChange(visible: boolean) {
-        state.opened = visible;
+        state.opened = visible
       }
 
       // provide
@@ -307,8 +305,8 @@
         sliceIndex,
         level: level + 1,
         handleMouseleave,
-        props: rootProps,
-      });
+        props: rootProps
+      })
 
       return {
         getClass,
@@ -324,8 +322,8 @@
         getEvents,
         getSubClass,
         ...toRefs(state),
-        ...toRefs(data),
-      };
-    },
-  });
+        ...toRefs(data)
+      }
+    }
+  })
 </script>

+ 25 - 25
src/components/StrengthMeter/src/index.vue

@@ -19,14 +19,14 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent, computed, ref, watch, unref, watchEffect } from 'vue';
+  import { defineComponent, computed, ref, watch, unref, watchEffect } from 'vue'
 
-  import { Input } from 'ant-design-vue';
+  import { Input } from 'ant-design-vue'
 
   // @ts-ignore
-  import { zxcvbn } from '@zxcvbn-ts/core';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { propTypes } from '/@/utils/propTypes';
+  import { zxcvbn } from '@zxcvbn-ts/core'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'StrengthMeter',
@@ -34,45 +34,45 @@
     props: {
       value: propTypes.string,
       showInput: propTypes.bool.def(true),
-      disabled: propTypes.bool,
+      disabled: propTypes.bool
     },
     emits: ['score-change', 'change'],
     setup(props, { emit }) {
-      const innerValueRef = ref('');
-      const { prefixCls } = useDesign('strength-meter');
+      const innerValueRef = ref('')
+      const { prefixCls } = useDesign('strength-meter')
 
       const getPasswordStrength = computed(() => {
-        const { disabled } = props;
-        if (disabled) return -1;
-        const innerValue = unref(innerValueRef);
-        const score = innerValue ? zxcvbn(unref(innerValueRef)).score : -1;
-        emit('score-change', score);
-        return score;
-      });
+        const { disabled } = props
+        if (disabled) return -1
+        const innerValue = unref(innerValueRef)
+        const score = innerValue ? zxcvbn(unref(innerValueRef)).score : -1
+        emit('score-change', score)
+        return score
+      })
 
       function handleChange(e: ChangeEvent) {
-        innerValueRef.value = e.target.value;
+        innerValueRef.value = e.target.value
       }
 
       watchEffect(() => {
-        innerValueRef.value = props.value || '';
-      });
+        innerValueRef.value = props.value || ''
+      })
 
       watch(
         () => unref(innerValueRef),
-        (val) => {
-          emit('change', val);
+        val => {
+          emit('change', val)
         }
-      );
+      )
 
       return {
         getPasswordStrength,
         handleChange,
         prefixCls,
-        innerValueRef,
-      };
-    },
-  });
+        innerValueRef
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-strength-meter';

+ 74 - 74
src/components/Table/src/BasicTable.vue

@@ -6,8 +6,8 @@
       $attrs.class,
       {
         [`${prefixCls}-form-container`]: getBindValues.useSearchForm,
-        [`${prefixCls}--inset`]: getBindValues.inset,
-      },
+        [`${prefixCls}--inset`]: getBindValues.inset
+      }
     ]"
   >
     <BasicForm
@@ -42,39 +42,39 @@
   </div>
 </template>
 <script lang="ts">
-  import type { BasicTableProps, TableActionType, SizeType } from './types/table';
+  import type { BasicTableProps, TableActionType, SizeType } from './types/table'
 
-  import { defineComponent, ref, computed, unref } from 'vue';
-  import { Table } from 'ant-design-vue';
-  import { BasicForm, useForm } from '/@/components/Form/index';
+  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 { omit } from 'lodash-es'
 
-  import { usePagination } from './hooks/usePagination';
-  import { useColumns } from './hooks/useColumns';
-  import { useDataSource } from './hooks/useDataSource';
-  import { useLoading } from './hooks/useLoading';
-  import { useRowSelection } from './hooks/useRowSelection';
-  import { useTableScroll } from './hooks/useTableScroll';
-  import { useCustomRow } from './hooks/useCustomRow';
-  import { useTableStyle } from './hooks/useTableStyle';
-  import { useTableHeader } from './hooks/useTableHeader';
-  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 { usePagination } from './hooks/usePagination'
+  import { useColumns } from './hooks/useColumns'
+  import { useDataSource } from './hooks/useDataSource'
+  import { useLoading } from './hooks/useLoading'
+  import { useRowSelection } from './hooks/useRowSelection'
+  import { useTableScroll } from './hooks/useTableScroll'
+  import { useCustomRow } from './hooks/useCustomRow'
+  import { useTableStyle } from './hooks/useTableStyle'
+  import { useTableHeader } from './hooks/useTableHeader'
+  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 { basicProps } from './props';
-  import expandIcon from './components/ExpandIcon';
-  import HeaderCell from './components/HeaderCell.vue';
+  import { basicProps } from './props'
+  import expandIcon from './components/ExpandIcon'
+  import HeaderCell from './components/HeaderCell.vue'
 
-  import './style/index.less';
+  import './style/index.less'
   export default defineComponent({
     components: {
       Table,
       BasicForm,
-      HeaderCell,
+      HeaderCell
     },
     props: basicProps,
     emits: [
@@ -90,30 +90,30 @@
       'edit-end',
       'edit-cancel',
       'edit-row-end',
-      'edit-change',
+      'edit-change'
     ],
     setup(props, { attrs, emit, slots }) {
-      const tableElRef = ref<ComponentRef>(null);
-      const tableData = ref<Recordable[]>([]);
+      const tableElRef = ref<ComponentRef>(null)
+      const tableData = ref<Recordable[]>([])
 
-      const wrapRef = ref<Nullable<HTMLDivElement>>(null);
-      const innerPropsRef = ref<Partial<BasicTableProps>>();
+      const wrapRef = ref<Nullable<HTMLDivElement>>(null)
+      const innerPropsRef = ref<Partial<BasicTableProps>>()
 
-      const { prefixCls } = useDesign('basic-table');
-      const [registerForm, formActions] = useForm();
+      const { prefixCls } = useDesign('basic-table')
+      const [registerForm, formActions] = useForm()
 
       const getProps = computed(() => {
-        return { ...props, ...unref(innerPropsRef) } as BasicTableProps;
-      });
+        return { ...props, ...unref(innerPropsRef) } as BasicTableProps
+      })
 
-      const { getLoading, setLoading } = useLoading(getProps);
+      const { getLoading, setLoading } = useLoading(getProps)
       const {
         getPaginationInfo,
         getPagination,
         setPagination,
         setShowPagination,
-        getShowPagination,
-      } = usePagination(getProps);
+        getShowPagination
+      } = usePagination(getProps)
 
       const {
         getRowSelection,
@@ -122,8 +122,8 @@
         clearSelectedRowKeys,
         getSelectRowKeys,
         deleteSelectRowByKey,
-        setSelectedRowKeys,
-      } = useRowSelection(getProps, tableData, emit);
+        setSelectedRowKeys
+      } = useRowSelection(getProps, tableData, emit)
 
       const {
         handleTableChange,
@@ -134,7 +134,7 @@
         getRowKey,
         reload,
         getAutoCreateKey,
-        updateTableData,
+        updateTableData
       } = useDataSource(
         getProps,
         {
@@ -143,10 +143,10 @@
           setLoading,
           setPagination,
           getFieldsValue: formActions.getFieldsValue,
-          clearSelectedRowKeys,
+          clearSelectedRowKeys
         },
         emit
-      );
+      )
 
       const {
         getViewColumns,
@@ -154,8 +154,8 @@
         setCacheColumnsByField,
         setColumns,
         getColumnsRef,
-        getCacheColumns,
-      } = useColumns(getProps, getPaginationInfo);
+        getCacheColumns
+      } = useColumns(getProps, getPaginationInfo)
 
       const { getScrollRef, redoHeight } = useTableScroll(
         getProps,
@@ -163,33 +163,33 @@
         getColumnsRef,
         getRowSelectionRef,
         getDataSourceRef
-      );
+      )
 
       const { customRow } = useCustomRow(getProps, {
         setSelectedRowKeys,
         getSelectRowKeys,
         clearSelectedRowKeys,
         getAutoCreateKey,
-        emit,
-      });
+        emit
+      })
 
-      const { getRowClassName } = useTableStyle(getProps, prefixCls);
+      const { getRowClassName } = useTableStyle(getProps, prefixCls)
 
-      const { getHeaderProps } = useTableHeader(getProps, slots);
+      const { getHeaderProps } = useTableHeader(getProps, slots)
 
       const { getFooterProps } = useTableFooter(
         getProps,
         getScrollRef,
         tableElRef,
         getDataSourceRef
-      );
+      )
 
       const {
         getFormProps,
         replaceFormSlotKey,
         getFormSlotKeys,
-        handleSearchInfoChange,
-      } = useTableForm(getProps, slots, fetch);
+        handleSearchInfoChange
+      } = useTableForm(getProps, slots, fetch)
 
       const getBindValues = computed(() => {
         let propsData: Recordable = {
@@ -207,27 +207,27 @@
           columns: unref(getViewColumns),
           pagination: unref(getPaginationInfo),
           dataSource: unref(getDataSourceRef),
-          footer: unref(getFooterProps),
-        };
+          footer: unref(getFooterProps)
+        }
         if (slots.expandedRowRender) {
-          propsData = omit(propsData, 'scroll');
+          propsData = omit(propsData, 'scroll')
         }
 
-        propsData = omit(propsData, 'class');
+        propsData = omit(propsData, 'class')
 
-        return propsData;
-      });
+        return propsData
+      })
 
       const getEmptyDataIsShowTable = computed(() => {
-        const { emptyDataIsShowTable, useSearchForm } = unref(getProps);
+        const { emptyDataIsShowTable, useSearchForm } = unref(getProps)
         if (emptyDataIsShowTable || !useSearchForm) {
-          return true;
+          return true
         }
-        return !!unref(getDataSourceRef).length;
-      });
+        return !!unref(getDataSourceRef).length
+      })
 
       function setProps(props: Partial<BasicTableProps>) {
-        innerPropsRef.value = { ...unref(innerPropsRef), ...props };
+        innerPropsRef.value = { ...unref(innerPropsRef), ...props }
       }
 
       const tableAction: TableActionType = {
@@ -254,14 +254,14 @@
         getShowPagination,
         setCacheColumnsByField,
         getSize: () => {
-          return unref(getBindValues).size as SizeType;
-        },
-      };
-      createTableContext({ ...tableAction, wrapRef, getBindValues });
+          return unref(getBindValues).size as SizeType
+        }
+      }
+      createTableContext({ ...tableAction, wrapRef, getBindValues })
 
-      useExpose<TableActionType>(tableAction);
+      useExpose<TableActionType>(tableAction)
 
-      emit('register', tableAction, formActions);
+      emit('register', tableAction, formActions)
 
       return {
         tableElRef,
@@ -279,8 +279,8 @@
         replaceFormSlotKey,
         getFormSlotKeys,
         prefixCls,
-        columns: getViewColumns,
-      };
-    },
-  });
+        columns: getViewColumns
+      }
+    }
+  })
 </script>

+ 6 - 6
src/components/Table/src/components/EditTableHeaderIcon.vue

@@ -6,16 +6,16 @@
   </span>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType } from 'vue';
-  import { FormOutlined } from '@ant-design/icons-vue';
+  import { defineComponent, PropType } from 'vue'
+  import { FormOutlined } from '@ant-design/icons-vue'
   export default defineComponent({
     name: 'EditTableHeaderIcon',
     components: { FormOutlined },
     props: {
       title: {
         type: String as PropType<string>,
-        default: '',
-      },
-    },
-  });
+        default: ''
+      }
+    }
+  })
 </script>

+ 6 - 6
src/components/Table/src/components/ExpandIcon.tsx

@@ -1,19 +1,19 @@
-import { BasicArrow } from '/@/components/Basic';
+import { BasicArrow } from '/@/components/Basic'
 
 export default () => {
   return (props: Recordable) => {
     if (!props.expandable) {
-      return <span />;
+      return <span />
     }
     return (
       <BasicArrow
         class="mr-1"
         iconStyle="margin-top: -2px;"
         onClick={(e: Event) => {
-          props.onExpand(props.record, e);
+          props.onExpand(props.record, e)
         }}
         expand={props.expanded}
       />
-    );
-  };
-};
+    )
+  }
+}

+ 19 - 19
src/components/Table/src/components/HeaderCell.vue

@@ -6,42 +6,42 @@
   <BasicHelp v-if="getHelpMessage" :text="getHelpMessage" :class="`${prefixCls}__help`" />
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import type { BasicColumn } from '../types/table';
+  import type { PropType } from 'vue'
+  import type { BasicColumn } from '../types/table'
 
-  import { defineComponent, computed } from 'vue';
-  import BasicHelp from '/@/components/Basic/src/BasicHelp.vue';
-  import EditTableHeaderCell from './EditTableHeaderIcon.vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { defineComponent, computed } from 'vue'
+  import BasicHelp from '/@/components/Basic/src/BasicHelp.vue'
+  import EditTableHeaderCell from './EditTableHeaderIcon.vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
   export default defineComponent({
     name: 'TableHeaderCell',
     components: {
       EditTableHeaderCell,
-      BasicHelp,
+      BasicHelp
     },
     props: {
       column: {
         type: Object as PropType<BasicColumn>,
-        default: {},
-      },
+        default: {}
+      }
     },
     setup(props) {
-      const { prefixCls } = useDesign('basic-table-header-cell');
+      const { prefixCls } = useDesign('basic-table-header-cell')
       const getIsEdit = computed(() => {
-        return !!props.column?.edit;
-      });
+        return !!props.column?.edit
+      })
 
       const getTitle = computed(() => {
-        return props.column?.customTitle;
-      });
+        return props.column?.customTitle
+      })
 
       const getHelpMessage = computed(() => {
-        return props.column?.helpMessage;
-      });
+        return props.column?.helpMessage
+      })
 
-      return { prefixCls, getIsEdit, getTitle, getHelpMessage };
-    },
-  });
+      return { prefixCls, getIsEdit, getTitle, getHelpMessage }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-table-header-cell';

+ 35 - 35
src/components/Table/src/components/TableAction.vue

@@ -19,37 +19,37 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, computed } from 'vue';
-  import Icon from '/@/components/Icon/index';
-  import { ActionItem, TableActionType } from '/@/components/Table';
-  import { PopConfirmButton } from '/@/components/Button';
-  import { Divider } from 'ant-design-vue';
-  import { Dropdown } from '/@/components/Dropdown';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { MoreOutlined } from '@ant-design/icons-vue';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useTableContext } from '../hooks/useTableContext';
-  import { ACTION_COLUMN_FLAG } from '../const';
+  import { defineComponent, PropType, computed } from 'vue'
+  import Icon from '/@/components/Icon/index'
+  import { ActionItem, TableActionType } from '/@/components/Table'
+  import { PopConfirmButton } from '/@/components/Button'
+  import { Divider } from 'ant-design-vue'
+  import { Dropdown } from '/@/components/Dropdown'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { MoreOutlined } from '@ant-design/icons-vue'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useTableContext } from '../hooks/useTableContext'
+  import { ACTION_COLUMN_FLAG } from '../const'
   export default defineComponent({
     name: 'TableAction',
     components: { Icon, PopConfirmButton, Divider, Dropdown, MoreOutlined },
     props: {
       actions: {
         type: Array as PropType<ActionItem[]>,
-        default: null,
+        default: null
       },
       dropDownActions: {
         type: Array as PropType<ActionItem[]>,
-        default: null,
+        default: null
       },
       divider: propTypes.bool.def(true),
-      outside: propTypes.bool,
+      outside: propTypes.bool
     },
     setup(props) {
-      const { prefixCls } = useDesign('basic-table-action');
-      let table: Partial<TableActionType> = {};
+      const { prefixCls } = useDesign('basic-table-action')
+      let table: Partial<TableActionType> = {}
       if (!props.outside) {
-        table = useTableContext();
+        table = useTableContext()
       }
 
       // const getSize = computed(() => {
@@ -65,8 +65,8 @@
       // });
 
       const getActions = computed(() => {
-        return (props.actions || []).map((action) => {
-          const { popConfirm } = action;
+        return (props.actions || []).map(action => {
+          const { popConfirm } = action
           // const size = unref(getSize);
           return {
             type: 'link',
@@ -76,31 +76,31 @@
             ...(popConfirm || {}),
             onConfirm: popConfirm?.confirm,
             onCancel: popConfirm?.cancel,
-            enable: !!popConfirm,
-          };
-        });
-      });
+            enable: !!popConfirm
+          }
+        })
+      })
 
       const getDropList = computed(() => {
         return (props.dropDownActions || []).map((action, index) => {
-          const { label } = action;
+          const { label } = action
           return {
             ...action,
             text: label,
-            divider: index < props.dropDownActions.length - 1 ? props.divider : false,
-          };
-        });
-      });
+            divider: index < props.dropDownActions.length - 1 ? props.divider : false
+          }
+        })
+      })
 
       const getAlign = computed(() => {
-        const columns = (table as TableActionType)?.getColumns?.() || [];
-        const actionColumn = columns.find((item) => item.flag === ACTION_COLUMN_FLAG);
-        return actionColumn?.align ?? 'left';
-      });
+        const columns = (table as TableActionType)?.getColumns?.() || []
+        const actionColumn = columns.find(item => item.flag === ACTION_COLUMN_FLAG)
+        return actionColumn?.align ?? 'left'
+      })
 
-      return { prefixCls, getActions, getDropList, getAlign };
-    },
-  });
+      return { prefixCls, getActions, getDropList, getAlign }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-table-action';

+ 43 - 43
src/components/Table/src/components/TableFooter.vue

@@ -5,91 +5,91 @@
     :bordered="false"
     :pagination="false"
     :dataSource="getDataSource"
-    :rowKey="(r) => r[rowKey]"
+    :rowKey="r => r[rowKey]"
     :columns="getColumns"
     tableLayout="fixed"
     :scroll="scroll"
   />
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import type { PropType } from 'vue'
 
-  import { defineComponent, unref, computed, toRaw } from 'vue';
-  import { Table } from 'ant-design-vue';
-  import { cloneDeep } from 'lodash-es';
-  import { isFunction } from '/@/utils/is';
-  import type { BasicColumn } from '../types/table';
-  import { INDEX_COLUMN_FLAG } from '../const';
-  import { propTypes } from '/@/utils/propTypes';
-  import { useTableContext } from '../hooks/useTableContext';
+  import { defineComponent, unref, computed, toRaw } from 'vue'
+  import { Table } from 'ant-design-vue'
+  import { cloneDeep } from 'lodash-es'
+  import { isFunction } from '/@/utils/is'
+  import type { BasicColumn } from '../types/table'
+  import { INDEX_COLUMN_FLAG } from '../const'
+  import { propTypes } from '/@/utils/propTypes'
+  import { useTableContext } from '../hooks/useTableContext'
 
-  const SUMMARY_ROW_KEY = '_row';
-  const SUMMARY_INDEX_KEY = '_index';
+  const SUMMARY_ROW_KEY = '_row'
+  const SUMMARY_INDEX_KEY = '_index'
   export default defineComponent({
     name: 'BasicTableFooter',
     components: { Table },
     props: {
       summaryFunc: {
-        type: Function as PropType<Fn>,
+        type: Function as PropType<Fn>
       },
       summaryData: {
-        type: Array as PropType<Recordable[]>,
+        type: Array as PropType<Recordable[]>
       },
       scroll: {
-        type: Object as PropType<Recordable>,
+        type: Object as PropType<Recordable>
       },
-      rowKey: propTypes.string.def('key'),
+      rowKey: propTypes.string.def('key')
     },
     setup(props) {
-      const table = useTableContext();
+      const table = useTableContext()
 
       const getDataSource = computed((): Recordable[] => {
-        const { summaryFunc, summaryData } = props;
+        const { summaryFunc, summaryData } = props
         if (summaryData?.length) {
-          summaryData.forEach((item, i) => (item[props.rowKey] = `${i}`));
-          return summaryData;
+          summaryData.forEach((item, i) => (item[props.rowKey] = `${i}`))
+          return summaryData
         }
         if (!isFunction(summaryFunc)) {
-          return [];
+          return []
         }
-        let dataSource = toRaw(unref(table.getDataSource()));
-        dataSource = summaryFunc(dataSource);
+        let dataSource = toRaw(unref(table.getDataSource()))
+        dataSource = summaryFunc(dataSource)
         dataSource.forEach((item, i) => {
-          item[props.rowKey] = `${i}`;
-        });
-        return dataSource;
-      });
+          item[props.rowKey] = `${i}`
+        })
+        return dataSource
+      })
 
       const getColumns = computed(() => {
-        const dataSource = unref(getDataSource);
-        const columns: BasicColumn[] = cloneDeep(table.getColumns());
-        const index = columns.findIndex((item) => item.flag === INDEX_COLUMN_FLAG);
-        const hasRowSummary = dataSource.some((item) => Reflect.has(item, SUMMARY_ROW_KEY));
-        const hasIndexSummary = dataSource.some((item) => Reflect.has(item, SUMMARY_INDEX_KEY));
+        const dataSource = unref(getDataSource)
+        const columns: BasicColumn[] = cloneDeep(table.getColumns())
+        const index = columns.findIndex(item => item.flag === INDEX_COLUMN_FLAG)
+        const hasRowSummary = dataSource.some(item => Reflect.has(item, SUMMARY_ROW_KEY))
+        const hasIndexSummary = dataSource.some(item => Reflect.has(item, SUMMARY_INDEX_KEY))
 
         if (index !== -1) {
           if (hasIndexSummary) {
-            columns[index].customRender = ({ record }) => record[SUMMARY_INDEX_KEY];
-            columns[index].ellipsis = false;
+            columns[index].customRender = ({ record }) => record[SUMMARY_INDEX_KEY]
+            columns[index].ellipsis = false
           } else {
-            Reflect.deleteProperty(columns[index], 'customRender');
+            Reflect.deleteProperty(columns[index], 'customRender')
           }
         }
 
         if (table.getRowSelection() && hasRowSummary) {
-          const isFixed = columns.some((col) => col.fixed === 'left');
+          const isFixed = columns.some(col => col.fixed === 'left')
           columns.unshift({
             width: 60,
             title: 'selection',
             key: 'selectionKey',
             align: 'center',
             ...(isFixed ? { fixed: 'left' } : {}),
-            customRender: ({ record }) => record[SUMMARY_ROW_KEY],
-          });
+            customRender: ({ record }) => record[SUMMARY_ROW_KEY]
+          })
         }
-        return columns;
-      });
-      return { getColumns, getDataSource };
-    },
-  });
+        return columns
+      })
+      return { getColumns, getDataSource }
+    }
+  })
 </script>

+ 17 - 17
src/components/Table/src/components/TableHeader.vue

@@ -9,42 +9,42 @@
   </div>
 </template>
 <script lang="ts">
-  import type { TableSetting } from '../types/table';
-  import type { PropType } from 'vue';
-  import { Divider } from 'ant-design-vue';
-  import { defineComponent } from 'vue';
+  import type { TableSetting } from '../types/table'
+  import type { PropType } from 'vue'
+  import { Divider } from 'ant-design-vue'
+  import { defineComponent } from 'vue'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import TableSettingComp from './settings/index.vue';
-  import TableTitle from './TableTitle.vue';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import TableSettingComp from './settings/index.vue'
+  import TableTitle from './TableTitle.vue'
 
   export default defineComponent({
     name: 'BasicTableHeader',
     components: {
       Divider,
       TableTitle,
-      TableSetting: TableSettingComp,
+      TableSetting: TableSettingComp
     },
     props: {
       title: {
-        type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
+        type: [Function, String] as PropType<string | ((data: Recordable) => string)>
       },
       tableSetting: {
-        type: Object as PropType<TableSetting>,
+        type: Object as PropType<TableSetting>
       },
       showTableSetting: {
-        type: Boolean,
+        type: Boolean
       },
       titleHelpMessage: {
         type: [String, Array] as PropType<string | string[]>,
-        default: '',
-      },
+        default: ''
+      }
     },
     setup() {
-      const { prefixCls } = useDesign('basic-table-header');
-      return { prefixCls };
-    },
-  });
+      const { prefixCls } = useDesign('basic-table-header')
+      return { prefixCls }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-table-header';

+ 14 - 14
src/components/Table/src/components/TableImg.vue

@@ -13,33 +13,33 @@
   </div>
 </template>
 <script lang="ts">
-  import type { CSSProperties } from 'vue';
-  import { defineComponent, computed } from 'vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import type { CSSProperties } from 'vue'
+  import { defineComponent, computed } from 'vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { Image } from 'ant-design-vue';
-  import { propTypes } from '/@/utils/propTypes';
+  import { Image } from 'ant-design-vue'
+  import { propTypes } from '/@/utils/propTypes'
 
   export default defineComponent({
     name: 'TableImage',
     components: { Image, PreviewGroup: Image.PreviewGroup },
     props: {
       imgList: propTypes.arrayOf(propTypes.string),
-      size: propTypes.number.def(40),
+      size: propTypes.number.def(40)
     },
     setup(props) {
       const getWrapStyle = computed(
         (): CSSProperties => {
-          const { size } = props;
-          const wh = `${size}px`;
-          return { height: wh, width: wh };
+          const { size } = props
+          const wh = `${size}px`
+          return { height: wh, width: wh }
         }
-      );
+      )
 
-      const { prefixCls } = useDesign('basic-table-img');
-      return { prefixCls, getWrapStyle };
-    },
-  });
+      const { prefixCls } = useDesign('basic-table-img')
+      return { prefixCls, getWrapStyle }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-table-img';

+ 18 - 18
src/components/Table/src/components/TableTitle.vue

@@ -4,43 +4,43 @@
   </BasicTitle>
 </template>
 <script lang="ts">
-  import { computed, defineComponent, PropType } from 'vue';
+  import { computed, defineComponent, PropType } from 'vue'
 
-  import { BasicTitle } from '/@/components/Basic/index';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { isFunction } from '/@/utils/is';
+  import { BasicTitle } from '/@/components/Basic/index'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { isFunction } from '/@/utils/is'
   export default defineComponent({
     name: 'BasicTableTitle',
     components: { BasicTitle },
     props: {
       title: {
-        type: [Function, String] as PropType<string | ((data: Recordable) => string)>,
+        type: [Function, String] as PropType<string | ((data: Recordable) => string)>
       },
       getSelectRows: {
-        type: Function as PropType<() => Recordable[]>,
+        type: Function as PropType<() => Recordable[]>
       },
       helpMessage: {
-        type: [String, Array] as PropType<string | string[]>,
-      },
+        type: [String, Array] as PropType<string | string[]>
+      }
     },
     setup(props) {
-      const { prefixCls } = useDesign('basic-table-title');
+      const { prefixCls } = useDesign('basic-table-title')
 
       const getTitle = computed(() => {
-        const { title, getSelectRows = () => {} } = props;
-        let tit = title;
+        const { title, getSelectRows = () => {} } = props
+        let tit = title
 
         if (isFunction(title)) {
           tit = title({
-            selectRows: getSelectRows(),
-          });
+            selectRows: getSelectRows()
+          })
         }
-        return tit;
-      });
+        return tit
+      })
 
-      return { getTitle, prefixCls };
-    },
-  });
+      return { getTitle, prefixCls }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-table-title';

+ 133 - 133
src/components/Table/src/components/editable/EditableCell.vue

@@ -27,61 +27,61 @@
   </div>
 </template>
 <script lang="ts">
-  import type { CSSProperties, PropType } from 'vue';
-  import type { BasicColumn } from '../../types/table';
-  import type { EditRecordRow } from './index';
+  import type { CSSProperties, PropType } from 'vue'
+  import type { BasicColumn } from '../../types/table'
+  import type { EditRecordRow } from './index'
 
-  import { defineComponent, ref, unref, nextTick, computed, watchEffect, toRaw } from 'vue';
-  import { FormOutlined, CloseOutlined, CheckOutlined } from '@ant-design/icons-vue';
-  import { CellComponent } from './CellComponent';
+  import { defineComponent, ref, unref, nextTick, computed, watchEffect, toRaw } from 'vue'
+  import { FormOutlined, CloseOutlined, CheckOutlined } from '@ant-design/icons-vue'
+  import { CellComponent } from './CellComponent'
 
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useTableContext } from '../../hooks/useTableContext';
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useTableContext } from '../../hooks/useTableContext'
 
-  import clickOutside from '/@/directives/clickOutside';
+  import clickOutside from '/@/directives/clickOutside'
 
-  import { propTypes } from '/@/utils/propTypes';
-  import { isString, isBoolean, isFunction, isNumber, isArray } from '/@/utils/is';
-  import { createPlaceholderMessage } from './helper';
+  import { propTypes } from '/@/utils/propTypes'
+  import { isString, isBoolean, isFunction, isNumber, isArray } from '/@/utils/is'
+  import { createPlaceholderMessage } from './helper'
 
   export default defineComponent({
     name: 'EditableCell',
     components: { FormOutlined, CloseOutlined, CheckOutlined, CellComponent },
     directives: {
-      clickOutside,
+      clickOutside
     },
     props: {
       value: {
         type: [String, Number, Boolean, Object] as PropType<string | number | boolean | Recordable>,
-        default: '',
+        default: ''
       },
       record: {
-        type: Object as PropType<EditRecordRow>,
+        type: Object as PropType<EditRecordRow>
       },
       column: {
         type: Object as PropType<BasicColumn>,
-        default: {},
+        default: {}
       },
-      index: propTypes.number,
+      index: propTypes.number
     },
     setup(props) {
-      const table = useTableContext();
-      const isEdit = ref(false);
-      const elRef = ref<any>(null);
-      const ruleVisible = ref(false);
-      const ruleMessage = ref('');
-      const optionsRef = ref<LabelValueOptions>([]);
-      const currentValueRef = ref<any>(props.value);
-      const defaultValueRef = ref<any>(props.value);
+      const table = useTableContext()
+      const isEdit = ref(false)
+      const elRef = ref<any>(null)
+      const ruleVisible = ref(false)
+      const ruleMessage = ref('')
+      const optionsRef = ref<LabelValueOptions>([])
+      const currentValueRef = ref<any>(props.value)
+      const defaultValueRef = ref<any>(props.value)
 
-      const { prefixCls } = useDesign('editable-cell');
+      const { prefixCls } = useDesign('editable-cell')
 
-      const getComponent = computed(() => props.column?.editComponent || 'Input');
-      const getRule = computed(() => props.column?.editRule);
+      const getComponent = computed(() => props.column?.editComponent || 'Input')
+      const getRule = computed(() => props.column?.editRule)
 
       const getRuleVisible = computed(() => {
-        return unref(ruleMessage) && unref(ruleVisible);
-      });
+        return unref(ruleMessage) && unref(ruleVisible)
+      })
 
       // const getSize = computed(() => {
       //   const size = table?.getSize?.();
@@ -96,184 +96,184 @@
       // });
 
       const getIsCheckComp = computed(() => {
-        const component = unref(getComponent);
-        return ['Checkbox', 'Switch'].includes(component);
-      });
+        const component = unref(getComponent)
+        return ['Checkbox', 'Switch'].includes(component)
+      })
 
       const getComponentProps = computed(() => {
-        const compProps = props.column?.editComponentProps ?? {};
-        const component = unref(getComponent);
-        const apiSelectProps: Recordable = {};
+        const compProps = props.column?.editComponentProps ?? {}
+        const component = unref(getComponent)
+        const apiSelectProps: Recordable = {}
         if (component === 'ApiSelect') {
-          apiSelectProps.cache = true;
+          apiSelectProps.cache = true
         }
 
-        const isCheckValue = unref(getIsCheckComp);
+        const isCheckValue = unref(getIsCheckComp)
 
-        const valueField = isCheckValue ? 'checked' : 'value';
-        const val = unref(currentValueRef);
+        const valueField = isCheckValue ? 'checked' : 'value'
+        const val = unref(currentValueRef)
 
-        const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val;
+        const value = isCheckValue ? (isNumber(val) && isBoolean(val) ? val : !!val) : val
 
         return {
           placeholder: createPlaceholderMessage(unref(getComponent)),
           ...apiSelectProps,
           ...compProps,
-          [valueField]: value,
-        };
-      });
+          [valueField]: value
+        }
+      })
 
       const getValues = computed(() => {
-        const { editComponentProps, editValueMap } = props.column;
+        const { editComponentProps, editValueMap } = props.column
 
-        const value = unref(currentValueRef);
+        const value = unref(currentValueRef)
 
         if (editValueMap && isFunction(editValueMap)) {
-          return editValueMap(value);
+          return editValueMap(value)
         }
 
-        const component = unref(getComponent);
+        const component = unref(getComponent)
         if (!component.includes('Select')) {
-          return value;
+          return value
         }
 
-        const options: LabelValueOptions = editComponentProps?.options ?? (unref(optionsRef) || []);
-        const option = options.find((item) => `${item.value}` === `${value}`);
+        const options: LabelValueOptions = editComponentProps?.options ?? (unref(optionsRef) || [])
+        const option = options.find(item => `${item.value}` === `${value}`)
 
-        return option?.label ?? value;
-      });
+        return option?.label ?? value
+      })
 
       const getWrapperStyle = computed(
         (): CSSProperties => {
           if (unref(getIsCheckComp) || unref(getRowEditable)) {
-            return {};
+            return {}
           }
           return {
-            width: 'calc(100% - 48px)',
-          };
+            width: 'calc(100% - 48px)'
+          }
         }
-      );
+      )
 
       const getRowEditable = computed(() => {
-        const { editable } = props.record || {};
-        return !!editable;
-      });
+        const { editable } = props.record || {}
+        return !!editable
+      })
 
       watchEffect(() => {
-        defaultValueRef.value = props.value;
-      });
+        defaultValueRef.value = props.value
+      })
 
       watchEffect(() => {
-        const { editable } = props.column;
+        const { editable } = props.column
         if (isBoolean(editable) || isBoolean(unref(getRowEditable))) {
-          isEdit.value = !!editable || unref(getRowEditable);
+          isEdit.value = !!editable || unref(getRowEditable)
         }
-      });
+      })
 
       function handleEdit() {
-        if (unref(getRowEditable) || unref(props.column?.editRow)) return;
-        ruleMessage.value = '';
-        isEdit.value = true;
+        if (unref(getRowEditable) || unref(props.column?.editRow)) return
+        ruleMessage.value = ''
+        isEdit.value = true
         nextTick(() => {
-          const el = unref(elRef);
-          el?.focus?.();
-        });
+          const el = unref(elRef)
+          el?.focus?.()
+        })
       }
 
       async function handleChange(e: any) {
-        const component = unref(getComponent);
+        const component = unref(getComponent)
         if (!e) {
-          currentValueRef.value = e;
+          currentValueRef.value = e
         } else if (e?.target && Reflect.has(e.target, 'value')) {
-          currentValueRef.value = (e as ChangeEvent).target.value;
+          currentValueRef.value = (e as ChangeEvent).target.value
         } else if (component === 'Checkbox') {
-          currentValueRef.value = (e as ChangeEvent).target.checked;
+          currentValueRef.value = (e as ChangeEvent).target.checked
         } else if (isString(e) || isBoolean(e) || isNumber(e)) {
-          currentValueRef.value = e;
+          currentValueRef.value = e
         }
 
         table.emit?.('edit-change', {
           column: props.column,
           value: unref(currentValueRef),
-          record: toRaw(props.record),
-        });
-        handleSubmiRule();
+          record: toRaw(props.record)
+        })
+        handleSubmiRule()
       }
 
       async function handleSubmiRule() {
-        const { column, record } = props;
-        const { editRule } = column;
-        const currentValue = unref(currentValueRef);
+        const { column, record } = props
+        const { editRule } = column
+        const currentValue = unref(currentValueRef)
 
         if (editRule) {
           if (isBoolean(editRule) && !currentValue && !isNumber(currentValue)) {
-            ruleVisible.value = true;
-            const component = unref(getComponent);
-            const message = createPlaceholderMessage(component);
-            ruleMessage.value = message;
-            return false;
+            ruleVisible.value = true
+            const component = unref(getComponent)
+            const message = createPlaceholderMessage(component)
+            ruleMessage.value = message
+            return false
           }
           if (isFunction(editRule)) {
-            const res = await editRule(currentValue, record as Recordable);
+            const res = await editRule(currentValue, record as Recordable)
             if (!!res) {
-              ruleMessage.value = res;
-              ruleVisible.value = true;
-              return false;
+              ruleMessage.value = res
+              ruleVisible.value = true
+              return false
             } else {
-              ruleMessage.value = '';
-              return true;
+              ruleMessage.value = ''
+              return true
             }
           }
         }
-        ruleMessage.value = '';
-        return true;
+        ruleMessage.value = ''
+        return true
       }
 
       async function handleSubmit(needEmit = true, valid = true) {
         if (valid) {
-          const isPass = await handleSubmiRule();
-          if (!isPass) return false;
+          const isPass = await handleSubmiRule()
+          if (!isPass) return false
         }
 
-        const { column, index } = props;
-        const { key, dataIndex } = column;
-        const value = unref(currentValueRef);
-        if (!key || !dataIndex) return;
+        const { column, index } = props
+        const { key, dataIndex } = column
+        const value = unref(currentValueRef)
+        if (!key || !dataIndex) return
 
-        const dataKey = (dataIndex || key) as string;
+        const dataKey = (dataIndex || key) as string
 
-        const record = await table.updateTableData(index, dataKey, value);
-        needEmit && table.emit?.('edit-end', { record, index, key, value });
-        isEdit.value = false;
+        const record = await table.updateTableData(index, dataKey, value)
+        needEmit && table.emit?.('edit-end', { record, index, key, value })
+        isEdit.value = false
       }
 
       async function handleEnter() {
         if (props.column?.editRow) {
-          return;
+          return
         }
-        handleSubmit();
+        handleSubmit()
       }
 
       function handleCancel() {
-        isEdit.value = false;
-        currentValueRef.value = defaultValueRef.value;
-        table.emit?.('edit-cancel', unref(currentValueRef));
+        isEdit.value = false
+        currentValueRef.value = defaultValueRef.value
+        table.emit?.('edit-cancel', unref(currentValueRef))
       }
 
       function onClickOutside() {
         if (props.column?.editable || unref(getRowEditable)) {
-          return;
+          return
         }
-        const component = unref(getComponent);
+        const component = unref(getComponent)
 
         if (component.includes('Input')) {
-          handleCancel();
+          handleCancel()
         }
       }
 
       // only ApiSelect
       function handleOptionsChange(options: LabelValueOptions) {
-        optionsRef.value = options;
+        optionsRef.value = options
       }
 
       function initCbs(cbs: 'submitCbs' | 'validCbs' | 'cancelCbs', handle: Fn) {
@@ -281,35 +281,35 @@
           /* eslint-disable  */
           isArray(props.record[cbs])
             ? props.record[cbs]?.push(handle)
-            : (props.record[cbs] = [handle]);
+            : (props.record[cbs] = [handle])
         }
       }
 
       if (props.record) {
-        initCbs('submitCbs', handleSubmit);
-        initCbs('validCbs', handleSubmiRule);
-        initCbs('cancelCbs', handleCancel);
+        initCbs('submitCbs', handleSubmit)
+        initCbs('validCbs', handleSubmiRule)
+        initCbs('cancelCbs', handleCancel)
 
         /* eslint-disable  */
         props.record.onCancelEdit = () => {
-          isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach((fn) => fn());
-        };
+          isArray(props.record?.cancelCbs) && props.record?.cancelCbs.forEach(fn => fn())
+        }
         /* eslint-disable */
         props.record.onSubmitEdit = async () => {
           if (isArray(props.record?.submitCbs)) {
-            const validFns = (props.record?.validCbs || []).map((fn) => fn());
+            const validFns = (props.record?.validCbs || []).map(fn => fn())
 
-            const res = await Promise.all(validFns);
+            const res = await Promise.all(validFns)
 
-            const pass = res.every((item) => !!item);
+            const pass = res.every(item => !!item)
 
-            if (!pass) return;
-            const submitFns = props.record?.submitCbs || [];
-            submitFns.forEach((fn) => fn(false, false));
-            table.emit?.('edit-row-end');
-            return true;
+            if (!pass) return
+            const submitFns = props.record?.submitCbs || []
+            submitFns.forEach(fn => fn(false, false))
+            table.emit?.('edit-row-end')
+            return true
           }
-        };
+        }
       }
 
       return {
@@ -331,11 +331,11 @@
         getWrapperStyle,
         getRowEditable,
         getValues,
-        handleEnter,
+        handleEnter
         // getSize,
-      };
-    },
-  });
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-editable-cell';

+ 123 - 123
src/components/Table/src/components/settings/ColumnSetting.vue

@@ -58,8 +58,8 @@
                       `${prefixCls}__fixed-left`,
                       {
                         active: item.fixed === 'left',
-                        disabled: !checkedList.includes(item.value),
-                      },
+                        disabled: !checkedList.includes(item.value)
+                      }
                     ]"
                     @click="handleColumnFixed(item, 'left')"
                   />
@@ -75,8 +75,8 @@
                       `${prefixCls}__fixed-right`,
                       {
                         active: item.fixed === 'right',
-                        disabled: !checkedList.includes(item.value),
-                      },
+                        disabled: !checkedList.includes(item.value)
+                      }
                     ]"
                     @click="handleColumnFixed(item, 'right')"
                   />
@@ -99,34 +99,34 @@
     watchEffect,
     nextTick,
     unref,
-    computed,
-  } from 'vue';
-  import { Tooltip, Popover, Checkbox, Divider } from 'ant-design-vue';
-  import { SettingOutlined, DragOutlined } from '@ant-design/icons-vue';
-  import { Icon } from '/@/components/Icon';
-  import { ScrollContainer } from '/@/components/Container';
+    computed
+  } from 'vue'
+  import { Tooltip, Popover, Checkbox, Divider } from 'ant-design-vue'
+  import { SettingOutlined, DragOutlined } from '@ant-design/icons-vue'
+  import { Icon } from '/@/components/Icon'
+  import { ScrollContainer } from '/@/components/Container'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useTableContext } from '../../hooks/useTableContext';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useSortable } from '/@/hooks/web/useSortable';
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useTableContext } from '../../hooks/useTableContext'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useSortable } from '/@/hooks/web/useSortable'
 
-  import { isNullAndUnDef } from '/@/utils/is';
-  import { getPopupContainer } from '/@/utils';
+  import { isNullAndUnDef } from '/@/utils/is'
+  import { getPopupContainer } from '/@/utils'
 
-  import type { BasicColumn } from '../../types/table';
+  import type { BasicColumn } from '../../types/table'
 
   interface State {
-    indeterminate: boolean;
-    checkAll: boolean;
-    checkedList: string[];
-    defaultCheckList: string[];
+    indeterminate: boolean
+    checkAll: boolean
+    checkedList: string[]
+    defaultCheckList: string[]
   }
 
   interface Options {
-    label: string;
-    value: string;
-    fixed?: boolean | 'left' | 'right';
+    label: string
+    value: string
+    fixed?: boolean | 'left' | 'right'
   }
 
   export default defineComponent({
@@ -140,200 +140,200 @@
       DragOutlined,
       ScrollContainer,
       Divider,
-      Icon,
+      Icon
     },
 
     setup() {
-      const { t } = useI18n();
-      const table = useTableContext();
+      const { t } = useI18n()
+      const table = useTableContext()
 
-      const defaultRowSelection = table.getRowSelection();
-      let inited = false;
+      const defaultRowSelection = table.getRowSelection()
+      let inited = false
 
-      const cachePlainOptions = ref<Options[]>([]);
-      const plainOptions = ref<Options[]>([]);
+      const cachePlainOptions = ref<Options[]>([])
+      const plainOptions = ref<Options[]>([])
 
-      const plainSortOptions = ref<Options[]>([]);
+      const plainSortOptions = ref<Options[]>([])
 
-      const columnListRef = ref<ComponentRef>(null);
+      const columnListRef = ref<ComponentRef>(null)
 
       const state = reactive<State>({
         indeterminate: false,
         checkAll: true,
         checkedList: [],
-        defaultCheckList: [],
-      });
+        defaultCheckList: []
+      })
 
-      const checkIndex = ref(false);
-      const checkSelect = ref(false);
+      const checkIndex = ref(false)
+      const checkSelect = ref(false)
 
-      const { prefixCls } = useDesign('basic-column-setting');
+      const { prefixCls } = useDesign('basic-column-setting')
 
       const getValues = computed(() => {
-        return unref(table?.getBindValues) || {};
-      });
+        return unref(table?.getBindValues) || {}
+      })
 
       watchEffect(() => {
-        const columns = table.getColumns();
+        const columns = table.getColumns()
         if (columns.length) {
-          init();
+          init()
         }
-      });
+      })
 
       watchEffect(() => {
-        const values = unref(getValues);
-        checkIndex.value = !!values.showIndexColumn;
-        checkSelect.value = !!values.rowSelection;
-      });
+        const values = unref(getValues)
+        checkIndex.value = !!values.showIndexColumn
+        checkSelect.value = !!values.rowSelection
+      })
 
       function getColumns() {
-        const ret: Options[] = [];
-        table.getColumns({ ignoreIndex: true, ignoreAction: true }).forEach((item) => {
+        const ret: Options[] = []
+        table.getColumns({ ignoreIndex: true, ignoreAction: true }).forEach(item => {
           ret.push({
             label: (item.title as string) || (item.customTitle as string),
             value: (item.dataIndex || item.title) as string,
-            ...item,
-          });
-        });
-        return ret;
+            ...item
+          })
+        })
+        return ret
       }
 
       function init() {
-        const columns = getColumns();
+        const columns = getColumns()
 
         const checkList = table
           .getColumns()
-          .map((item) => {
+          .map(item => {
             if (item.defaultHidden) {
-              return '';
+              return ''
             }
-            return item.dataIndex || item.title;
+            return item.dataIndex || item.title
           })
-          .filter(Boolean) as string[];
+          .filter(Boolean) as string[]
 
         if (!plainOptions.value.length) {
-          plainOptions.value = columns;
-          plainSortOptions.value = columns;
-          cachePlainOptions.value = columns;
-          state.defaultCheckList = checkList;
+          plainOptions.value = columns
+          plainSortOptions.value = columns
+          cachePlainOptions.value = columns
+          state.defaultCheckList = checkList
         } else {
           // const fixedColumns = columns.filter((item) =>
           //   Reflect.has(item, 'fixed')
           // ) as BasicColumn[];
 
           unref(plainOptions).forEach((item: BasicColumn) => {
-            const findItem = columns.find((col: BasicColumn) => col.dataIndex === item.dataIndex);
+            const findItem = columns.find((col: BasicColumn) => col.dataIndex === item.dataIndex)
             if (findItem) {
-              item.fixed = findItem.fixed;
+              item.fixed = findItem.fixed
             }
-          });
+          })
         }
-        state.checkedList = checkList;
+        state.checkedList = checkList
       }
 
       // checkAll change
       function onCheckAllChange(e: ChangeEvent) {
-        state.indeterminate = false;
-        const checkList = plainOptions.value.map((item) => item.value);
+        state.indeterminate = false
+        const checkList = plainOptions.value.map(item => item.value)
         if (e.target.checked) {
-          state.checkedList = checkList;
-          table.setColumns(checkList);
+          state.checkedList = checkList
+          table.setColumns(checkList)
         } else {
-          state.checkedList = [];
-          table.setColumns([]);
+          state.checkedList = []
+          table.setColumns([])
         }
       }
 
       // Trigger when check/uncheck a column
       function onChange(checkedList: string[]) {
-        const len = plainOptions.value.length;
-        state.indeterminate = !!checkedList.length && checkedList.length < len;
-        state.checkAll = checkedList.length === len;
+        const len = plainOptions.value.length
+        state.indeterminate = !!checkedList.length && checkedList.length < len
+        state.checkAll = checkedList.length === len
 
-        const sortList = unref(plainSortOptions).map((item) => item.value);
+        const sortList = unref(plainSortOptions).map(item => item.value)
         checkedList.sort((prev, next) => {
-          return sortList.indexOf(prev) - sortList.indexOf(next);
-        });
-        table.setColumns(checkedList);
+          return sortList.indexOf(prev) - sortList.indexOf(next)
+        })
+        table.setColumns(checkedList)
       }
 
       // reset columns
       function reset() {
-        state.checkedList = [...state.defaultCheckList];
-        state.checkAll = true;
-        state.indeterminate = false;
-        plainOptions.value = unref(cachePlainOptions);
-        plainSortOptions.value = unref(cachePlainOptions);
-        table.setColumns(table.getCacheColumns());
+        state.checkedList = [...state.defaultCheckList]
+        state.checkAll = true
+        state.indeterminate = false
+        plainOptions.value = unref(cachePlainOptions)
+        plainSortOptions.value = unref(cachePlainOptions)
+        table.setColumns(table.getCacheColumns())
       }
 
       // Open the pop-up window for drag and drop initialization
       function handleVisibleChange() {
-        if (inited) return;
+        if (inited) return
         nextTick(() => {
-          const columnListEl = unref(columnListRef);
-          if (!columnListEl) return;
-          const el = columnListEl.$el;
-          if (!el) return;
+          const columnListEl = unref(columnListRef)
+          if (!columnListEl) return
+          const el = columnListEl.$el
+          if (!el) return
           // Drag and drop sort
           const { initSortable } = useSortable(el, {
             handle: '.table-coulmn-drag-icon ',
-            onEnd: (evt) => {
-              const { oldIndex, newIndex } = evt;
+            onEnd: evt => {
+              const { oldIndex, newIndex } = evt
               if (isNullAndUnDef(oldIndex) || isNullAndUnDef(newIndex) || oldIndex === newIndex) {
-                return;
+                return
               }
               // Sort column
-              const columns = getColumns();
+              const columns = getColumns()
 
               if (oldIndex > newIndex) {
-                columns.splice(newIndex, 0, columns[oldIndex]);
-                columns.splice(oldIndex + 1, 1);
+                columns.splice(newIndex, 0, columns[oldIndex])
+                columns.splice(oldIndex + 1, 1)
               } else {
-                columns.splice(newIndex + 1, 0, columns[oldIndex]);
-                columns.splice(oldIndex, 1);
+                columns.splice(newIndex + 1, 0, columns[oldIndex])
+                columns.splice(oldIndex, 1)
               }
 
-              plainSortOptions.value = columns;
-              plainOptions.value = columns;
-              table.setColumns(columns);
-            },
-          });
-          initSortable();
-          inited = true;
-        });
+              plainSortOptions.value = columns
+              plainOptions.value = columns
+              table.setColumns(columns)
+            }
+          })
+          initSortable()
+          inited = true
+        })
       }
 
       // Control whether the serial number column is displayed
       function handleIndexCheckChange(e: ChangeEvent) {
         table.setProps({
-          showIndexColumn: e.target.checked,
-        });
+          showIndexColumn: e.target.checked
+        })
       }
 
       // Control whether the check box is displayed
       function handleSelectCheckChange(e: ChangeEvent) {
         table.setProps({
-          rowSelection: e.target.checked ? defaultRowSelection : undefined,
-        });
+          rowSelection: e.target.checked ? defaultRowSelection : undefined
+        })
       }
 
       function handleColumnFixed(item: BasicColumn, fixed?: 'left' | 'right') {
-        if (!state.checkedList.includes(item.dataIndex as string)) return;
+        if (!state.checkedList.includes(item.dataIndex as string)) return
 
-        const columns = getColumns() as BasicColumn[];
-        const isFixed = item.fixed === fixed ? false : fixed;
-        const index = columns.findIndex((col) => col.dataIndex === item.dataIndex);
+        const columns = getColumns() as BasicColumn[]
+        const isFixed = item.fixed === fixed ? false : fixed
+        const index = columns.findIndex(col => col.dataIndex === item.dataIndex)
         if (index !== -1) {
-          columns[index].fixed = isFixed;
+          columns[index].fixed = isFixed
         }
-        item.fixed = isFixed;
+        item.fixed = isFixed
 
         if (isFixed && !item.width) {
-          item.width = 100;
+          item.width = 100
         }
-        table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed });
-        table.setColumns(columns);
+        table.setCacheColumnsByField?.(item.dataIndex, { fixed: isFixed })
+        table.setColumns(columns)
       }
 
       return {
@@ -352,10 +352,10 @@
         handleSelectCheckChange,
         defaultRowSelection,
         handleColumnFixed,
-        getPopupContainer,
-      };
-    },
-  });
+        getPopupContainer
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-column-setting';

+ 15 - 15
src/components/Table/src/components/settings/FullScreenSetting.vue

@@ -8,36 +8,36 @@
   </Tooltip>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { useTableContext } from '../../hooks/useTableContext';
-  import { Tooltip } from 'ant-design-vue';
-  import { FullscreenOutlined, FullscreenExitOutlined } from '@ant-design/icons-vue';
-  import { useFullscreen } from '/@/hooks/web/useFullScreen';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { defineComponent } from 'vue'
+  import { useTableContext } from '../../hooks/useTableContext'
+  import { Tooltip } from 'ant-design-vue'
+  import { FullscreenOutlined, FullscreenExitOutlined } from '@ant-design/icons-vue'
+  import { useFullscreen } from '/@/hooks/web/useFullScreen'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'FullScreenSetting',
     components: {
       FullscreenExitOutlined,
       FullscreenOutlined,
-      Tooltip,
+      Tooltip
     },
 
     setup() {
-      const table = useTableContext();
-      const { t } = useI18n();
+      const table = useTableContext()
+      const { t } = useI18n()
 
-      const { toggleFullscreen, isFullscreenRef } = useFullscreen(table.wrapRef);
+      const { toggleFullscreen, isFullscreenRef } = useFullscreen(table.wrapRef)
 
       function handleFullScreen() {
-        toggleFullscreen();
+        toggleFullscreen()
       }
 
       return {
         handleFullScreen,
         isFullscreenRef,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>

+ 13 - 13
src/components/Table/src/components/settings/RedoSetting.vue

@@ -7,31 +7,31 @@
   </Tooltip>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { useTableContext } from '../../hooks/useTableContext';
-  import { Tooltip } from 'ant-design-vue';
-  import { RedoOutlined } from '@ant-design/icons-vue';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { defineComponent } from 'vue'
+  import { useTableContext } from '../../hooks/useTableContext'
+  import { Tooltip } from 'ant-design-vue'
+  import { RedoOutlined } from '@ant-design/icons-vue'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'RedoSetting',
     components: {
       RedoOutlined,
-      Tooltip,
+      Tooltip
     },
 
     setup() {
-      const table = useTableContext();
-      const { t } = useI18n();
+      const table = useTableContext()
+      const { t } = useI18n()
 
       function redo() {
-        table.reload();
+        table.reload()
       }
 
       return {
         redo,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>

+ 18 - 18
src/components/Table/src/components/settings/SizeSetting.vue

@@ -23,14 +23,14 @@
   </Tooltip>
 </template>
 <script lang="ts">
-  import { defineComponent, ref } from 'vue';
-  import { useTableContext } from '../../hooks/useTableContext';
-  import { Tooltip, Dropdown, Menu } from 'ant-design-vue';
-  import { ColumnHeightOutlined } from '@ant-design/icons-vue';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { getPopupContainer } from '/@/utils';
+  import { defineComponent, ref } from 'vue'
+  import { useTableContext } from '../../hooks/useTableContext'
+  import { Tooltip, Dropdown, Menu } from 'ant-design-vue'
+  import { ColumnHeightOutlined } from '@ant-design/icons-vue'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { getPopupContainer } from '/@/utils'
 
-  import type { SizeType } from '../../types/table';
+  import type { SizeType } from '../../types/table'
 
   export default defineComponent({
     name: 'SizeSetting',
@@ -39,27 +39,27 @@
       Tooltip,
       Dropdown,
       Menu,
-      MenuItem: Menu.Item,
+      MenuItem: Menu.Item
     },
     setup() {
-      const table = useTableContext();
-      const { t } = useI18n();
+      const table = useTableContext()
+      const { t } = useI18n()
 
-      const selectedKeysRef = ref<SizeType[]>([table.getSize()]);
+      const selectedKeysRef = ref<SizeType[]>([table.getSize()])
 
       function handleTitleClick({ key }: { key: SizeType }) {
-        selectedKeysRef.value = [key];
+        selectedKeysRef.value = [key]
         table.setProps({
-          size: key,
-        });
+          size: key
+        })
       }
 
       return {
         handleTitleClick,
         selectedKeysRef,
         getPopupContainer,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>

+ 17 - 17
src/components/Table/src/components/settings/index.vue

@@ -7,29 +7,29 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType, computed } from 'vue';
-  import type { TableSetting } from '../../types/table';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import ColumnSetting from './ColumnSetting.vue';
-  import SizeSetting from './SizeSetting.vue';
-  import RedoSetting from './RedoSetting.vue';
-  import FullScreenSetting from './FullScreenSetting.vue';
+  import { defineComponent, PropType, computed } from 'vue'
+  import type { TableSetting } from '../../types/table'
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import ColumnSetting from './ColumnSetting.vue'
+  import SizeSetting from './SizeSetting.vue'
+  import RedoSetting from './RedoSetting.vue'
+  import FullScreenSetting from './FullScreenSetting.vue'
   export default defineComponent({
     name: 'TableSetting',
     components: {
       ColumnSetting,
       SizeSetting,
       RedoSetting,
-      FullScreenSetting,
+      FullScreenSetting
     },
     props: {
       setting: {
         type: Object as PropType<TableSetting>,
-        default: {},
-      },
+        default: {}
+      }
     },
     setup(props) {
-      const { t } = useI18n();
+      const { t } = useI18n()
 
       const getSetting = computed(
         (): TableSetting => {
@@ -38,14 +38,14 @@
             size: true,
             setting: true,
             fullScreen: false,
-            ...props.setting,
-          };
+            ...props.setting
+          }
         }
-      );
+      )
 
-      return { getSetting, t };
-    },
-  });
+      return { getSetting, t }
+    }
+  })
 </script>
 <style lang="less">
   .table-settings {

+ 29 - 29
src/components/Table/src/hooks/usePagination.tsx

@@ -1,40 +1,40 @@
-import type { PaginationProps } from '../types/pagination';
-import type { BasicTableProps } from '../types/table';
+import type { PaginationProps } from '../types/pagination'
+import type { BasicTableProps } from '../types/table'
 
-import { computed, unref, ref, ComputedRef } from 'vue';
-import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
+import { computed, unref, ref, ComputedRef } from 'vue'
+import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue'
 
-import { isBoolean } from '/@/utils/is';
+import { isBoolean } from '/@/utils/is'
 
-import { PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../const';
-import { useI18n } from '/@/hooks/web/useI18n';
+import { PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../const'
+import { useI18n } from '/@/hooks/web/useI18n'
 
 interface ItemRender {
-  page: number;
-  type: 'page' | 'prev' | 'next';
-  originalElement: any;
+  page: number
+  type: 'page' | 'prev' | 'next'
+  originalElement: any
 }
 
 function itemRender({ page, type, originalElement }: ItemRender) {
   if (type === 'prev') {
-    return page === 0 ? null : <LeftOutlined />;
+    return page === 0 ? null : <LeftOutlined />
   } else if (type === 'next') {
-    return page === 1 ? null : <RightOutlined />;
+    return page === 1 ? null : <RightOutlined />
   }
-  return originalElement;
+  return originalElement
 }
 
 export function usePagination(refProps: ComputedRef<BasicTableProps>) {
-  const configRef = ref<PaginationProps>({});
+  const configRef = ref<PaginationProps>({})
 
-  const show = ref(true);
+  const show = ref(true)
 
-  const { t } = useI18n();
+  const { t } = useI18n()
   const getPaginationInfo = computed((): PaginationProps | boolean => {
-    const { pagination } = unref(refProps);
+    const { pagination } = unref(refProps)
 
     if (!unref(show) || (isBoolean(pagination) && !pagination)) {
-      return false;
+      return false
     }
 
     return {
@@ -42,35 +42,35 @@ export function usePagination(refProps: ComputedRef<BasicTableProps>) {
       pageSize: PAGE_SIZE,
       size: 'small',
       defaultPageSize: PAGE_SIZE,
-      showTotal: (total) => t('component.table.total', { total }),
+      showTotal: total => t('component.table.total', { total }),
       showSizeChanger: true,
       pageSizeOptions: PAGE_SIZE_OPTIONS,
       itemRender: itemRender,
       showQuickJumper: true,
       ...(isBoolean(pagination) ? {} : pagination),
-      ...unref(configRef),
-    };
-  });
+      ...unref(configRef)
+    }
+  })
 
   function setPagination(info: Partial<PaginationProps>) {
-    const paginationInfo = unref(getPaginationInfo);
+    const paginationInfo = unref(getPaginationInfo)
     configRef.value = {
       ...(!isBoolean(paginationInfo) ? paginationInfo : {}),
-      ...info,
-    };
+      ...info
+    }
   }
 
   function getPagination() {
-    return unref(getPaginationInfo);
+    return unref(getPaginationInfo)
   }
 
   function getShowPagination() {
-    return unref(show);
+    return unref(show)
   }
 
   async function setShowPagination(flag: boolean) {
-    show.value = flag;
+    show.value = flag
   }
 
-  return { getPagination, getPaginationInfo, setShowPagination, getShowPagination, setPagination };
+  return { getPagination, getPaginationInfo, setShowPagination, getShowPagination, setPagination }
 }

+ 45 - 45
src/components/Time/src/index.vue

@@ -2,108 +2,108 @@
   <span>{{ date }}</span>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, watch } from 'vue';
+  import { defineComponent, ref, watch } from 'vue'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useIntervalFn } from '@vueuse/core';
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useIntervalFn } from '@vueuse/core'
 
-  import { formatToDateTime, formatToDate, dateUtil } from '/@/utils/dateUtil';
-  import { isNumber, isObject, isString } from '/@/utils/is';
-  import { propTypes } from '/@/utils/propTypes';
+  import { formatToDateTime, formatToDate, dateUtil } from '/@/utils/dateUtil'
+  import { isNumber, isObject, isString } from '/@/utils/is'
+  import { propTypes } from '/@/utils/propTypes'
 
-  const ONE_SECONDS = 1000;
-  const ONE_MINUTES = ONE_SECONDS * 60;
-  const ONE_HOUR = ONE_MINUTES * 60;
-  const ONE_DAY = ONE_HOUR * 24;
+  const ONE_SECONDS = 1000
+  const ONE_MINUTES = ONE_SECONDS * 60
+  const ONE_HOUR = ONE_MINUTES * 60
+  const ONE_DAY = ONE_HOUR * 24
   export default defineComponent({
     name: 'Time',
     props: {
       value: propTypes.oneOfType([propTypes.number, propTypes.instanceOf(Date), propTypes.string])
         .isRequired,
       step: propTypes.number.def(60),
-      mode: propTypes.oneOf(['date', 'datetime', 'relative']).def('relative'),
+      mode: propTypes.oneOf(['date', 'datetime', 'relative']).def('relative')
     },
     setup(props) {
-      const date = ref('');
+      const date = ref('')
 
-      const { t } = useI18n();
+      const { t } = useI18n()
 
-      useIntervalFn(setTime, props.step * ONE_SECONDS);
+      useIntervalFn(setTime, props.step * ONE_SECONDS)
 
       watch(
         () => props.value,
         () => {
-          setTime();
+          setTime()
         },
         { immediate: true }
-      );
+      )
 
       function getTime() {
-        const { value } = props;
-        let time = 0;
+        const { value } = props
+        let time = 0
         if (isNumber(value)) {
-          const timestamp = value.toString().length > 10 ? value : value * 1000;
-          time = new Date(timestamp).getTime();
+          const timestamp = value.toString().length > 10 ? value : value * 1000
+          time = new Date(timestamp).getTime()
         } else if (isString(value)) {
-          time = new Date(value).getTime();
+          time = new Date(value).getTime()
         } else if (isObject(value)) {
-          time = value.getTime();
+          time = value.getTime()
         }
-        return time;
+        return time
       }
 
       function setTime() {
-        const { mode, value } = props;
-        const time = getTime();
+        const { mode, value } = props
+        const time = getTime()
         if (mode === 'relative') {
-          date.value = getRelativeTime(time);
+          date.value = getRelativeTime(time)
         } else {
           if (mode === 'datetime') {
-            date.value = formatToDateTime(value);
+            date.value = formatToDateTime(value)
           } else if (mode === 'date') {
-            date.value = formatToDate(value);
+            date.value = formatToDate(value)
           }
         }
       }
 
       function getRelativeTime(timeStamp: number) {
-        const currentTime = new Date().getTime();
+        const currentTime = new Date().getTime()
 
         // Determine whether the incoming timestamp is earlier than the current timestamp
-        const isBefore = dateUtil(timeStamp).isBefore(currentTime);
+        const isBefore = dateUtil(timeStamp).isBefore(currentTime)
 
-        let diff = currentTime - timeStamp;
+        let diff = currentTime - timeStamp
         if (!isBefore) {
-          diff = -diff;
+          diff = -diff
         }
 
-        let resStr = '';
-        let dirStr = isBefore ? t('component.time.before') : t('component.time.after');
+        let resStr = ''
+        let dirStr = isBefore ? t('component.time.before') : t('component.time.after')
 
         if (diff < ONE_SECONDS) {
-          resStr = t('component.time.just');
+          resStr = t('component.time.just')
           // Less than or equal to 59 seconds
         } else if (diff < ONE_MINUTES) {
-          resStr = parseInt(diff / ONE_SECONDS) + t('component.time.seconds') + dirStr;
+          resStr = parseInt(diff / ONE_SECONDS) + t('component.time.seconds') + dirStr
           // More than 59 seconds, less than or equal to 59 minutes and 59 seconds
         } else if (diff >= ONE_MINUTES && diff < ONE_HOUR) {
-          resStr = Math.floor(diff / ONE_MINUTES) + t('component.time.minutes') + dirStr;
+          resStr = Math.floor(diff / ONE_MINUTES) + t('component.time.minutes') + dirStr
           // More than 59 minutes and 59 seconds, less than or equal to 23 hours, 59 minutes and 59 seconds
         } else if (diff >= ONE_HOUR && diff < ONE_DAY) {
-          resStr = Math.floor(diff / ONE_HOUR) + t('component.time.hours') + dirStr;
+          resStr = Math.floor(diff / ONE_HOUR) + t('component.time.hours') + dirStr
           // More than 23 hours, 59 minutes and 59 seconds, less than or equal to 29 days, 59 minutes and 59 seconds
         } else if (diff >= ONE_DAY && diff < 2623860000) {
-          resStr = Math.floor(diff / ONE_DAY) + t('component.time.days') + dirStr;
+          resStr = Math.floor(diff / ONE_DAY) + t('component.time.days') + dirStr
           // More than 29 days, 59 minutes, 59 seconds, less than 364 days, 23 hours, 59 minutes, 59 seconds, and the incoming timestamp is earlier than the current
         } else if (diff >= 2623860000 && diff <= 31567860000 && isBefore) {
-          resStr = dateUtil(timeStamp).format('MM-DD-HH-mm');
+          resStr = dateUtil(timeStamp).format('MM-DD-HH-mm')
         } else {
-          resStr = dateUtil(timeStamp).format('YYYY');
+          resStr = dateUtil(timeStamp).format('YYYY')
         }
-        return resStr;
+        return resStr
       }
 
-      return { date };
-    },
-  });
+      return { date }
+    }
+  })
 </script>

+ 88 - 88
src/components/Tinymce/src/Editor.vue

@@ -19,24 +19,24 @@
     unref,
     watch,
     onUnmounted,
-    onDeactivated,
-  } from 'vue';
-  import { basicProps } from './props';
-  import toolbar from './toolbar';
-  import plugins from './plugins';
-  import { getTinymce } from './getTinymce';
-  import { useScript } from '/@/hooks/web/useScript';
-  import { buildShortUUID } from '/@/utils/uuid';
-  import { bindHandlers } from './helper';
-  import lineHeight from './lineHeight';
-  import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
-  import ImgUpload from './ImgUpload.vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { isNumber } from '/@/utils/is';
-
-  const CDN_URL = 'https://cdn.bootcdn.net/ajax/libs/tinymce/5.5.1';
-
-  const tinymceScriptSrc = `${CDN_URL}/tinymce.min.js`;
+    onDeactivated
+  } from 'vue'
+  import { basicProps } from './props'
+  import toolbar from './toolbar'
+  import plugins from './plugins'
+  import { getTinymce } from './getTinymce'
+  import { useScript } from '/@/hooks/web/useScript'
+  import { buildShortUUID } from '/@/utils/uuid'
+  import { bindHandlers } from './helper'
+  import lineHeight from './lineHeight'
+  import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated'
+  import ImgUpload from './ImgUpload.vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { isNumber } from '/@/utils/is'
+
+  const CDN_URL = 'https://cdn.bootcdn.net/ajax/libs/tinymce/5.5.1'
+
+  const tinymceScriptSrc = `${CDN_URL}/tinymce.min.js`
 
   export default defineComponent({
     name: 'Tinymce',
@@ -45,26 +45,26 @@
     props: basicProps,
     emits: ['change', 'update:modelValue'],
     setup(props, { emit, attrs }) {
-      const editorRef = ref<any>(null);
-      const tinymceId = ref<string>(buildShortUUID('tiny-vue'));
-      const elRef = ref<Nullable<HTMLElement>>(null);
+      const editorRef = ref<any>(null)
+      const tinymceId = ref<string>(buildShortUUID('tiny-vue'))
+      const elRef = ref<Nullable<HTMLElement>>(null)
 
-      const { prefixCls } = useDesign('tinymce-container');
+      const { prefixCls } = useDesign('tinymce-container')
 
       const tinymceContent = computed(() => {
-        return props.modelValue;
-      });
+        return props.modelValue
+      })
 
       const containerWidth = computed(() => {
-        const width = props.width;
+        const width = props.width
         if (isNumber(width)) {
-          return `${width}px`;
+          return `${width}px`
         }
-        return width;
-      });
+        return width
+      })
 
       const initOptions = computed(() => {
-        const { height, options } = props;
+        const { height, options } = props
         return {
           selector: `#${unref(tinymceId)}`,
           base_url: CDN_URL,
@@ -86,70 +86,70 @@
           lineheight_formats: '1 1.5 1.75 2.0 3.0 4.0 5.0',
           ...options,
           setup: (editor: any) => {
-            editorRef.value = editor;
-            editor.on('init', (e: Event) => initSetup(e));
-          },
-        };
-      });
+            editorRef.value = editor
+            editor.on('init', (e: Event) => initSetup(e))
+          }
+        }
+      })
 
       const { toPromise } = useScript({
-        src: tinymceScriptSrc,
-      });
+        src: tinymceScriptSrc
+      })
 
       watch(
         () => attrs.disabled,
         () => {
-          const editor = unref(editorRef);
-          if (!editor) return;
-          editor.setMode(attrs.disabled ? 'readonly' : 'design');
+          const editor = unref(editorRef)
+          if (!editor) return
+          editor.setMode(attrs.disabled ? 'readonly' : 'design')
         }
-      );
+      )
       onMountedOrActivated(() => {
-        tinymceId.value = buildShortUUID('tiny-vue');
+        tinymceId.value = buildShortUUID('tiny-vue')
         nextTick(() => {
-          init();
-        });
-      });
+          init()
+        })
+      })
 
       onUnmounted(() => {
-        destory();
-      });
+        destory()
+      })
 
       onDeactivated(() => {
-        destory();
-      });
+        destory()
+      })
 
       function destory() {
         if (getTinymce() !== null) {
-          getTinymce()?.remove?.(unref(editorRef));
+          getTinymce()?.remove?.(unref(editorRef))
         }
       }
 
       function init() {
         toPromise().then(() => {
           setTimeout(() => {
-            initEditor();
-          }, 0);
-        });
+            initEditor()
+          }, 0)
+        })
       }
 
       function initEditor() {
-        getTinymce().PluginManager.add('lineHeight', lineHeight(getTinymce()));
-        const el = unref(elRef);
+        getTinymce().PluginManager.add('lineHeight', lineHeight(getTinymce()))
+        const el = unref(elRef)
         if (el) {
-          el.style.visibility = '';
+          el.style.visibility = ''
         }
-        getTinymce().init(unref(initOptions));
+        getTinymce().init(unref(initOptions))
       }
 
       function initSetup(e: Event) {
-        const editor = unref(editorRef);
-        if (!editor) return;
-        const value = props.modelValue || '';
+        const editor = unref(editorRef)
+        if (!editor) return
+        const value = props.modelValue || ''
 
-        editor.setContent(value);
-        bindModelHandlers(editor);
-        bindHandlers(e, attrs, unref(editorRef));
+        editor.setContent(value)
+        bindModelHandlers(editor)
+        bindHandlers(e, attrs, unref(editorRef))
       }
 
       function setValue(editor: Recordable, val: string, prevVal?: string) {
@@ -159,56 +159,56 @@
           val !== prevVal &&
           val !== editor.getContent({ format: attrs.outputFormat })
         ) {
-          editor.setContent(val);
+          editor.setContent(val)
         }
       }
 
       function bindModelHandlers(editor: any) {
-        const modelEvents = attrs.modelEvents ? attrs.modelEvents : null;
-        const normalizedEvents = Array.isArray(modelEvents) ? modelEvents.join(' ') : modelEvents;
+        const modelEvents = attrs.modelEvents ? attrs.modelEvents : null
+        const normalizedEvents = Array.isArray(modelEvents) ? modelEvents.join(' ') : modelEvents
 
         watch(
           () => props.modelValue,
           (val: string, prevVal: string) => {
-            setValue(editor, val, prevVal);
+            setValue(editor, val, prevVal)
           }
-        );
+        )
 
         watch(
           () => props.value,
           (val: string, prevVal: string) => {
-            setValue(editor, val, prevVal);
+            setValue(editor, val, prevVal)
           },
           {
-            immediate: true,
+            immediate: true
           }
-        );
+        )
 
         editor.on(normalizedEvents ? normalizedEvents : 'change keyup undo redo', () => {
-          const content = editor.getContent({ format: attrs.outputFormat });
-          emit('update:modelValue', content);
-          emit('change', content);
-        });
+          const content = editor.getContent({ format: attrs.outputFormat })
+          emit('update:modelValue', content)
+          emit('change', content)
+        })
       }
 
       function handleImageUploading(name: string) {
-        const editor = unref(editorRef);
-        if (!editor) return;
-        const content = editor?.getContent() ?? '';
-        setValue(editor, `${content}\n${getImgName(name)}`);
+        const editor = unref(editorRef)
+        if (!editor) return
+        const content = editor?.getContent() ?? ''
+        setValue(editor, `${content}\n${getImgName(name)}`)
       }
 
       function handleDone(name: string, url: string) {
-        const editor = unref(editorRef);
-        if (!editor) return;
+        const editor = unref(editorRef)
+        if (!editor) return
 
-        const content = editor?.getContent() ?? '';
-        const val = content?.replace(getImgName(name), `<img src="${url}"/>`) ?? '';
-        setValue(editor, val);
+        const content = editor?.getContent() ?? ''
+        const val = content?.replace(getImgName(name), `<img src="${url}"/>`) ?? ''
+        setValue(editor, val)
       }
 
       function getImgName(name: string) {
-        return `[uploading:${name}]`;
+        return `[uploading:${name}]`
       }
 
       return {
@@ -221,10 +221,10 @@
         tinymceId,
         handleImageUploading,
         handleDone,
-        editorRef,
-      };
-    },
-  });
+        editorRef
+      }
+    }
+  })
 </script>
 
 <style lang="less" scoped></style>

+ 23 - 23
src/components/Tinymce/src/ImgUpload.vue

@@ -15,40 +15,40 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  import { Upload } from 'ant-design-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useGlobSetting } from '/@/hooks/setting';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { Upload } from 'ant-design-vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useGlobSetting } from '/@/hooks/setting'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'TinymceImageUpload',
     components: { Upload },
     emits: ['uploading', 'done', 'error'],
     setup(_, { emit }) {
-      let uploading = false;
+      let uploading = false
 
-      const { uploadUrl } = useGlobSetting();
-      const { t } = useI18n();
-      const { prefixCls } = useDesign('tinymce-img-upload');
+      const { uploadUrl } = useGlobSetting()
+      const { t } = useI18n()
+      const { prefixCls } = useDesign('tinymce-img-upload')
       function handleChange(info: Recordable) {
-        const file = info.file;
-        const status = file?.status;
+        const file = info.file
+        const status = file?.status
 
-        const url = file?.response?.url;
-        const name = file?.name;
+        const url = file?.response?.url
+        const name = file?.name
         if (status === 'uploading') {
           if (!uploading) {
-            emit('uploading', name);
-            uploading = true;
+            emit('uploading', name)
+            uploading = true
           }
         } else if (status === 'done') {
-          emit('done', name, url);
-          uploading = false;
+          emit('done', name, url)
+          uploading = false
         } else if (status === 'error') {
-          emit('error');
-          uploading = false;
+          emit('error')
+          uploading = false
         }
       }
 
@@ -56,10 +56,10 @@
         prefixCls,
         handleChange,
         uploadUrl,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-tinymce-img-upload';

+ 6 - 6
src/components/Transition/src/CollapseTransition.tsx

@@ -1,8 +1,8 @@
 // collapse 展开折叠
-import { defineComponent } from 'vue';
-import { getSlot } from '/@/utils/helper/tsxHelper';
+import { defineComponent } from 'vue'
+import { getSlot } from '/@/utils/helper/tsxHelper'
 // import { createJavascriptTransition } from './CreateTransition';
-import ExpandTransition from './ExpandTransition.vue';
+import ExpandTransition from './ExpandTransition.vue'
 
 // export const ExpandTransition = createJavascriptTransition(
 //   'expand-transition',
@@ -11,6 +11,6 @@ import ExpandTransition from './ExpandTransition.vue';
 export default defineComponent({
   name: 'CollapseTransition',
   setup(_, { slots }) {
-    return () => <ExpandTransition>{() => getSlot(slots)}</ExpandTransition>;
-  },
-});
+    return () => <ExpandTransition>{() => getSlot(slots)}</ExpandTransition>
+  }
+})

+ 21 - 21
src/components/Transition/src/CreateTransition.tsx

@@ -1,9 +1,9 @@
-import type { PropType } from 'vue';
+import type { PropType } from 'vue'
 
-import { defineComponent, Transition, TransitionGroup } from 'vue';
-import { getSlot } from '/@/utils/helper/tsxHelper';
+import { defineComponent, Transition, TransitionGroup } from 'vue'
+import { getSlot } from '/@/utils/helper/tsxHelper'
 
-type Mode = 'in-out' | 'out-in' | 'default' | undefined;
+type Mode = 'in-out' | 'out-in' | 'default' | undefined
 
 export function createSimpleTransition(name: string, origin = 'top center 0', mode?: Mode) {
   return defineComponent({
@@ -11,32 +11,32 @@ export function createSimpleTransition(name: string, origin = 'top center 0', mo
     props: {
       group: {
         type: Boolean as PropType<boolean>,
-        default: false,
+        default: false
       },
       mode: {
         type: String as PropType<Mode>,
-        default: mode,
+        default: mode
       },
       origin: {
         type: String as PropType<string>,
-        default: origin,
-      },
+        default: origin
+      }
     },
     setup(props, { slots, attrs }) {
       const onBeforeEnter = (el: HTMLElement) => {
-        el.style.transformOrigin = props.origin;
-      };
+        el.style.transformOrigin = props.origin
+      }
 
       return () => {
-        const Tag = !props.group ? Transition : TransitionGroup;
+        const Tag = !props.group ? Transition : TransitionGroup
         return (
           <Tag name={name} mode={props.mode} {...attrs} onBeforeEnter={onBeforeEnter}>
             {() => getSlot(slots)}
           </Tag>
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 }
 export function createJavascriptTransition(
   name: string,
@@ -48,8 +48,8 @@ export function createJavascriptTransition(
     props: {
       mode: {
         type: String as PropType<Mode>,
-        default: mode,
-      },
+        default: mode
+      }
     },
     setup(props, { attrs, slots }) {
       return () => {
@@ -66,8 +66,8 @@ export function createJavascriptTransition(
           >
             {() => getSlot(slots)}
           </Transition>
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 }

+ 41 - 41
src/components/Transition/src/ExpandTransition.vue

@@ -4,80 +4,80 @@
   </transition>
 </template>
 <script lang="ts">
-  import { addClass, removeClass } from '/@/utils/domUtils';
-  import { defineComponent } from 'vue';
+  import { addClass, removeClass } from '/@/utils/domUtils'
+  import { defineComponent } from 'vue'
   export default defineComponent({
     name: 'CollapseTransition',
     setup() {
       return {
         on: {
           beforeEnter(el: any) {
-            addClass(el, 'collapse-transition');
-            if (!el.dataset) el.dataset = {};
+            addClass(el, 'collapse-transition')
+            if (!el.dataset) el.dataset = {}
 
-            el.dataset.oldPaddingTop = el.style.paddingTop;
-            el.dataset.oldPaddingBottom = el.style.paddingBottom;
+            el.dataset.oldPaddingTop = el.style.paddingTop
+            el.dataset.oldPaddingBottom = el.style.paddingBottom
 
-            el.style.height = '0';
-            el.style.paddingTop = 0;
-            el.style.paddingBottom = 0;
+            el.style.height = '0'
+            el.style.paddingTop = 0
+            el.style.paddingBottom = 0
           },
 
           enter(el: any) {
-            el.dataset.oldOverflow = el.style.overflow;
+            el.dataset.oldOverflow = el.style.overflow
             if (el.scrollHeight !== 0) {
-              el.style.height = el.scrollHeight + 'px';
-              el.style.paddingTop = el.dataset.oldPaddingTop;
-              el.style.paddingBottom = el.dataset.oldPaddingBottom;
+              el.style.height = el.scrollHeight + 'px'
+              el.style.paddingTop = el.dataset.oldPaddingTop
+              el.style.paddingBottom = el.dataset.oldPaddingBottom
             } else {
-              el.style.height = '';
-              el.style.paddingTop = el.dataset.oldPaddingTop;
-              el.style.paddingBottom = el.dataset.oldPaddingBottom;
+              el.style.height = ''
+              el.style.paddingTop = el.dataset.oldPaddingTop
+              el.style.paddingBottom = el.dataset.oldPaddingBottom
             }
 
-            el.style.overflow = 'hidden';
+            el.style.overflow = 'hidden'
           },
 
           afterEnter(el: any) {
             // for safari: remove class then reset height is necessary
-            removeClass(el, 'collapse-transition');
-            el.style.height = '';
-            el.style.overflow = el.dataset.oldOverflow;
+            removeClass(el, 'collapse-transition')
+            el.style.height = ''
+            el.style.overflow = el.dataset.oldOverflow
           },
 
           beforeLeave(el: any) {
-            if (!el.dataset) el.dataset = {};
-            el.dataset.oldPaddingTop = el.style.paddingTop;
-            el.dataset.oldPaddingBottom = el.style.paddingBottom;
-            el.dataset.oldOverflow = el.style.overflow;
+            if (!el.dataset) el.dataset = {}
+            el.dataset.oldPaddingTop = el.style.paddingTop
+            el.dataset.oldPaddingBottom = el.style.paddingBottom
+            el.dataset.oldOverflow = el.style.overflow
 
-            el.style.height = el.scrollHeight + 'px';
-            el.style.overflow = 'hidden';
+            el.style.height = el.scrollHeight + 'px'
+            el.style.overflow = 'hidden'
           },
 
           leave(el: any) {
             if (el.scrollHeight !== 0) {
               // for safari: add class after set height, or it will jump to zero height suddenly, weired
-              addClass(el, 'collapse-transition');
+              addClass(el, 'collapse-transition')
               // in vue3.0.4, transitionProperty is set 'none' to avoid 'v-leave-from' issue
-              el.style.transitionProperty = 'height';
-              el.style.height = 0;
-              el.style.paddingTop = 0;
-              el.style.paddingBottom = 0;
+              el.style.transitionProperty = 'height'
+              el.style.height = 0
+              el.style.paddingTop = 0
+              el.style.paddingBottom = 0
             }
           },
 
           afterLeave(el: any) {
-            removeClass(el, 'collapse-transition');
-            el.style.height = '';
-            el.style.overflow = el.dataset.oldOverflow;
-            el.style.paddingTop = el.dataset.oldPaddingTop;
-            el.style.paddingBottom = el.dataset.oldPaddingBottom;
-          },
-        },
-      };
-    },
-  });
+            removeClass(el, 'collapse-transition')
+            el.style.height = ''
+            el.style.overflow = el.dataset.oldOverflow
+            el.style.paddingTop = el.dataset.oldPaddingTop
+            el.style.paddingBottom = el.dataset.oldPaddingBottom
+          }
+        }
+      }
+    }
+  })
 </script>
 <style lang="less" scoped>
   .collapse-transition {

+ 41 - 41
src/components/Tree/src/TreeHeader.vue

@@ -23,22 +23,22 @@
   </div>
 </template>
 <script lang="ts">
-  import type { PropType } from 'vue';
-  import { defineComponent, computed } from 'vue';
+  import type { PropType } from 'vue'
+  import { defineComponent, computed } from 'vue'
 
-  import { Dropdown, Menu, Input } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
-  import { BasicTitle } from '/@/components/Basic';
+  import { Dropdown, Menu, Input } from 'ant-design-vue'
+  import { Icon } from '/@/components/Icon'
+  import { BasicTitle } from '/@/components/Basic'
 
-  import { propTypes } from '/@/utils/propTypes';
+  import { propTypes } from '/@/utils/propTypes'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import { useDebounce } from '/@/hooks/core/useDebounce';
+  import { useI18n } from '/@/hooks/web/useI18n'
+  import { useDebounce } from '/@/hooks/core/useDebounce'
 
-  import { ToolbarEnum } from './enum';
+  import { ToolbarEnum } from './enum'
 
   interface MenuInfo {
-    key: ToolbarEnum;
+    key: ToolbarEnum
   }
   export default defineComponent({
     name: 'BasicTreeHeader',
@@ -49,34 +49,34 @@
       Menu,
       MenuItem: Menu.Item,
       MenuDivider: Menu.Divider,
-      InputSearch: Input.Search,
+      InputSearch: Input.Search
     },
     props: {
       helpMessage: {
         type: [String, Array] as PropType<string | string[]>,
-        default: '',
+        default: ''
       },
       title: propTypes.string,
       toolbar: propTypes.bool,
       checkable: propTypes.bool,
       search: propTypes.bool,
       checkAll: propTypes.func,
-      expandAll: propTypes.func,
+      expandAll: propTypes.func
     },
     emits: ['strictly-change', 'search'],
     setup(props, { emit }) {
-      const { t } = useI18n();
+      const { t } = useI18n()
 
       const toolbarList = computed(() => {
-        const { checkable } = props;
+        const { checkable } = props
         const defaultToolbarList = [
           { label: t('component.tree.expandAll'), value: ToolbarEnum.EXPAND_ALL },
           {
             label: t('component.tree.unExpandAll'),
             value: ToolbarEnum.UN_EXPAND_ALL,
-            divider: checkable,
-          },
-        ];
+            divider: checkable
+          }
+        ]
 
         return checkable
           ? [
@@ -84,49 +84,49 @@
               {
                 label: t('component.tree.unSelectAll'),
                 value: ToolbarEnum.UN_SELECT_ALL,
-                divider: checkable,
+                divider: checkable
               },
               ...defaultToolbarList,
               { label: t('component.tree.checkStrictly'), value: ToolbarEnum.CHECK_STRICTLY },
-              { label: t('component.tree.checkUnStrictly'), value: ToolbarEnum.CHE },
+              { label: t('component.tree.checkUnStrictly'), value: ToolbarEnum.CHE }
             ]
-          : defaultToolbarList;
-      });
+          : defaultToolbarList
+      })
 
       function handleMenuClick(e: MenuInfo) {
-        const { key } = e;
+        const { key } = e
         switch (key) {
           case ToolbarEnum.SELECT_ALL:
-            props.checkAll?.(true);
-            break;
+            props.checkAll?.(true)
+            break
           case ToolbarEnum.UN_SELECT_ALL:
-            props.checkAll?.(false);
-            break;
+            props.checkAll?.(false)
+            break
           case ToolbarEnum.EXPAND_ALL:
-            props.expandAll?.(true);
-            break;
+            props.expandAll?.(true)
+            break
           case ToolbarEnum.UN_EXPAND_ALL:
-            props.expandAll?.(false);
-            break;
+            props.expandAll?.(false)
+            break
           case ToolbarEnum.CHECK_STRICTLY:
-            emit('strictly-change', false);
-            break;
+            emit('strictly-change', false)
+            break
           case ToolbarEnum.CHECK_UN_STRICTLY:
-            emit('strictly-change', true);
-            break;
+            emit('strictly-change', true)
+            break
         }
       }
 
       function emitChange(value?: string): void {
-        emit('search', value);
+        emit('search', value)
       }
-      const [debounceEmitChange] = useDebounce(emitChange, 200);
+      const [debounceEmitChange] = useDebounce(emitChange, 200)
 
       function handleSearch(e: ChangeEvent): void {
-        debounceEmitChange(e.target.value);
+        debounceEmitChange(e.target.value)
       }
 
-      return { t, toolbarList, handleMenuClick, handleSearch };
-    },
-  });
+      return { t, toolbarList, handleMenuClick, handleSearch }
+    }
+  })
 </script>

+ 121 - 121
src/components/Tree/src/index.vue

@@ -1,5 +1,5 @@
 <script lang="tsx">
-  import type { ReplaceFields, Keys, CheckKeys, TreeActionType, TreeItem } from './types';
+  import type { ReplaceFields, Keys, CheckKeys, TreeActionType, TreeItem } from './types'
 
   import {
     defineComponent,
@@ -10,30 +10,30 @@
     watchEffect,
     toRaw,
     watch,
-    CSSProperties,
-  } from 'vue';
-  import { Tree, Empty } from 'ant-design-vue';
-  import { TreeIcon } from './TreeIcon';
-  import TreeHeader from './TreeHeader.vue';
-  import { ScrollContainer } from '/@/components/Container';
+    CSSProperties
+  } from 'vue'
+  import { Tree, Empty } from 'ant-design-vue'
+  import { TreeIcon } from './TreeIcon'
+  import TreeHeader from './TreeHeader.vue'
+  import { ScrollContainer } from '/@/components/Container'
 
-  import { omit, get } from 'lodash-es';
-  import { isBoolean, isFunction } from '/@/utils/is';
-  import { extendSlots, getSlot } from '/@/utils/helper/tsxHelper';
-  import { filter } from '/@/utils/helper/treeHelper';
+  import { omit, get } from 'lodash-es'
+  import { isBoolean, isFunction } from '/@/utils/is'
+  import { extendSlots, getSlot } from '/@/utils/helper/tsxHelper'
+  import { filter } from '/@/utils/helper/treeHelper'
 
-  import { useTree } from './useTree';
-  import { useContextMenu, ContextMenuItem } from '/@/hooks/web/useContextMenu';
-  import { useExpose } from '/@/hooks/core/useExpose';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTree } from './useTree'
+  import { useContextMenu, ContextMenuItem } from '/@/hooks/web/useContextMenu'
+  import { useExpose } from '/@/hooks/core/useExpose'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
-  import { basicProps } from './props';
+  import { basicProps } from './props'
 
   interface State {
-    expandedKeys: Keys;
-    selectedKeys: Keys;
-    checkedKeys: CheckKeys;
-    checkStrictly: boolean;
+    expandedKeys: Keys
+    selectedKeys: Keys
+    checkedKeys: CheckKeys
+    checkStrictly: boolean
   }
   export default defineComponent({
     name: 'BasicTree',
@@ -45,30 +45,30 @@
         checkStrictly: props.checkStrictly,
         expandedKeys: props.expandedKeys || [],
         selectedKeys: props.selectedKeys || [],
-        checkedKeys: props.checkedKeys || [],
-      });
+        checkedKeys: props.checkedKeys || []
+      })
 
       const searchState = reactive({
         startSearch: false,
-        searchData: [] as TreeItem[],
-      });
+        searchData: [] as TreeItem[]
+      })
 
-      const treeDataRef = ref<TreeItem[]>([]);
+      const treeDataRef = ref<TreeItem[]>([])
 
-      const [createContextMenu] = useContextMenu();
-      const { prefixCls } = useDesign('basic-tree');
+      const [createContextMenu] = useContextMenu()
+      const { prefixCls } = useDesign('basic-tree')
 
       const getReplaceFields = computed(
         (): Required<ReplaceFields> => {
-          const { replaceFields } = props;
+          const { replaceFields } = props
           return {
             children: 'children',
             title: 'title',
             key: 'key',
-            ...replaceFields,
-          };
+            ...replaceFields
+          }
         }
-      );
+      )
 
       const getBindValues = computed(() => {
         let propsData = {
@@ -81,150 +81,150 @@
           checkStrictly: state.checkStrictly,
           replaceFields: unref(getReplaceFields),
           'onUpdate:expandedKeys': (v: Keys) => {
-            state.expandedKeys = v;
-            emit('update:expandedKeys', v);
+            state.expandedKeys = v
+            emit('update:expandedKeys', v)
           },
           'onUpdate:selectedKeys': (v: Keys) => {
-            state.selectedKeys = v;
-            emit('update:selectedKeys', v);
+            state.selectedKeys = v
+            emit('update:selectedKeys', v)
           },
           onCheck: (v: CheckKeys) => {
-            state.checkedKeys = v;
-            const rawVal = toRaw(v);
-            emit('change', rawVal);
-            emit('update:value', rawVal);
+            state.checkedKeys = v
+            const rawVal = toRaw(v)
+            emit('change', rawVal)
+            emit('update:value', rawVal)
           },
-          onRightClick: handleRightClick,
-        };
-        propsData = omit(propsData, 'treeData', 'class');
-        return propsData;
-      });
+          onRightClick: handleRightClick
+        }
+        propsData = omit(propsData, 'treeData', 'class')
+        return propsData
+      })
 
       const getTreeData = computed((): TreeItem[] =>
         searchState.startSearch ? searchState.searchData : unref(treeDataRef)
-      );
+      )
 
       const getNotFound = computed((): boolean => {
-        return searchState.startSearch && searchState.searchData?.length === 0;
-      });
+        return searchState.startSearch && searchState.searchData?.length === 0
+      })
 
       const {
         deleteNodeByKey,
         insertNodeByKey,
         filterByLevel,
         updateNodeByKey,
-        getAllKeys,
-      } = useTree(treeDataRef, getReplaceFields);
+        getAllKeys
+      } = useTree(treeDataRef, getReplaceFields)
 
       function getIcon(params: Recordable, icon?: string) {
         if (!icon) {
           if (props.renderIcon && isFunction(props.renderIcon)) {
-            return props.renderIcon(params);
+            return props.renderIcon(params)
           }
         }
-        return icon;
+        return icon
       }
 
       async function handleRightClick({ event, node }: Recordable) {
-        const { rightMenuList: menuList = [], beforeRightClick } = props;
-        let rightMenuList: ContextMenuItem[] = [];
+        const { rightMenuList: menuList = [], beforeRightClick } = props
+        let rightMenuList: ContextMenuItem[] = []
 
         if (beforeRightClick && isFunction(beforeRightClick)) {
-          rightMenuList = await beforeRightClick(node);
+          rightMenuList = await beforeRightClick(node)
         } else {
-          rightMenuList = menuList;
+          rightMenuList = menuList
         }
-        if (!rightMenuList.length) return;
+        if (!rightMenuList.length) return
         createContextMenu({
           event,
-          items: rightMenuList,
-        });
+          items: rightMenuList
+        })
       }
 
       function setExpandedKeys(keys: Keys) {
-        state.expandedKeys = keys;
+        state.expandedKeys = keys
       }
 
       function getExpandedKeys() {
-        return state.expandedKeys;
+        return state.expandedKeys
       }
       function setSelectedKeys(keys: Keys) {
-        state.selectedKeys = keys;
+        state.selectedKeys = keys
       }
 
       function getSelectedKeys() {
-        return state.selectedKeys;
+        return state.selectedKeys
       }
 
       function setCheckedKeys(keys: CheckKeys) {
-        state.checkedKeys = keys;
+        state.checkedKeys = keys
       }
 
       function getCheckedKeys() {
-        return state.checkedKeys;
+        return state.checkedKeys
       }
 
       function checkAll(checkAll: boolean) {
-        state.checkedKeys = checkAll ? getAllKeys() : ([] as Keys);
+        state.checkedKeys = checkAll ? getAllKeys() : ([] as Keys)
       }
 
       function expandAll(expandAll: boolean) {
-        state.expandedKeys = expandAll ? getAllKeys() : ([] as Keys);
+        state.expandedKeys = expandAll ? getAllKeys() : ([] as Keys)
       }
 
       function onStrictlyChange(strictly: boolean) {
-        state.checkStrictly = strictly;
+        state.checkStrictly = strictly
       }
 
       function handleSearch(searchValue: string) {
         if (!searchValue) {
-          searchState.startSearch = false;
-          return;
+          searchState.startSearch = false
+          return
         }
-        searchState.startSearch = true;
-        const { title: titleField } = unref(getReplaceFields);
+        searchState.startSearch = true
+        const { title: titleField } = unref(getReplaceFields)
 
-        searchState.searchData = filter(unref(treeDataRef), (node) => {
-          return node[titleField]?.includes(searchValue) ?? false;
-        });
+        searchState.searchData = filter(unref(treeDataRef), node => {
+          return node[titleField]?.includes(searchValue) ?? false
+        })
       }
 
       function handleClickNode(key: string, children: TreeItem[]) {
-        if (!props.clickRowToExpand || !children || children.length === 0) return;
+        if (!props.clickRowToExpand || !children || children.length === 0) return
         if (!state.expandedKeys.includes(key)) {
-          setExpandedKeys([...state.expandedKeys, key]);
+          setExpandedKeys([...state.expandedKeys, key])
         } else {
-          const keys = [...state.expandedKeys];
-          const index = keys.findIndex((item) => item === key);
+          const keys = [...state.expandedKeys]
+          const index = keys.findIndex(item => item === key)
           if (index !== -1) {
-            keys.splice(index, 1);
+            keys.splice(index, 1)
           }
-          setExpandedKeys(keys);
+          setExpandedKeys(keys)
         }
       }
 
       watchEffect(() => {
-        treeDataRef.value = props.treeData as TreeItem[];
-      });
+        treeDataRef.value = props.treeData as TreeItem[]
+      })
 
       watchEffect(() => {
-        state.expandedKeys = props.expandedKeys;
-      });
+        state.expandedKeys = props.expandedKeys
+      })
 
       watchEffect(() => {
-        state.selectedKeys = props.selectedKeys;
-      });
+        state.selectedKeys = props.selectedKeys
+      })
 
       watchEffect(() => {
-        state.checkedKeys = props.checkedKeys;
-      });
+        state.checkedKeys = props.checkedKeys
+      })
 
       watch(
         () => props.value,
         () => {
-          state.checkedKeys = toRaw(props.value || []);
+          state.checkedKeys = toRaw(props.value || [])
         }
-      );
+      )
 
       // watchEffect(() => {
       //   console.log('======================');
@@ -236,8 +236,8 @@
       // });
 
       watchEffect(() => {
-        state.checkStrictly = props.checkStrictly;
-      });
+        state.checkStrictly = props.checkStrictly
+      })
 
       const instance: TreeActionType = {
         setExpandedKeys,
@@ -252,45 +252,45 @@
         checkAll,
         expandAll,
         filterByLevel: (level: number) => {
-          state.expandedKeys = filterByLevel(level);
-        },
-      };
+          state.expandedKeys = filterByLevel(level)
+        }
+      }
 
-      useExpose<TreeActionType>(instance);
+      useExpose<TreeActionType>(instance)
 
       function renderAction(node: TreeItem) {
-        const { actionList } = props;
-        if (!actionList || actionList.length === 0) return;
+        const { actionList } = props
+        if (!actionList || actionList.length === 0) return
         return actionList.map((item, index) => {
-          let nodeShow = true;
+          let nodeShow = true
           if (isFunction(item.show)) {
-            nodeShow = item.show?.(node);
+            nodeShow = item.show?.(node)
           } else if (isBoolean(item.show)) {
-            nodeShow = item.show;
+            nodeShow = item.show
           }
 
-          if (!nodeShow) return null;
+          if (!nodeShow) return null
 
           return (
             <span key={index} class={`${prefixCls}__action`}>
               {item.render(node)}
             </span>
-          );
-        });
+          )
+        })
       }
 
       function renderTreeNode({ data, level }: { data: TreeItem[] | undefined; level: number }) {
         if (!data) {
-          return null;
+          return null
         }
-        return data.map((item) => {
+        return data.map(item => {
           const { title: titleField, key: keyField, children: childrenField } = unref(
             getReplaceFields
-          );
+          )
 
-          const propsData = omit(item, 'title');
-          const icon = getIcon({ ...item, level }, item.icon);
-          const children = get(item, childrenField) || [];
+          const propsData = omit(item, 'title')
+          const icon = getIcon({ ...item, level }, item.icon)
+          const children = get(item, childrenField) || []
           return (
             <Tree.TreeNode {...propsData} node={toRaw(item)} key={get(item, keyField)}>
               {{
@@ -312,16 +312,16 @@
                     )}
                   </span>
                 ),
-                default: () => renderTreeNode({ data: children, level: level + 1 }),
+                default: () => renderTreeNode({ data: children, level: level + 1 })
               }}
             </Tree.TreeNode>
-          );
-        });
+          )
+        })
       }
       return () => {
-        const { title, helpMessage, toolbar, search, checkable } = props;
-        const showTitle = title || toolbar || search;
-        const scrollStyle: CSSProperties = { height: 'calc(100% - 38px)' };
+        const { title, helpMessage, toolbar, search, checkable } = props
+        const showTitle = title || toolbar || search
+        const scrollStyle: CSSProperties = { height: 'calc(100% - 38px)' }
         return (
           <div class={[prefixCls, 'h-full bg-white', attrs.class]}>
             {showTitle && (
@@ -342,17 +342,17 @@
                 {{
                   // switcherIcon: () => <DownOutlined />,
                   default: () => renderTreeNode({ data: unref(getTreeData), level: 1 }),
-                  ...extendSlots(slots),
+                  ...extendSlots(slots)
                 }}
               </Tree>
             </ScrollContainer>
 
             <Empty v-show={unref(getNotFound)} class="!mt-4" />
           </div>
-        );
-      };
-    },
-  });
+        )
+      }
+    }
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-tree';

+ 30 - 30
src/components/Upload/src/BasicUpload.vue

@@ -35,18 +35,18 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, watch, unref, computed } from 'vue';
+  import { defineComponent, ref, watch, unref, computed } from 'vue'
 
-  import UploadModal from './UploadModal.vue';
-  import UploadPreviewModal from './UploadPreviewModal.vue';
-  import Icon from '/@/components/Icon';
-  import { Tooltip } from 'ant-design-vue';
+  import UploadModal from './UploadModal.vue'
+  import UploadPreviewModal from './UploadPreviewModal.vue'
+  import Icon from '/@/components/Icon'
+  import { Tooltip } from 'ant-design-vue'
 
-  import { useModal } from '/@/components/Modal';
+  import { useModal } from '/@/components/Modal'
 
-  import { uploadContainerProps } from './props';
-  import { omit } from 'lodash-es';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { uploadContainerProps } from './props'
+  import { omit } from 'lodash-es'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'BasicUpload',
@@ -55,44 +55,44 @@
     emits: ['change'],
 
     setup(props, { emit, attrs }) {
-      const { t } = useI18n();
+      const { t } = useI18n()
       // 上传modal
-      const [registerUploadModal, { openModal: openUploadModal }] = useModal();
+      const [registerUploadModal, { openModal: openUploadModal }] = useModal()
 
       //   预览modal
-      const [registerPreviewModal, { openModal: openPreviewModal }] = useModal();
+      const [registerPreviewModal, { openModal: openPreviewModal }] = useModal()
 
-      const fileListRef = ref<string[]>([]);
+      const fileListRef = ref<string[]>([])
 
       const showPreview = computed(() => {
-        const { emptyHidePreview } = props;
-        if (!emptyHidePreview) return true;
-        return emptyHidePreview ? fileListRef.value.length > 0 : true;
-      });
+        const { emptyHidePreview } = props
+        if (!emptyHidePreview) return true
+        return emptyHidePreview ? fileListRef.value.length > 0 : true
+      })
 
       const bindValue = computed(() => {
-        const value = { ...attrs, ...props };
-        return omit(value, 'onChange');
-      });
+        const value = { ...attrs, ...props }
+        return omit(value, 'onChange')
+      })
 
       watch(
         () => props.value,
         (value = []) => {
-          fileListRef.value = value;
+          fileListRef.value = value
         },
         { immediate: true }
-      );
+      )
 
       // 上传modal保存操作
       function handleChange(urls: string[]) {
-        fileListRef.value = [...unref(fileListRef), ...(urls || [])];
-        emit('change', fileListRef.value);
+        fileListRef.value = [...unref(fileListRef), ...(urls || [])]
+        emit('change', fileListRef.value)
       }
 
       // 预览modal保存操作
       function handlePreviewChange(urls: string[]) {
-        fileListRef.value = [...(urls || [])];
-        emit('change', fileListRef.value);
+        fileListRef.value = [...(urls || [])]
+        emit('change', fileListRef.value)
       }
 
       return {
@@ -105,8 +105,8 @@
         fileListRef,
         showPreview,
         bindValue,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>

+ 28 - 28
src/components/Upload/src/FileList.tsx

@@ -1,48 +1,48 @@
-import { defineComponent, CSSProperties, watch, nextTick } from 'vue';
-import { fileListProps } from './props';
-import { isFunction } from '/@/utils/is';
-import './FileList.less';
-import { useModalContext } from '/@/components/Modal/src/hooks/useModalContext';
+import { defineComponent, CSSProperties, watch, nextTick } from 'vue'
+import { fileListProps } from './props'
+import { isFunction } from '/@/utils/is'
+import './FileList.less'
+import { useModalContext } from '/@/components/Modal/src/hooks/useModalContext'
 
 export default defineComponent({
   name: 'FileList',
   props: fileListProps,
   setup(props) {
-    const modalFn = useModalContext();
+    const modalFn = useModalContext()
     watch(
       () => props.dataSource,
       () => {
         nextTick(() => {
-          modalFn?.redoModalHeight?.();
-        });
+          modalFn?.redoModalHeight?.()
+        })
       }
-    );
+    )
     return () => {
-      const { columns, actionColumn, dataSource } = props;
-      const columnList = [...columns, actionColumn];
+      const { columns, actionColumn, dataSource } = props
+      const columnList = [...columns, actionColumn]
       return (
         <table class="file-table">
           <colgroup>
-            {columnList.map((item) => {
-              const { width = 0, dataIndex } = item;
+            {columnList.map(item => {
+              const { width = 0, dataIndex } = item
 
               const style: CSSProperties = {
                 width: `${width}px`,
-                minWidth: `${width}px`,
-              };
+                minWidth: `${width}px`
+              }
 
-              return <col style={width ? style : {}} key={dataIndex} />;
+              return <col style={width ? style : {}} key={dataIndex} />
             })}
           </colgroup>
           <thead>
             <tr class="file-table-tr">
-              {columnList.map((item) => {
-                const { title = '', align = 'center', dataIndex } = item;
+              {columnList.map(item => {
+                const { title = '', align = 'center', dataIndex } = item
                 return (
                   <th class={['file-table-th', align]} key={dataIndex}>
                     {title}
                   </th>
-                );
+                )
               })}
             </tr>
           </thead>
@@ -50,23 +50,23 @@ export default defineComponent({
             {dataSource.map((record = {}, index) => {
               return (
                 <tr class="file-table-tr" key={`${index + record.name || ''}`}>
-                  {columnList.map((item) => {
-                    const { dataIndex = '', customRender, align = 'center' } = item;
-                    const render = customRender && isFunction(customRender);
+                  {columnList.map(item => {
+                    const { dataIndex = '', customRender, align = 'center' } = item
+                    const render = customRender && isFunction(customRender)
                     return (
                       <td class={['file-table-td', align]} key={dataIndex}>
                         {render
                           ? customRender?.({ text: record[dataIndex], record })
                           : record[dataIndex]}
                       </td>
-                    );
+                    )
                   })}
                 </tr>
-              );
+              )
             })}
           </tbody>
         </table>
-      );
-    };
-  },
-});
+      )
+    }
+  }
+})

+ 6 - 6
src/components/Upload/src/ThumbUrl.vue

@@ -4,17 +4,17 @@
   </span>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { propTypes } from '/@/utils/propTypes';
-  import { Image } from 'ant-design-vue';
+  import { defineComponent } from 'vue'
+  import { propTypes } from '/@/utils/propTypes'
+  import { Image } from 'ant-design-vue'
 
   export default defineComponent({
     components: { Image },
     props: {
       fileUrl: propTypes.string.def(''),
-      fileName: propTypes.string.def(''),
-    },
-  });
+      fileName: propTypes.string.def('')
+    }
+  })
 </script>
 <style lang="less">
   .thumb {

+ 99 - 101
src/components/Upload/src/UploadModal.vue

@@ -42,99 +42,97 @@
   </BasicModal>
 </template>
 <script lang="ts">
-  import { defineComponent, reactive, ref, toRefs, unref, computed, PropType } from 'vue';
-  import { Upload, Alert } from 'ant-design-vue';
-  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import { defineComponent, reactive, ref, toRefs, unref, computed, PropType } from 'vue'
+  import { Upload, Alert } from 'ant-design-vue'
+  import { BasicModal, useModalInner } from '/@/components/Modal'
   //   import { BasicTable, useTable } from '/@/components/Table';
   // hooks
-  import { useUploadType } from './useUpload';
-  import { useMessage } from '/@/hooks/web/useMessage';
+  import { useUploadType } from './useUpload'
+  import { useMessage } from '/@/hooks/web/useMessage'
   //   types
-  import { FileItem, UploadResultStatus } from './types';
-  import { basicProps } from './props';
-  import { createTableColumns, createActionColumn } from './data';
+  import { FileItem, UploadResultStatus } from './types'
+  import { basicProps } from './props'
+  import { createTableColumns, createActionColumn } from './data'
   // utils
-  import { checkFileType, checkImgType, getBase64WithFile } from './helper';
-  import { buildUUID } from '/@/utils/uuid';
-  import { isFunction } from '/@/utils/is';
-  import { warn } from '/@/utils/log';
-  import FileList from './FileList';
+  import { checkFileType, checkImgType, getBase64WithFile } from './helper'
+  import { buildUUID } from '/@/utils/uuid'
+  import { isFunction } from '/@/utils/is'
+  import { warn } from '/@/utils/log'
+  import FileList from './FileList'
 
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { useI18n } from '/@/hooks/web/useI18n'
   export default defineComponent({
     components: { BasicModal, Upload, Alert, FileList },
     props: {
       ...basicProps,
       previewFileList: {
         type: Array as PropType<string[]>,
-        default: () => [],
-      },
+        default: () => []
+      }
     },
     emits: ['change', 'register'],
     setup(props, { emit }) {
-      const { t } = useI18n();
+      const { t } = useI18n()
 
       //   是否正在上传
-      const isUploadingRef = ref(false);
-      const fileListRef = ref<FileItem[]>([]);
+      const isUploadingRef = ref(false)
+      const fileListRef = ref<FileItem[]>([])
       const state = reactive<{ fileList: FileItem[] }>({
-        fileList: [],
-      });
+        fileList: []
+      })
 
-      const [register, { closeModal }] = useModalInner();
+      const [register, { closeModal }] = useModalInner()
 
-      const { accept, helpText, maxNumber, maxSize } = toRefs(props);
+      const { accept, helpText, maxNumber, maxSize } = toRefs(props)
       const { getAccept, getStringAccept, getHelpText } = useUploadType({
         acceptRef: accept,
         helpTextRef: helpText,
         maxNumberRef: maxNumber,
-        maxSizeRef: maxSize,
-      });
+        maxSizeRef: maxSize
+      })
 
-      const { createMessage } = useMessage();
+      const { createMessage } = useMessage()
 
       const getIsSelectFile = computed(() => {
         return (
           fileListRef.value.length > 0 &&
-          !fileListRef.value.every((item) => item.status === UploadResultStatus.SUCCESS)
-        );
-      });
+          !fileListRef.value.every(item => item.status === UploadResultStatus.SUCCESS)
+        )
+      })
 
       const getOkButtonProps = computed(() => {
         const someSuccess = fileListRef.value.some(
-          (item) => item.status === UploadResultStatus.SUCCESS
-        );
+          item => item.status === UploadResultStatus.SUCCESS
+        )
         return {
-          disabled: isUploadingRef.value || fileListRef.value.length === 0 || !someSuccess,
-        };
-      });
+          disabled: isUploadingRef.value || fileListRef.value.length === 0 || !someSuccess
+        }
+      })
 
       const getUploadBtnText = computed(() => {
-        const someError = fileListRef.value.some(
-          (item) => item.status === UploadResultStatus.ERROR
-        );
+        const someError = fileListRef.value.some(item => item.status === UploadResultStatus.ERROR)
         return isUploadingRef.value
           ? t('component.upload.uploading')
           : someError
           ? t('component.upload.reUploadFailed')
-          : t('component.upload.startUpload');
-      });
+          : t('component.upload.startUpload')
+      })
 
       // 上传前校验
       function beforeUpload(file: File) {
-        const { size, name } = file;
-        const { maxSize } = props;
-        const accept = unref(getAccept);
+        const { size, name } = file
+        const { maxSize } = props
+        const accept = unref(getAccept)
         // 设置最大值,则判断
         if (maxSize && file.size / 1024 / 1024 >= maxSize) {
-          createMessage.error(t('component.upload.maxSizeMultiple', [maxSize]));
-          return false;
+          createMessage.error(t('component.upload.maxSizeMultiple', [maxSize]))
+          return false
         }
 
         // 设置类型,则判断
         if (accept.length > 0 && !checkFileType(file, accept)) {
-          createMessage.error!(t('component.upload.acceptUpload', [accept.join(',')]));
-          return false;
+          createMessage.error!(t('component.upload.acceptUpload', [accept.join(',')]))
+          return false
         }
         const commonItem = {
           uuid: buildUUID(),
@@ -142,8 +140,8 @@
           size,
           name,
           percent: 0,
-          type: name.split('.').pop(),
-        };
+          type: name.split('.').pop()
+        }
         // 生成图片缩略图
         if (checkImgType(file)) {
           // beforeUpload,如果异步会调用自带上传方法
@@ -153,19 +151,19 @@
               ...unref(fileListRef),
               {
                 thumbUrl,
-                ...commonItem,
-              },
-            ];
-          });
+                ...commonItem
+              }
+            ]
+          })
         } else {
-          fileListRef.value = [...unref(fileListRef), commonItem];
+          fileListRef.value = [...unref(fileListRef), commonItem]
         }
-        return false;
+        return false
       }
       // 删除
       function handleRemove(record: FileItem) {
-        const index = fileListRef.value.findIndex((item) => item.uuid === record.uuid);
-        index !== -1 && fileListRef.value.splice(index, 1);
+        const index = fileListRef.value.findIndex(item => item.uuid === record.uuid)
+        index !== -1 && fileListRef.value.splice(index, 1)
       }
 
       // 预览
@@ -177,99 +175,99 @@
       // }
 
       async function uploadApiByItem(item: FileItem) {
-        const { api } = props;
+        const { api } = props
         if (!api || !isFunction(api)) {
-          return warn('upload api must exist and be a function');
+          return warn('upload api must exist and be a function')
         }
         try {
-          item.status = UploadResultStatus.UPLOADING;
+          item.status = UploadResultStatus.UPLOADING
           const { data } = await props.api?.(
             {
               ...(props.uploadParams || {}),
-              file: item.file,
+              file: item.file
             },
             function onUploadProgress(progressEvent: ProgressEvent) {
-              const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0;
-              item.percent = complete;
+              const complete = ((progressEvent.loaded / progressEvent.total) * 100) | 0
+              item.percent = complete
             }
-          );
-          item.status = UploadResultStatus.SUCCESS;
-          item.responseData = data;
+          )
+          item.status = UploadResultStatus.SUCCESS
+          item.responseData = data
           return {
             success: true,
-            error: null,
-          };
+            error: null
+          }
         } catch (e) {
-          console.log(e);
-          item.status = UploadResultStatus.ERROR;
+          console.log(e)
+          item.status = UploadResultStatus.ERROR
           return {
             success: false,
-            error: e,
-          };
+            error: e
+          }
         }
       }
 
       // 点击开始上传
       async function handleStartUpload() {
-        const { maxNumber } = props;
+        const { maxNumber } = props
         if ((fileListRef.value.length + props.previewFileList?.length ?? 0) > maxNumber) {
-          return createMessage.warning(t('component.upload.maxNumber', [maxNumber]));
+          return createMessage.warning(t('component.upload.maxNumber', [maxNumber]))
         }
         try {
-          isUploadingRef.value = true;
+          isUploadingRef.value = true
           // 只上传不是成功状态的
           const uploadFileList =
-            fileListRef.value.filter((item) => item.status !== UploadResultStatus.SUCCESS) || [];
+            fileListRef.value.filter(item => item.status !== UploadResultStatus.SUCCESS) || []
           const data = await Promise.all(
-            uploadFileList.map((item) => {
-              return uploadApiByItem(item);
+            uploadFileList.map(item => {
+              return uploadApiByItem(item)
             })
-          );
-          isUploadingRef.value = false;
+          )
+          isUploadingRef.value = false
           // 生产环境:抛出错误
-          const errorList = data.filter((item: any) => !item.success);
-          if (errorList.length > 0) throw errorList;
+          const errorList = data.filter((item: any) => !item.success)
+          if (errorList.length > 0) throw errorList
         } catch (e) {
-          isUploadingRef.value = false;
-          throw e;
+          isUploadingRef.value = false
+          throw e
         }
       }
 
       //   点击保存
       function handleOk() {
-        const { maxNumber } = props;
+        const { maxNumber } = props
 
         if (fileListRef.value.length > maxNumber) {
-          return createMessage.warning(t('component.upload.maxNumber', [maxNumber]));
+          return createMessage.warning(t('component.upload.maxNumber', [maxNumber]))
         }
         if (isUploadingRef.value) {
-          return createMessage.warning(t('component.upload.saveWarn'));
+          return createMessage.warning(t('component.upload.saveWarn'))
         }
-        const fileList: string[] = [];
+        const fileList: string[] = []
 
         for (const item of fileListRef.value) {
-          const { status, responseData } = item;
+          const { status, responseData } = item
           if (status === UploadResultStatus.SUCCESS && responseData) {
-            fileList.push(responseData.url);
+            fileList.push(responseData.url)
           }
         }
         // 存在一个上传成功的即可保存
         if (fileList.length <= 0) {
-          return createMessage.warning(t('component.upload.saveError'));
+          return createMessage.warning(t('component.upload.saveError'))
         }
-        fileListRef.value = [];
-        closeModal();
-        emit('change', fileList);
+        fileListRef.value = []
+        closeModal()
+        emit('change', fileList)
       }
 
       // 点击关闭:则所有操作不保存,包括上传的
       function handleCloseFunc() {
         if (!isUploadingRef.value) {
-          fileListRef.value = [];
-          return true;
+          fileListRef.value = []
+          return true
         } else {
-          createMessage.warning(t('component.upload.uploadWait'));
-          return false;
+          createMessage.warning(t('component.upload.uploadWait'))
+          return false
         }
       }
 
@@ -291,10 +289,10 @@
         handleCloseFunc,
         getIsSelectFile,
         getUploadBtnText,
-        t,
-      };
-    },
-  });
+        t
+      }
+    }
+  })
 </script>
 <style lang="less">
   .upload-modal {

+ 0 - 0
src/components/Upload/src/UploadPreviewModal.vue


Algúns arquivos non se mostraron porque demasiados arquivos cambiaron neste cambio