Compact main branch (#2255)

* init

* init

* fix: 修改外联路由打包bug

* fix: sime

* wip(lock): remove

* fix: LOCK

* fix: lock

* init

* feat: remove lock

* chore: remove semi

* chore: chore

* chore: chore

* chore: chore

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

* init

.vscode/settings.json

@@ -109,7 +109,6 @@
     "esnext",
     "antv",
     "tinymce",
-    "qrcode",
     "sider",
     "pinia",
     "sider",

CHANGELOG.en_US.md

@@ -1,1262 +0,0 @@
-## 2.8.0(2021-11.03)
-
-### Upgrade Instructions
-
-- Package manager changed from `yarn` to `pnpm`
-- Delete `node_modules` and `yarn.lock`, install `pnpm` globally
-- Execute `pnpm install`
-
-### ✨ Features
-
-- **Others**
-  - The `VITE_PROXY` configuration in the `.env` file supports single quotes
-  - Remove warnings during build
-
-### 🐛 Bug Fixes
-
-- **BasicTable**
-  - Fix the issue that editable cells cannot be submitted in some cases
-  - Fix the problem that the `inset` attribute does not work
-  - Fix the problem that the performance of `useTable` and `reload` method `await` of `BasicTable` instance are inconsistent
-  - Fix the issue that `clickToRowSelect` would ignore the disabled state of the row selection box
-  - Fix the problem that the page of `BasicTable` will be reset in some cases
-  - Modify the `deleteTableDataRecord` method
-- **BasicModal**
-  - Fixed the problem that `Modal` could not be closed even when clicking on the mask and pressing the `Esc` key
-  - Fixed the issue that clicking the close button and the blank area next to the maximize button would also cause `Modal` to close
-- **BasicTree** Fix the problem that the node slot does not work
-- **CodeEditor** Fix the problem that may cause `Build` failure
-- **BasicForm** Fix the problem that the content width of the custom FormItem component may be out of range
-- **ApiTreeSelect** Fix the problem that the change of `params` failed to trigger the re-request of api data
-- **Others** -Fixed an issue where multiple tabs would not jump to routing when closing tabs in some cases
-  - Fix the issue that some components may cause abnormal hot update
-  - Fix the problem that some sub-components of `antdv` will be reported in the build process when directly `import` part of the `antdv`, such as: TabPane, RadioGroup
-
-## 2.7.2(2021-09-14)
-
-### ✨ Features
-
-- **BasicForm** New `Divider` in the form component for dividing the area of longer forms
-- **BasicTable**
-  - Cell editor adds submit callback, which will decide whether to submit data to the form based on the result returned by the callback function
-  - Add check method for row editing, allowing only check but not submit value, so asynchronously save data successfully before submit to table
-  - Fix the problem that the `rowClassName` property cannot be used at the same time as `striped`.
-- New component **MarkdownViewer** for displaying rich text in Markdown format
-
-### 🐛 Bug Fixes
-
-- **CodeEditor** Fix JSON editor throwing exception when formatting invalid JSON text
-- **Tinymce** fixes an issue where inline mode throws an exception in some scenarios
-- **BasicTable**
-  - Repair the problem that the editing icon is not displayed when the content of editable cell is empty
-  - Repair the problem that the total row at the end of the table sometimes fails to align with the columns in the main part of the table.
-- **MarkDown** Repair the problem that the value of initial value property does not work.
-- **BasicUpload** Repair the problem that `accept` property does not support `MIME` and suffix name starting with dot.
-- **ApiSelect** Fix the problem of type definition of `value` property.
-- **Other**
-  - Repair the problem that some wrapper components give error when using slots.
-  - Repair the problem that `theme` parameter of `useECharts` does not work.
-  - Repair the problem that when `Token` is invalid, pressing F5 to refresh the page may cause abnormal page loading.
-  - Repair the problem that the improper call of `useRedo` may lead to `path` redirection abnormality.
-  - Repair the problem that `vite` custom mode name does not support underscore.
-
-## 2.7.1(2021-08-16)
-
-- Upgrade vue 3.2, if the operation fails, delete node_modules and reinstall it
-
-### ✨ Features
-
-- **BasicTree** Add search function related properties and methods
-- **BasicForm** added `alwaysShowLines` to set the number of lines kept displayed when folding
-
-### 🐛 Bug Fixes
-
-- **Cropper** Fix the problem of failure to destroy in time
-- **BasicTable**
-  - Fix the problem that `CellFormat` cannot use `Map` type data
-  - Fixed an issue where the editable cell failed to display the `0` value correctly
-  - Fixed the issue that selection-change event failed to trigger correctly when unchecked
-  - Fix the problem that the background color of the full screen state under the light theme is incorrect
-  - Fix the problem of obtaining complete data when `getSelectRows` does not support remote data cross-page selection
-  - Fix the issue that the `size` property provided for editing components in `editComponentProps` is invalid
-- **Qrcode** Fixed the problem that the QR code component could not be drawn in time when it was created
-- **BasicModal** Fix the problem that the `helpMessage` property does not work
-- **BasicButton** Fix the problem that the button style performance is inconsistent with the official antd
-- **Others** Fix the problem that `useRedo` (reload the current route) will lose route `params` data
-
-## 2.7.0(2021-08-03)
-
-## (Breaking changes) Breaking changes
-
-- Restore the project `tailwindcss` back to `windicss`, tried `tailwindcss`, there may be a lot of problems, first switch back to `windicss` to improve development efficiency and lower switching costs.
-  - There are currently incompatible areas of the project
-    - The wording of `xl:!m-4` needs to be changed to `!xl:m-4`, note that only `!` is incompatible. If you don’t use it, you don’t need to change it.
-    - The memory overflow problem may still exist (low frequency, just restart, restart vite faster)
-
-### ✨ Features
-
-- **Preview** Add new properties and events
-- **Dark Theme** added support for tailwindcss night mode
-- **Others** add setTip method for useLoading
-
-### 🐛 Bug Fixes
-
-- **ApiTreeSelect** Fixed the problem of failing to monitor `params` changes correctly
-- **ImgRotateDragVerify** Fix the problem that the component `resume` method cannot be called
-- **TableAction** Fix the problem that the stopButtonPropagation property does not work in some cases
-- **PageWrapper** Fix the problem of invalid `class` attribute
-- **BasicTree** Fix the problem that the `checkAll` method will affect the `disabled` state node
-- **BasicTable**
-  - Fix the issue that editable cells do not support `ellipsis` configuration
-  - Fixed the problem that the pop-up layer of sub-components (popconfirm and edit components such as select and treeSelect) cannot be seen in full-screen mode
-  - Fixed an issue where when `expandRowByClick` is enabled, clicking non-expandable rows may cause style errors
-  - Fix the problem that the dynamic change of `pagination` property does not take effect
-  - Fix the problem that `getSelectRows` does not support the child data of the tree table -**Dark Theme** Fix the color matching problem under the dark theme
-  - Fix the background color of the selected node of the `Tree` component
-  - Fix the color configuration of the `Alert` component
-  - Fix the problem of the button color of `link` type in the disabled state
-  - Fix the style problem of checked checkboxes in `Tree` -**Others** Fix the problem that useScript failed to automatically remove the script node
-
-## 2.6.1(2021-07-19)
-
-### ✨ Features
-
-- **NoticeList** Add pagination, auto omit for overlength, title click event, title strikethrough, etc.
-- **MixSider** Optimize the style of the bottom collapse button in the Mix menu layout to be consistent with the style of other menu layouts
-- **ApiTreeSelect** Extend `TreeSelect` component of `antdv` to support remote data source, similar to `ApiSelect`.
-- **BasicTable** New `ApiTreeSelect` editing component
-- Different backend home pages can be specified for different users.
-  - Add `homePath` field (optional) to the user information returned by the `getUserInfo` interface to customize the home page path for the current user
-
-### 🐛 Bug Fixes
-
-- **BasicTable**
-  - Fix scrollbar style issue (removed scroll style patch)
-  - Fix the alignment problem of cells with expanded icons in tree tables
-  - Add `headerTop` slot.
-  - Fix the color display of the operation column button in disabled state.
-  - Repair the problem that the values of editable cells cannot be updated by modifying `dataSource` directly.
-  - Repair the problem of data replay when using `ApiSelect` to edit components.
-  - Repair the problem that editing components may report `onXXX` type error in some scenarios.
-- **TableAction**
-  - Create Tooltip component only if `action.tooltip` exists.
-  - Fix the problem that the content of the round button inside the component is not centered
-- **AppSearch** Fix the problem that the hidden menu may be searched.
-- **BasicUpload** Repair the problem of error when handling non-`array` values.
-- **Form** Repair the `suffix` slot style problem of `FormItem`.
-- **Menu**
-  - Repair the hovering trigger logic of the left mixed menu
-  - Repair the problem that the top bar menu is wrong when displaying menu items that need to be hidden.
-  - Fix the left mixed menu in hover trigger mode will jump to route directly when there is no submenu and it is activated
-- **Breadcrumb** Repair the problem that the menu with redirection cannot be jumped when clicked
-- **Markdown** fixes an initialization exception and an issue where value was not set dynamically correctly
-- **Modal** Make sure props are passed correctly
-- **MultipleTab** fixes an issue that could accidentally create login route tabs
-- **BasicTree** Fix the problem that the search function may cause `checkedKeys` to be lost
-- **CodeEditor** Fix the problem that value does not support v-model usage.
-- **CountdownInput** Fix the problem that `input` slot is not supported.
-- **ApiSelect** Fix the problem that the `options-change` event parameter is not the standard `options` data used by `select
-- **Other**
-  - Fix the problem that the configuration of default menu collapse does not work
-  - Repair the problem that `safari` browser reports an error and the website cannot be opened.
-  - Repair the problem that eslint keeps error due to endOfLine after pulling the code on window.
-  - Fix `Vue Router warn` caused by dynamic routing
-
-### 🎫 Chores
-
-- Add test environment test command
-
-## 2.6.0(2021-07-04)
-
-### ✨ Features
-
-- **Axios** New `withToken` configuration to control whether the request carries a token or not
-- **BasicUpload**
-  - New `preview-delete` event triggered when deleting a file in preview `Modal`.
-  - `value` supports `v-model` usage
-- **Route configuration**
-  - Add `ignoreRoute` to generate menu only in `ROUTE_MAPPING` or `BACK` permission mode
-  - Add `hidePathForChildren` configuration to ignore this level `path` when generating menus for child items
-- **TableAction** Add `tooltip` configuration to add tooltip hint for button
-- **CropperAvatar**
-  - Added `value` to set the current avatar
-  - Added `onChange` to accept avatar cropping and upload success event
-  - New `btnText`, `btnProps` for customizing the text and properties of the upload button
-  - Add tooltips to the action buttons in `Modal` for cropping
-- **Modal** Add tooltip for action button in top right corner
-
-### 🐛 Bug Fixes
-
-- **Modal**
-  - Fix the problem that the mask cannot be closed by clicking on it.
-  - Fix `setModalProps` does not support setting `defaultFullscreen`.
-- **Table**
-  - Fix the problem that `editComponentProps` doesn't support `onChange`.
-  - Fix the problem that `selection-change` event is not triggered when `clickToRowSelect` is enabled.
-  - Fix the problem that global configuration `fetchSetting` may be accidentally modified by local configuration.
-  - Fix the problem that the parameter of `handleSearchInfoFn` contains redundant blank keys.
-  - Repair the problem that when rowSelection.onChange is provided for table, the selected items of table cannot be changed manually.
-  - Fix the problem that the scrollbar continues to be displayed even when it is not needed to be displayed.
-- **Icon** Repair the problem that SvgIcon is missing some styles.
-- **Menu**
-  - Repair the problem that single-level menu refreshing will not be activated in route mapping mode.
-  - Repair the problem that the collapse customization at the bottom of the side menu is invalid.
-- **Form** Repair the type definition of `submitButtonOptions` and `resetButtonOptions`.
-- **PopConfirmButton** Remove the redundant `title` on `Button`.
-- **Axios** Fix the problem that `params` and `data` data cannot be submitted at the same time when non-`GET` requests are made
-- **Other**
-  - Repair the problem that the lock screen function can skip the lock state by refreshing the page or copying the URL to open a new browser tab
-  - Repair the problem that `Token` won't be synchronized when multiple windows open pages at the same time.
-  - Repair the problem that `hasPermission` does not work in `ROLE` permission mode.
-- **Table** Repair the problem that the parameter of `handleSearchInfoFn` contains extra blank keys.
-- **Tailwindcss** Remove console warning
-
-## 2.5.2(2021-06-27)
-
-### ⚡ Performance Improvements
-
-- **Icon** Remove the global registration of Icon components to prevent hot update issues under certain circumstances
-
-### ✨ Features
-
-- **Menu** Added `permissionMode=PermissionModeEnum.ROUTE_MAPPING` mode
-  - The project is changed to this mode by default, and the original menu file is deleted
-  - If you have written the menu before, you can change to `PermissionModeEnum.ROLE` mode
-
-## 2.5.1(2021-06-26)
-
-### ⚡ Performance Improvements
-
-- Upgrade `vue` and `ant-design-vue` versions to solve compatibility issues
-- **Tree** Performance optimization
-
-### 🐛 Bug Fixes
-
-- **Table** Fix page jitter problem
-- **Upload** Make sure to carry custom parameters
-- **Dropdown** Fix the icon display problem of popConfirm
-- **Table** Fix the problem that the editing event of the tree table is abnormal
-- **Table** Fix the problem that when the table data is empty, the value returned by getDataSource is not the data source used by the table
-
-## 2.5.0(2021-06-20)
-
-## (Breaking changes) Breaking changes
-
-- Change the project `windicss` to `tailwindcss` to solve the memory overflow problem
-  - There are currently incompatible areas of the project
-    - The wording of `!xl:m-4` needs to be changed to `xl:!m-4`, note that only `!` is incompatible. If you don’t use it, you don’t need to change it.
-    - The new features of `windicss` itself need to be adjusted, for example, `Attribute` mode is not compatible
-
-### ✨ Refactor
-
-- Remove `useExpose` and use `expose` provided by the component itself instead
-
-### ⚡ Performance Improvements
-
-- **Locale** merge multi-language files to reduce the number of files
-- **Utils** Mitt default export is changed from `Class` to `Function`
-- **Axios** `isTransformRequestResult` is renamed to `isTransformResponse`
-
-### ✨ Features
-
-- **CropperImage** `Cropper` Avatar cropping adds circular cropping function
-- **CropperAvatar** Added avatar upload component
-- **Drawer** `useDrawer` added `closeDrawer` function
-- **Preview** Added `createImgPreview` picture preview function
-- **Setup** New guide page example
-- **Tests** Add jest test suite, Vue component single test is not currently supported
-- **Axios** Added `authenticationScheme` configuration to specify the authentication scheme
-- **Setting** Added `sessionTimeoutProcessing` project configuration item, used to configure how to deal with session timeout
-
-### 🐛 Bug Fixes
-
-- **Modal** fix full screen height calculation error
-- **Modal** Fix the problem that the shutdown event is triggered multiple times
-- **PageWrapper** fix the height calculation problem
-- **FlowChart** Repair drag and drop menu missing
-- Fixed Iframe routing error in background mode
-- **PageWrapper** Fix the height calculation problem when footer and global footer are opened at the same time
-- **Menu** Fix the jitter problem of menu folding animation
-- **Store** fixed type error after pinia version upgrade
-
-## 2.4.2(2021-06-10)
-
-### ✨ Refactor
-
-- `CountTo` component refactoring
-
-### ✨ Features
-
-- `radioButtonGroup` supports `boolean` value
-- `useModalInner` added `redoModalHeight` to reset the height of `Modal` inside Modal
-- `useECharts` added `getInstance` to obtain instances of `echart`
-- `TableAction` added `stopButtonPropagation` to prevent the action button click event from bubbling
-- `BasicTable` in the row edit mode, you can get or set the value of other editing components in the column
-- The `ApiSelect` component will automatically re-fetch the data after the `params` is changed
-- `TableImg` component improvement
-- `BasicTable` added `columns-change` event to monitor the user to change the sorting, display, and fixed status of columns
-- `Tinymce` supports dynamic modification readonly
-- `BasicTable` added `updateTableDataRecord` method to update the specified row data
-- `useModal` added `closeModal` method to close `Modal`
-
-### 🐛 Bug Fixes
-
-- Fix the problem that `redoModalHeight` cannot reduce the height
-- Fix the problem that the schema data of `BasicForm` does not take effect
-- Fix the problem that multiple tags may cause `KeepAlive` to fail
-- Fix the problem that the default `axios` interceptor cannot handle custom code
-- Fix the height issue of the lock screen pop-up window
-- Fixed the problem that the half-selected state of the `Column Display` checkbox of `BaiscTable` was incorrectly displayed
-- Fixed the problem that the preview list of the `BasicUpload` component could not be displayed in some cases
-- Fix the problem that the `options` setting of ` RadioButtonGroup``disabled ` does not take effect
-- Fix the problem that the button for uploading pictures in the read-only mode of the `Tinymce` component is still available
-- Fix the stuttering problem of `BasicForm` under certain circumstances
-- Fix the problem that "directory" routing does not work
-
-## 2.4.1(2021-06-01)
-
-### ✨ Features
-
-- Add `DatePicker` and `TimePicker` components to editable tables
-- Added `defaultExpandLevel` configuration to `Tree` component
-
-### ⚡ Performance Improvements
-
--Menu search default focus
-
-### 🐛 Bug Fixes
-
-- Fix known issues of `CodeEditor`
-- Fix the issue of `i18n` console warning
-- Fix the problem that the editable table `align` configuration does not take effect
-- Ensure that `axios` only processes `Object` parameters
-- Fix the failure of the `defaultExpandAll` configuration of the `Tree` component
-- Fix the problem of missing dividing line in `TableAction`
-- Fix the known issues of the table
-- Fix that the lang attribute of HTML will not be set when reloading due to the first loading or changing the language
-
-## 2.4.0 (2021-05-25)
-
-### ✨ Features
-
--New graphical editor example -New code editor (including Json editor) -Added `JsonPreview`Json data viewing component -The fields of the data column and actionColumn of the table can be controlled according to the authority and business. -Added an example of a permission control table (AuthColumn.vue) -Added user login expiration example
-
-### ⚡ Performance Improvements
-
--Consolidate some language files to reduce the number of files
-
-### 🐛 Bug Fixes
-
--Fix the flashing white screen when the dark theme refreshes -Fix the problem that other functions are invalid when the tab is closed -Fix known issues in the form -Fix the automatic lock screen failure
-
-## 2.3.0 (2021-04-10)
-
-## (Breaking changes) Breaking changes
-
-- Use `pinia` to replace `vuex`, `vuex-module-decorators`.
-
-  -Impact, if you used vuex-module-decorators yourself before, you need to transform it to pinia.
-
-  - the reason: -pinia is basically similar to vuex5api and is easy to understand. -Subsequent switching to vuex5 has a very low cost and can also be used as a third-party state management library
-
-- Remove `useKeyPress` and use `vueuse`-`onKeyStroke` instead
-- Remove `useDebounceFn` and use `vueuse`-`useDebounceFn` instead
-- Remove `useThrottle` and use `vueuse`-`useThrottleFn` instead
-
-### ✨ Features
-
-- Tabs support persistent storage
-
-### ✨ Refactor
-
-- Remove `useElResize`
-
-### 🐛 Bug Fixes
-
-- Login page style fix
-- Fix the known problems of the menu
-- Fix the problem of theme style switching
-
-## 2.2.0 (2021-04-06)
-
-### ✨ Features
-
-- Added `headerTitle` slot
-- New printing example
-- Added about interface
-
-### ✨ Refactor
-
-- Remove useFullScreen function
-- tinymce changed from Cdn to npm (the package size is too large)
-- Dashboard refactoring
-- Remove ApexCharts and examples
-
-### 🐛 Bug Fixes
-
-- Make sure the breadcrumbs are displayed correctly
-- Fixed the issue of tinymce upload button disappearing in full screen mode
-- Make sure that the title changes normally after logging in again
-- Ensure that the background mode login is normal
-- Fix TableAction click event issue
-
-## 2.1.1 (2021-03-26)
-
-### ✨ Features
-
-- Added hideChildrenInMenu configuration for routing. Used to hide submenu
-- Built-in expand/collapse all functions in the tree form
-
-### ✨ Refactor
-
-- Refactor the routing multi-layer mode to solve the problem of multiple implementations of nested keepalives
-
-### 🐛 Bug Fixes
-
-- Ensure that the CountDownInput component is reset to the empty value
-- Fix the display problem on the small screen in split mode
-- Fix table height calculation problem
-- Fix the problem that components cannot be obtained by background routing
-- Fix Modal component loadingTip configuration does not take effect
-- Fix the background permission command does not take effect
-- Make sure the progress bar is closed properly
-- Fix the problem of invalid table check column configuration
-- Ensure that the first level menu can be hidden
-- Ensure that the hidden fields of the form are verified properly
-
-### 🎫 Chores
-
-- Remove ls-lint
-
-### 🎫 Chores
-
-- 移除 ls-lint
-
-## 2.1.0 (2021-03-15)
-
-### ✨ Features
-
-- Added svg mode to icon selector
-- Added time component
-- Added AutoNavi/Baidu/Google Map example
-
-### ✨ Refactor
-
-- Refactor the project to solve the hot update problem caused by circular dependencies
-- Remove vueHelper/useClickoutside, use @vueuse/core instead
-
-### 🐛 Bug Fixes
-
-- Ensure that the value of `table action` is updated correctly
-- Fix the animation of page switching cannot be closed
-- Fix `PageWrapper`title not showing
-- Fix the known issues of the table
-- Fix the problem that the BasicTree component can't customize the title
-- Fix the button style problem after theme switching
-
-## 2.0.3 (2021-03-07)
-
-### ✨ Features
-
-- `BasicTree` added `clickRowToExpand`, used to click tree node to expand
-- Added SvgIcon plugin and examples
-- Add the department tree on the left side of the account management interface·
-
-### ⚡ Performance Improvements
-
-- Pagination parameters are no longer carried when the table is closed
-- The login page monitors the carriage return event to log in
-- When the adaptive size of the table is set, the height is filled according to the screen.
-- Tree scroll bar optimization
-- Optimize the loading speed of local development
-
-### 🐛 Bug Fixes
-
-- Fix known issues with `Description`
-- Fix known issues with `BasicForm`
-- Fix the logic problem of show attribute of ActionItem under `BasicTree`
-- Fix the style error of the tree component demo example
-- Repair account management to add new but not cleared old data
-- The form component should allow the setFieldsValue method to be null or undefined
-- Ensure that the single-level breadcrumbs jump correctly
-- Ensure that the Form component does not verify hidden form items
-
-## 2.0.2 (2021-03-04)
-
-### ✨ Refactor
-
-- Refactored multi-language modules to support lazy loading and remote loading
-
-### ✨ Features
-
-- axios supports form-data format request
-- Added icon selector component (support local and online methods)
-- Added WebSocket examples and service scripts
-- Added the `renderIcon` property to the Tree component to control the display of level icons
-- Tree->actionItem added show attribute, used to dynamically control button display
-- New toolbar/title/search function for Tree
-- Added department management/password modification/account management/role management/menu management sample interface
-
-### ⚡ Performance Improvements
-
-- Optimized login interface animation
-- Fix the problem of excessively large github warehouse.
-- Hide table full screen button by default
-- `crypto-es` is changed to `crypto-js` to reduce the package size
-- `types` directory moved to the root directory, compatible with other directory global types
-
-### 🐛 Bug Fixes
-
-- Fix the warning problem of verification code component
-- Fix the table cannot get the selected row correctly
-- Fixed modal height calculation error in full screen state
-- Fix some table style issues
-- Fix the invalidation of the tree form `indentSize` setting
-
-## 2.0.1 (2021-02-21)
-
-### ✨ Refactor
-
-- Refactored login page, new registration page/reset password page/mobile phone login/QR code login
-
-### ✨ Features
-
-- Added the `settingButtonPosition` configuration item for configuring the position of the `settings` button
-- `modal` can switch the full screen by double-clicking the head
-- Added `CountDownInput` component
-
-### ⚡ Performance Improvements
-
-- Optimize the editable center style and the width of the drop-down box is too short
-- The `edit-change` event listener when the table is added and edited
-
-### 🐛 Bug Fixes
-
-- Fix image preview style error
-- Fix icon style problem
-- Fix the drop-down echo problem of editable table
-
-## 2.0.0 (2021-02-18)
-
-## Breaking changes
-
-- `echarts` is upgraded to 5.0 and introduced on demand (just use `useECharts`).
-
-### ✨ Refactor
-
-- Removed `global.less`, `mixin.less`, `design/helper`, replaced by `windicss`, and need to modify the corresponding styles if they are useful
-
-### ✨ Features
-
-- useModal adds the return value function `redoModalHeight`, which is used to refresh the modal height when the modal is dynamic content
-- Upgrade husky to 5.0
-- Added `brotli`|`gzip` compression and related test commands
-- Re-introduction of `windicss` (same as `tailwind`). Faster in speed
-
-### ⚡ Performance Improvements
-
-- Adjust the return value of the interface to obtain user information in array format
-- Fix the error-log list as the system route
-
-### 🐛 Bug Fixes
-
-- Fix the issue of upload component maxNumber invalid
-- Fix package sourcemap error report
-- Fix code debugger location display error
-- Fix the issue of mock plugin post request error
-- Fix some themes color value error
-- Fix the table in editable row status and press Enter to confirm
-
-### 🎫 Chores
-
-- Documentation update
-- Upgrade ant-design-vue to `2.0.0`
-- Upgrade vite to `2.0.0`
-
-## 2.0.0-rc.18 (2021-02-05)
-
-### ✨ Features
-
-- `ApiSelect` adds `numberToString` property, which is used to convert all the value of `number` into `string`
-- Added theme color switch
-- Packed image compression
-
-### ⚡ Performance Improvements
-
-When mock is not used, move `mock.js` out of the package file
-
-### 🐛 Bug Fixes
-
-- Fix modal height calculation error
-- Fix the pop-up menu when the menu is clicked on the tab when the menu is collapsed
-- Fix the problem that the initial value of form is 0
-- Fix table wrapping problem
-- Fix the menu outside link does not jump
-- Fix the display problem at the top of the menu
-- Fix the issue of `modifyVars` configuration failure
-
-## 2.0.0-rc.17 (2020-01-18)
-
-### ✨ Refactor
-
-- Added `SimpleMenu` component to replace the left menu component (the top menu is not replaced, the function should be as simple as possible without stuck). Solve the menu stuck problem.
-- The `ant-design-vue` component is no longer registered globally. In order to better coordinate with the introduction of css on demand. If you need to register globally, you need to add it yourself
-
-### ✨ Features
-
-- `css` import on demand
-
-### 🐛 Bug Fixes
-
-- Fix `TableAction` icon problem
-- Fix the problem of missing menu folding buttons
-- Fix menu related issues
-- Fix moment multilingual issue
-
-## 2.0.0-rc.16 (2020-01-12)
-
-### ✨ Refactor
-
-- Independent component configuration to `/@/settings/componentsSetting`
-- `colorSetting` and `designSetting` are now merged into `designSetting`
-- `ant-design-vue` component registration moved to `components/registerComponent`
-- Remove the `setup` folder
-- Upgrade to `vite2`
-- Image preview is changed to `Image` component implementation, temporarily removing functional usage
-
-### ✨ Features
-
-- Added `mixSideTrigger` configuration. Used to configure how to open the mixed mode menu on the left. Optional `hover`, default `click`
-- Added `mixSideFixed` configuration. Used to fix the left mixed mode menu
-- Added `height` and `min-height` properties to the modal component
-- Added `PageWrapper` component. And applied to the sample page
-- Added tab folding function
-- Compatible with older browsers
-- tinymce new image upload
-
-### 🐛 Bug Fixes
-
-- Fix known issues with table column configuration
-- Restore the `isTreeTable` property of the table
-- Fix table memory overflow problem
-- Fix the function of `layout` shrinking and expanding in split mode
-- Fix modal height calculation error
-- Fix file upload error
-
-## 2.0.0-rc.15 (2020-12-31)
-
-### ✨ Table destructive update
-
-- Refactored editable cells and editable rows. See examples for details. The writing has changed. For editable tables.
-
-- Form editing supports form validation
-
-- Added the following configuration in the table column configuration
-
-```bash
-{
-
-  # Whether to display columns by default. Those that are not displayed can be opened in the column configuration
-  defaultHidden?: boolean;
-  # Help text on the right side of the column header
-  helpMessage?: string | string[];
-  # Custom formatting Cell content. Support time/enumeration automatic conversion
-  format?: CellFormat;
-
-  # Editable
-  # Is it an editable cell
-  edit?: boolean;
-  # Is it an editable line
-  editRow?: boolean;
-  # Edit status.
-  editable?: boolean;
-  # Edit component
-  editComponent?: ComponentType;
-  # The parameters of the corresponding component
-  editComponentProps?: Recordable;
-  # Check
-  editRule?: boolean | ((text: string, record: Recordable) => Promise<string>);
-  # Value enumeration conversion
-  editValueMap?: (value: any) => string;
-  # Trigger editing Zhenghang
-  record.onEditRow?: () => void;
-}
-
-```
-
-### ✨ Table reconstruction
-
-- Added `clickToRowSelect` attribute. Used to control whether the clicked row is checked or not
-- Monitor row click event
-- Add column drag and drop and column fix function for the table column configuration button.
-- Added `defaultHidden` attribute to table column configuration. Used to hide by default. You can configure the tick display in the table column
-- More powerful column configuration
-- useTable: Support for dynamically changing parameters. You can pass in `Ref` type and `Computed` type for dynamic changes
-- useTable: Added return function `getForm`. Can be used to manipulate forms in the form Fix known issues in the table
-
-### ✨ Features
-
-- Added `v-ripple` water ripple command
-- Added the left menu mixed mode
-- Add an example of markdown embedded in the form
-- Add an example of a page outside the main frame
-- `route.meta` added `currentActiveMenu`, `hideTab`, and `hideMenu` parameters to control the display and hide of the crumb-level menu on the detail page.
-- Added breadcrumb navigation example
-- form: Added `suffix` attribute to configure suffix content
-- form: Added remote drop-down `ApiSelect` and examples
-- form: Add `autoFocusFirstItem` configuration. Used to configure whether to focus on the first input box of the form
-- useForm: Support for dynamically changing parameters. You can pass in `Ref` type and `Computed` type for dynamic changes
-
-### ⚡ Performance Improvements
-
-- Optimize the scroll bar components of `modal` and `drawer`
-- table: remove the `isTreeTable` attribute
-- Import `less` files globally. No need to manually re-introduce the component
-
-### 🎫 Chores
-
-- Upgrade `ant-design-vue` to `2.0.0-rc.7`
-- Upgrade `vue` to `3.0.5`
-
-### 🐛 Bug Fixes
-
-- Fixed the issue of missing scroll bars in mixed mode
-- Fix the invalid configuration of environment variables and the logo address problem in history mode
-- Fix the calculation error of width and height caused by switching page of chart library
-- Fixed the issue of multi-language configuration `Locale.show` causing the configuration not to take effect
-- Fix routing type error
-- Fix the problem of invalid permissions when the menu is split
-- Iframe loads early when closing multi-tab pages
-- Fix known issues with `modal` and `drawer`
-- Fix the problem of mixing mode adaptation in the left menu
-
-## 2.0.0-rc.14 (2020-12-15)
-
-### ✨ Features
-
--Remove the left menu search, add the top menu search function -Layout mobile terminal adaptation. Business page is not adapted -axios join the joinTime configuration. Control whether the response includes a timestamp
-
-### ⚡ Performance Improvements
-
--Import components asynchronously -Optimize the overall structure -Replace the default scroll bar of the menu as a scroll component -Menu performance optimization
-
-### 🎫 Chores
-
--Return to the top to adjust the style to avoid covering other elements -Upgrade `ant-design-vue` to `2.0.0-rc.5` -Refresh button layout adjustment -`route.meta` removes the `externalLink` attribute
-
-### ✨ Refactor
-
--`openModal` and `openDrawer` third parameter `openOnSet` is set to true by default
-
-### 🐛 Bug Fixes
-
--Fixed an issue where multi-level routing cache caused components to render multiple times -Fixed the problem of disappearing after switching the map chart -Fix the issue of successful login and notify disappearing -Modify the names of `VirtualScroll` and `ImportExcel` components as `VScroll` and `ImpExcel` to temporarily solve the memory overflow of components containing keywords in the vue template -Fix axios case problem -Fix button style problem -Fix the problem of menu split mode -Fix the issue of invalid data transmission when using emits in `Modal` and `Drawer` components -Fix the known problems of the menu -Fix the issue of upload component api failure -Fix the problem of invalid menu permission filtering
-
-## 2.0.0-rc.13 (2020-12-10)
-
-## (Breaking changes) Breaking changes
-
--Route reconstruction, the previous format is no longer supported. Change to support the original default structure of vue-router, the specific format can be changed by referring to the example. Realize multi-level route caching, and no longer convert routes to level 2. -Refactor breadcrumbs and use antd's breadcrumbs component. The previous component has been deleted
-
-### ✨ Features
-
--Restore the default loading of antdv, refactor the `Loading` component, and add `useLoading` and `v-loading` instructions. And add examples -i18n supports vscode `i18n-ally` plugin -New examples of increased routing cache -Packaged code split (experimental) -Extract upload address to global variable, package can be dynamically configured
-
-### ✨ Refactor
-
--Tree component ref function call to delete `$` -Reconstruction and beautification of the lock screen interface, delete unnecessary background pictures
-
-### ⚡ Performance Improvements
-
--Page switching loading logic modification. Regardless of whether the loaded page is closed or not, loading will not be displayed when opened again (pages that have been opened are opened again faster, and loading is not required, and the logic of the top progress bar is the same), and it will be restored after refreshing.
-
-### 🎫 Chores
-
--First screen loading modification -Upgrade `vue` to `3.0.4` -Upgrade `ant-design-vue` to `2.0.0-rc.3` -Re-introduction of `vueuse` -Remove the `afterCloseLoading` attribute in route meta -Documentation update
-
-### 🐛 Bug Fixes
-
--Fix form i18n error -Fix the inconsistent size of menu icons -Fix the calculation of the top menu width -Fix table tabSetting problem -Repair file upload and delete invalidation -Fix the problem of editing and saving table rows
-
-## 2.0.0-rc.12 (2020-11-30)
-
-## (破坏性更新) Breaking changes
-
-- The ClickOutSide component import method is changed from `import ClickOutSide from'/@/components/ClickOutSide/index.vue'` to `import {ClickOutSide} from'/@/components/ClickOutSide'`
-- Button component import method changed from `import Button from'/@/components/Button/index.vue'` to `import {Button} from'/@/components/Button'`
-- StrengthMeter component import method is changed from `import StrengthMeter from'/@/components/StrengthMeter'` to `import {StrengthMeter} from'/@/components/StrengthMeter'`
-- In addition to the examples, the global internationalization function is added, supporting Chinese and English
-
-### ✨ Refactor
-
-- Refactor the overall layout. Change the code implementation method. Code is more streamlined
-- Configuration item reconstruction
-- Remove messageSetting configuration
-- BasicTitle component `showSpan`=> `span`
-
-### ✨ Features
-
-- The cache can be configured to encrypt or not, and Aes encryption is enabled in the production environment by default
-- Add tab drag and drop sort
-- Added LayoutFooter. The default display, can be closed in the configuration
-
-### ⚡ Performance Improvements
-
-- Optimized the problem that the full screen animation of `Modal` component is not smooth
-
-### 🐛 Bug Fixes
-
-- tree: Fix the problem that the text exceeds the operation button
-- useRedo: Fix the problem of missing parameters when refreshing the page through useRedo
-- form: Fix the problem that the form verification is first set in the verification and the console error message
-- `modal`&`drawer` fix the problem of component passing array parameters
-- form: fix `updateSchema` does not take effect when the value contains `[]`
-- table: Fix the display problem of the table `TableAction` icon
-- table: fix table column settings not displayed by `setColumns` setting
-
-### 🎫 Chores
-
-- Update antdv to `2.0.0-rc.2`
-- Update vue to `3.0.3`
-- Update vite to `1.0.0.rc13`
-- Temporarily delete `@vueuse/core`. After it is stable, it will be integrated. It is currently not stable.
-
-## 2.0.0-rc.11 (2020-11-18)
-
-### ✨ Features
-
-- Added base64 file stream download
-- Optimize upload components and examples
-- New editable row example
-- Add a personal page
-- New form page
-- Add details page
-- Integrate upload components into form by default
-
-### 🎫 Chores
-
-- Update antdv to `2.0.0-rc.1` (temporarily restore to beta15, rc1 menu freezes too seriously.)
-- Add some notes
-
-### ✨ Refactor
-
-- Removed `receiveDrawerDataRef` and `transferDrawerData` properties of `useModal` and `useDrawer`
-- `openModal` and `openDrawer` corresponding to `useModal` and `useDrawer` extend the third parameter. Used to open the trigger callback again
-
-### 🐛 Bug Fixes
-
-- Repair form inputNumber verification error
-- Fix the error of setting the default value of the form
-- Fix the problem of occupying position when the menu collapse button is hidden
-- Fix the form baseColProps does not take effect
-
-## 2.0.0-rc.10 (2020-11-13)
-
-### ✨ Refactor
-
-- Refactor hook, introduce `@vueuse`, delete existing `hook`, optimize existing hook
-- ʻUseEvent` renamed ->ʻuseEventListener`
-- Delete the four types `SelectOptGroup`, `SelectOption`, `Transfer`, and `Radio` from the form `ComponentType`. Modify the `RadioButtonGroup` component
-
-### ✨ Features
-
-- `componentsProps` support function type of form item
-- Added tag display to the menu, supporting 4 types of colors and dot display
-- New menu and top bar color selection color matching
-- Add sample result page
-- New file download example
-
-### ⚡ Wip
-
-- Upload components (not completed, testing...)
-
-### ⚡ Performance Improvements
-
-- Optimize settingDrawer code
-- Optimize the switching speed of multiple tabs
-- Add form customization and dynamic capabilities
-
-### 🐛 Bug Fixes
-
-- Fixed multiple rich text editors showing only one
-- Fixed the problem of not redirecting to the original page after logging in again after expiration
-- Fix window system dynamic introduction error
-- Fix page type error
-- Fixed an error when the form switch and checkBox were used separately
-
-## 2.0.0-rc.9 (2020-11-9)
-
-### ✨ Features
-
-- Menu trigger can select location
-- Add an example of rich text embedded form
-- Added `required` attribute to form component schema. Simplified configuration
-- The second parameter of openModal and openDrawer can be passed internally instead of `transferModalData`
-- Routes with parameters can be cached
-
-### ✨ Refactor
-
-- Refactored the logic of the menu generated by the background
-- Route Module structural transformation
-
-### ⚡ Performance Improvements
-
-- Menu performance continues to be optimized and smoother
-- Optimize lazy loading components and examples
-- layout style fine-tuning
-
-### 🎫 Chores
-
-- Delete menu background image
-- Update the version of ʻant-design-vue`to`beta15`
-- Update `vite` version to `rc.9`
-- Exception page adjustment
-- `BasicTitle` Color blocks are not displayed by default
-
-### 🐛 Bug Fixes
-
-- Fix table type problem after upgrade
-- Fix the problem that the last submenu continues to be displayed when the menu is divided and there is no data in the left menu
-- Fix the issue of ʻuseMessage` type
-- Fix the problem that the form item setting `disabled` does not take effect
-- Fix that ʻuseECharts`can't adapt when`resize`, and an error is reported
-- Fix that `resize` is not deleted after ʻuseWatermark` is cleared
-- Fix form verification problem
-- Fixed the problem that the multi-level header configuration does not take effect
-
-## 2.0.0-rc.8 (2020-11-2)
-
-### ✨ Features
-
-- Global loading add text
-- Right-click menu supports multiple levels
-
-### 🎫 Chores
-
-- Login cache changed from sessionStorage to LocalStorage
-
-### ⚡ Performance Improvements
-
-- Update ʻant-design-vue`to`beta.12`
-- Layout interface layout style adjustment
-- Optimize lazy loading components
-- Optimize table rendering performance
-- Add animation to form folding search icon
-- routeModule can ignore the layout configuration. Convenient to configure the first-level menu
-
-### 🐛 Bug Fixes
-
-- Fix table type error
-- Fix bug in mock paging tool
-- Fix the folding problem of the search form when the table is opened
-- Fix the problem of fixed column style when the table size is samll
-- Fixed the error report when closing multiple tabs
-- Fix message type error
-
-## 2.0.0-rc.7 (2020-10-31)
-
-### ✨ Features
-
-- The form component now supports directly passing in the model to directly perform the set operation, please refer to **Component -> Popup Extension -> Open Popup and Pass Data**
-
-- The useModalInner of modal now supports the incoming callback function to receive the value passed in from the external `transferModalData`
-
-  - Used to handle the setting values ​​of components such as forms when the pop-up window is opened. Refer to **Component -> Popup Extension -> Open Popup and Pass Data**
-  - The value of `receiveModalDataRef` is temporarily reserved. Use as little as possible. It may be deleted later.
-
-- The drawer’s useDrawerInner now supports the incoming callback function to receive the value passed in from the external `transferModalData`,，
-  - Used to handle the setting values ​​of components such as forms for opening the drawer Refer to **Component->Drawer Extension->Open the drawer and transfer data**
-  - The value of `receiveModalDataRef` is temporarily reserved. Use as little as possible. It may be deleted later.
-
-### ✨ Refactor
-
-- Form code optimization and reconstruction
-
-### ⚡ Performance Improvements
-
-- Modal slot can be overwritten
-- Optimize table embedding height calculation problem
-
-### 🎫 Chores
-
-- Add some notes
-- pwa icon supplement
-- Type adjustment
-- Upgrade ʻant-design-vue`to`beta.11`, and modify the known issues brought about, and some issues will be resolved after discovery
-
-### 🐛 Bug Fixes
-
-- Fix the timeout error of local proxy post interface to https address
-- Fix modal full screen height calculation problem when footer is not displayed
-- Fix the error that the verification information is not deleted when the form is reset
-- Fix the style problem of the split mode of the top menu
-- Fix the invalidation of table expansion icon animation
-
-## 2.0.0-rc.6 (2020-10-28)
-
-### ✨ Features
-
-- Added `pwa` function, which can be turned on in `.env.production`
-- Button component extends `preIcon` and `postIcon` attributes to add icons before and after the text
-- Restore the breadcrumb display icon function
-
-### 🎫 Chores
-
-- Upgrade vite version to `v1.0.0.rc8`
-- vite.config.ts internal plugins extraction
-- Build directory structure adjustment
-- Dependency update
-- Documentation update
-- Modify the default route switching animation
-
-### ⚡ Performance Improvements
-
-- `setTitle` logic adjustment
-- The sessionStorage and LocalStorage cache settings used by the system expire in `7` days by default
-
-### ✨ Refactor
-
-- Separate `vite-plugin-html` and modify the logic of inserting html
-
-### 🐛 Bug Fixes
-
-- Fix the warning problem of multiple registration components during hot update
-- Fix the login tab page appears after login
-- Fix the problem of routing switch parameter disappearance
-- Fix the useMessage icon style problem
-
-## # 2.0.0-rc.5 (2020-10-26)
-
-### ✨ Features
-
-- Update component documentation
-- Breadcrumbs support display icon
-- Added tinymce rich text component
-- Add submitOnReset to the form to control whether to re-initiate the request when reset
-- Added `sortFn` to the table to support custom sorting
-- Added animation components and examples
-- Added lazy loading/delay loading components and examples
-
-### ✨ Refactor
-
-- The detailType of the Drawer component is changed to isDetail
-
-### 🎫 Chores
-
-- Remove the optional chain syntax in the code
-- Form reset logic modification
-- Turn off multi-tab page tabs animation
-- Upgrade vite version to `v1.0.0.rc6`
-- Delete Chinese path warning. rc6 has been fixed
-
-### 🐛 Bug Fixes
-
-- Fix the automatic height and display footer display problems of drawer components
-- Reset to default value after repairing form query
-- Fix the problem of displaying the collapsed menu when there are no child nodes
-- Fix the problem of breadcrumb display style
-- Fixed the problem of multiple open drag and drop failure when destroyOnClose=true in modal
-- Fixed multiple action columns in the table
-
-# 2.0.0-rc.4 (2020-10-21)
-
-### ✨ Features
-
-- New configuration toolbar for tables
-- New message notification module
-
-### 🎫 Chores
-
-- The table does not show borders by default
-- Dependency update
-- Update vue to `v3.0.2`
-- Interface style fine-tuning
-
-### ⚡ Performance Improvements
-
-- Optimize the size of the first screen
-- Optimize the TableAction component
-- Reduce the folding width of the menu
-
-### 🐛 Bug Fixes
-
-- Fix the problem of the menu name when the first level menu is folded
-- Fix the problem that the preview command is not packaged
-- Fix the problem that the form actionColOptions parameter does not take effect
-- Fix the problem that the loading does not take effect when refreshing the form
-
-# 2.0.0-rc.3 (2020-10-19)
-
-### ✨ Features
-
-- Added excel component and excel/xml/csv/html export example
-- Added excel import example
-- Added global error handling
-- Added markdown components and examples
-- The menu name can be displayed when adding a new folding menu
-
-### Docs
-
-- add project doc
-
-### 🎫 Chores
-
-- update deps
-
-### 🐛 Bug Fixes
-
-- Fix the adaptive problem of the top menu
-- Fix window system packaging error
-
-# 2.0.0-rc.2 (2020-10-17)
-
-### ✨ Features
-
-- Package can be configured to output `gizp`
-- Package can be configured to delete `console`
-- Routes and menus do not need to be imported manually, they are imported automatically
-
-### 🎫 Chores
-
-- Upgrade vue to `3.0.1`
-- Change `vite` version to daily build version
-
-### 🐛 Bug Fixes
-
-- Fix menu error
-- Fix the problem of table adaptive height
-- Fix the issue of error reporting when executing script in `window system`
-- Fix the problem of folding components
-
-### ⚡ Performance Improvements
-
-- Remove menu to minimize background
-- Prevent page refresh and re-render menu
-- Some other details are optimized
-
-# 2.0.0-rc.1 (2020-10-14)
-
-### ✨ Features
-
-- Add a tab with parameters
-
-### ⚡ Performance Improvements
-
-- Optimized menu folding
-- Page details optimization
-- Compress html after packaging
-- Functional reconstruction of preview components and right-click menu
-- The preview component operation column is centered
-
-### 🎫 Chores
-
-- update deps
-- Added `README.en-US.md`
-- Added `CHANGELOG.en-US.md`
-
-### 🐛 Bug Fixes
-
-- Fix page refresh and jump to landing page
-
-# 2.0.0-beta.7 (2020-10-12)
-
-### ⚡ Performance Improvements
-
-- The existing tab switching no longer displays animation and progress bar
-
-### ✨ Features
-
-- Added `CountTo` component and sample demo
-- Added `closeMessageOnSwitch` and `removeAllHttpPending` to the project configuration file
-- The production environment has a separate configuration file for dynamic configuration project configuration
-- Added ʻuseEcharts` and ʻuseApexChart` to facilitate the use of charts, and added related demos
-- New workbench interface
-- New analysis page interface
-
-### 🎫 Chores
-
-- Update dependencies
-
-### 🐛 Bug Fixes
-
-- Fix routing switch, tab inactive problem
-
-# 2.0.0-beta.6 (2020-10-11)
-
-### 💄 Styles
-
-- Menu style adjustment
-
-### 🐛 Bug Fixes
-
-- Fix the problem that editable forms cannot be entered
-- Repair packaging errors, no proxy is required in the production environment
-
-### ⚡ Performance Improvements
-
-- Optimize the switching speed of multi-tab pages
-- First screen loading animation
-
-# 2.0.0-beta.5 (2020-10-10)
-
-### ♻ Code Refactoring
-
-- Delete `tailwind css`
-
-### ⚡ Performance Improvements
-
-- Optimize page switching speed
-
-### 🎫 Chores
-
-- Add `.vscode` and `.github` configuration
-- Change menu icon
-- Added `.env` configuration file
-- Update readme.md
-
-### 🐛 Bug Fixes
-
-- Fix the failure of `Tree` component check event
-
-# 2.0.0-beta.4 (2020-10-08)
-
-### 🎫 Chores
-
-- Remove redundant dependencies
-
-### 🐛 Bug Fixes
-
-- Fix page refresh blank
-- Fix the invalid table style in the production environment
-
-# 2.0.0-beta.3 (2020-10-07)
-
-### ✨ Features
-
-- Added ʻopenNProgress` to the project configuration file to control whether to open the top control bar
-- Add `Table` component and demo
-
-### 🎫 Chores
-
-- Add ` github workflows`
-
-# 2.0.0-beta.2 (2020-10-07)
-
-### ✨ Features
-
-- Added image preview component
-
-### 🔧 Continuous Integration
-
-- Add githubAction script
-
-# 2.0.0-beta.1(2020-09-30)
-
-### 🎫 Chores
-
-- Migrate some code from 1.0
-- Add README.md description file
-
-### 🐛 Bug Fixes
-
-- Fix the problem of form, animation and packaging failure

CHANGELOG.zh_CN.md

@@ -1,1317 +0,0 @@
-## 2.8.0(2021-11.03)
-
-### 升级说明
-
-- 包管理器由`yarn`改为 `pnpm`
-- 删除`node_modules`和`yarn.lock`，全局安装`pnpm`
-- 执行`pnpm install`
-
-### ✨ Features
-
-- **其它**
-  - `.env`文件中的`VITE_PROXY`配置支持单引号
-  - 移除 build 过程中的警告
-
-### 🐛 Bug Fixes
-
-- **BasicTable**
-  - 修复可编辑单元格某些情况下无法提交的问题
-  - 修复`inset`属性不起作用的问题
-  - 修复`useTable`与`BasicTable`实例的`reload`方法`await`表现不一致的问题
-  - 修复`clickToRowSelect`会无视行选择框 disabled 状态的问题
-  - 修复`BasicTable`在某些情况下，分页会被重置的问题
-  - 修改 `deleteTableDataRecord` 方法
-- **BasicModal**
-  - 修复点击遮罩、按下`Esc`键都不能关闭`Modal`的问题
-  - 修复点击关闭按钮、最大化按钮旁边的空白区域也会导致`Modal`关闭的问题
-- **BasicTree** 修复节点插槽不起作用的问题
-- **CodeEditor** 修复可能会造成的`Build`失败的问题
-- **BasicForm** 修复自定义 FormItem 组件的内容宽度可能超出范围的问题
-- **ApiTreeSelect** 修复`params`变化未能触发重新请求 api 数据的问题
-- **其它**
-  - 修复多标签在某些情况下关闭页签不会跳转路由的问题
-  - 修复部分组件可能会造成热更新异常的问题
-  - 修复直接`import`部分`antdv`子组件时会在 build 过程中报错的问题，如：TabPane、RadioGroup
-
-## 2.7.2(2021-09-14)
-
-### ✨ Features
-
-- **BasicForm** 表单组件新增`Divider`，用于较长表单的区域分割
-- **BasicTable**
-  - 单元格编辑新增提交回调，将根据回调函数返回的结果来决定是否将数据提交到表格
-  - 行编辑添加校验方法，允许只校验而不提交值，以便异步保存数据成功后才提交倒表格
-  - 修复`rowClassName`属性无法和`striped`同时使用的问题
-- 新增组件 **MarkdownViewer** 用于显示 Markdown 格式的富文本
-
-### 🐛 Bug Fixes
-
-- **CodeEditor** 修复 JSON 编辑器在格式化无效 JSON 文本时会抛出异常的问题
-- **Tinymce** 修复 inline 模式在一些场景下会出现异常的问题
-- **BasicTable**
-  - 修复可编辑单元格的内容为空时，不会显示编辑图标的问题
-  - 修复表尾合计行与表格主体部分的列有时候未能对齐的问题
-- **MarkDown** 修复初始 value 属性的值不起作用的问题
-- **BasicUpload** 修复`accept`属性不支持`MIME`及点开头的后缀名的问题
-- **ApiSelect** 修复`value`属性的类型定义问题
-- **其它**
-  - 修复部分封装组件在使用插槽时报错的问题
-  - 修复`useECharts`的`theme`参数不起作用的问题
-  - 修复`Token`失效时，按 F5 刷新页面可能会出现页面加载异常的问题
-  - 修复`useRedo`的不当调用可能会导致重定向`path`异常的问题
-  - 修复`vite`自定义模式名称不支持下划线的问题
-
-## 2.7.1(2021-08-16)
-
-- 升级 vue 3.2,如果运行失败，删除 node_modules 后重装即可
-
-### ✨ Features
-
-- **BasicTree** 添加搜索功能相关属性和方法
-- **BasicForm** 新增`alwaysShowLines`用于设置折叠时保留显示的行数
-
-### 🐛 Bug Fixes
-
-- **Cropper** 修复未能及时销毁的问题
-- **BasicTable**
-  - 修复`CellFormat`无法使用`Map`类型数据的问题
-  - 修复可编辑单元格未能正确显示`0`值的问题
-  - 修复 selection-change 事件在取消勾选时未能正确触发的问题
-  - 修复浅色主题下的全屏状态背景颜色不正确的问题
-  - 修复`getSelectRows`不支持远程数据跨页选择时获取完整数据的问题
-  - 修复在`editComponentProps`中为编辑组件提供的`size`属性无效的问题
-- **Qrcode** 修复二维码组件在创建时未能及时绘制的问题
-- **BasicModal** 修复`helpMessage`属性不起作用的问题
-- **BasicButton** 修复按钮样式表现与 antd 官方不一致的问题
-- **其它** 修复`useRedo`(重新加载当前路由)会丢失路由`params`数据的问题
-
-## 2.7.0(2021-08-03)
-
-## (破坏性更新) Breaking changes
-
-- 将项目`tailwindcss`还原回`windicss`，尝试了`tailwindcss`，问题可能还挺多，先切换回`windicss`提高开发效率，切换成本较低。
-  - 目前项目不兼容地方有
-    - `xl:!m-4` 之类的写法需要改为`!xl:m-4`,注意只有`!`这个不兼容，没用到则不用改
-    - 内存溢出问题可能还在（频率低，重启下即可，重启 vite 较快）
-
-### ✨ Features
-
-- **Preview** 添加新的属性及事件
-- **Dark Theme** 新增对 tailwindcss 夜间模式的支持
-- **其它** 为 useLoading 添加 setTip 方法
-
-### 🐛 Bug Fixes
-
-- **ApiTreeSelect** 修复未能正确监听`params`变化的问题
-- **ImgRotateDragVerify** 修复组件`resume`方法无法调用的问题
-- **TableAction** 修复 stopButtonPropagation 属性某些情况下不起作用的问题
-- **PageWrapper** 修复`class`属性无效的问题
-- **BasicTree** 修复`checkAll`方法会影响到`disabled`状态节点的问题
-- **BasicTable**
-  - 修复可编辑单元格不支持`ellipsis`配置的问题
-  - 修复全屏模式下看不到子组件弹出层（popconfirm 以及 select、treeSelect 等编辑组件）的问题
-  - 修复启用`expandRowByClick`时，点击不可展开的行可能会导致样式错误的问题
-  - 修复`pagination`属性动态改变不生效的问题
-  - 修复`getSelectRows`不支持树形表格子级数据的问题
-- **Dark Theme** 黑暗主题下的配色问题修正
-  - 修复`Tree`组件被选中节点的背景颜色
-  - 修复`Alert`组件的颜色配置
-  - 修复禁用状态下的`link`类型的按钮颜色问题
-  - 修复`Tree`已勾选的复选框的样式问题
-- **其它** 修复 useScript 未能自动移除 script 节点的问题
-
-## 2.6.1(2021-07-19)
-
-### ✨ Features
-
-- **NoticeList** 添加分页、超长自动省略、标题点击事件、标题删除线等功能
-- **MixSider** 优化 Mix 菜单布局时 底部折叠按钮 的样式，与其它菜单布局时的风格保持一致
-- **ApiTreeSelect** 扩展`antdv`的`TreeSelect`组件，支持远程数据源，用法类似`ApiSelect`
-- **BasicTable**
-  - 新增`ApiTreeSelect`编辑组件
-  - 新增`headerTop`插槽
-- **其它** 可以为不同的用户指定不同的后台首页：
-  - 在`getUserInfo`接口返回的用户信息中增加`homePath`字段(可选)即可为当前用户定制首页路径
-
-### 🐛 Bug Fixes
-
-- **BasicTable**
-  - 修复滚动条样式问题(移除了滚动样式补丁)
-  - 修复树形表格的带有展开图标的单元格的内容对齐问题
-  - 修复操作列的按钮在 disabled 状态下的颜色显示
-  - 修复可编辑单元格的值不能直接通过修改`dataSource`来更新显示的问题
-  - 修复使用`ApiSelect`编辑组件时的数据回显问题
-  - 修复在部分场景下编辑组件可能会报`onXXX`类型错误的问题
-- **TableAction**
-  - 仅在 `action.tooltip`存在的情况下 才创建 Tooltip 组件
-  - 修复组件内的圆形按钮内容没有居中的问题
-- **AppSearch** 修复可能会搜索隐藏菜单的问题
-- **BasicUpload** 修复处理非`array`值时报错的问题
-- **Form** 修复`FormItem`的`suffix`插槽样式问题
-- **Menu**
-  - 修复左侧混合菜单的悬停触发逻辑
-  - 修复顶栏菜单在显示包含需要隐藏的菜单项目时出错的问题
-  - 修复悬停触发模式下左侧混合菜单会在没有子菜单且被激活时直接跳转路由
-- **Breadcrumb** 修复带有重定向的菜单点击无法跳转的问题
-- **Markdown** 修复初始化异常以及不能正确地动态设置 value 的问题
-- **Modal** 确保 props 正确被传递
-- **MultipleTab** 修复可能会意外创建登录路由标签的问题
-- **BasicTree** 修复搜索功能可能导致`checkedKeys`丢失的问题
-- **CodeEditor** 修复 value 不支持 v-model 用法的问题
-- **CountdownInput** 修复不支持`input`插槽的问题
-- **ApiSelect** 修复`options-change`事件参数不是`select`所使用的标准`options`数据的问题
-- **其它**
-  - 修复菜单默认折叠的配置不起作用的问题
-  - 修复`safari`浏览器报错导致网站打不开
-  - 修复在 window 上，拉取代码后 eslint 因 endOfLine 而报错问题
-  - 修复因动态路由而产生的 `Vue Router warn`
-
-### 🎫 Chores
-
-- 添加 test 环境测试命令
-
-## 2.6.0(2021-07-04)
-
-### ✨ Features
-
-- **Axios** 新增`withToken`配置，用于控制请求是否携带 token
-- **BasicUpload**
-  - 新增在预览 `Modal` 中删除文件时触发`preview-delete` 事件
-  - `value` 支持 `v-model` 用法
-- **Route 配置**
-  - 增加`ignoreRoute`用于在`ROUTE_MAPPING`或`BACK`权限模式下仅生成菜单
-  - 增加`hidePathForChildren`配置，标识为子项目生成菜单时忽略本级`path`
-- **TableAction** 新增`tooltip`配置，可以为按钮增加 tooltip 提示
-- **CropperAvatar**
-  - 新增`value`用于设置当前头像
-  - 新增`onChange`用于接受头像剪裁并上传成功事件
-  - 新增`btnText`、`btnProps` 用于自定义上传按钮文案和属性
-  - 为剪裁`Modal`内的操作按钮添加工具提示
-- **Modal** 为右上角的操作按钮添加工具提示
-
-### 🐛 Bug Fixes
-
-- **Modal**
-  - 修复点击遮罩不能关闭的问题
-  - 修复 `setModalProps` 不支持设置 `defaultFullscreen` 的问题
-- **Table**
-  - 修复 `editComponentProps` 不支持 `onChange`的问题
-  - 修复启用`clickToRowSelect`时，点击行不会触发`selection-change`事件的问题
-  - 修复全局配置`fetchSetting`可能会被局部配置意外修改的问题
-  - 修复`handleSearchInfoFn`的参数包含多余空白键的问题
-  - 修复为 table 提供 rowSelection.onChange 时，无法手动变更 table 的选中项的问题
-  - 修复滚动条在无需显示的时候仍然持续显示的问题
-- **Icon** 修复 SvgIcon 缺少部分样式的问题
-- **Menu**
-  - 修复路由映射模式下，单级菜单刷新不会激活
-  - 修复侧边菜单底部的折叠自定义失效的问题
-- **Form** 修复`submitButtonOptions`和`resetButtonOptions`的类型定义
-- **PopConfirmButton** 移除`Button`上多余的`title`
-- **Axios** 修复非`GET`请求时，无法同时提交`params`和`data`数据的问题
-- **其它**
-  - 修复锁屏功能可以通过刷新页面或复制 URL 打开新的浏览器标签来跳过锁定状态的问题
-  - 修复多个窗口同时打开页面时，`Token` 不会同步的问题
-  - 修复`ROLE`权限模式下`hasPermission`不工作的问题
-- **Table** 修复`handleSearchInfoFn`的参数包含多余空白键的问题
-- **Tailwindcss** 移除控制台警告
-
-## 2.5.2(2021-06-27)
-
-### ⚡ Performance Improvements
-
-- **Icon** 移除 Icon 组件全局注册，防止特定情况下热更新问题
-
-### ✨ Features
-
-- **Menu** 新增 `permissionMode=PermissionModeEnum.ROUTE_MAPPING`模式
-  - 项目默认改为该模式，删除原有菜单文件
-  - 如果之前已经写好了菜单，可以更改为`PermissionModeEnum.ROLE`模式即可
-
-### 🐛 Bug Fixes
-
-- **Drawer** 修复`visible`状态异常
-
-## 2.5.1(2021-06-26)
-
-### ⚡ Performance Improvements
-
-- 升级`vue`与`ant-design-vue`版本，解决兼容问题
-- **Tree** 性能优化
-
-### 🐛 Bug Fixes
-
-- **Table** 修复分页抖动问题
-- **Upload** 确保携带自定义参数
-- **Dropdown** 修复 popConfirm 的图标显示问题
-- **Table** 修复树形表格的编辑事件不正常的问题
-- **Table** 修复当表格数据为空时，getDataSource 返回的值不是表格所使用的数据源的问题
-
-## 2.5.0(2021-06-20)
-
-## (破坏性更新) Breaking changes
-
-- 将项目`windicss`改为`tailwindcss`，解决内存溢出问题
-  - 目前项目不兼容地方有
-    - `!xl:m-4` 之类的写法需要改为`xl:!m-4`,注意只有`!`这个不兼容，没用到则不用改
-    - `windicss`自身新增的特性需要调整，比如`Attribute`模式不兼容
-
-### ✨ Refactor
-
-- 移除`useExpose`,使用组件自身提供的`expose`代替
-
-### ⚡ Performance Improvements
-
-- **Locale** 合并多语言文件，减少文件数量
-- **Utils** Mitt 默认导出由 `Class` 改为 `Function`
-- **Axios** `isTransformRequestResult`更名为`isTransformResponse`
-
-### ✨ Features
-
-- **CropperImage** `Cropper` 头像裁剪新增圆形裁剪功能
-- **CropperAvatar** 新增头像上传组件
-- **Drawer** `useDrawer`新增`closeDrawer`函数
-- **Preview** 新增`createImgPreview`图片预览函数
-- **Setup** 新增引导页示例
-- **Tests** 添加 jest 测试套件，暂不支持 Vue 组件单测
-- **Axios** 新增`authenticationScheme`配置，用于指定认证方案
-- **Setting** 新增 `sessionTimeoutProcessing` 项目配置项，用于配置会话超时如何处理
-
-### 🐛 Bug Fixes
-
-- **Modal** 修复全屏高度计算错误
-- **Modal** 修复关闭事件触发多次问题
-- **PageWrapper** 修复高度计算问题
-- **FlowChart** 修复拖放菜单丢失
-- 修复后台模式下，Iframe 路由错误
-- **PageWrapper** 修复 footer 与全局页脚同时开启时的高度计算问题
-- **Menu** 修复菜单折叠动画抖动问题
-- **Store**修复 pinia 版本升级之后类型错误
-
-## 2.4.2(2021-06-10)
-
-### ✨ Refactor
-
-- `CountTo`组件重构
-
-### ✨ Features
-
-- `radioButtonGroup` 支持`boolean`值
-- `useModalInner` 新增 `redoModalHeight`用于在 Modal 内部重设`Modal`高度
-- `useECharts` 新增`getInstance`用于获取`echart`实例
-- `TableAction` 新增 `stopButtonPropagation` 阻止操作按钮点击事件冒泡
-- `BasicTable` 在行编辑模式下，可以获取或设置其它处于列的编辑组件的值
-- `ApiSelect` 组件在`params`改变后会自动重新`fetch`数据
-- `TableImg` 组件改进
-- `BasicTable` 新增 `columns-change` 事件用于监听用户改变列排序、展示、固定状态
-- `Tinymce`支持动态修改 readonly
-- `BasicTable`新增`updateTableDataRecord`方法用于更新指定行数据
-- `useModal`新增`closeModal`方法用于关闭`Modal`
-
-### 🐛 Bug Fixes
-
-- 修复`redoModalHeight`不能减小高度的问题
-- 修复 `BasicForm`设置 schemas 数据不生效的问题
-- 修复多标签可能导致`KeepAlive`失效的问题
-- 修复默认的`axios`拦截器不能处理自定义 code 的问题
-- 修复锁屏弹窗的高度问题
-- 修复`BaiscTable`的`列展示`复选框的半选状态显示不正确的问题
-- 修复`BasicUpload`组件的预览列表某些情况下不能显示的问题
-- 修复`RadioButtonGroup`的`options`设置`disabled`不生效的问题
-- 修复`Tinymce`组件在只读模式下上传图片的按钮仍然可用的问题
-- 修复`BasicForm`特定情况下的卡顿问题
-- 修复"目录"路由不起作用的问题
-
-## 2.4.1(2021-06-01)
-
-### ✨ Features
-
-- 可编辑表格新增`DatePicker`和`TimePicker`组件
-- `Tree` 组件新增`defaultExpandLevel`配置
-
-### ⚡ Performance Improvements
-
-- 菜单搜索默认聚焦
-
-### 🐛 Bug Fixes
-
-- 修复`CodeEditor`已知问题
-- 修复`i18n`控制台警告问题
-- 修复可编辑表格`align`配置不生效问题
-- 确保`axios`只对`Object`参数进行处理
-- 修复`Tree`组件 `defaultExpandAll` 配置失效
-- 修复`TableAction` 分割线丢失问题
-- 修复表格已知问题
-- 修复首次加载或改变语言导致重载时，不会设置 HTML 的 lang 属性
-
-## 2.4.0 (2021-05-25)
-
-### ✨ Features
-
-- 新增图形编辑器示例
-- 新增代码编辑器(包含 Json 编辑器)
-- 新增 `JsonPreview`Json 数据查看组件
-- 表格的数据列(column)和操作列(actionColumn)的字段可以根据权限和业务来控制是否显示
-- 新增权限控制表格示例(AuthColumn.vue)
-- 新增用户登录过期示例
-
-### ⚡ Performance Improvements
-
-- 合并部分语言文件，减少文件数量
-
-### 🐛 Bug Fixes
-
-- 修复黑暗主题刷新闪烁的白屏
-- 修复标签页关闭其他功能失效问题
-- 修复表单已知问题
-- 修复自动锁屏失效
-
-## 2.3.0 (2021-04-10)
-
-## (破坏性更新) Breaking changes
-
-- 使用 `pinia` 替换 `vuex`,`vuex-module-decorators`。
-
-  - 影响，之前如果有自己使用 vuex-module-decorators，需要改造为 pinia。
-  - 原因：
-    - pinia 于 vuex5api 基本类似，且简单易懂。
-    - 后续切换 vuex5 成本非常低，也可以当作第三方状态管理库使用
-
-- 移除 `useKeyPress` 使用`vueuse`-`onKeyStroke`代替
-- 移除 `useDebounceFn` 使用`vueuse`-`useDebounceFn`代替
-- 移除 `useThrottle` 使用`vueuse`-`useThrottleFn`代替
-
-### ✨ Features
-
-- 标签页支持持久化保存
-
-### ✨ Refactor
-
-- 移除 `useElResize`
-
-### 🐛 Bug Fixes
-
-- 登录页样式修复
-- 修复菜单已知问题
-- 修复主题样式切换问题
-
-## 2.2.0 (2021-04-06)
-
-### ✨ Features
-
-- 新增`headerTitle` slot
-- 新增打印示例
-- 新增关于界面
-
-### ✨ Refactor
-
-- 移除 useFullScreen 函数
-- tinymce 由 Cdn 改为 npm(打包体积偏大)
-- Dashboard 重构
-- 移除 ApexCharts 及示例
-
-### 🐛 Bug Fixes
-
-- 确保面包屑正确的显示图标
-- 修复 tinymce 上传按钮全屏模式下消失问题
-- 确保 title 在重新登录后正常改变
-- 确保后台模式登录正常
-- 修复 TableAction 点击事件问题
-
-## 2.1.1 (2021-03-26)
-
-### ✨ Features
-
-- 路由新增 hideChildrenInMenu 配置。用于隐藏子菜单
-- 树形表格内置展开/折叠全部函数
-
-### ✨ Refactor
-
-- 重构路由多层模式,解决嵌套 keepalive 执行多次问题
-
-### 🐛 Bug Fixes
-
-- 确保 CountDownInput 组件重置清空值
-- 修复分割模式下在小屏幕中显示问题
-- 修复表格高度计算问题
-- 修复后台路由获取不到组件问题
-- 修复 Modal 组件 loadingTip 配置不生效
-- 修复后台权限指令不生效
-- 确保 progress 进度条正确关闭
-- 修复表格勾选列配置失效问题
-- 确保一级菜单可以被隐藏
-- 确保表单隐藏字段校验正常
-
-### 🎫 Chores
-
-- 移除 ls-lint
-
-## 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
-
-- 修复表单，动画及打包失败问题

README.md

@@ -5,67 +5,47 @@
 <h1>Vue vben admin</h1>
 </div>
 
-**English** | [中文](./README.zh-CN.md)
+## 简介
 
-## Introduction
+精简 Vue Vben Admin。
 
-Vue Vben Admin is a free and open source middle and back-end template. Using the latest `vue3`, `vite2`, `TypeScript` and other mainstream technology development, the out-of-the-box middle and back-end front-end solutions can also be used for learning reference.
+## 特性
 
-## Feature
+- **最新技术栈**：使用 Vue3/vite2 等前端前沿技术开发
+- **TypeScript**: 应用程序级 JavaScript 的语言
+- **主题**：可配置的主题
+- **国际化**：内置完善的国际化方案
+- **Mock 数据** 内置 Mock 数据方案
+- **权限** 内置完善的动态路由权限生成方案
+- **组件** 二次封装了多个常用的组件
 
-- **State of The Art Development**：Use front-end front-end technology development such as Vue3/vite2
-- **TypeScript**: Application-level JavaScript language
-- **Theming**: Configurable themes
-- **International**：Built-in complete internationalization program
-- **Mock Server** Built-in mock data scheme
-- **Authority** Built-in complete dynamic routing permission generation scheme.
-- **Component** Multiple commonly used components are encapsulated twice
+## 预览
 
-## Preview
+- [vue-vben-admin](https://vvbin.cn/next/) - 完整版中文站点
+- [vue-vben-admin-gh-pages](https://anncwb.github.io/vue-vben-admin/) - 完整版 github 站点
+- [vben-admin-thin-next](https://vvbin.cn/thin/next/) - 简化版中文站点
+- [vben-admin-thin-gh-pages](https://anncwb.github.io/vben-admin-thin-next/) - 简化版 github 站点
 
-- [vue-vben-admin](https://vvbin.cn/next/) - Full version Chinese site
-- [vue-vben-admin-gh-pages](https://anncwb.github.io/vue-vben-admin/) - Full version of the github site
-- [vben-admin-thin-next](https://vvbin.cn/thin/next/) - Simplified Chinese site
-- [vben-admin-thin-gh-pages](https://anncwb.github.io/vben-admin-thin-next/) -Simplified github site
+## 准备
 
-Test account: vben/123456
+- [node](http://nodejs.org/) 和 [git](https://git-scm.com/) -项目开发环境
+- [Vite](https://vitejs.dev/) - 熟悉 vite 特性
+- [Vue3](https://v3.vuejs.org/) - 熟悉 Vue 基础语法
+- [TypeScript](https://www.typescriptlang.org/) - 熟悉`TypeScript`基本语法
+- [Es6+](http://es6.ruanyifeng.com/) - 熟悉 es6 基本语法
+- [Vue-Router-Next](https://next.router.vuejs.org/) - 熟悉 vue-router 基本使用
+- [Ant-Design-Vue](https://2x.antdv.com/docs/vue/introduce-cn/) - ui 基本使用
+- [Mock.js](https://github.com/nuysoft/Mock) - mockjs 基本语法
 
-<p align="center">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
-</p>
+## 安装使用
 
-### Use Gitpod
-
-Open the project in Gitpod (free online dev environment for GitHub) and start coding immediately.
-
-[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/anncwb/vue-vben-admin)
-
-## Documentation
-
-[Document](https://vvbin.cn/doc-next/)
-
-## Preparation
-
-- [node](http://nodejs.org/) and [git](https://git-scm.com/) - Project development environment
-- [Vite](https://vitejs.dev/) - Familiar with vite features
-- [Vue3](https://v3.vuejs.org/) - Familiar with Vue basic syntax
-- [TypeScript](https://www.typescriptlang.org/) - Familiar with the basic syntax of `TypeScript`
-- [Es6+](http://es6.ruanyifeng.com/) - Familiar with es6 basic syntax
-- [Vue-Router-Next](https://next.router.vuejs.org/) - Familiar with the basic use of vue-router
-- [Ant-Design-Vue](https://2x.antdv.com/docs/vue/introduce-cn/) - ui basic use
-- [Mock.js](https://github.com/nuysoft/Mock) - mockjs basic syntax
-
-## Install and use
-
-- Get the project code
+- 获取项目代码
 
 ```bash
 git clone https://github.com/anncwb/vue-vben-admin.git
 ```
 
-- Installation dependencies
+- 安装依赖
 
 ```bash
 cd vue-vben-admin
@@ -74,95 +54,47 @@ pnpm install
 
 ```
 
-- run
+- 运行
 
 ```bash
 pnpm serve
 ```
 
-- build
+- 打包
 
 ```bash
 pnpm build
 ```
 
-## Change Log
-
-[CHANGELOG](./CHANGELOG.zh_CN.md)
-
-## Project
-
-- [vue-vben-admin](https://github.com/anncwb/vue-vben-admin) - full version
-- [vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next) - Simplified version
-
-## How to contribute
-
-You are very welcome to join！[Raise an issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) Or submit a Pull Request。
-
-**Pull Request:**
-
-1. Fork code!
-2. Create your own branch: `git checkout -b feat/xxxx`
-3. Submit your changes: `git commit -am 'feat(function): add xxxxx'`
-4. Push your branch: `git push origin feat/xxxx`
-5. submit`pull request`
-
-## Git Contribution submission specification
-
-- reference [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) specification ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
-
-  - `feat` Add new features
-  - `fix` Fix the problem/BUG
-  - `style` The code style is related and does not affect the running result
-  - `perf` Optimization/performance improvement
-  - `refactor` Refactor
-  - `revert` Undo edit
-  - `test` Test related
-  - `docs` Documentation/notes
-  - `chore` Dependency update/scaffolding configuration modification etc.
-  - `workflow` Workflow improvements
-  - `ci` Continuous integration
-  - `types` Type definition file changes
-  - `wip` In development
-
-## Related warehouse
-
-If these plugins are helpful to you, you can give a star support
-
-- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - Used for local and development environment data mock
-- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - Used for html template conversion and compression
-- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - Used for component library style introduction on demand
-- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - Used for online switching of theme colors and other color-related configurations
-- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin) - Used to pack compressed image resources
-- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - Used to pack input .gz|.brotil files
-- [vite-plugin-svg-icons](https://github.com/anncwb/vite-plugin-svg-icons) - Used to quickly generate svg sprite
-
-## Browser support
-
-The `Chrome 80+` browser is recommended for local development
-
-Support modern browsers, not IE
-
-| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
-| :-: | :-: | :-: | :-: | :-: |
-| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
-
-## Maintainer
-
-[@Vben](https://github.com/anncwb)
-
-## Donate
-
-If you think this project is helpful to you, you can help the author buy a cup of coffee to show your support!
-
-![donate](https://anncwb.github.io/anncwb/images/sponsor.png)
-
-<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>
-
-## Discord
-
-- [github discussions](https://github.com/anncwb/vue-vben-admin/discussions)
-- [Discord](https://discord.gg/8GuAdwDhj6)
+## Git 贡献提交规范
+
+- 参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 规范 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
+
+  - `feat` 增加新功能
+  - `fix` 修复问题/BUG
+  - `style` 代码风格相关无影响运行结果的
+  - `perf` 优化/性能提升
+  - `refactor` 重构
+  - `revert` 撤销修改
+  - `test` 测试相关
+  - `docs` 文档/注释
+  - `chore` 依赖更新/脚手架配置修改等
+  - `workflow` 工作流改进
+  - `ci` 持续集成
+  - `types` 类型定义文件更改
+  - `wip` 开发中
+
+## 相关仓库
+
+如果这些插件对你有帮助，可以给一个 star 支持下
+
+- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - 用于本地及开发环境数据 mock
+- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - 用于 html 模版转换及压缩
+- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - 用于组件库样式按需引入
+- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - 用于在线切换主题色等颜色相关配置
+- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin) - 用于打包压缩图片资源
+- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - 用于打包输出.gz|.brotil 文件
+- [vite-plugin-svg-icons](https://github.com/anncwb/vite-plugin-svg-icons) - 用于快速生成 svg 雪碧图
 
 ## License
 

README.zh-CN.md

@@ -1,175 +0,0 @@
-<div align="center"> <a href="https://github.com/anncwb/vue-vben-admin"> <img alt="VbenAdmin Logo" width="200" height="200" src="https://anncwb.github.io/anncwb/images/logo.png"> </a> <br> <br>
-
-[![license](https://img.shields.io/github/license/anncwb/vue-vben-admin.svg)](LICENSE)
-
-<h1>Vue vben admin</h1>
-</div>
-
-**中文** | [English](./README.md)
-
-## 简介
-
-Vue Vben Admin 是一个免费开源的中后台模版。使用了最新的`vue3`,`vite2`,`TypeScript`等主流技术开发，开箱即用的中后台前端解决方案，也可用于学习参考。
-
-## 特性
-
-- **最新技术栈**：使用 Vue3/vite2 等前端前沿技术开发
-- **TypeScript**: 应用程序级 JavaScript 的语言
-- **主题**：可配置的主题
-- **国际化**：内置完善的国际化方案
-- **Mock 数据** 内置 Mock 数据方案
-- **权限** 内置完善的动态路由权限生成方案
-- **组件** 二次封装了多个常用的组件
-
-## 预览
-
-- [vue-vben-admin](https://vvbin.cn/next/) - 完整版中文站点
-- [vue-vben-admin-gh-pages](https://anncwb.github.io/vue-vben-admin/) - 完整版 github 站点
-- [vben-admin-thin-next](https://vvbin.cn/thin/next/) - 简化版中文站点
-- [vben-admin-thin-gh-pages](https://anncwb.github.io/vben-admin-thin-next/) - 简化版 github 站点
-
-测试账号: vben/123456
-
-<p align="center">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview1.png">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview2.png">
-    <img alt="VbenAdmin Logo" width="100%" src="https://anncwb.github.io/anncwb/images/preview3.png">
-</p>
-
-### 使用 Gitpod
-
-在 Gitpod（适用于 GitHub 的免费在线开发环境）中打开项目，并立即开始编码.
-
-[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/anncwb/vue-vben-admin)
-
-## 文档
-
-[文档地址](https://vvbin.cn/doc-next/)
-
-## 准备
-
-- [node](http://nodejs.org/) 和 [git](https://git-scm.com/) -项目开发环境
-- [Vite](https://vitejs.dev/) - 熟悉 vite 特性
-- [Vue3](https://v3.vuejs.org/) - 熟悉 Vue 基础语法
-- [TypeScript](https://www.typescriptlang.org/) - 熟悉`TypeScript`基本语法
-- [Es6+](http://es6.ruanyifeng.com/) - 熟悉 es6 基本语法
-- [Vue-Router-Next](https://next.router.vuejs.org/) - 熟悉 vue-router 基本使用
-- [Ant-Design-Vue](https://2x.antdv.com/docs/vue/introduce-cn/) - ui 基本使用
-- [Mock.js](https://github.com/nuysoft/Mock) - mockjs 基本语法
-
-## 安装使用
-
-- 获取项目代码
-
-```bash
-git clone https://github.com/anncwb/vue-vben-admin.git
-```
-
-- 安装依赖
-
-```bash
-cd vue-vben-admin
-
-pnpm install
-
-```
-
-- 运行
-
-```bash
-pnpm serve
-```
-
-- 打包
-
-```bash
-pnpm build
-```
-
-## 更新日志
-
-[CHANGELOG](./CHANGELOG.zh_CN.md)
-
-## 项目地址
-
-- [vue-vben-admin](https://github.com/anncwb/vue-vben-admin) - 完整版
-- [vue-vben-admin-thin-next](https://github.com/anncwb/vben-admin-thin-next) - 简化版
-
-## 如何贡献
-
-非常欢迎你的加入！[提一个 Issue](https://github.com/anncwb/vue-vben-admin/issues/new/choose) 或者提交一个 Pull Request。
-
-**Pull Request:**
-
-1. Fork 代码!
-2. 创建自己的分支: `git checkout -b feat/xxxx`
-3. 提交你的修改: `git commit -am 'feat(function): add xxxxx'`
-4. 推送您的分支: `git push origin feat/xxxx`
-5. 提交`pull request`
-
-## Git 贡献提交规范
-
-- 参考 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md) 规范 ([Angular](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular))
-
-  - `feat` 增加新功能
-  - `fix` 修复问题/BUG
-  - `style` 代码风格相关无影响运行结果的
-  - `perf` 优化/性能提升
-  - `refactor` 重构
-  - `revert` 撤销修改
-  - `test` 测试相关
-  - `docs` 文档/注释
-  - `chore` 依赖更新/脚手架配置修改等
-  - `workflow` 工作流改进
-  - `ci` 持续集成
-  - `types` 类型定义文件更改
-  - `wip` 开发中
-
-## 浏览器支持
-
-本地开发推荐使用`Chrome 80+` 浏览器
-
-支持现代浏览器, 不支持 IE
-
-| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
-| :-: | :-: | :-: | :-: | :-: |
-| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
-
-## 相关仓库
-
-如果这些插件对你有帮助，可以给一个 star 支持下
-
-- [vite-plugin-mock](https://github.com/anncwb/vite-plugin-mock) - 用于本地及开发环境数据 mock
-- [vite-plugin-html](https://github.com/anncwb/vite-plugin-html) - 用于 html 模版转换及压缩
-- [vite-plugin-style-import](https://github.com/anncwb/vite-plugin-style-import) - 用于组件库样式按需引入
-- [vite-plugin-theme](https://github.com/anncwb/vite-plugin-theme) - 用于在线切换主题色等颜色相关配置
-- [vite-plugin-imagemin](https://github.com/anncwb/vite-plugin-imagemin) - 用于打包压缩图片资源
-- [vite-plugin-compression](https://github.com/anncwb/vite-plugin-compression) - 用于打包输出.gz|.brotil 文件
-- [vite-plugin-svg-icons](https://github.com/anncwb/vite-plugin-svg-icons) - 用于快速生成 svg 雪碧图
-
-## 后台整合示例
-
-- [lamp-cloud](https://github.com/zuihou/lamp-cloud) - 基于 SpringCloud Alibaba 的微服务中后台快速开发平台
-- [matecloud](https://github.com/matevip/matecloud) - MateCloud 微服务脚手架，基于 Spring Cloud 2020.0.3、SpringBoot 2.5.3 的全开源平台
-
-## 维护者
-
-[@Vben](https://github.com/anncwb)
-
-## 捐赠
-
-如果你觉得这个项目对你有帮助，你可以帮作者买一杯咖啡表示支持!
-
-![donate](https://anncwb.github.io/anncwb/images/sponsor.png)
-
-<a style="display: block;width: 100px;height: 50px;line-height: 50px; color: #fff;text-align: center; background: #408aed;border-radius: 4px;" href="https://www.paypal.com/paypalme/cvvben">Paypal Me</a>
-
-## 交流
-
-`Vue-vben-Admin` 是完全开源免费的项目，在帮助开发者更方便地进行中大型管理系统开发，同时也提供 QQ 交流群使用问题欢迎在群内提问。
-
-- QQ 群 `569291866`
-
-## License
-
-[MIT © Vben-2020](./LICENSE)

build/vite/plugin/index.ts

@@ -1,20 +1,20 @@
-import { PluginOption } from 'vite';
-import vue from '@vitejs/plugin-vue';
-import vueJsx from '@vitejs/plugin-vue-jsx';
-import legacy from '@vitejs/plugin-legacy';
-import purgeIcons from 'vite-plugin-purge-icons';
-import windiCSS from 'vite-plugin-windicss';
-import VitePluginCertificate from 'vite-plugin-mkcert';
+import { PluginOption } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import vueJsx from '@vitejs/plugin-vue-jsx'
+import legacy from '@vitejs/plugin-legacy'
+import purgeIcons from 'vite-plugin-purge-icons'
+import windiCSS from 'vite-plugin-windicss'
+import VitePluginCertificate from 'vite-plugin-mkcert'
 //import vueSetupExtend from 'vite-plugin-vue-setup-extend';
-import { configHtmlPlugin } from './html';
-import { configPwaConfig } from './pwa';
-import { configMockPlugin } from './mock';
-import { configCompressPlugin } from './compress';
-import { configStyleImportPlugin } from './styleImport';
-import { configVisualizerConfig } from './visualizer';
-import { configThemePlugin } from './theme';
-import { configImageminPlugin } from './imagemin';
-import { configSvgIconsPlugin } from './svgSprite';
+import { configHtmlPlugin } from './html'
+import { configPwaConfig } from './pwa'
+import { configMockPlugin } from './mock'
+import { configCompressPlugin } from './compress'
+import { configStyleImportPlugin } from './styleImport'
+import { configVisualizerConfig } from './visualizer'
+import { configThemePlugin } from './theme'
+import { configImageminPlugin } from './imagemin'
+import { configSvgIconsPlugin } from './svgSprite'
 
 export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) {
   const {
@@ -23,7 +23,7 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) {
     VITE_LEGACY,
     VITE_BUILD_COMPRESS,
     VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE,
-  } = viteEnv;
+  } = viteEnv
 
   const vitePlugins: (PluginOption | PluginOption[])[] = [
     // have to
@@ -35,48 +35,48 @@ export function createVitePlugins(viteEnv: ViteEnv, isBuild: boolean) {
     VitePluginCertificate({
       source: 'coding',
     }),
-  ];
+  ]
 
   // vite-plugin-windicss
-  vitePlugins.push(windiCSS());
+  vitePlugins.push(windiCSS())
 
   // @vitejs/plugin-legacy
-  VITE_LEGACY && isBuild && vitePlugins.push(legacy());
+  VITE_LEGACY && isBuild && vitePlugins.push(legacy())
 
   // vite-plugin-html
-  vitePlugins.push(configHtmlPlugin(viteEnv, isBuild));
+  vitePlugins.push(configHtmlPlugin(viteEnv, isBuild))
 
   // vite-plugin-svg-icons
-  vitePlugins.push(configSvgIconsPlugin(isBuild));
+  vitePlugins.push(configSvgIconsPlugin(isBuild))
 
   // vite-plugin-mock
-  VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild));
+  VITE_USE_MOCK && vitePlugins.push(configMockPlugin(isBuild))
 
   // vite-plugin-purge-icons
-  vitePlugins.push(purgeIcons());
+  vitePlugins.push(purgeIcons())
 
   // vite-plugin-style-import
-  vitePlugins.push(configStyleImportPlugin(isBuild));
+  vitePlugins.push(configStyleImportPlugin(isBuild))
 
   // rollup-plugin-visualizer
-  vitePlugins.push(configVisualizerConfig());
+  vitePlugins.push(configVisualizerConfig())
 
   // vite-plugin-theme
-  vitePlugins.push(configThemePlugin(isBuild));
+  vitePlugins.push(configThemePlugin(isBuild))
 
   // The following plugins only work in the production environment
   if (isBuild) {
     // vite-plugin-imagemin
-    VITE_USE_IMAGEMIN && vitePlugins.push(configImageminPlugin());
+    VITE_USE_IMAGEMIN && vitePlugins.push(configImageminPlugin())
 
     // rollup-plugin-gzip
     vitePlugins.push(
       configCompressPlugin(VITE_BUILD_COMPRESS, VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE),
-    );
+    )
 
     // vite-plugin-pwa
-    vitePlugins.push(configPwaConfig(viteEnv));
+    vitePlugins.push(configPwaConfig(viteEnv))
   }
 
-  return vitePlugins;
+  return vitePlugins
 }

build/vite/plugin/styleImport.ts

@@ -2,11 +2,11 @@
  *  Introduces component library styles on demand.
  * https://github.com/anncwb/vite-plugin-style-import
  */
-import { createStyleImportPlugin } from 'vite-plugin-style-import';
+import { createStyleImportPlugin } from 'vite-plugin-style-import'
 
 export function configStyleImportPlugin(_isBuild: boolean) {
   if (!_isBuild) {
-    return [];
+    return []
   }
   const styleImportPlugin = createStyleImportPlugin({
     libs: [
@@ -45,7 +45,7 @@ export function configStyleImportPlugin(_isBuild: boolean) {
             'skeleton-paragraph',
             'skeleton-image',
             'skeleton-button',
-          ];
+          ]
           // 这里是需要额外引入样式的子组件列表
           // 单独引入子组件时需引入组件样式，否则会在打包后导致子组件样式丢失
           const replaceList = {
@@ -66,16 +66,16 @@ export function configStyleImportPlugin(_isBuild: boolean) {
             'month-picker': 'date-picker',
             'range-picker': 'date-picker',
             'image-preview-group': 'image',
-          };
+          }
 
           return ignoreList.includes(name)
             ? ''
             : replaceList.hasOwnProperty(name)
             ? `ant-design-vue/es/${replaceList[name]}/style/index`
-            : `ant-design-vue/es/${name}/style/index`;
+            : `ant-design-vue/es/${name}/style/index`
         },
       },
     ],
-  });
-  return styleImportPlugin;
+  })
+  return styleImportPlugin
 }

commitlint.config.js

@@ -1,11 +1,11 @@
-const fs = require('fs');
-const path = require('path');
-const { execSync } = require('child_process');
+const fs = require('fs')
+const path = require('path')
+const { execSync } = require('child_process')
 
 const scopes = fs
   .readdirSync(path.resolve(__dirname, 'src'), { withFileTypes: true })
   .filter((dirent) => dirent.isDirectory())
-  .map((dirent) => dirent.name.replace(/s$/, ''));
+  .map((dirent) => dirent.name.replace(/s$/, ''))
 
 // precomputed scope
 const scopeComplete = execSync('git status --porcelain || true')
@@ -15,7 +15,7 @@ const scopeComplete = execSync('git status --porcelain || true')
   .find((r) => ~r.indexOf('M  src'))
   ?.replace(/(\/)/g, '%%')
   ?.match(/src%%((\w|-)*)/)?.[1]
-  ?.replace(/s$/, '');
+  ?.replace(/s$/, '')
 
 /** @type {import('cz-git').UserConfig} */
 module.exports = {
@@ -104,4 +104,4 @@ module.exports = {
     // emptyScopesAlias: 'empty:      不填写',
     // customScopesAlias: 'custom:     自定义',
   },
-};
+}

index.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en" id="htmlRoot">
+<html lang="zh-cn" id="htmlRoot">
   <head>
     <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
@@ -13,14 +13,14 @@
   </head>
   <body>
     <script>
-      (() => {
-        var htmlRoot = document.getElementById('htmlRoot');
-        var theme = window.localStorage.getItem('__APP__DARK__MODE__');
+      ;(() => {
+        var htmlRoot = document.getElementById('htmlRoot')
+        var theme = window.localStorage.getItem('__APP__DARK__MODE__')
         if (htmlRoot && theme) {
-          htmlRoot.setAttribute('data-theme', theme);
-          theme = htmlRoot = null;
+          htmlRoot.setAttribute('data-theme', theme)
+          theme = htmlRoot = null
         }
-      })();
+      })()
     </script>
     <div id="app">
       <style>

mock/sys/menu.ts

@@ -1,6 +1,6 @@
-import { resultSuccess, resultError, getRequestToken, requestParams } from '../_util';
-import { MockMethod } from 'vite-plugin-mock';
-import { createFakeUserList } from './user';
+import { resultSuccess, resultError, getRequestToken, requestParams } from '../_util'
+import { MockMethod } from 'vite-plugin-mock'
+import { createFakeUserList } from './user'
 
 // single
 const dashboardRoute = {
@@ -39,7 +39,7 @@ const dashboardRoute = {
       },
     },
   ],
-};
+}
 
 const backRoute = {
   path: 'back',
@@ -66,7 +66,7 @@ const backRoute = {
       },
     },
   ],
-};
+}
 
 const authRoute = {
   path: '/permission',
@@ -78,7 +78,7 @@ const authRoute = {
     title: 'routes.demo.permission.permission',
   },
   children: [backRoute],
-};
+}
 
 const levelRoute = {
   path: '/level',
@@ -134,7 +134,7 @@ const levelRoute = {
       },
     },
   ],
-};
+}
 
 const sysRoute = {
   path: '/system',
@@ -176,16 +176,6 @@ const sysRoute = {
       },
       component: '/demo/system/role/index',
     },
-
-    {
-      path: 'menu',
-      name: 'MenuManagement',
-      meta: {
-        title: 'routes.demo.system.menu',
-        ignoreKeepAlive: true,
-      },
-      component: '/demo/system/menu/index',
-    },
     {
       path: 'dept',
       name: 'DeptManagement',
@@ -205,7 +195,7 @@ const sysRoute = {
       component: '/demo/system/password/index',
     },
   ],
-};
+}
 
 const linkRoute = {
   path: '/link',
@@ -233,7 +223,7 @@ const linkRoute = {
       },
     },
   ],
-};
+}
 
 export default [
   {
@@ -241,30 +231,30 @@ export default [
     timeout: 1000,
     method: 'get',
     response: (request: requestParams) => {
-      const token = getRequestToken(request);
+      const token = getRequestToken(request)
       if (!token) {
-        return resultError('Invalid token!');
+        return resultError('Invalid token!')
       }
-      const checkUser = createFakeUserList().find((item) => item.token === token);
+      const checkUser = createFakeUserList().find((item) => item.token === token)
       if (!checkUser) {
-        return resultError('Invalid user token!');
+        return resultError('Invalid user token!')
       }
-      const id = checkUser.userId;
-      let menu: Object[];
+      const id = checkUser.userId
+      let menu: Object[]
       switch (id) {
         case '1':
-          dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[0].path;
-          menu = [dashboardRoute, authRoute, levelRoute, sysRoute, linkRoute];
-          break;
+          dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[0].path
+          menu = [dashboardRoute, authRoute, levelRoute, sysRoute, linkRoute]
+          break
         case '2':
-          dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[1].path;
-          menu = [dashboardRoute, authRoute, levelRoute, linkRoute];
-          break;
+          dashboardRoute.redirect = dashboardRoute.path + '/' + dashboardRoute.children[1].path
+          menu = [dashboardRoute, authRoute, levelRoute, linkRoute]
+          break
         default:
-          menu = [];
+          menu = []
       }
 
-      return resultSuccess(menu);
+      return resultSuccess(menu)
     },
   },
-] as MockMethod[];
+] as MockMethod[]

package.json

@@ -56,8 +56,6 @@
     "nprogress": "^0.2.0",
     "path-to-regexp": "^6.2.0",
     "pinia": "2.0.12",
-    "print-js": "^1.6.0",
-    "qrcode": "^1.5.0",
     "qs": "^6.10.3",
     "resize-observer-polyfill": "^1.5.1",
     "showdown": "^2.1.0",
@@ -85,7 +83,6 @@
     "@types/mockjs": "^1.0.6",
     "@types/node": "^17.0.25",
     "@types/nprogress": "^0.2.0",
-    "@types/qrcode": "^1.4.2",
     "@types/qs": "^6.9.7",
     "@types/showdown": "^1.9.4",
     "@types/sortablejs": "^1.10.7",
@@ -99,8 +96,8 @@
     "autoprefixer": "^10.4.4",
     "conventional-changelog-cli": "^2.2.2",
     "cross-env": "^7.0.3",
-    "cz-git": "^1.3.9",
-    "czg": "^1.3.9",
+    "cz-git": "^1.3.11",
+    "czg": "^1.3.11",
     "dotenv": "^16.0.0",
     "eslint": "^8.13.0",
     "eslint-config-prettier": "^8.5.0",

prettier.config.js

@@ -1,10 +1,10 @@
 module.exports = {
   printWidth: 100,
-  semi: true,
+  semi: false,
   vueIndentScriptAndStyle: true,
   singleQuote: true,
   trailingComma: 'all',
   proseWrap: 'never',
   htmlWhitespaceSensitivity: 'strict',
   endOfLine: 'auto',
-};
+}

src/App.vue

@@ -7,15 +7,15 @@
 </template>
 
 <script lang="ts" setup>
-  import { ConfigProvider } from 'ant-design-vue';
-  import { AppProvider } from '/@/components/Application';
-  import { useTitle } from '/@/hooks/web/useTitle';
-  import { useLocale } from '/@/locales/useLocale';
+  import { ConfigProvider } from 'ant-design-vue'
+  import { AppProvider } from '/@/components/Application'
+  import { useTitle } from '/@/hooks/web/useTitle'
+  import { useLocale } from '/@/locales/useLocale'
 
-  import 'dayjs/locale/zh-cn';
+  import 'dayjs/locale/zh-cn'
   // support Multi-language
-  const { getAntdLocale } = useLocale();
+  const { getAntdLocale } = useLocale()
 
   // Listening to page changes and dynamically changing site titles
-  useTitle();
+  useTitle()
 </script>

src/api/demo/account.ts

@@ -1,5 +1,5 @@
-import { defHttp } from '/@/utils/http/axios';
-import { GetAccountInfoModel } from './model/accountModel';
+import { defHttp } from '/@/utils/http/axios'
+import { GetAccountInfoModel } from './model/accountModel'
 
 enum Api {
   ACCOUNT_INFO = '/account/getAccountInfo',
@@ -9,8 +9,8 @@ enum Api {
 
 // Get personal center-basic settings
 
-export const accountInfoApi = () => defHttp.get<GetAccountInfoModel>({ url: Api.ACCOUNT_INFO });
+export const accountInfoApi = () => defHttp.get<GetAccountInfoModel>({ url: Api.ACCOUNT_INFO })
 
-export const sessionTimeoutApi = () => defHttp.post<void>({ url: Api.SESSION_TIMEOUT });
+export const sessionTimeoutApi = () => defHttp.post<void>({ url: Api.SESSION_TIMEOUT })
 
-export const tokenExpiredApi = () => defHttp.post<void>({ url: Api.TOKEN_EXPIRED });
+export const tokenExpiredApi = () => defHttp.post<void>({ url: Api.TOKEN_EXPIRED })

src/api/demo/cascader.ts

@@ -1,9 +1,9 @@
-import { defHttp } from '/@/utils/http/axios';
-import { AreaModel, AreaParams } from '/@/api/demo/model/areaModel';
+import { defHttp } from '/@/utils/http/axios'
+import { AreaModel, AreaParams } from '/@/api/demo/model/areaModel'
 
 enum Api {
   AREA_RECORD = '/cascader/getAreaRecord',
 }
 
 export const areaRecord = (data: AreaParams) =>
-  defHttp.post<AreaModel>({ url: Api.AREA_RECORD, data });
+  defHttp.post<AreaModel>({ url: Api.AREA_RECORD, data })

src/api/demo/error.ts

@@ -1,4 +1,4 @@
-import { defHttp } from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios'
 
 enum Api {
   // The address does not exist
@@ -9,4 +9,4 @@ enum Api {
  * @description: Trigger ajax error
  */
 
-export const fireErrorApi = () => defHttp.get({ url: Api.Error });
+export const fireErrorApi = () => defHttp.get({ url: Api.Error })

src/api/demo/model/accountModel.ts

@@ -1,7 +1,7 @@
 export interface GetAccountInfoModel {
-  email: string;
-  name: string;
-  introduction: string;
-  phone: string;
-  address: string;
+  email: string
+  name: string
+  introduction: string
+  phone: string
+  address: string
 }

src/api/demo/model/areaModel.ts

@@ -1,12 +1,12 @@
 export interface AreaModel {
-  id: string;
-  code: string;
-  parentCode: string;
-  name: string;
-  levelType: number;
-  [key: string]: string | number;
+  id: string
+  code: string
+  parentCode: string
+  name: string
+  levelType: number
+  [key: string]: string | number
 }
 
 export interface AreaParams {
-  parentCode: string;
+  parentCode: string
 }

src/api/demo/model/optionsModel.ts

@@ -1,15 +1,15 @@
-import { BasicFetchResult } from '/@/api/model/baseModel';
+import { BasicFetchResult } from '/@/api/model/baseModel'
 
 export interface DemoOptionsItem {
-  label: string;
-  value: string;
+  label: string
+  value: string
 }
 
 export interface selectParams {
-  id: number | string;
+  id: number | string
 }
 
 /**
  * @description: Request list return value
  */
-export type DemoOptionsGetResultModel = BasicFetchResult<DemoOptionsItem>;
+export type DemoOptionsGetResultModel = BasicFetchResult<DemoOptionsItem>

src/api/demo/model/systemModel.ts

@@ -1,74 +1,74 @@
-import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
+import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel'
 
 export type AccountParams = BasicPageParams & {
-  account?: string;
-  nickname?: string;
-};
+  account?: string
+  nickname?: string
+}
 
 export type RoleParams = {
-  roleName?: string;
-  status?: string;
-};
+  roleName?: string
+  status?: string
+}
 
-export type RolePageParams = BasicPageParams & RoleParams;
+export type RolePageParams = BasicPageParams & RoleParams
 
 export type DeptParams = {
-  deptName?: string;
-  status?: string;
-};
+  deptName?: string
+  status?: string
+}
 
 export type MenuParams = {
-  menuName?: string;
-  status?: string;
-};
+  menuName?: string
+  status?: string
+}
 
 export interface AccountListItem {
-  id: string;
-  account: string;
-  email: string;
-  nickname: string;
-  role: number;
-  createTime: string;
-  remark: string;
-  status: number;
+  id: string
+  account: string
+  email: string
+  nickname: string
+  role: number
+  createTime: string
+  remark: string
+  status: number
 }
 
 export interface DeptListItem {
-  id: string;
-  orderNo: string;
-  createTime: string;
-  remark: string;
-  status: number;
+  id: string
+  orderNo: string
+  createTime: string
+  remark: string
+  status: number
 }
 
 export interface MenuListItem {
-  id: string;
-  orderNo: string;
-  createTime: string;
-  status: number;
-  icon: string;
-  component: string;
-  permission: string;
+  id: string
+  orderNo: string
+  createTime: string
+  status: number
+  icon: string
+  component: string
+  permission: string
 }
 
 export interface RoleListItem {
-  id: string;
-  roleName: string;
-  roleValue: string;
-  status: number;
-  orderNo: string;
-  createTime: string;
+  id: string
+  roleName: string
+  roleValue: string
+  status: number
+  orderNo: string
+  createTime: string
 }
 
 /**
  * @description: Request list return value
  */
-export type AccountListGetResultModel = BasicFetchResult<AccountListItem>;
+export type AccountListGetResultModel = BasicFetchResult<AccountListItem>
 
-export type DeptListGetResultModel = BasicFetchResult<DeptListItem>;
+export type DeptListGetResultModel = BasicFetchResult<DeptListItem>
 
-export type MenuListGetResultModel = BasicFetchResult<MenuListItem>;
+export type MenuListGetResultModel = BasicFetchResult<MenuListItem>
 
-export type RolePageListGetResultModel = BasicFetchResult<RoleListItem>;
+export type RolePageListGetResultModel = BasicFetchResult<RoleListItem>
 
-export type RoleListGetResultModel = RoleListItem[];
+export type RoleListGetResultModel = RoleListItem[]

src/api/demo/model/tableModel.ts

@@ -1,20 +1,20 @@
-import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel';
+import { BasicPageParams, BasicFetchResult } from '/@/api/model/baseModel'
 /**
  * @description: Request list interface parameters
  */
-export type DemoParams = BasicPageParams;
+export type DemoParams = BasicPageParams
 
 export interface DemoListItem {
-  id: string;
-  beginTime: string;
-  endTime: string;
-  address: string;
-  name: string;
-  no: number;
-  status: number;
+  id: string
+  beginTime: string
+  endTime: string
+  address: string
+  name: string
+  no: number
+  status: number
 }
 
 /**
  * @description: Request list return value
  */
-export type DemoListGetResultModel = BasicFetchResult<DemoListItem>;
+export type DemoListGetResultModel = BasicFetchResult<DemoListItem>

src/api/demo/select.ts

@@ -1,5 +1,5 @@
-import { defHttp } from '/@/utils/http/axios';
-import { DemoOptionsItem, selectParams } from './model/optionsModel';
+import { defHttp } from '/@/utils/http/axios'
+import { DemoOptionsItem, selectParams } from './model/optionsModel'
 enum Api {
   OPTIONS_LIST = '/select/getDemoOptions',
 }
@@ -8,4 +8,4 @@ enum Api {
  * @description: Get sample options value
  */
 export const optionsListApi = (params?: selectParams) =>
-  defHttp.get<DemoOptionsItem[]>({ url: Api.OPTIONS_LIST, params });
+  defHttp.get<DemoOptionsItem[]>({ url: Api.OPTIONS_LIST, params })

src/api/demo/system.ts

@@ -9,8 +9,8 @@ import {
   AccountListGetResultModel,
   RolePageListGetResultModel,
   RoleListGetResultModel,
-} from './model/systemModel';
-import { defHttp } from '/@/utils/http/axios';
+} from './model/systemModel'
+import { defHttp } from '/@/utils/http/axios'
 
 enum Api {
   AccountList = '/system/getAccountList',
@@ -23,22 +23,22 @@ enum Api {
 }
 
 export const getAccountList = (params: AccountParams) =>
-  defHttp.get<AccountListGetResultModel>({ url: Api.AccountList, params });
+  defHttp.get<AccountListGetResultModel>({ url: Api.AccountList, params })
 
 export const getDeptList = (params?: DeptListItem) =>
-  defHttp.get<DeptListGetResultModel>({ url: Api.DeptList, params });
+  defHttp.get<DeptListGetResultModel>({ url: Api.DeptList, params })
 
 export const getMenuList = (params?: MenuParams) =>
-  defHttp.get<MenuListGetResultModel>({ url: Api.MenuList, params });
+  defHttp.get<MenuListGetResultModel>({ url: Api.MenuList, params })
 
 export const getRoleListByPage = (params?: RolePageParams) =>
-  defHttp.get<RolePageListGetResultModel>({ url: Api.RolePageList, params });
+  defHttp.get<RolePageListGetResultModel>({ url: Api.RolePageList, params })
 
 export const getAllRoleList = (params?: RoleParams) =>
-  defHttp.get<RoleListGetResultModel>({ url: Api.GetAllRoleList, params });
+  defHttp.get<RoleListGetResultModel>({ url: Api.GetAllRoleList, params })
 
 export const setRoleStatus = (id: number, status: string) =>
-  defHttp.post({ url: Api.setRoleStatus, params: { id, status } });
+  defHttp.post({ url: Api.setRoleStatus, params: { id, status } })
 
 export const isAccountExist = (account: string) =>
-  defHttp.post({ url: Api.IsAccountExist, params: { account } }, { errorMessageMode: 'none' });
+  defHttp.post({ url: Api.IsAccountExist, params: { account } }, { errorMessageMode: 'none' })

src/api/demo/table.ts

@@ -1,5 +1,5 @@
-import { defHttp } from '/@/utils/http/axios';
-import { DemoParams, DemoListGetResultModel } from './model/tableModel';
+import { defHttp } from '/@/utils/http/axios'
+import { DemoParams, DemoListGetResultModel } from './model/tableModel'
 
 enum Api {
   DEMO_LIST = '/table/getDemoList',
@@ -17,4 +17,4 @@ export const demoListApi = (params: DemoParams) =>
       // @ts-ignore
       ignoreCancelToken: true,
     },
-  });
+  })

src/api/demo/tree.ts

@@ -1,4 +1,4 @@
-import { defHttp } from '/@/utils/http/axios';
+import { defHttp } from '/@/utils/http/axios'
 
 enum Api {
   TREE_OPTIONS_LIST = '/tree/getDemoOptions',
@@ -8,4 +8,4 @@ enum Api {
  * @description: Get sample options value
  */
 export const treeOptionsListApi = (params?: Recordable) =>
-  defHttp.get<Recordable[]>({ url: Api.TREE_OPTIONS_LIST, params });
+  defHttp.get<Recordable[]>({ url: Api.TREE_OPTIONS_LIST, params })

src/api/model/baseModel.ts

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

src/api/sys/menu.ts

@@ -1,5 +1,5 @@
-import { defHttp } from '/@/utils/http/axios';
-import { getMenuListResultModel } from './model/menuModel';
+import { defHttp } from '/@/utils/http/axios'
+import { getMenuListResultModel } from './model/menuModel'
 
 enum Api {
   GetMenuList = '/getMenuList',
@@ -10,5 +10,5 @@ enum Api {
  */
 
 export const getMenuList = () => {
-  return defHttp.get<getMenuListResultModel>({ url: Api.GetMenuList });
-};
+  return defHttp.get<getMenuListResultModel>({ url: Api.GetMenuList })
+}

src/api/sys/model/menuModel.ts

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

src/api/sys/model/uploadModel.ts

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

src/api/sys/model/userModel.ts

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

src/api/sys/upload.ts

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

src/api/sys/user.ts

@@ -1,7 +1,7 @@
-import { defHttp } from '/@/utils/http/axios';
-import { LoginParams, LoginResultModel, GetUserInfoModel } from './model/userModel';
+import { defHttp } from '/@/utils/http/axios'
+import { LoginParams, LoginResultModel, GetUserInfoModel } from './model/userModel'
 
-import { ErrorMessageMode } from '/#/axios';
+import { ErrorMessageMode } from '/#/axios'
 
 enum Api {
   Login = '/login',
@@ -23,22 +23,22 @@ export function loginApi(params: LoginParams, mode: ErrorMessageMode = 'modal')
     {
       errorMessageMode: mode,
     },
-  );
+  )
 }
 
 /**
  * @description: getUserInfo
  */
 export function getUserInfo() {
-  return defHttp.get<GetUserInfoModel>({ url: Api.GetUserInfo }, { errorMessageMode: 'none' });
+  return defHttp.get<GetUserInfoModel>({ url: Api.GetUserInfo }, { errorMessageMode: 'none' })
 }
 
 export function getPermCode() {
-  return defHttp.get<string[]>({ url: Api.GetPermCode });
+  return defHttp.get<string[]>({ url: Api.GetPermCode })
 }
 
 export function doLogout() {
-  return defHttp.get({ url: Api.Logout });
+  return defHttp.get({ url: Api.Logout })
 }
 
 export function testRetry() {
@@ -51,5 +51,5 @@ export function testRetry() {
         waitTime: 1000,
       },
     },
-  );
+  )
 }

src/components/Application/index.ts

@@ -1,15 +1,15 @@
-import { withInstall } from '/@/utils';
+import { withInstall } from '/@/utils'
 
-import appLogo from './src/AppLogo.vue';
-import appProvider from './src/AppProvider.vue';
-import appSearch from './src/search/AppSearch.vue';
-import appLocalePicker from './src/AppLocalePicker.vue';
-import appDarkModeToggle from './src/AppDarkModeToggle.vue';
+import appLogo from './src/AppLogo.vue'
+import appProvider from './src/AppProvider.vue'
+import appSearch from './src/search/AppSearch.vue'
+import appLocalePicker from './src/AppLocalePicker.vue'
+import appDarkModeToggle from './src/AppDarkModeToggle.vue'
 
-export { useAppProviderContext } from './src/useAppContext';
+export { useAppProviderContext } from './src/useAppContext'
 
-export const AppLogo = withInstall(appLogo);
-export const AppProvider = withInstall(appProvider);
-export const AppSearch = withInstall(appSearch);
-export const AppLocalePicker = withInstall(appLocalePicker);
-export const AppDarkModeToggle = withInstall(appDarkModeToggle);
+export const AppLogo = withInstall(appLogo)
+export const AppProvider = withInstall(appProvider)
+export const AppSearch = withInstall(appSearch)
+export const AppLocalePicker = withInstall(appLocalePicker)
+export const AppDarkModeToggle = withInstall(appDarkModeToggle)

src/components/Application/src/AppDarkModeToggle.vue

@@ -6,32 +6,32 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed, unref } from 'vue';
-  import { SvgIcon } from '/@/components/Icon';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useRootSetting } from '/@/hooks/setting/useRootSetting';
-  import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground';
-  import { updateDarkTheme } from '/@/logics/theme/dark';
-  import { ThemeEnum } from '/@/enums/appEnum';
+  import { computed, unref } from 'vue'
+  import { SvgIcon } from '/@/components/Icon'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useRootSetting } from '/@/hooks/setting/useRootSetting'
+  import { updateHeaderBgColor, updateSidebarBgColor } from '/@/logics/theme/updateBackground'
+  import { updateDarkTheme } from '/@/logics/theme/dark'
+  import { ThemeEnum } from '/@/enums/appEnum'
 
-  const { prefixCls } = useDesign('dark-switch');
-  const { getDarkMode, setDarkMode, getShowDarkModeToggle } = useRootSetting();
+  const { prefixCls } = useDesign('dark-switch')
+  const { getDarkMode, setDarkMode, getShowDarkModeToggle } = useRootSetting()
 
-  const isDark = computed(() => getDarkMode.value === ThemeEnum.DARK);
+  const isDark = computed(() => getDarkMode.value === ThemeEnum.DARK)
 
   const getClass = computed(() => [
     prefixCls,
     {
       [`${prefixCls}--dark`]: unref(isDark),
     },
-  ]);
+  ])
 
   function toggleDarkMode() {
-    const darkMode = getDarkMode.value === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK;
-    setDarkMode(darkMode);
-    updateDarkTheme(darkMode);
-    updateHeaderBgColor();
-    updateSidebarBgColor();
+    const darkMode = getDarkMode.value === ThemeEnum.DARK ? ThemeEnum.LIGHT : ThemeEnum.DARK
+    setDarkMode(darkMode)
+    updateDarkTheme(darkMode)
+    updateHeaderBgColor()
+    updateSidebarBgColor()
   }
 </script>
 <style lang="less" scoped>

src/components/Application/src/AppLocalePicker.vue

@@ -18,13 +18,13 @@
   </Dropdown>
 </template>
 <script lang="ts" setup>
-  import type { LocaleType } from '/#/config';
-  import type { DropMenu } from '/@/components/Dropdown';
-  import { 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 type { LocaleType } from '/#/config'
+  import type { DropMenu } from '/@/components/Dropdown'
+  import { 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'
 
   const props = defineProps({
     /**
@@ -35,35 +35,35 @@
      * Whether to refresh the interface when changing
      */
     reload: { type: Boolean },
-  });
+  })
 
-  const selectedKeys = ref<string[]>([]);
+  const selectedKeys = ref<string[]>([])
 
-  const { changeLocale, getLocale } = useLocale();
+  const { changeLocale, getLocale } = useLocale()
 
   const getLocaleText = computed(() => {
-    const key = selectedKeys.value[0];
+    const key = selectedKeys.value[0]
     if (!key) {
-      return '';
+      return ''
     }
-    return localeList.find((item) => item.event === key)?.text;
-  });
+    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;
+      return
     }
-    toggleLocale(menu.event as string);
+    toggleLocale(menu.event as string)
   }
 </script>
 

src/components/Application/src/AppLogo.vue

@@ -11,13 +11,13 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed, unref } 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 { PageEnum } from '/@/enums/pageEnum';
-  import { useUserStore } from '/@/store/modules/user';
+  import { computed, unref } 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 { PageEnum } from '/@/enums/pageEnum'
+  import { useUserStore } from '/@/store/modules/user'
 
   const props = defineProps({
     /**
@@ -32,29 +32,29 @@
      * The title is also displayed when the menu is collapsed
      */
     alwaysShowTitle: { type: Boolean },
-  });
+  })
 
-  const { prefixCls } = useDesign('app-logo');
-  const { getCollapsedShowTitle } = useMenuSetting();
-  const userStore = useUserStore();
-  const { title } = useGlobSetting();
-  const go = useGo();
+  const { prefixCls } = useDesign('app-logo')
+  const { getCollapsedShowTitle } = useMenuSetting()
+  const userStore = useUserStore()
+  const { title } = useGlobSetting()
+  const go = useGo()
 
   const getAppLogoClass = computed(() => [
     prefixCls,
     props.theme,
     { 'collapsed-show-title': unref(getCollapsedShowTitle) },
-  ]);
+  ])
 
   const getTitleClass = computed(() => [
     `${prefixCls}__title`,
     {
       'xs:opacity-0': !props.alwaysShowTitle,
     },
-  ]);
+  ])
 
   function goHome() {
-    go(userStore.getUserInfo.homePath || PageEnum.BASE_HOME);
+    go(userStore.getUserInfo.homePath || PageEnum.BASE_HOME)
   }
 </script>
 <style lang="less" scoped>

src/components/Application/src/AppProvider.vue

@@ -1,41 +1,41 @@
 <script lang="ts">
-  import { defineComponent, toRefs, ref, unref } from 'vue';
-  import { createAppProviderContext } from './useAppContext';
-  import { createBreakpointListen } from '/@/hooks/event/useBreakpoint';
-  import { prefixCls } from '/@/settings/designSetting';
-  import { useAppStore } from '/@/store/modules/app';
-  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum';
+  import { defineComponent, toRefs, ref, unref } from 'vue'
+  import { createAppProviderContext } from './useAppContext'
+  import { createBreakpointListen } from '/@/hooks/event/useBreakpoint'
+  import { prefixCls } from '/@/settings/designSetting'
+  import { useAppStore } from '/@/store/modules/app'
+  import { MenuModeEnum, MenuTypeEnum } from '/@/enums/menuEnum'
 
   const props = {
     /**
      * class style prefix
      */
     prefixCls: { type: String, default: prefixCls },
-  };
+  }
 
   export default defineComponent({
     name: 'AppProvider',
     inheritAttrs: false,
     props,
     setup(props, { slots }) {
-      const isMobile = ref(false);
-      const isSetState = ref(false);
+      const isMobile = ref(false)
+      const isSetState = ref(false)
 
-      const appStore = useAppStore();
+      const appStore = useAppStore()
 
       // Monitor screen breakpoint information changes
       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);
+      const { prefixCls } = toRefs(props)
 
       // Inject variables into the global
-      createAppProviderContext({ prefixCls, isMobile });
+      createAppProviderContext({ prefixCls, isMobile })
 
       /**
        * Used to maintain the state before the window changes
@@ -43,7 +43,7 @@
       function handleRestoreState() {
         if (unref(isMobile)) {
           if (!unref(isSetState)) {
-            isSetState.value = true;
+            isSetState.value = true
             const {
               menuSetting: {
                 type: menuType,
@@ -51,20 +51,20 @@
                 collapsed: menuCollapsed,
                 split: menuSplit,
               },
-            } = appStore.getProjectConfig;
+            } = appStore.getProjectConfig
             appStore.setProjectConfig({
               menuSetting: {
                 type: MenuTypeEnum.SIDEBAR,
                 mode: MenuModeEnum.INLINE,
                 split: false,
               },
-            });
-            appStore.setBeforeMiniInfo({ menuMode, menuCollapsed, menuType, menuSplit });
+            })
+            appStore.setBeforeMiniInfo({ menuMode, menuCollapsed, menuType, menuSplit })
           }
         } else {
           if (unref(isSetState)) {
-            isSetState.value = false;
-            const { menuMode, menuCollapsed, menuType, menuSplit } = appStore.getBeforeMiniInfo;
+            isSetState.value = false
+            const { menuMode, menuCollapsed, menuType, menuSplit } = appStore.getBeforeMiniInfo
             appStore.setProjectConfig({
               menuSetting: {
                 type: menuType,
@@ -72,11 +72,11 @@
                 collapsed: menuCollapsed,
                 split: menuSplit,
               },
-            });
+            })
           }
         }
       }
-      return () => slots.default?.();
+      return () => slots.default?.()
     },
-  });
+  })
 </script>

src/components/Application/src/search/AppSearch.vue

@@ -1,18 +1,18 @@
 <script lang="tsx">
-  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 { useI18n } from '/@/hooks/web/useI18n';
+  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 { useI18n } from '/@/hooks/web/useI18n'
 
   export default defineComponent({
     name: 'AppSearch',
     setup() {
-      const showModal = ref(false);
-      const { t } = useI18n();
+      const showModal = ref(false)
+      const { t } = useI18n()
 
       function changeModal(show: boolean) {
-        showModal.value = show;
+        showModal.value = show
       }
 
       return () => {
@@ -26,8 +26,8 @@
             </Tooltip>
             <AppSearchModal onClose={changeModal.bind(null, false)} visible={unref(showModal)} />
           </div>
-        );
-      };
+        )
+      }
     },
-  });
+  })
 </script>

src/components/Application/src/search/AppSearchFooter.vue

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

src/components/Application/src/search/AppSearchKeyItem.vue

@@ -4,8 +4,8 @@
   </span>
 </template>
 <script lang="ts" setup>
-  import { Icon } from '/@/components/Icon';
+  import { Icon } from '/@/components/Icon'
   defineProps({
     icon: String,
-  });
+  })
 </script>

src/components/Application/src/search/AppSearchModal.vue

@@ -58,36 +58,36 @@
 </template>
 
 <script lang="ts" setup>
-  import { computed, unref, ref, watch, nextTick } from 'vue';
-  import { SearchOutlined } from '@ant-design/icons-vue';
-  import AppSearchFooter from './AppSearchFooter.vue';
-  import Icon from '/@/components/Icon';
+  import { computed, unref, ref, watch, nextTick } from 'vue'
+  import { SearchOutlined } from '@ant-design/icons-vue'
+  import AppSearchFooter from './AppSearchFooter.vue'
+  import Icon from '/@/components/Icon'
   // @ts-ignore
-  import vClickOutside 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 vClickOutside 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'
 
   const props = defineProps({
     visible: { type: Boolean },
-  });
+  })
 
-  const emit = defineEmits(['close']);
+  const emit = defineEmits(['close'])
 
-  const scrollWrap = ref(null);
-  const inputRef = ref<Nullable<HTMLElement>>(null);
+  const scrollWrap = ref(null)
+  const inputRef = ref<Nullable<HTMLElement>>(null)
 
-  const { t } = useI18n();
-  const { prefixCls } = useDesign('app-search-modal');
-  const [refs, setRefs] = useRefs();
-  const { getIsMobile } = useAppInject();
+  const { t } = useI18n()
+  const { prefixCls } = useDesign('app-search-modal')
+  const [refs, setRefs] = useRefs()
+  const { getIsMobile } = useAppInject()
 
   const { handleSearch, searchResult, keyword, activeIndex, handleEnter, handleMouseenter } =
-    useMenuSearch(refs, scrollWrap, emit);
+    useMenuSearch(refs, scrollWrap, emit)
 
-  const getIsNotData = computed(() => !keyword || unref(searchResult).length === 0);
+  const getIsNotData = computed(() => !keyword || unref(searchResult).length === 0)
 
   const getClass = computed(() => {
     return [
@@ -95,22 +95,22 @@
       {
         [`${prefixCls}--mobile`]: unref(getIsMobile),
       },
-    ];
-  });
+    ]
+  })
 
   watch(
     () => props.visible,
     (visible: boolean) => {
       visible &&
         nextTick(() => {
-          unref(inputRef)?.focus();
-        });
+          unref(inputRef)?.focus()
+        })
     },
-  );
+  )
 
   function handleClose() {
-    searchResult.value = [];
-    emit('close');
+    searchResult.value = []
+    emit('close')
   }
 </script>
 <style lang="less" scoped>

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

@@ -1,166 +1,166 @@
-import type { Menu } from '/@/router/types';
-import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue';
-import { getMenus } from '/@/router/menus';
-import { cloneDeep } from 'lodash-es';
-import { filter, forEach } from '/@/utils/helper/treeHelper';
-import { useGo } from '/@/hooks/web/usePage';
-import { useScrollTo } from '/@/hooks/event/useScrollTo';
-import { onKeyStroke, useDebounceFn } from '@vueuse/core';
-import { useI18n } from '/@/hooks/web/useI18n';
+import type { Menu } from '/@/router/types'
+import { ref, onBeforeMount, unref, Ref, nextTick } from 'vue'
+import { getMenus } from '/@/router/menus'
+import { cloneDeep } from 'lodash-es'
+import { filter, forEach } from '/@/utils/helper/treeHelper'
+import { useGo } from '/@/hooks/web/usePage'
+import { useScrollTo } from '/@/hooks/event/useScrollTo'
+import { onKeyStroke, useDebounceFn } from '@vueuse/core'
+import { useI18n } from '/@/hooks/web/useI18n'
 
 export interface SearchResult {
-  name: string;
-  path: string;
-  icon?: string;
+  name: string
+  path: string
+  icon?: string
 }
 
 // Translate special characters
 function transform(c: string) {
-  const code: string[] = ['$', '(', ')', '*', '+', '.', '[', ']', '?', '\\', '^', '{', '}', '|'];
-  return code.includes(c) ? `\\${c}` : c;
+  const code: string[] = ['$', '(', ')', '*', '+', '.', '[', ']', '?', '\\', '^', '{', '}', '|']
+  return code.includes(c) ? `\\${c}` : c
 }
 
 function createSearchReg(key: string) {
-  const keys = [...key].map((item) => transform(item));
-  const str = ['', ...keys, ''].join('.*');
-  return new RegExp(str);
+  const keys = [...key].map((item) => transform(item))
+  const str = ['', ...keys, ''].join('.*')
+  return new RegExp(str)
 }
 
 export function useMenuSearch(refs: Ref<HTMLElement[]>, scrollWrap: Ref<ElRef>, emit: EmitType) {
-  const searchResult = ref<SearchResult[]>([]);
-  const keyword = ref('');
-  const activeIndex = ref(-1);
+  const searchResult = ref<SearchResult[]>([])
+  const keyword = ref('')
+  const activeIndex = ref(-1)
 
-  let menuList: Menu[] = [];
+  let menuList: Menu[] = []
 
-  const { t } = useI18n();
-  const go = useGo();
-  const handleSearch = useDebounceFn(search, 200);
+  const { t } = useI18n()
+  const go = useGo()
+  const handleSearch = useDebounceFn(search, 200)
 
   onBeforeMount(async () => {
-    const list = await getMenus();
-    menuList = cloneDeep(list);
+    const list = await getMenus()
+    menuList = cloneDeep(list)
     forEach(menuList, (item) => {
-      item.name = t(item.name);
-    });
-  });
+      item.name = t(item.name)
+    })
+  })
 
   function search(e: ChangeEvent) {
-    e?.stopPropagation();
-    const key = e.target.value;
-    keyword.value = key.trim();
+    e?.stopPropagation()
+    const key = e.target.value
+    keyword.value = key.trim()
     if (!key) {
-      searchResult.value = [];
-      return;
+      searchResult.value = []
+      return
     }
-    const reg = createSearchReg(unref(keyword));
+    const reg = createSearchReg(unref(keyword))
     const filterMenu = filter(menuList, (item) => {
-      return reg.test(item.name) && !item.hideMenu;
-    });
-    searchResult.value = handlerSearchResult(filterMenu, reg);
-    activeIndex.value = 0;
+      return reg.test(item.name) && !item.hideMenu
+    })
+    searchResult.value = handlerSearchResult(filterMenu, reg)
+    activeIndex.value = 0
   }
 
   function handlerSearchResult(filterMenu: Menu[], reg: RegExp, parent?: Menu) {
-    const ret: SearchResult[] = [];
+    const ret: SearchResult[] = []
     filterMenu.forEach((item) => {
-      const { name, path, icon, children, hideMenu, meta } = item;
+      const { name, path, icon, children, hideMenu, meta } = item
       if (!hideMenu && reg.test(name) && (!children?.length || meta?.hideChildrenInMenu)) {
         ret.push({
           name: parent?.name ? `${parent.name} > ${name}` : name,
           path,
           icon,
-        });
+        })
       }
       if (!meta?.hideChildrenInMenu && Array.isArray(children) && children.length) {
-        ret.push(...handlerSearchResult(children, reg, item));
+        ret.push(...handlerSearchResult(children, reg, item))
       }
-    });
-    return ret;
+    })
+    return ret
   }
 
   // Activate when the mouse moves to a certain line
   function handleMouseenter(e: any) {
-    const index = e.target.dataset.index;
-    activeIndex.value = Number(index);
+    const index = e.target.dataset.index
+    activeIndex.value = Number(index)
   }
 
   // Arrow key up
   function handleUp() {
-    if (!searchResult.value.length) return;
-    activeIndex.value--;
+    if (!searchResult.value.length) return
+    activeIndex.value--
     if (activeIndex.value < 0) {
-      activeIndex.value = searchResult.value.length - 1;
+      activeIndex.value = searchResult.value.length - 1
     }
-    handleScroll();
+    handleScroll()
   }
 
   // Arrow key down
   function handleDown() {
-    if (!searchResult.value.length) return;
-    activeIndex.value++;
+    if (!searchResult.value.length) return
+    activeIndex.value++
     if (activeIndex.value > searchResult.value.length - 1) {
-      activeIndex.value = 0;
+      activeIndex.value = 0
     }
-    handleScroll();
+    handleScroll()
   }
 
   // When the keyboard up and down keys move to an invisible place
   // the scroll bar needs to scroll automatically
   function handleScroll() {
-    const refList = unref(refs);
+    const refList = unref(refs)
     if (!refList || !Array.isArray(refList) || refList.length === 0 || !unref(scrollWrap)) {
-      return;
+      return
     }
 
-    const index = unref(activeIndex);
-    const currentRef = refList[index];
+    const index = unref(activeIndex)
+    const currentRef = refList[index]
     if (!currentRef) {
-      return;
+      return
     }
-    const wrapEl = unref(scrollWrap);
+    const wrapEl = unref(scrollWrap)
     if (!wrapEl) {
-      return;
+      return
     }
-    const scrollHeight = currentRef.offsetTop + currentRef.offsetHeight;
-    const wrapHeight = wrapEl.offsetHeight;
+    const scrollHeight = currentRef.offsetTop + currentRef.offsetHeight
+    const wrapHeight = wrapEl.offsetHeight
     const { start } = useScrollTo({
       el: wrapEl,
       duration: 100,
       to: scrollHeight - wrapHeight,
-    });
-    start();
+    })
+    start()
   }
 
   // enter keyboard event
   async function handleEnter() {
     if (!searchResult.value.length) {
-      return;
+      return
     }
-    const result = unref(searchResult);
-    const index = unref(activeIndex);
+    const result = unref(searchResult)
+    const index = unref(activeIndex)
     if (result.length === 0 || index < 0) {
-      return;
+      return
     }
-    const to = result[index];
-    handleClose();
-    await nextTick();
-    go(to.path);
+    const to = result[index]
+    handleClose()
+    await nextTick()
+    go(to.path)
   }
 
   // close search modal
   function handleClose() {
-    searchResult.value = [];
-    emit('close');
+    searchResult.value = []
+    emit('close')
   }
 
   // enter search
-  onKeyStroke('Enter', handleEnter);
+  onKeyStroke('Enter', handleEnter)
   // Monitor keyboard arrow keys
-  onKeyStroke('ArrowUp', handleUp);
-  onKeyStroke('ArrowDown', handleDown);
+  onKeyStroke('ArrowUp', handleUp)
+  onKeyStroke('ArrowDown', handleDown)
   // esc close
-  onKeyStroke('Escape', handleClose);
+  onKeyStroke('Escape', handleClose)
 
-  return { handleSearch, searchResult, keyword, activeIndex, handleMouseenter, handleEnter };
+  return { handleSearch, searchResult, keyword, activeIndex, handleMouseenter, handleEnter }
 }

src/components/Application/src/useAppContext.ts

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

src/components/Authority/index.ts

@@ -1,4 +0,0 @@
-import { withInstall } from '/@/utils';
-import authority from './src/Authority.vue';
-
-export const Authority = withInstall(authority);

src/components/Authority/src/Authority.vue

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

src/components/Basic/index.ts

@@ -1,8 +1,8 @@
-import { withInstall } from '/@/utils';
-import basicArrow from './src/BasicArrow.vue';
-import basicTitle from './src/BasicTitle.vue';
-import basicHelp from './src/BasicHelp.vue';
+import { withInstall } from '/@/utils'
+import basicArrow from './src/BasicArrow.vue'
+import basicTitle from './src/BasicTitle.vue'
+import basicHelp from './src/BasicHelp.vue'
 
-export const BasicArrow = withInstall(basicArrow);
-export const BasicTitle = withInstall(basicTitle);
-export const BasicHelp = withInstall(basicHelp);
+export const BasicArrow = withInstall(basicArrow)
+export const BasicTitle = withInstall(basicTitle)
+export const BasicHelp = withInstall(basicHelp)

src/components/Basic/src/BasicArrow.vue

@@ -8,9 +8,9 @@
   </span>
 </template>
 <script lang="ts" setup>
-  import { computed } from 'vue';
-  import { Icon } from '/@/components/Icon';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { computed } from 'vue'
+  import { Icon } from '/@/components/Icon'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   const props = defineProps({
     /**
@@ -29,13 +29,13 @@
      * Cancel padding/margin for inline
      */
     inset: { type: Boolean },
-  });
+  })
 
-  const { prefixCls } = useDesign('basic-arrow');
+  const { prefixCls } = useDesign('basic-arrow')
 
   // get component class
   const getClass = computed(() => {
-    const { expand, up, down, inset } = props;
+    const { expand, up, down, inset } = props
     return [
       prefixCls,
       {
@@ -44,8 +44,8 @@
         inset,
         down,
       },
-    ];
-  });
+    ]
+  })
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-basic-arrow';

src/components/Basic/src/BasicHelp.vue

@@ -1,12 +1,12 @@
 <script lang="tsx">
-  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 { getPopupContainer } from '/@/utils';
-  import { isString, isArray } from '/@/utils/is';
-  import { getSlot } from '/@/utils/helper/tsxHelper';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  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 { getPopupContainer } from '/@/utils'
+  import { isString, isArray } from '/@/utils/is'
+  import { getSlot } from '/@/utils/helper/tsxHelper'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   const props = {
     /**
@@ -37,26 +37,26 @@
      * Help text list
      */
     text: { type: [Array, String] as PropType<string[] | string> },
-  };
+  }
 
   export default defineComponent({
     name: 'BasicHelp',
     components: { Tooltip },
     props,
     setup(props, { slots }) {
-      const { prefixCls } = useDesign('basic-help');
+      const { prefixCls } = useDesign('basic-help')
 
       const getTooltipStyle = computed(
         (): CSSProperties => ({ color: props.color, fontSize: props.fontSize }),
-      );
+      )
 
-      const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth }));
+      const getOverlayStyle = computed((): CSSProperties => ({ maxWidth: props.maxWidth }))
 
       function renderTitle() {
-        const textList = props.text;
+        const textList = props.text
 
         if (isString(textList)) {
-          return <p>{textList}</p>;
+          return <p>{textList}</p>
         }
 
         if (isArray(textList)) {
@@ -68,10 +68,10 @@
                   {text}
                 </>
               </p>
-            );
-          });
+            )
+          })
         }
-        return null;
+        return null
       }
 
       return () => {
@@ -86,10 +86,10 @@
           >
             <span class={prefixCls}>{getSlot(slots) || <InfoCircleOutlined />}</span>
           </Tooltip>
-        );
-      };
+        )
+      }
     },
-  });
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-basic-help';

src/components/Basic/src/BasicTitle.vue

@@ -5,10 +5,10 @@
   </span>
 </template>
 <script lang="ts" setup>
-  import type { PropType } from 'vue';
-  import { useSlots, computed } from 'vue';
-  import BasicHelp from './BasicHelp.vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import type { PropType } from 'vue'
+  import { useSlots, computed } from 'vue'
+  import BasicHelp from './BasicHelp.vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   const props = defineProps({
     /**
@@ -29,15 +29,15 @@
      * @default: false
      */
     normal: { type: Boolean },
-  });
+  })
 
-  const { prefixCls } = useDesign('basic-title');
-  const slots = useSlots();
+  const { prefixCls } = useDesign('basic-title')
+  const slots = useSlots()
   const getClass = computed(() => [
     prefixCls,
     { [`${prefixCls}-show-span`]: props.span && slots.default },
     { [`${prefixCls}-normal`]: props.normal },
-  ]);
+  ])
 </script>
 <style lang="less" scoped>
   @prefix-cls: ~'@{namespace}-basic-title';

src/components/Button/index.ts

@@ -1,9 +1,9 @@
-import { withInstall } from '/@/utils';
-import type { ExtractPropTypes } from 'vue';
-import button from './src/BasicButton.vue';
-import popConfirmButton from './src/PopConfirmButton.vue';
-import { buttonProps } from './src/props';
+import { withInstall } from '/@/utils'
+import type { ExtractPropTypes } from 'vue'
+import button from './src/BasicButton.vue'
+import popConfirmButton from './src/PopConfirmButton.vue'
+import { buttonProps } from './src/props'
 
-export const Button = withInstall(button);
-export const PopConfirmButton = withInstall(popConfirmButton);
-export declare type ButtonProps = Partial<ExtractPropTypes<typeof buttonProps>>;
+export const Button = withInstall(button)
+export const PopConfirmButton = withInstall(popConfirmButton)
+export declare type ButtonProps = Partial<ExtractPropTypes<typeof buttonProps>>

src/components/Button/src/BasicButton.vue

@@ -9,32 +9,32 @@
 </template>
 
 <script lang="ts">
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
   export default defineComponent({
     name: 'AButton',
     inheritAttrs: false,
-  });
+  })
 </script>
 <script lang="ts" setup>
-  import { computed, unref } from 'vue';
-  import { Button } from 'ant-design-vue';
-  import Icon from '/@/components/Icon/src/Icon.vue';
-  import { buttonProps } from './props';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import { computed, unref } from 'vue'
+  import { Button } from 'ant-design-vue'
+  import Icon from '/@/components/Icon/src/Icon.vue'
+  import { buttonProps } from './props'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
 
-  const props = defineProps(buttonProps);
+  const props = defineProps(buttonProps)
   // get component class
-  const attrs = useAttrs({ excludeDefaultKeys: false });
+  const attrs = useAttrs({ excludeDefaultKeys: false })
   const getButtonClass = computed(() => {
-    const { color, disabled } = props;
+    const { color, disabled } = props
     return [
       {
         [`ant-btn-${color}`]: !!color,
         [`is-disabled`]: disabled,
       },
-    ];
-  });
+    ]
+  })
 
   // get inherit binding value
-  const getBindValue = computed(() => ({ ...unref(attrs), ...props }));
+  const getBindValue = computed(() => ({ ...unref(attrs), ...props }))
 </script>

src/components/Button/src/PopConfirmButton.vue

@@ -1,11 +1,11 @@
 <script lang="ts">
-  import { computed, defineComponent, h, unref } from 'vue';
-  import BasicButton from './BasicButton.vue';
-  import { Popconfirm } from 'ant-design-vue';
-  import { extendSlots } from '/@/utils/helper/tsxHelper';
-  import { omit } from 'lodash-es';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { computed, defineComponent, h, unref } from 'vue'
+  import BasicButton from './BasicButton.vue'
+  import { Popconfirm } from 'ant-design-vue'
+  import { extendSlots } from '/@/utils/helper/tsxHelper'
+  import { omit } from 'lodash-es'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   const props = {
     /**
@@ -16,15 +16,15 @@
       type: Boolean,
       default: true,
     },
-  };
+  }
 
   export default defineComponent({
     name: 'PopButton',
     inheritAttrs: false,
     props,
     setup(props, { slots }) {
-      const { t } = useI18n();
-      const attrs = useAttrs();
+      const { t } = useI18n()
+      const attrs = useAttrs()
 
       // get inherit binding value
       const getBindValues = computed(() => {
@@ -34,21 +34,21 @@
             cancelText: t('common.cancelText'),
           },
           { ...props, ...unref(attrs) },
-        );
-      });
+        )
+      })
 
       return () => {
-        const bindValues = omit(unref(getBindValues), 'icon');
-        const btnBind = omit(bindValues, 'title') as Recordable;
-        if (btnBind.disabled) btnBind.color = '';
-        const Button = h(BasicButton, btnBind, extendSlots(slots));
+        const bindValues = omit(unref(getBindValues), 'icon')
+        const btnBind = omit(bindValues, 'title') as Recordable
+        if (btnBind.disabled) btnBind.color = ''
+        const Button = h(BasicButton, btnBind, extendSlots(slots))
 
         // If it is not enabled, it is a normal button
         if (!props.enable) {
-          return Button;
+          return Button
         }
-        return h(Popconfirm, bindValues, { default: () => Button });
-      };
+        return h(Popconfirm, bindValues, { default: () => Button })
+      }
     },
-  });
+  })
 </script>

src/components/Button/src/props.ts

@@ -16,4 +16,4 @@ export const buttonProps = {
    */
   iconSize: { type: Number, default: 14 },
   onClick: { type: Function as PropType<(...args) => any>, default: null },
-};
+}

src/components/CardList/index.ts

@@ -1,4 +0,0 @@
-import { withInstall } from '/@/utils';
-import cardList from './src/CardList.vue';
-
-export const CardList = withInstall(cardList);

src/components/CardList/src/CardList.vue

@@ -1,177 +0,0 @@
-<template>
-  <div class="p-2">
-    <div class="p-4 mb-2 bg-white">
-      <BasicForm @register="registerForm" />
-    </div>
-    <div class="p-2 bg-white">
-      <List
-        :grid="{ gutter: 5, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: grid }"
-        :data-source="data"
-        :pagination="paginationProp"
-      >
-        <template #header>
-          <div class="flex justify-end space-x-2"
-            ><slot name="header"></slot>
-            <Tooltip>
-              <template #title>
-                <div class="w-50">每行显示数量</div
-                ><Slider
-                  id="slider"
-                  v-bind="sliderProp"
-                  v-model:value="grid"
-                  @change="sliderChange"
-              /></template>
-              <Button><TableOutlined /></Button>
-            </Tooltip>
-            <Tooltip @click="fetch">
-              <template #title>刷新</template>
-              <Button><RedoOutlined /></Button>
-            </Tooltip>
-          </div>
-        </template>
-        <template #renderItem="{ item }">
-          <ListItem>
-            <Card>
-              <template #title></template>
-              <template #cover>
-                <div :class="height">
-                  <Image :src="item.imgs[0]" />
-                </div>
-              </template>
-              <template #actions>
-                <!--              <SettingOutlined key="setting" />-->
-                <EditOutlined key="edit" />
-                <Dropdown
-                  :trigger="['hover']"
-                  :dropMenuList="[
-                    {
-                      text: '删除',
-                      event: '1',
-                      popConfirm: {
-                        title: '是否确认删除',
-                        confirm: handleDelete.bind(null, item.id),
-                      },
-                    },
-                  ]"
-                  popconfirm
-                >
-                  <EllipsisOutlined key="ellipsis" />
-                </Dropdown>
-              </template>
-
-              <CardMeta>
-                <template #title>
-                  <TypographyText :content="item.name" :ellipsis="{ tooltip: item.address }" />
-                </template>
-                <template #avatar>
-                  <Avatar :src="item.avatar" />
-                </template>
-                <template #description>{{ item.time }}</template>
-              </CardMeta>
-            </Card>
-          </ListItem>
-        </template>
-      </List>
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-  import { computed, onMounted, ref } from 'vue';
-  import {
-    EditOutlined,
-    EllipsisOutlined,
-    RedoOutlined,
-    TableOutlined,
-  } from '@ant-design/icons-vue';
-  import { List, Card, Image, Typography, Tooltip, Slider, Avatar } from 'ant-design-vue';
-  import { Dropdown } from '/@/components/Dropdown';
-  import { BasicForm, useForm } from '/@/components/Form';
-  import { propTypes } from '/@/utils/propTypes';
-  import { Button } from '/@/components/Button';
-  import { isFunction } from '/@/utils/is';
-  import { useSlider, grid } from './data';
-  const ListItem = List.Item;
-  const CardMeta = Card.Meta;
-  const TypographyText = Typography.Text;
-  // 获取slider属性
-  const sliderProp = computed(() => useSlider(4));
-  // 组件接收参数
-  const props = defineProps({
-    // 请求API的参数
-    params: propTypes.object.def({}),
-    //api
-    api: propTypes.func,
-  });
-  //暴露内部方法
-  const emit = defineEmits(['getMethod', 'delete']);
-  //数据
-  const data = ref([]);
-  // 切换每行个数
-  // cover图片自适应高度
-  //修改pageSize并重新请求数据
-
-  const height = computed(() => {
-    return `h-${120 - grid.value * 6}`;
-  });
-  //表单
-  const [registerForm, { validate }] = useForm({
-    schemas: [{ field: 'type', component: 'Input', label: '类型' }],
-    labelWidth: 80,
-    baseColProps: { span: 6 },
-    actionColOptions: { span: 24 },
-    autoSubmitOnEnter: true,
-    submitFunc: handleSubmit,
-  });
-  //表单提交
-  async function handleSubmit() {
-    const data = await validate();
-    await fetch(data);
-  }
-  function sliderChange(n) {
-    pageSize.value = n * 4;
-    fetch();
-  }
-
-  // 自动请求并暴露内部方法
-  onMounted(() => {
-    fetch();
-    emit('getMethod', fetch);
-  });
-
-  async function fetch(p = {}) {
-    const { api, params } = props;
-    if (api && isFunction(api)) {
-      const res = await api({ ...params, page: page.value, pageSize: pageSize.value, ...p });
-      data.value = res.items;
-      total.value = res.total;
-    }
-  }
-  //分页相关
-  const page = ref(1);
-  const pageSize = ref(36);
-  const total = ref(0);
-  const paginationProp = ref({
-    showSizeChanger: false,
-    showQuickJumper: true,
-    pageSize,
-    current: page,
-    total,
-    showTotal: (total) => `总 ${total} 条`,
-    onChange: pageChange,
-    onShowSizeChange: pageSizeChange,
-  });
-
-  function pageChange(p, pz) {
-    page.value = p;
-    pageSize.value = pz;
-    fetch();
-  }
-  function pageSizeChange(_current, size) {
-    pageSize.value = size;
-    fetch();
-  }
-
-  async function handleDelete(id) {
-    emit('delete', id);
-  }
-</script>

src/components/CardList/src/data.ts

@@ -1,25 +0,0 @@
-import { ref } from 'vue';
-// 每行个数
-export const grid = ref(12);
-// slider属性
-export const useSlider = (min = 6, max = 12) => {
-  // 每行显示个数滑动条
-  const getMarks = () => {
-    const l = {};
-    for (let i = min; i < max + 1; i++) {
-      l[i] = {
-        style: {
-          color: '#fff',
-        },
-        label: i,
-      };
-    }
-    return l;
-  };
-  return {
-    min,
-    max,
-    marks: getMarks(),
-    step: 1,
-  };
-};

src/components/ClickOutSide/index.ts

@@ -1,4 +0,0 @@
-import { withInstall } from '/@/utils';
-import clickOutSide from './src/ClickOutSide.vue';
-
-export const ClickOutSide = withInstall(clickOutSide);

src/components/ClickOutSide/src/ClickOutSide.vue

@@ -1,19 +0,0 @@
-<template>
-  <div ref="wrap">
-    <slot></slot>
-  </div>
-</template>
-<script lang="ts" setup>
-  import { ref, onMounted } from 'vue';
-  import { onClickOutside } from '@vueuse/core';
-  const emit = defineEmits(['mounted', 'clickOutside']);
-  const wrap = ref<ElRef>(null);
-
-  onClickOutside(wrap, () => {
-    emit('clickOutside');
-  });
-
-  onMounted(() => {
-    emit('mounted');
-  });
-</script>

src/components/CodeEditor/index.ts

@@ -1,8 +0,0 @@
-import { withInstall } from '/@/utils';
-import codeEditor from './src/CodeEditor.vue';
-import jsonPreview from './src/json-preview/JsonPreview.vue';
-
-export const CodeEditor = withInstall(codeEditor);
-export const JsonPreview = withInstall(jsonPreview);
-
-export * from './src/typing';

src/components/CodeEditor/src/CodeEditor.vue

@@ -1,54 +0,0 @@
-<template>
-  <div class="h-full">
-    <CodeMirrorEditor
-      :value="getValue"
-      @change="handleValueChange"
-      :mode="mode"
-      :readonly="readonly"
-    />
-  </div>
-</template>
-<script lang="ts" setup>
-  import { computed } from 'vue';
-  import CodeMirrorEditor from './codemirror/CodeMirror.vue';
-  import { isString } from '/@/utils/is';
-  import { MODE } from './typing';
-
-  const props = defineProps({
-    value: { type: [Object, String] as PropType<Record<string, any> | string> },
-    mode: {
-      type: String as PropType<MODE>,
-      default: MODE.JSON,
-      validator(value: any) {
-        // 这个值必须匹配下列字符串中的一个
-        return Object.values(MODE).includes(value);
-      },
-    },
-    readonly: { type: Boolean },
-    autoFormat: { type: Boolean, default: true },
-  });
-
-  const emit = defineEmits(['change', 'update:value', 'format-error']);
-
-  const getValue = computed(() => {
-    const { value, mode, autoFormat } = props;
-    if (!autoFormat || mode !== MODE.JSON) {
-      return value as string;
-    }
-    let result = value;
-    if (isString(value)) {
-      try {
-        result = JSON.parse(value);
-      } catch (e) {
-        emit('format-error', value);
-        return value as string;
-      }
-    }
-    return JSON.stringify(result, null, 2);
-  });
-
-  function handleValueChange(v) {
-    emit('update:value', v);
-    emit('change', v);
-  }
-</script>

src/components/CodeEditor/src/codemirror/CodeMirror.vue

@@ -1,113 +0,0 @@
-<template>
-  <div class="relative !h-full w-full overflow-hidden" ref="el"></div>
-</template>
-
-<script lang="ts" setup>
-  import { ref, onMounted, onUnmounted, watchEffect, watch, unref, nextTick } from 'vue';
-  import { useDebounceFn } from '@vueuse/core';
-  import { useAppStore } from '/@/store/modules/app';
-  import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
-  import CodeMirror from 'codemirror';
-  import { MODE } from './../typing';
-  // css
-  import './codemirror.css';
-  import 'codemirror/theme/idea.css';
-  import 'codemirror/theme/material-palenight.css';
-  // modes
-  import 'codemirror/mode/javascript/javascript';
-  import 'codemirror/mode/css/css';
-  import 'codemirror/mode/htmlmixed/htmlmixed';
-
-  const props = defineProps({
-    mode: {
-      type: String as PropType<MODE>,
-      default: MODE.JSON,
-      validator(value: any) {
-        // 这个值必须匹配下列字符串中的一个
-        return Object.values(MODE).includes(value);
-      },
-    },
-    value: { type: String, default: '' },
-    readonly: { type: Boolean, default: false },
-  });
-
-  const emit = defineEmits(['change']);
-
-  const el = ref();
-  let editor: Nullable<CodeMirror.Editor>;
-
-  const debounceRefresh = useDebounceFn(refresh, 100);
-  const appStore = useAppStore();
-
-  watch(
-    () => props.value,
-    async (value) => {
-      await nextTick();
-      const oldValue = editor?.getValue();
-      if (value !== oldValue) {
-        editor?.setValue(value ? value : '');
-      }
-    },
-    { flush: 'post' },
-  );
-
-  watchEffect(() => {
-    editor?.setOption('mode', props.mode);
-  });
-
-  watch(
-    () => appStore.getDarkMode,
-    async () => {
-      setTheme();
-    },
-    {
-      immediate: true,
-    },
-  );
-
-  function setTheme() {
-    unref(editor)?.setOption(
-      'theme',
-      appStore.getDarkMode === 'light' ? 'idea' : 'material-palenight',
-    );
-  }
-
-  function refresh() {
-    editor?.refresh();
-  }
-
-  async function init() {
-    const addonOptions = {
-      autoCloseBrackets: true,
-      autoCloseTags: true,
-      foldGutter: true,
-      gutters: ['CodeMirror-linenumbers'],
-    };
-
-    editor = CodeMirror(el.value!, {
-      value: '',
-      mode: props.mode,
-      readOnly: props.readonly,
-      tabSize: 2,
-      theme: 'material-palenight',
-      lineWrapping: true,
-      lineNumbers: true,
-      ...addonOptions,
-    });
-    editor?.setValue(props.value);
-    setTheme();
-    editor?.on('change', () => {
-      emit('change', editor?.getValue());
-    });
-  }
-
-  onMounted(async () => {
-    await nextTick();
-    init();
-    useWindowSizeFn(debounceRefresh);
-  });
-
-  onUnmounted(() => {
-    editor = null;
-  });
-</script>

src/components/CodeEditor/src/codemirror/codeMirror.ts

@@ -1,21 +0,0 @@
-import CodeMirror from 'codemirror';
-import './codemirror.css';
-import 'codemirror/theme/idea.css';
-import 'codemirror/theme/material-palenight.css';
-// import 'codemirror/addon/lint/lint.css';
-
-// modes
-import 'codemirror/mode/javascript/javascript';
-import 'codemirror/mode/css/css';
-import 'codemirror/mode/htmlmixed/htmlmixed';
-// addons
-// import 'codemirror/addon/edit/closebrackets';
-// import 'codemirror/addon/edit/closetag';
-// import 'codemirror/addon/comment/comment';
-// import 'codemirror/addon/fold/foldcode';
-// import 'codemirror/addon/fold/foldgutter';
-// import 'codemirror/addon/fold/brace-fold';
-// import 'codemirror/addon/fold/indent-fold';
-// import 'codemirror/addon/lint/json-lint';
-// import 'codemirror/addon/fold/comment-fold';
-export { CodeMirror };

src/components/CodeEditor/src/codemirror/codemirror.css

@@ -1,525 +0,0 @@
-/* BASICS */
-
-.CodeMirror {
-  --base: #545281;
-  --comment: hsl(210deg 25% 60%);
-  --keyword: #af4ab1;
-  --variable: #0055d1;
-  --function: #c25205;
-  --string: #2ba46d;
-  --number: #c25205;
-  --tags: #d00;
-  --qualifier: #ff6032;
-  --important: var(--string);
-
-  position: relative;
-  height: auto;
-  height: 100%;
-  overflow: hidden;
-  font-family: var(--font-code);
-  background: white;
-  direction: ltr;
-}
-
-/* PADDING */
-
-.CodeMirror-lines {
-  min-height: 1px; /* prevents collapsing before first draw */
-  padding: 4px 0; /* Vertical padding around content */
-  cursor: text;
-}
-
-.CodeMirror-scrollbar-filler,
-.CodeMirror-gutter-filler {
-  background-color: white; /* The little square between H and V scrollbars */
-}
-
-/* GUTTER */
-
-.CodeMirror-gutters {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 3;
-  min-height: 100%;
-  white-space: nowrap;
-  background-color: transparent;
-  border-right: 1px solid #ddd;
-}
-
-.CodeMirror-linenumber {
-  min-width: 20px;
-  padding: 0 3px 0 5px;
-  color: var(--comment);
-  text-align: right;
-  white-space: nowrap;
-  opacity: 0.6;
-}
-
-.CodeMirror-guttermarker {
-  color: black;
-}
-
-.CodeMirror-guttermarker-subtle {
-  color: #999;
-}
-
-/* FOLD GUTTER */
-
-.CodeMirror-foldmarker {
-  font-family: arial;
-  line-height: 0.3;
-  color: #414141;
-  text-shadow: #f96 1px 1px 2px, #f96 -1px -1px 2px, #f96 1px -1px 2px, #f96 -1px 1px 2px;
-  cursor: pointer;
-}
-
-.CodeMirror-foldgutter {
-  width: 0.7em;
-}
-
-.CodeMirror-foldgutter-open,
-.CodeMirror-foldgutter-folded {
-  cursor: pointer;
-}
-
-.CodeMirror-foldgutter-open::after,
-.CodeMirror-foldgutter-folded::after {
-  position: relative;
-  top: -0.1em;
-  display: inline-block;
-  font-size: 0.8em;
-  content: '>';
-  opacity: 0.8;
-  transform: rotate(90deg);
-  transition: transform 0.2s;
-}
-
-.CodeMirror-foldgutter-folded::after {
-  transform: none;
-}
-
-/* CURSOR */
-
-.CodeMirror-cursor {
-  position: absolute;
-  width: 0;
-  pointer-events: none;
-  border-right: none;
-  border-left: 1px solid black;
-}
-
-/* Shown when moving in bi-directional text */
-.CodeMirror div.CodeMirror-secondarycursor {
-  border-left: 1px solid silver;
-}
-
-.cm-fat-cursor .CodeMirror-cursor {
-  width: auto;
-  background: #7e7;
-  border: 0 !important;
-}
-
-.cm-fat-cursor div.CodeMirror-cursors {
-  z-index: 1;
-}
-
-.cm-fat-cursor-mark {
-  background-color: rgb(20 255 20 / 50%);
-  animation: blink 1.06s steps(1) infinite;
-}
-
-.cm-animate-fat-cursor {
-  width: auto;
-  background-color: #7e7;
-  border: 0;
-  animation: blink 1.06s steps(1) infinite;
-}
-@keyframes blink {
-  50% {
-    background-color: transparent;
-  }
-}
-@keyframes blink {
-  50% {
-    background-color: transparent;
-  }
-}
-@keyframes blink {
-  50% {
-    background-color: transparent;
-  }
-}
-
-.cm-tab {
-  display: inline-block;
-  text-decoration: inherit;
-}
-
-.CodeMirror-rulers {
-  position: absolute;
-  top: -50px;
-  right: 0;
-  bottom: -20px;
-  left: 0;
-  overflow: hidden;
-}
-
-.CodeMirror-ruler {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  border-left: 1px solid #ccc;
-}
-
-/* DEFAULT THEME */
-.cm-s-default.CodeMirror {
-  background-color: transparent;
-}
-
-.cm-s-default .cm-header {
-  color: blue;
-}
-
-.cm-s-default .cm-quote {
-  color: #090;
-}
-
-.cm-negative {
-  color: #d44;
-}
-
-.cm-positive {
-  color: #292;
-}
-
-.cm-header,
-.cm-strong {
-  font-weight: bold;
-}
-
-.cm-em {
-  font-style: italic;
-}
-
-.cm-link {
-  text-decoration: underline;
-}
-
-.cm-strikethrough {
-  text-decoration: line-through;
-}
-
-.cm-s-default .cm-atom,
-.cm-s-default .cm-def,
-.cm-s-default .cm-property,
-.cm-s-default .cm-variable-2,
-.cm-s-default .cm-variable-3,
-.cm-s-default .cm-punctuation {
-  color: var(--base);
-}
-
-.cm-s-default .cm-hr,
-.cm-s-default .cm-comment {
-  color: var(--comment);
-}
-
-.cm-s-default .cm-attribute,
-.cm-s-default .cm-keyword {
-  color: var(--keyword);
-}
-
-.cm-s-default .cm-variable {
-  color: var(--variable);
-}
-
-.cm-s-default .cm-bracket,
-.cm-s-default .cm-tag {
-  color: var(--tags);
-}
-
-.cm-s-default .cm-number {
-  color: var(--number);
-}
-
-.cm-s-default .cm-string,
-.cm-s-default .cm-string-2 {
-  color: var(--string);
-}
-
-.cm-s-default .cm-type {
-  color: #085;
-}
-
-.cm-s-default .cm-meta {
-  color: #555;
-}
-
-.cm-s-default .cm-qualifier {
-  color: var(--qualifier);
-}
-
-.cm-s-default .cm-builtin {
-  color: #7539ff;
-}
-
-.cm-s-default .cm-link {
-  color: var(--flash);
-}
-
-.cm-s-default .cm-error {
-  color: #ff008c;
-}
-
-.cm-invalidchar {
-  color: #ff008c;
-}
-
-.CodeMirror-composing {
-  border-bottom: 2px solid;
-}
-
-/* Default styles for common addons */
-
-div.CodeMirror span.CodeMirror-matchingbracket {
-  color: #0b0;
-}
-
-div.CodeMirror span.CodeMirror-nonmatchingbracket {
-  color: #a22;
-}
-
-.CodeMirror-matchingtag {
-  background: rgb(255 150 0 / 30%);
-}
-
-.CodeMirror-activeline-background {
-  background: #e8f2ff;
-}
-
-/* STOP */
-
-/* The rest of this file contains styles related to the mechanics of
-   the editor. You probably shouldn't touch them. */
-
-.CodeMirror-scroll {
-  position: relative;
-  height: 100%;
-  padding-bottom: 30px;
-  margin-right: -30px;
-
-  /* 30px is the magic margin used to hide the element's real scrollbars */
-
-  /* See overflow: hidden in .CodeMirror */
-  margin-bottom: -30px;
-  overflow: scroll !important; /* Things will break if this is overridden */
-  outline: none; /* Prevent dragging from highlighting the element */
-}
-
-.CodeMirror-sizer {
-  position: relative;
-  margin-bottom: 20px !important;
-  border-right: 30px solid transparent;
-}
-
-/* The fake, visible scrollbars. Used to force redraw during scrolling
-   before actual scrolling happens, thus preventing shaking and
-   flickering artifacts. */
-.CodeMirror-vscrollbar,
-.CodeMirror-hscrollbar,
-.CodeMirror-scrollbar-filler,
-.CodeMirror-gutter-filler {
-  position: absolute;
-  z-index: 6;
-  display: none;
-}
-
-.CodeMirror-vscrollbar {
-  top: 0;
-  right: 0;
-  overflow-x: hidden;
-  overflow-y: scroll;
-}
-
-.CodeMirror-hscrollbar {
-  bottom: 0;
-  left: 0;
-  overflow-x: scroll;
-  overflow-y: hidden;
-}
-
-.CodeMirror-scrollbar-filler {
-  right: 0;
-  bottom: 0;
-}
-
-.CodeMirror-gutter-filler {
-  bottom: 0;
-  left: 0;
-}
-
-.CodeMirror-gutter {
-  display: inline-block;
-  height: 100%;
-  margin-bottom: -30px;
-  white-space: normal;
-  vertical-align: top;
-}
-
-.CodeMirror-gutter-wrapper {
-  position: absolute;
-  z-index: 4;
-  background: none !important;
-  border: none !important;
-}
-
-.CodeMirror-gutter-background {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  z-index: 4;
-}
-
-.CodeMirror-gutter-elt {
-  position: absolute;
-  z-index: 4;
-  cursor: default;
-}
-
-.CodeMirror-gutter-wrapper ::selection {
-  background-color: transparent;
-}
-
-.CodeMirrorwrapper ::selection {
-  background-color: transparent;
-}
-
-.CodeMirror pre {
-  position: relative;
-  z-index: 2;
-  padding: 0 4px; /* Horizontal padding of content */
-  margin: 0;
-  overflow: visible;
-  font-family: inherit;
-  font-size: inherit;
-  line-height: inherit;
-  color: inherit;
-  word-wrap: normal;
-  white-space: pre;
-  background: transparent;
-  border-width: 0;
-
-  /* Reset some styles that the rest of the page might have set */
-  border-radius: 0;
-  -webkit-tap-highlight-color: transparent;
-  font-variant-ligatures: contextual;
-}
-
-.CodeMirror-wrap pre {
-  word-break: normal;
-  word-wrap: break-word;
-  white-space: pre-wrap;
-}
-
-.CodeMirror-linebackground {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 0;
-}
-
-.CodeMirror-linewidget {
-  position: relative;
-  z-index: 2;
-  padding: 0.1px; /* Force widget margins to stay inside of the container */
-}
-
-.CodeMirror-rtl pre {
-  direction: rtl;
-}
-
-.CodeMirror-code {
-  outline: none;
-}
-
-/* Force content-box sizing for the elements where we expect it */
-.CodeMirror-scroll,
-.CodeMirror-sizer,
-.CodeMirror-gutter,
-.CodeMirror-gutters,
-.CodeMirror-linenumber {
-  box-sizing: content-box;
-}
-
-.CodeMirror-measure {
-  position: absolute;
-  width: 100%;
-  height: 0;
-  overflow: hidden;
-  visibility: hidden;
-}
-
-.CodeMirror-measure pre {
-  position: static;
-}
-
-div.CodeMirror-cursors {
-  position: relative;
-  z-index: 3;
-  visibility: hidden;
-}
-
-div.CodeMirror-dragcursors {
-  visibility: visible;
-}
-
-.CodeMirror-focused div.CodeMirror-cursors {
-  visibility: visible;
-}
-
-.CodeMirror-selected {
-  background: #d9d9d9;
-}
-
-.CodeMirror-focused .CodeMirror-selected {
-  background: #d7d4f0;
-}
-
-.CodeMirror-crosshair {
-  cursor: crosshair;
-}
-
-.CodeMirror-line::selection,
-.CodeMirror-line > span::selection,
-.CodeMirror-line > span > span::selection {
-  background: #d7d4f0;
-}
-
-.cm-searching {
-  background-color: #ffa;
-  background-color: rgb(255 255 0 / 40%);
-}
-
-/* Used to force a border model for a node */
-.cm-force-border {
-  padding-right: 0.1px;
-}
-
-@media print {
-  /* Hide the cursor when printing */
-  .CodeMirror div.CodeMirror-cursors {
-    visibility: hidden;
-  }
-}
-
-/* See issue #2901 */
-.cm-tab-wrap-hack::after {
-  content: '';
-}
-
-/* Help users use markselection to safely style text background */
-span.CodeMirror-selectedtext {
-  background: none;
-}

src/components/CodeEditor/src/json-preview/JsonPreview.vue

@@ -1,12 +0,0 @@
-<template>
-  <vue-json-pretty :path="'res'" :deep="3" :showLength="true" :data="data" />
-</template>
-
-<script lang="ts" setup>
-  import VueJsonPretty from 'vue-json-pretty';
-  import 'vue-json-pretty/lib/styles.css';
-
-  defineProps({
-    data: Object,
-  });
-</script>

src/components/CodeEditor/src/typing.ts

@@ -1,5 +0,0 @@
-export enum MODE {
-  JSON = 'application/json',
-  HTML = 'htmlmixed',
-  JS = 'javascript',
-}

src/components/Container/index.ts

@@ -1,10 +1,10 @@
-import { withInstall } from '/@/utils';
-import collapseContainer from './src/collapse/CollapseContainer.vue';
-import scrollContainer from './src/ScrollContainer.vue';
-import lazyContainer from './src/LazyContainer.vue';
+import { withInstall } from '/@/utils'
+import collapseContainer from './src/collapse/CollapseContainer.vue'
+import scrollContainer from './src/ScrollContainer.vue'
+import lazyContainer from './src/LazyContainer.vue'
 
-export const CollapseContainer = withInstall(collapseContainer);
-export const ScrollContainer = withInstall(scrollContainer);
-export const LazyContainer = withInstall(lazyContainer);
+export const CollapseContainer = withInstall(collapseContainer)
+export const ScrollContainer = withInstall(scrollContainer)
+export const LazyContainer = withInstall(lazyContainer)
 
-export * from './src/typing';
+export * from './src/typing'

src/components/Container/src/LazyContainer.vue

@@ -17,16 +17,16 @@
   </transition-group>
 </template>
 <script lang="ts">
-  import type { PropType } 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 type { PropType } 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'
 
   interface State {
-    isInit: boolean;
-    loading: boolean;
-    intersectionObserverInstance: IntersectionObserver | null;
+    isInit: boolean
+    loading: boolean
+    intersectionObserverInstance: IntersectionObserver | null
   }
 
   const props = {
@@ -63,7 +63,7 @@
      * transition name
      */
     transitionName: { type: String, default: 'lazy-container' },
-  };
+  }
 
   export default defineComponent({
     name: 'LazyContainer',
@@ -72,49 +72,49 @@
     props,
     emits: ['init'],
     setup(props, { emit }) {
-      const elRef = ref();
+      const elRef = ref()
       const state = reactive<State>({
         isInit: false,
         loading: false,
         intersectionObserverInstance: null,
-      });
+      })
 
       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 {
@@ -122,24 +122,24 @@
             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'),
-          });
+          })
         } catch (e) {
-          init();
+          init()
         }
       }
       return {
         elRef,
         ...toRefs(state),
-      };
+      }
     },
-  });
+  })
 </script>

src/components/Container/src/ScrollContainer.vue

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

src/components/Container/src/collapse/CollapseContainer.vue

@@ -23,17 +23,17 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import type { PropType } from 'vue';
-  import { ref } from 'vue';
-  import { isNil } from 'lodash-es';
+  import type { PropType } from 'vue'
+  import { ref } from 'vue'
+  import { isNil } from 'lodash-es'
   // component
-  import { Skeleton } from 'ant-design-vue';
-  import { CollapseTransition } from '/@/components/Transition';
-  import CollapseHeader from './CollapseHeader.vue';
-  import { triggerWindowResize } from '/@/utils/event';
+  import { Skeleton } from 'ant-design-vue'
+  import { CollapseTransition } from '/@/components/Transition'
+  import CollapseHeader from './CollapseHeader.vue'
+  import { triggerWindowResize } from '/@/utils/event'
   // hook
-  import { useTimeoutFn } from '/@/hooks/core/useTimeout';
-  import { useDesign } from '/@/hooks/web/useDesign';
+  import { useTimeoutFn } from '/@/hooks/core/useTimeout'
+  import { useDesign } from '/@/hooks/web/useDesign'
 
   const props = defineProps({
     title: { type: String, default: '' },
@@ -58,26 +58,26 @@
      * Delayed loading time
      */
     lazyTime: { type: Number, default: 0 },
-  });
+  })
 
-  const show = ref(true);
+  const show = ref(true)
 
-  const { prefixCls } = useDesign('collapse-container');
+  const { prefixCls } = useDesign('collapse-container')
 
   /**
    * @description: Handling development events
    */
   function handleExpand(val: boolean) {
-    show.value = isNil(val) ? !show.value : val;
+    show.value = isNil(val) ? !show.value : val
     if (props.triggerWindowResize) {
       // 200 milliseconds here is because the expansion has animation,
-      useTimeoutFn(triggerWindowResize, 200);
+      useTimeoutFn(triggerWindowResize, 200)
     }
   }
 
   defineExpose({
     handleExpand,
-  });
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-collapse-container';

src/components/Container/src/collapse/CollapseHeader.vue

@@ -15,8 +15,8 @@
   </div>
 </template>
 <script lang="ts">
-  import { defineComponent } from 'vue';
-  import { BasicArrow, BasicTitle } from '/@/components/Basic';
+  import { defineComponent } from 'vue'
+  import { BasicArrow, BasicTitle } from '/@/components/Basic'
 
   const props = {
     prefixCls: { type: String },
@@ -27,12 +27,12 @@
     title: { type: String },
     show: { type: Boolean },
     canExpan: { type: Boolean },
-  };
+  }
 
   export default defineComponent({
     components: { BasicArrow, BasicTitle },
     inheritAttrs: false,
     props,
     emits: ['expand'],
-  });
+  })
 </script>

src/components/Container/src/typing.ts

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

src/components/ContextMenu/index.ts

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

src/components/ContextMenu/src/ContextMenu.vue

@@ -1,209 +0,0 @@
-<script lang="tsx">
-  import type { ContextMenuItem, ItemContentProps, Axis } from './typing';
-  import type { FunctionalComponent, CSSProperties, PropType } from 'vue';
-  import { defineComponent, nextTick, onMounted, computed, ref, unref, onUnmounted } from 'vue';
-  import Icon from '/@/components/Icon';
-  import { Menu, Divider } from 'ant-design-vue';
-
-  const prefixCls = 'context-menu';
-
-  const props = {
-    width: { type: Number, default: 156 },
-    customEvent: { type: Object as PropType<Event>, default: null },
-    styles: { type: Object as PropType<CSSProperties> },
-    showIcon: { type: Boolean, default: true },
-    axis: {
-      // The position of the right mouse button click
-      type: Object as PropType<Axis>,
-      default() {
-        return { x: 0, y: 0 };
-      },
-    },
-    items: {
-      // The most important list, if not, will not be displayed
-      type: Array as PropType<ContextMenuItem[]>,
-      default() {
-        return [];
-      },
-    },
-  };
-
-  const ItemContent: FunctionalComponent<ItemContentProps> = (props) => {
-    const { item } = props;
-    return (
-      <span
-        style="display: inline-block; width: 100%; "
-        class="px-4"
-        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,
-    setup(props) {
-      const wrapRef = ref(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;
-        return {
-          ...styles,
-          position: 'absolute',
-          width: `${width}px`,
-          left: `${left + 1}px`,
-          top: `${top + 1}px`,
-          zIndex: 9999,
-        };
-      });
-
-      onMounted(() => {
-        nextTick(() => (showRef.value = true));
-      });
-
-      onUnmounted(() => {
-        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;
-        e?.stopPropagation();
-        e?.preventDefault();
-        handler?.();
-      }
-
-      function renderMenuItem(items: ContextMenuItem[]) {
-        const visibleItems = items.filter((item) => !item.hidden);
-        return visibleItems.map((item) => {
-          const { disabled, label, children, divider = false } = item;
-
-          const contentProps = {
-            item,
-            handler: handleAction,
-            showIcon: props.showIcon,
-          };
-
-          if (!children || children.length === 0) {
-            return (
-              <>
-                <Menu.Item disabled={disabled} class={`${prefixCls}__item`} key={label}>
-                  <ItemContent {...contentProps} />
-                </Menu.Item>
-                {divider ? <Divider key={`d-${label}`} /> : null}
-              </>
-            );
-          }
-          if (!unref(showRef)) return null;
-
-          return (
-            <Menu.SubMenu key={label} disabled={disabled} popupClassName={`${prefixCls}__popup`}>
-              {{
-                title: () => <ItemContent {...contentProps} />,
-                default: () => renderMenuItem(children),
-              }}
-            </Menu.SubMenu>
-          );
-        });
-      }
-      return () => {
-        if (!unref(showRef)) {
-          return null;
-        }
-        const { items } = props;
-        return (
-          <div class={prefixCls}>
-            <Menu inlineIndent={12} mode="vertical" ref={wrapRef} style={unref(getStyle)}>
-              {renderMenuItem(items)}
-            </Menu>
-          </div>
-        );
-      };
-    },
-  });
-</script>
-<style lang="less">
-  @default-height: 42px !important;
-
-  @small-height: 36px !important;
-
-  @large-height: 36px !important;
-
-  .item-style() {
-    li {
-      display: inline-block;
-      width: 100%;
-      height: @default-height;
-      margin: 0 !important;
-      line-height: @default-height;
-
-      span {
-        line-height: @default-height;
-      }
-
-      > div {
-        margin: 0 !important;
-      }
-
-      &:not(.ant-menu-item-disabled):hover {
-        color: @text-color-base;
-        background-color: @item-hover-bg;
-      }
-    }
-  }
-
-  .context-menu {
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 200;
-    display: block;
-    width: 156px;
-    margin: 0;
-    list-style: none;
-    background-color: @component-background;
-    border: 1px solid rgb(0 0 0 / 8%);
-    border-radius: 0.25rem;
-    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 10%),
-      0 1px 5px 0 rgb(0 0 0 / 6%);
-    background-clip: padding-box;
-    user-select: none;
-
-    &__item {
-      margin: 0 !important;
-    }
-    .item-style();
-
-    .ant-divider {
-      margin: 0;
-    }
-
-    &__popup {
-      .ant-divider {
-        margin: 0;
-      }
-
-      .item-style();
-    }
-
-    .ant-menu-submenu-title,
-    .ant-menu-item {
-      padding: 0 !important;
-    }
-  }
-</style>

src/components/ContextMenu/src/createContextMenu.ts

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

src/components/ContextMenu/src/typing.ts

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

src/components/CountDown/index.ts

@@ -1,6 +1,6 @@
-import { withInstall } from '/@/utils';
-import countButton from './src/CountButton.vue';
-import countdownInput from './src/CountdownInput.vue';
+import { withInstall } from '/@/utils'
+import countButton from './src/CountButton.vue'
+import countdownInput from './src/CountdownInput.vue'
 
-export const CountdownInput = withInstall(countdownInput);
-export const CountButton = withInstall(countButton);
+export const CountdownInput = withInstall(countdownInput)
+export const CountButton = withInstall(countButton)

src/components/CountDown/src/CountButton.vue

@@ -4,11 +4,11 @@
   </Button>
 </template>
 <script lang="ts">
-  import { defineComponent, ref, watchEffect, computed, unref } from 'vue';
-  import { Button } from 'ant-design-vue';
-  import { useCountdown } from './useCountdown';
-  import { isFunction } from '/@/utils/is';
-  import { useI18n } from '/@/hooks/web/useI18n';
+  import { defineComponent, ref, watchEffect, computed, unref } from 'vue'
+  import { Button } from 'ant-design-vue'
+  import { useCountdown } from './useCountdown'
+  import { isFunction } from '/@/utils/is'
+  import { useI18n } from '/@/hooks/web/useI18n'
 
   const props = {
     value: { type: [Object, Number, String, Array] },
@@ -17,46 +17,46 @@
       type: Function as PropType<() => Promise<boolean>>,
       default: null,
     },
-  };
+  }
 
   export default defineComponent({
     name: 'CountButton',
     components: { Button },
     props,
     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()
 
       const getButtonText = computed(() => {
         return !unref(isStart)
           ? t('component.countdown.normalText')
-          : t('component.countdown.sendText', [unref(currentCount)]);
-      });
+          : t('component.countdown.sendText', [unref(currentCount)])
+      })
 
       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, currentCount, loading, getButtonText, isStart };
+      return { handleStart, currentCount, loading, getButtonText, isStart }
     },
-  });
+  })
 </script>

src/components/CountDown/src/CountdownInput.vue

@@ -9,10 +9,10 @@
   </a-input>
 </template>
 <script lang="ts">
-  import { defineComponent, PropType } from 'vue';
-  import CountButton from './CountButton.vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useRuleFormItem } from '/@/hooks/component/useFormItem';
+  import { defineComponent, PropType } from 'vue'
+  import CountButton from './CountButton.vue'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useRuleFormItem } from '/@/hooks/component/useFormItem'
 
   const props = {
     value: { type: String },
@@ -22,7 +22,7 @@
       type: Function as PropType<() => Promise<boolean>>,
       default: null,
     },
-  };
+  }
 
   export default defineComponent({
     name: 'CountDownInput',
@@ -30,12 +30,12 @@
     inheritAttrs: false,
     props,
     setup(props) {
-      const { prefixCls } = useDesign('countdown-input');
-      const [state] = useRuleFormItem(props);
+      const { prefixCls } = useDesign('countdown-input')
+      const [state] = useRuleFormItem(props)
 
-      return { prefixCls, state };
+      return { prefixCls, state }
     },
-  });
+  })
 </script>
 <style lang="less">
   @prefix-cls: ~'@{namespace}-countdown-input';

src/components/CountDown/src/useCountdown.ts

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

src/components/CountTo/index.ts

@@ -1,4 +0,0 @@
-import { withInstall } from '/@/utils';
-import countTo from './src/CountTo.vue';
-
-export const CountTo = withInstall(countTo);

src/components/CountTo/src/CountTo.vue

@@ -1,110 +0,0 @@
-<template>
-  <span :style="{ color }">
-    {{ value }}
-  </span>
-</template>
-<script lang="ts">
-  import { defineComponent, ref, computed, watchEffect, unref, onMounted, watch } from 'vue';
-  import { useTransition, TransitionPresets } from '@vueuse/core';
-  import { isNumber } from '/@/utils/is';
-
-  const props = {
-    startVal: { type: Number, default: 0 },
-    endVal: { type: Number, default: 2021 },
-    duration: { type: Number, default: 1500 },
-    autoplay: { type: Boolean, default: true },
-    decimals: {
-      type: Number,
-      default: 0,
-      validator(value: number) {
-        return value >= 0;
-      },
-    },
-    prefix: { type: String, default: '' },
-    suffix: { type: String, default: '' },
-    separator: { type: String, default: ',' },
-    decimal: { type: String, default: '.' },
-    /**
-     * font color
-     */
-    color: { type: String },
-    /**
-     * Turn on digital animation
-     */
-    useEasing: { type: Boolean, default: true },
-    /**
-     * Digital animation
-     */
-    transition: { type: String, default: 'linear' },
-  };
-
-  export default defineComponent({
-    name: 'CountTo',
-    props,
-    emits: ['onStarted', 'onFinished'],
-    setup(props, { emit }) {
-      const source = ref(props.startVal);
-      const disabled = ref(false);
-      let outputValue = useTransition(source);
-
-      const value = computed(() => formatNumber(unref(outputValue)));
-
-      watchEffect(() => {
-        source.value = props.startVal;
-      });
-
-      watch([() => props.startVal, () => props.endVal], () => {
-        if (props.autoplay) {
-          start();
-        }
-      });
-
-      onMounted(() => {
-        props.autoplay && start();
-      });
-
-      function start() {
-        run();
-        source.value = props.endVal;
-      }
-
-      function reset() {
-        source.value = props.startVal;
-        run();
-      }
-
-      function run() {
-        outputValue = useTransition(source, {
-          disabled,
-          duration: props.duration,
-          onFinished: () => emit('onFinished'),
-          onStarted: () => emit('onStarted'),
-          ...(props.useEasing ? { transition: TransitionPresets[props.transition] } : {}),
-        });
-      }
-
-      function formatNumber(num: number | string) {
-        if (!num && num !== 0) {
-          return '';
-        }
-        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');
-          }
-        }
-        return prefix + x1 + x2 + suffix;
-      }
-
-      return { value, start, reset };
-    },
-  });
-</script>

src/components/Cropper/index.ts

@@ -1,7 +0,0 @@
-import { withInstall } from '/@/utils';
-import cropperImage from './src/Cropper.vue';
-import avatarCropper from './src/CropperAvatar.vue';
-
-export * from './src/typing';
-export const CropperImage = withInstall(cropperImage);
-export const CropperAvatar = withInstall(avatarCropper);

src/components/Cropper/src/CopperModal.vue

@@ -1,283 +0,0 @@
-<template>
-  <BasicModal
-    v-bind="$attrs"
-    @register="register"
-    :title="t('component.cropper.modalTitle')"
-    width="800px"
-    :canFullscreen="false"
-    @ok="handleOk"
-    :okText="t('component.cropper.okText')"
-  >
-    <div :class="prefixCls">
-      <div :class="`${prefixCls}-left`">
-        <div :class="`${prefixCls}-cropper`">
-          <CropperImage
-            v-if="src"
-            :src="src"
-            height="300px"
-            :circled="circled"
-            @cropend="handleCropend"
-            @ready="handleReady"
-          />
-        </div>
-
-        <div :class="`${prefixCls}-toolbar`">
-          <Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload">
-            <Tooltip :title="t('component.cropper.selectImage')" placement="bottom">
-              <a-button size="small" preIcon="ant-design:upload-outlined" type="primary" />
-            </Tooltip>
-          </Upload>
-          <Space>
-            <Tooltip :title="t('component.cropper.btn_reset')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="ant-design:reload-outlined"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('reset')"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_rotate_left')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="ant-design:rotate-left-outlined"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('rotate', -45)"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_rotate_right')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="ant-design:rotate-right-outlined"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('rotate', 45)"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_scale_x')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="vaadin:arrows-long-h"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('scaleX')"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_scale_y')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="vaadin:arrows-long-v"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('scaleY')"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_zoom_in')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="ant-design:zoom-in-outlined"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('zoom', 0.1)"
-              />
-            </Tooltip>
-            <Tooltip :title="t('component.cropper.btn_zoom_out')" placement="bottom">
-              <a-button
-                type="primary"
-                preIcon="ant-design:zoom-out-outlined"
-                size="small"
-                :disabled="!src"
-                @click="handlerToolbar('zoom', -0.1)"
-              />
-            </Tooltip>
-          </Space>
-        </div>
-      </div>
-      <div :class="`${prefixCls}-right`">
-        <div :class="`${prefixCls}-preview`">
-          <img :src="previewSource" v-if="previewSource" :alt="t('component.cropper.preview')" />
-        </div>
-        <template v-if="previewSource">
-          <div :class="`${prefixCls}-group`">
-            <Avatar :src="previewSource" size="large" />
-            <Avatar :src="previewSource" :size="48" />
-            <Avatar :src="previewSource" :size="64" />
-            <Avatar :src="previewSource" :size="80" />
-          </div>
-        </template>
-      </div>
-    </div>
-  </BasicModal>
-</template>
-<script lang="ts">
-  import type { CropendResult, Cropper } from './typing';
-
-  import { defineComponent, ref } from 'vue';
-  import CropperImage from './Cropper.vue';
-  import { Space, Upload, Avatar, Tooltip } from 'ant-design-vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { BasicModal, useModalInner } from '/@/components/Modal';
-  import { dataURLtoBlob } from '/@/utils/file/base64Conver';
-  import { isFunction } from '/@/utils/is';
-  import { useI18n } from '/@/hooks/web/useI18n';
-
-  type apiFunParams = { file: Blob; name: string; filename: string };
-
-  const props = {
-    circled: { type: Boolean, default: true },
-    uploadApi: {
-      type: Function as PropType<(params: apiFunParams) => Promise<any>>,
-    },
-  };
-
-  export default defineComponent({
-    name: 'CropperModal',
-    components: { BasicModal, Space, CropperImage, Upload, Avatar, Tooltip },
-    props,
-    emits: ['uploadSuccess', 'register'],
-    setup(props, { emit }) {
-      let filename = '';
-      const src = ref('');
-      const previewSource = ref('');
-      const cropper = ref<Cropper>();
-      let scaleX = 1;
-      let scaleY = 1;
-
-      const { prefixCls } = useDesign('cropper-am');
-      const [register, { closeModal, setModalProps }] = useModalInner();
-      const { t } = useI18n();
-
-      // Block upload
-      function handleBeforeUpload(file: File) {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        src.value = '';
-        previewSource.value = '';
-        reader.onload = function (e) {
-          src.value = (e.target?.result as string) ?? '';
-          filename = file.name;
-        };
-        return false;
-      }
-
-      function handleCropend({ imgBase64 }: CropendResult) {
-        previewSource.value = imgBase64;
-      }
-
-      function handleReady(cropperInstance: Cropper) {
-        cropper.value = cropperInstance;
-      }
-
-      function handlerToolbar(event: string, arg?: number) {
-        if (event === 'scaleX') {
-          scaleX = arg = scaleX === -1 ? 1 : -1;
-        }
-        if (event === 'scaleY') {
-          scaleY = arg = scaleY === -1 ? 1 : -1;
-        }
-        cropper?.value?.[event]?.(arg);
-      }
-
-      async function handleOk() {
-        const uploadApi = props.uploadApi;
-        if (uploadApi && isFunction(uploadApi)) {
-          const blob = dataURLtoBlob(previewSource.value);
-          try {
-            setModalProps({ confirmLoading: true });
-            const result = await uploadApi({ name: 'file', file: blob, filename });
-            emit('uploadSuccess', { source: previewSource.value, data: result.data });
-            closeModal();
-          } finally {
-            setModalProps({ confirmLoading: false });
-          }
-        }
-      }
-
-      return {
-        t,
-        prefixCls,
-        src,
-        register,
-        previewSource,
-        handleBeforeUpload,
-        handleCropend,
-        handleReady,
-        handlerToolbar,
-        handleOk,
-      };
-    },
-  });
-</script>
-
-<style lang="less">
-  @prefix-cls: ~'@{namespace}-cropper-am';
-
-  .@{prefix-cls} {
-    display: flex;
-
-    &-left,
-    &-right {
-      height: 340px;
-    }
-
-    &-left {
-      width: 55%;
-    }
-
-    &-right {
-      width: 45%;
-    }
-
-    &-cropper {
-      height: 300px;
-      background: #eee;
-      background-image: linear-gradient(
-          45deg,
-          rgb(0 0 0 / 25%) 25%,
-          transparent 0,
-          transparent 75%,
-          rgb(0 0 0 / 25%) 0
-        ),
-        linear-gradient(
-          45deg,
-          rgb(0 0 0 / 25%) 25%,
-          transparent 0,
-          transparent 75%,
-          rgb(0 0 0 / 25%) 0
-        );
-      background-position: 0 0, 12px 12px;
-      background-size: 24px 24px;
-    }
-
-    &-toolbar {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      margin-top: 10px;
-    }
-
-    &-preview {
-      width: 220px;
-      height: 220px;
-      margin: 0 auto;
-      overflow: hidden;
-      border: 1px solid @border-color-base;
-      border-radius: 50%;
-
-      img {
-        width: 100%;
-        height: 100%;
-      }
-    }
-
-    &-group {
-      display: flex;
-      padding-top: 8px;
-      margin-top: 8px;
-      border-top: 1px solid @border-color-base;
-      justify-content: space-around;
-      align-items: center;
-    }
-  }
-</style>

src/components/Cropper/src/Cropper.vue

@@ -1,188 +0,0 @@
-<template>
-  <div :class="getClass" :style="getWrapperStyle">
-    <img
-      v-show="isReady"
-      ref="imgElRef"
-      :src="src"
-      :alt="alt"
-      :crossorigin="crossorigin"
-      :style="getImageStyle"
-    />
-  </div>
-</template>
-<script lang="ts">
-  import type { CSSProperties } from 'vue';
-  import { defineComponent, onMounted, ref, unref, computed, onUnmounted } from 'vue';
-  import Cropper from 'cropperjs';
-  import 'cropperjs/dist/cropper.css';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useDebounceFn } from '@vueuse/shared';
-
-  type Options = Cropper.Options;
-
-  const defaultOptions: Options = {
-    aspectRatio: 1,
-    zoomable: true,
-    zoomOnTouch: true,
-    zoomOnWheel: true,
-    cropBoxMovable: true,
-    cropBoxResizable: true,
-    toggleDragModeOnDblclick: true,
-    autoCrop: true,
-    background: true,
-    highlight: true,
-    center: true,
-    responsive: true,
-    restore: true,
-    checkCrossOrigin: true,
-    checkOrientation: true,
-    scalable: true,
-    modal: true,
-    guides: true,
-    movable: true,
-    rotatable: true,
-  };
-
-  const props = {
-    src: { type: String, required: true },
-    alt: { type: String },
-    circled: { type: Boolean, default: false },
-    realTimePreview: { type: Boolean, default: true },
-    height: { type: [String, Number], default: '360px' },
-    crossorigin: {
-      type: String as PropType<'' | 'anonymous' | 'use-credentials' | undefined>,
-      default: undefined,
-    },
-    imageStyle: { type: Object as PropType<CSSProperties>, default: () => ({}) },
-    options: { type: Object as PropType<Options>, default: () => ({}) },
-  };
-
-  export default defineComponent({
-    name: 'CropperImage',
-    props,
-    emits: ['cropend', 'ready', 'cropendError'],
-    setup(props, { attrs, emit }) {
-      const imgElRef = ref<ElRef<HTMLImageElement>>();
-      const cropper = ref<Nullable<Cropper>>();
-      const isReady = ref(false);
-
-      const { prefixCls } = useDesign('cropper-image');
-      const debounceRealTimeCroppered = useDebounceFn(realTimeCroppered, 80);
-
-      const getImageStyle = computed((): CSSProperties => {
-        return {
-          height: props.height,
-          maxWidth: '100%',
-          ...props.imageStyle,
-        };
-      });
-
-      const getClass = computed(() => {
-        return [
-          prefixCls,
-          attrs.class,
-          {
-            [`${prefixCls}--circled`]: props.circled,
-          },
-        ];
-      });
-
-      const getWrapperStyle = computed((): CSSProperties => {
-        return { height: `${props.height}`.replace(/px/, '') + 'px' };
-      });
-
-      onMounted(init);
-
-      onUnmounted(() => {
-        cropper.value?.destroy();
-      });
-
-      async function init() {
-        const imgEl = unref(imgElRef);
-        if (!imgEl) {
-          return;
-        }
-        cropper.value = new Cropper(imgEl, {
-          ...defaultOptions,
-          ready: () => {
-            isReady.value = true;
-            realTimeCroppered();
-            emit('ready', cropper.value);
-          },
-          crop() {
-            debounceRealTimeCroppered();
-          },
-          zoom() {
-            debounceRealTimeCroppered();
-          },
-          cropmove() {
-            debounceRealTimeCroppered();
-          },
-          ...props.options,
-        });
-      }
-
-      // Real-time display preview
-      function realTimeCroppered() {
-        props.realTimePreview && croppered();
-      }
-
-      // event: return base64 and width and height information after cropping
-      function croppered() {
-        if (!cropper.value) {
-          return;
-        }
-        let imgInfo = cropper.value.getData();
-        const canvas = props.circled ? getRoundedCanvas() : cropper.value.getCroppedCanvas();
-        canvas.toBlob((blob) => {
-          if (!blob) {
-            return;
-          }
-          let fileReader: FileReader = new FileReader();
-          fileReader.readAsDataURL(blob);
-          fileReader.onloadend = (e) => {
-            emit('cropend', {
-              imgBase64: e.target?.result ?? '',
-              imgInfo,
-            });
-          };
-          fileReader.onerror = () => {
-            emit('cropendError');
-          };
-        }, 'image/png');
-      }
-
-      // Get a circular picture canvas
-      function getRoundedCanvas() {
-        const sourceCanvas = cropper.value!.getCroppedCanvas();
-        const canvas = document.createElement('canvas');
-        const context = canvas.getContext('2d')!;
-        const width = sourceCanvas.width;
-        const height = sourceCanvas.height;
-        canvas.width = width;
-        canvas.height = height;
-        context.imageSmoothingEnabled = true;
-        context.drawImage(sourceCanvas, 0, 0, width, height);
-        context.globalCompositeOperation = 'destination-in';
-        context.beginPath();
-        context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
-        context.fill();
-        return canvas;
-      }
-
-      return { getClass, imgElRef, getWrapperStyle, getImageStyle, isReady, croppered };
-    },
-  });
-</script>
-<style lang="less">
-  @prefix-cls: ~'@{namespace}-cropper-image';
-
-  .@{prefix-cls} {
-    &--circled {
-      .cropper-view-box,
-      .cropper-face {
-        border-radius: 50%;
-      }
-    }
-  }
-</style>

src/components/Cropper/src/CropperAvatar.vue

@@ -1,161 +0,0 @@
-<template>
-  <div :class="getClass" :style="getStyle">
-    <div :class="`${prefixCls}-image-wrapper`" :style="getImageWrapperStyle" @click="openModal">
-      <div :class="`${prefixCls}-image-mask`" :style="getImageWrapperStyle">
-        <Icon
-          icon="ant-design:cloud-upload-outlined"
-          :size="getIconWidth"
-          :style="getImageWrapperStyle"
-          color="#d6d6d6"
-        />
-      </div>
-      <img :src="sourceValue" v-if="sourceValue" alt="avatar" />
-    </div>
-    <a-button
-      :class="`${prefixCls}-upload-btn`"
-      @click="openModal"
-      v-if="showBtn"
-      v-bind="btnProps"
-    >
-      {{ btnText ? btnText : t('component.cropper.selectImage') }}
-    </a-button>
-
-    <CopperModal
-      @register="register"
-      @upload-success="handleUploadSuccess"
-      :uploadApi="uploadApi"
-      :src="sourceValue"
-    />
-  </div>
-</template>
-<script lang="ts">
-  import {
-    defineComponent,
-    computed,
-    CSSProperties,
-    unref,
-    ref,
-    watchEffect,
-    watch,
-    PropType,
-  } from 'vue';
-  import CopperModal from './CopperModal.vue';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useModal } from '/@/components/Modal';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import { useI18n } from '/@/hooks/web/useI18n';
-  import type { ButtonProps } from '/@/components/Button';
-  import Icon from '/@/components/Icon';
-
-  const props = {
-    width: { type: [String, Number], default: '200px' },
-    value: { type: String },
-    showBtn: { type: Boolean, default: true },
-    btnProps: { type: Object as PropType<ButtonProps> },
-    btnText: { type: String, default: '' },
-    uploadApi: { type: Function as PropType<({ file: Blob, name: string }) => Promise<void>> },
-  };
-
-  export default defineComponent({
-    name: 'CropperAvatar',
-    components: { CopperModal, Icon },
-    props,
-    emits: ['update:value', 'change'],
-    setup(props, { emit, expose }) {
-      const sourceValue = ref(props.value || '');
-      const { prefixCls } = useDesign('cropper-avatar');
-      const [register, { openModal, closeModal }] = useModal();
-      const { createMessage } = useMessage();
-      const { t } = useI18n();
-
-      const getClass = computed(() => [prefixCls]);
-
-      const getWidth = computed(() => `${props.width}`.replace(/px/, '') + 'px');
-
-      const getIconWidth = computed(() => parseInt(`${props.width}`.replace(/px/, '')) / 2 + 'px');
-
-      const getStyle = computed((): CSSProperties => ({ width: unref(getWidth) }));
-
-      const getImageWrapperStyle = computed(
-        (): CSSProperties => ({ width: unref(getWidth), height: unref(getWidth) }),
-      );
-
-      watchEffect(() => {
-        sourceValue.value = props.value || '';
-      });
-
-      watch(
-        () => sourceValue.value,
-        (v: string) => {
-          emit('update:value', v);
-        },
-      );
-
-      function handleUploadSuccess({ source, data }) {
-        sourceValue.value = source;
-        emit('change', { source, data });
-        createMessage.success(t('component.cropper.uploadSuccess'));
-      }
-
-      expose({ openModal: openModal.bind(null, true), closeModal });
-
-      return {
-        t,
-        prefixCls,
-        register,
-        openModal: openModal as any,
-        getIconWidth,
-        sourceValue,
-        getClass,
-        getImageWrapperStyle,
-        getStyle,
-        handleUploadSuccess,
-      };
-    },
-  });
-</script>
-
-<style lang="less" scoped>
-  @prefix-cls: ~'@{namespace}-cropper-avatar';
-
-  .@{prefix-cls} {
-    display: inline-block;
-    text-align: center;
-
-    &-image-wrapper {
-      overflow: hidden;
-      cursor: pointer;
-      background: @component-background;
-      border: 1px solid @border-color-base;
-      border-radius: 50%;
-
-      img {
-        width: 100%;
-      }
-    }
-
-    &-image-mask {
-      opacity: 0%;
-      position: absolute;
-      width: inherit;
-      height: inherit;
-      border-radius: inherit;
-      border: inherit;
-      background: rgb(0 0 0 / 40%);
-      cursor: pointer;
-      transition: opacity 0.4s;
-
-      ::v-deep(svg) {
-        margin: auto;
-      }
-    }
-
-    &-image-mask:hover {
-      opacity: 4000%;
-    }
-
-    &-upload-btn {
-      margin: 10px auto;
-    }
-  }
-</style>

src/components/Cropper/src/typing.ts

@@ -1,8 +0,0 @@
-import type Cropper from 'cropperjs';
-
-export interface CropendResult {
-  imgBase64: string;
-  imgInfo: Cropper.Data;
-}
-
-export type { Cropper };

src/components/Description/index.ts

@@ -1,6 +1,6 @@
-import { withInstall } from '/@/utils';
-import description from './src/Description.vue';
+import { withInstall } from '/@/utils'
+import description from './src/Description.vue'
 
-export * from './src/typing';
-export { useDescription } from './src/useDescription';
-export const Description = withInstall(description);
+export * from './src/typing'
+export { useDescription } from './src/useDescription'
+export const Description = withInstall(description)

src/components/Description/src/Description.vue

@@ -1,16 +1,16 @@
 <script lang="tsx">
-  import type { DescriptionProps, DescInstance, DescItem } from './typing';
-  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, toRefs } 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 { isFunction } from '/@/utils/is';
-  import { getSlot } from '/@/utils/helper/tsxHelper';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
+  import type { DescriptionProps, DescInstance, DescItem } from './typing'
+  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, toRefs } 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 { isFunction } from '/@/utils/is'
+  import { getSlot } from '/@/utils/helper/tsxHelper'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
 
   const props = {
     useCollapse: { type: Boolean, default: true },
@@ -24,7 +24,7 @@
     column: {
       type: [Number, Object] as PropType<number | Recordable>,
       default: () => {
-        return { xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 };
+        return { xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }
       },
     },
     collapseOptions: {
@@ -36,38 +36,38 @@
       default: () => [],
     },
     data: { type: Object },
-  };
+  }
 
   export default defineComponent({
     name: 'Description',
     props,
     emits: ['register'],
     setup(props, { slots, emit }) {
-      const propsRef = ref<Partial<DescriptionProps> | null>(null);
+      const propsRef = ref<Partial<DescriptionProps> | 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 DescriptionProps;
-      });
+        } as DescriptionProps
+      })
 
       const getProps = computed(() => {
         const opt = {
           ...unref(getMergeProps),
           title: undefined,
-        };
-        return opt as DescriptionProps;
-      });
+        }
+        return opt as DescriptionProps
+      })
 
       /**
        * @description: Whether to setting title
        */
-      const useWrapper = computed(() => !!unref(getMergeProps).title);
+      const useWrapper = computed(() => !!unref(getMergeProps).title)
 
       /**
        * @description: Get configuration Collapse
@@ -77,72 +77,72 @@
           // Cannot be expanded by default
           canExpand: false,
           ...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<DescriptionProps>): 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>;
+        }
+        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;
+            const { render, field, span, show, contentMinWidth } = item
 
             if (show && isFunction(show) && !show(data)) {
-              return null;
+              return null
             }
 
             const getContent = () => {
-              const _data = unref(getProps)?.data;
+              const _data = unref(getProps)?.data
               if (!_data) {
-                return null;
+                return null
               }
-              const getField = get(_data, field);
+              const getField = get(_data, field)
               if (getField && !toRefs(_data).hasOwnProperty(field)) {
-                return isFunction(render) ? render('', _data) : '';
+                return isFunction(render) ? render('', _data) : ''
               }
-              return isFunction(render) ? render(getField, _data) : getField ?? '';
-            };
+              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>;
+                  }
+                  return <div style={style}>{getContent()}</div>
                 }}
               </Descriptions.Item>
-            );
+            )
           })
-          .filter((item) => !!item);
+          .filter((item) => !!item)
       }
 
       const renderDesc = () => {
@@ -150,18 +150,18 @@
           <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}>
@@ -170,15 +170,15 @@
               action: () => getSlot(slots, 'action'),
             }}
           </CollapseContainer>
-        );
-      };
+        )
+      }
 
       const methods: DescInstance = {
         setDescProps,
-      };
+      }
 
-      emit('register', methods);
-      return () => (unref(useWrapper) ? renderContainer() : renderDesc());
+      emit('register', methods)
+      return () => (unref(useWrapper) ? renderContainer() : renderDesc())
     },
-  });
+  })
 </script>

src/components/Description/src/typing.ts

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

src/components/Description/src/useDescription.ts

@@ -1,28 +1,28 @@
-import type { DescriptionProps, DescInstance, UseDescReturnType } from './typing';
-import { ref, getCurrentInstance, unref } from 'vue';
-import { isProdMode } from '/@/utils/env';
+import type { DescriptionProps, DescInstance, UseDescReturnType } from './typing'
+import { ref, getCurrentInstance, unref } from 'vue'
+import { isProdMode } from '/@/utils/env'
 
 export function useDescription(props?: Partial<DescriptionProps>): UseDescReturnType {
   if (!getCurrentInstance()) {
-    throw new Error('useDescription() can only be used inside setup() or functional components!');
+    throw new Error('useDescription() can only be used inside setup() or functional components!')
   }
-  const desc = ref<Nullable<DescInstance>>(null);
-  const loaded = ref(false);
+  const desc = ref<Nullable<DescInstance>>(null)
+  const loaded = ref(false)
 
   function register(instance: DescInstance) {
     if (unref(loaded) && isProdMode()) {
-      return;
+      return
     }
-    desc.value = instance;
-    props && instance.setDescProps(props);
-    loaded.value = true;
+    desc.value = instance
+    props && instance.setDescProps(props)
+    loaded.value = true
   }
 
   const methods: DescInstance = {
     setDescProps: (descProps: Partial<DescriptionProps>): void => {
-      unref(desc)?.setDescProps(descProps);
+      unref(desc)?.setDescProps(descProps)
     },
-  };
+  }
 
-  return [register, methods];
+  return [register, methods]
 }

src/components/Drawer/index.ts

@@ -1,6 +1,6 @@
-import { withInstall } from '/@/utils';
-import basicDrawer from './src/BasicDrawer.vue';
+import { withInstall } from '/@/utils'
+import basicDrawer from './src/BasicDrawer.vue'
 
-export const BasicDrawer = withInstall(basicDrawer);
-export * from './src/typing';
-export { useDrawer, useDrawerInner } from './src/useDrawer';
+export const BasicDrawer = withInstall(basicDrawer)
+export * from './src/typing'
+export { useDrawer, useDrawerInner } from './src/useDrawer'

src/components/Drawer/src/BasicDrawer.vue

@@ -31,8 +31,8 @@
   </Drawer>
 </template>
 <script lang="ts">
-  import type { DrawerInstance, DrawerProps } from './typing';
-  import type { CSSProperties } from 'vue';
+  import type { DrawerInstance, DrawerProps } from './typing'
+  import type { CSSProperties } from 'vue'
   import {
     defineComponent,
     ref,
@@ -42,17 +42,17 @@
     nextTick,
     toRaw,
     getCurrentInstance,
-  } from 'vue';
-  import { Drawer } from 'ant-design-vue';
-  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 { basicProps } from './props';
-  import { useDesign } from '/@/hooks/web/useDesign';
-  import { useAttrs } from '/@/hooks/core/useAttrs';
+  } from 'vue'
+  import { Drawer } from 'ant-design-vue'
+  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 { basicProps } from './props'
+  import { useDesign } from '/@/hooks/web/useDesign'
+  import { useAttrs } from '/@/hooks/core/useAttrs'
 
   export default defineComponent({
     components: { Drawer, ScrollContainer, DrawerFooter, DrawerHeader },
@@ -60,25 +60,25 @@
     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,
-      };
+      }
 
-      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 => {
         const opt = {
@@ -86,95 +86,95 @@
           ...unref(attrs),
           ...unref(getMergeProps),
           visible: unref(visibleRef),
-        };
-        opt.title = undefined;
-        const { isDetail, width, wrapClassName, getContainer } = opt;
+        }
+        opt.title = undefined
+        const { isDetail, width, wrapClassName, getContainer } = opt
         if (isDetail) {
           if (!width) {
-            opt.width = '100%';
+            opt.width = '100%'
           }
-          const detailCls = `${prefixCls}__detail`;
-          opt.class = wrapClassName ? `${wrapClassName} ${detailCls}` : detailCls;
+          const detailCls = `${prefixCls}__detail`
+          opt.class = 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),
-        };
-      });
+        }
+      })
 
       // 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})`,
-        };
-      });
+        }
+      })
 
       const getLoading = computed(() => {
-        return !!unref(getProps)?.loading;
-      });
+        return !!unref(getProps)?.loading
+      })
 
       watch(
         () => props.visible,
         (newVal, oldVal) => {
-          if (newVal !== oldVal) visibleRef.value = newVal;
+          if (newVal !== oldVal) visibleRef.value = newVal
         },
         { deep: true },
-      );
+      )
 
       watch(
         () => visibleRef.value,
         (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) || ({} as any), props);
+        propsRef.value = deepMerge(unref(propsRef) || ({} as any), props)
 
         if (Reflect.has(props, 'visible')) {
-          visibleRef.value = !!props.visible;
+          visibleRef.value = !!props.visible
         }
       }
 
       function handleOk() {
-        emit('ok');
+        emit('ok')
       }
 
       return {
@@ -188,9 +188,9 @@
         getBindValues,
         getFooterHeight,
         handleOk,
-      };
+      }
     },
-  });
+  })
 </script>
 <style lang="less">
   @header-height: 60px;

src/components/Drawer/src/components/DrawerFooter.vue

@@ -25,11 +25,11 @@
   </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: {
@@ -41,26 +41,26 @@
     },
     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: `calc(${heightStr} - 1px)`,
-        };
-      });
+        }
+      })
 
       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">

src/components/Drawer/src/components/DrawerHeader.vue

@@ -18,13 +18,13 @@
   </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 },
@@ -35,15 +35,15 @@
     },
     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">

src/components/Drawer/src/props.ts

@@ -1,7 +1,7 @@
-import type { PropType } from 'vue';
+import type { PropType } from 'vue'
 
-import { useI18n } from '/@/hooks/web/useI18n';
-const { t } = useI18n();
+import { useI18n } from '/@/hooks/web/useI18n'
+const { t } = useI18n()
 
 export const footerProps = {
   confirmLoading: { type: Boolean },
@@ -23,7 +23,7 @@ export const footerProps = {
     type: [String, Number] as PropType<string | number>,
     default: 60,
   },
-};
+}
 export const basicProps = {
   isDetail: { type: Boolean },
   title: { type: String, default: '' },
@@ -41,4 +41,4 @@ export const basicProps = {
   },
   destroyOnClose: { type: Boolean },
   ...footerProps,
-};
+}

src/components/Drawer/src/typing.ts

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

src/components/Drawer/src/useDrawer.ts

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

src/components/Dropdown/index.ts

@@ -1,5 +1,5 @@
-import { withInstall } from '/@/utils';
-import dropdown from './src/Dropdown.vue';
+import { withInstall } from '/@/utils'
+import dropdown from './src/Dropdown.vue'
 
-export * from './src/typing';
-export const Dropdown = withInstall(dropdown);
+export * from './src/typing'
+export const Dropdown = withInstall(dropdown)

src/components/Dropdown/src/Dropdown.vue

@@ -36,18 +36,18 @@
 </template>
 
 <script lang="ts" setup>
-  import { computed, PropType } from 'vue';
-  import type { DropMenu } from './typing';
-  import { Dropdown, Menu, Popconfirm } from 'ant-design-vue';
-  import { Icon } from '/@/components/Icon';
-  import { omit } from 'lodash-es';
-  import { isFunction } from '/@/utils/is';
+  import { computed, PropType } from 'vue'
+  import type { DropMenu } from './typing'
+  import { Dropdown, Menu, Popconfirm } from 'ant-design-vue'
+  import { Icon } from '/@/components/Icon'
+  import { omit } from 'lodash-es'
+  import { isFunction } from '/@/utils/is'
 
-  const ADropdown = Dropdown;
-  const AMenu = Menu;
-  const AMenuItem = Menu.Item;
-  const AMenuDivider = Menu.Divider;
-  const APopconfirm = Popconfirm;
+  const ADropdown = Dropdown
+  const AMenu = Menu
+  const AMenuItem = Menu.Item
+  const AMenuDivider = Menu.Divider
+  const APopconfirm = Popconfirm
 
   const props = defineProps({
     popconfirm: Boolean,
@@ -59,7 +59,7 @@
     trigger: {
       type: [Array] as PropType<('contextmenu' | 'click' | 'hover')[]>,
       default: () => {
-        return ['contextmenu'];
+        return ['contextmenu']
       },
     },
     dropMenuList: {
@@ -70,27 +70,27 @@
       type: Array as PropType<string[]>,
       default: () => [],
     },
-  });
+  })
 
-  const emit = defineEmits(['menuEvent']);
+  const emit = defineEmits(['menuEvent'])
 
   function handleClickMenu(item: DropMenu) {
-    const { event } = item;
-    const menu = props.dropMenuList.find((item) => `${item.event}` === `${event}`);
-    emit('menuEvent', menu);
-    item.onClick?.();
+    const { event } = item
+    const menu = props.dropMenuList.find((item) => `${item.event}` === `${event}`)
+    emit('menuEvent', menu)
+    item.onClick?.()
   }
 
   const getPopConfirmAttrs = computed(() => {
     return (attrs) => {
-      const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon']);
+      const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon'])
       if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm))
-        originAttrs['onConfirm'] = attrs.confirm;
+        originAttrs['onConfirm'] = attrs.confirm
       if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel))
-        originAttrs['onCancel'] = attrs.cancel;
-      return originAttrs;
-    };
-  });
+        originAttrs['onCancel'] = attrs.cancel
+      return originAttrs
+    }
+  })
 
-  const getAttr = (key: string | number) => ({ key });
+  const getAttr = (key: string | number) => ({ key })
 </script>