chore: merge branch 'main' of github.com:anncwb/vue-vben-admin into main

.gitignore

@@ -4,7 +4,8 @@ dist
 .npmrc
 .cache
 
-test/server/static
+tests/server/static
+tests/server/static/upload
 
 .local
 # local env files

CHANGELOG.en_US.md

@@ -1,3 +1,44 @@
+## 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

CHANGELOG.zh_CN.md

@@ -1,3 +1,11 @@
+## Wip
+
+### 🐛 Bug Fixes
+
+- **Table** 修复分页抖动问题
+- **Upload** 确保携带自定义参数
+- **Dropdown** 修复 popConfirm 的图标显示问题
+
 ## 2.5.0(2021-06-20)
 
 ## (破坏性更新) Breaking changes

package.json

@@ -51,15 +51,15 @@
     "vue": "3.0.11",
     "vue-i18n": "9.1.6",
     "vue-json-pretty": "^2.0.2",
-    "vue-router": "^4.0.9",
+    "vue-router": "^4.0.10",
     "vue-types": "^3.0.2"
   },
   "devDependencies": {
     "@commitlint/cli": "^12.1.4",
     "@commitlint/config-conventional": "^12.1.4",
-    "@iconify/json": "^1.1.358",
+    "@iconify/json": "^1.1.360",
     "@purge-icons/generated": "^0.7.0",
-    "@types/codemirror": "^5.60.0",
+    "@types/codemirror": "^5.60.1",
     "@types/crypto-js": "^4.0.1",
     "@types/fs-extra": "^9.0.11",
     "@types/inquirer": "^7.3.2",
@@ -72,13 +72,13 @@
     "@types/qrcode": "^1.4.0",
     "@types/qs": "^6.9.6",
     "@types/sortablejs": "^1.10.6",
-    "@typescript-eslint/eslint-plugin": "^4.27.0",
-    "@typescript-eslint/parser": "^4.27.0",
-    "@vitejs/plugin-legacy": "^1.4.1",
+    "@typescript-eslint/eslint-plugin": "^4.28.0",
+    "@typescript-eslint/parser": "^4.28.0",
+    "@vitejs/plugin-legacy": "^1.4.2",
     "@vitejs/plugin-vue": "^1.2.3",
     "@vitejs/plugin-vue-jsx": "^1.1.5",
     "@vue/compiler-sfc": "3.0.11",
-    "@vue/test-utils": "^2.0.0-rc.7",
+    "@vue/test-utils": "^2.0.0-rc.9",
     "autoprefixer": "^10.2.6",
     "commitizen": "^4.2.4",
     "conventional-changelog-cli": "^2.1.1",
@@ -96,7 +96,7 @@
     "husky": "^6.0.0",
     "inquirer": "^8.1.1",
     "is-ci": "^3.0.0",
-    "jest": "^27.0.4",
+    "jest": "^27.0.5",
     "less": "^4.1.1",
     "lint-staged": "^11.0.0",
     "npm-run-all": "^4.1.5",
@@ -109,7 +109,7 @@
     "stylelint-config-prettier": "^8.0.2",
     "stylelint-config-standard": "^22.0.0",
     "stylelint-order": "^4.1.0",
-    "tailwindcss": "^2.2.2",
+    "tailwindcss": "^2.2.4",
     "ts-jest": "^27.0.3",
     "ts-node": "^10.0.0",
     "typescript": "4.3.4",
@@ -124,12 +124,12 @@
     "vite-plugin-svg-icons": "^0.7.1",
     "vite-plugin-theme": "^0.8.1",
     "vue-eslint-parser": "^7.6.0",
-    "vue-tsc": "^0.1.7"
+    "vue-tsc": "^0.2.0"
   },
   "resolutions": {
     "//": "Used to install imagemin dependencies, because imagemin may not be installed in China. If it is abroad, you can delete it",
     "bin-wrapper": "npm:bin-wrapper-china",
-    "rollup": "^2.52.1"
+    "rollup": "^2.52.2"
   },
   "repository": {
     "type": "git",

src/components/Dropdown/src/Dropdown.vue

@@ -11,9 +11,17 @@
             @click="handleClickMenu(item)"
             :disabled="item.disabled"
           >
-            <Popconfirm v-if="popconfirm && item.popConfirm" v-bind="item">
-              <Icon :icon="item.icon" v-if="item.icon" />
-              <span class="ml-1">{{ item.text }}</span>
+            <Popconfirm
+              v-if="popconfirm && item.popConfirm"
+              v-bind="getPopConfirmAttrs(item.popConfirm)"
+            >
+              <template #icon v-if="item.popConfirm.icon">
+                <Icon :icon="item.popConfirm.icon" />
+              </template>
+              <div>
+                <Icon :icon="item.icon" v-if="item.icon" />
+                <span class="ml-1">{{ item.text }}</span>
+              </div>
             </Popconfirm>
             <template v-else>
               <Icon :icon="item.icon" v-if="item.icon" />
@@ -28,12 +36,14 @@
 </template>
 
 <script lang="ts">
-  import type { PropType } from 'vue';
+  import { computed, PropType } from 'vue';
   import type { DropMenu } from './typing';
 
   import { defineComponent } from 'vue';
   import { Dropdown, Menu, Popconfirm } from 'ant-design-vue';
   import { Icon } from '/@/components/Icon';
+  import { omit } from 'lodash-es';
+  import { isFunction } from '/@/utils/is';
 
   export default defineComponent({
     name: 'BasicDropdown',
@@ -76,8 +86,20 @@
         item.onClick?.();
       }
 
+      const getPopConfirmAttrs = computed(() => {
+        return (attrs) => {
+          const originAttrs = omit(attrs, ['confirm', 'cancel', 'icon']);
+          if (!attrs.onConfirm && attrs.confirm && isFunction(attrs.confirm))
+            originAttrs['onConfirm'] = attrs.confirm;
+          if (!attrs.onCancel && attrs.cancel && isFunction(attrs.cancel))
+            originAttrs['onCancel'] = attrs.cancel;
+          return originAttrs;
+        };
+      });
+
       return {
         handleClickMenu,
+        getPopConfirmAttrs,
         getAttr: (key: string | number) => ({ key }),
       };
     },

src/components/Form/src/components/ApiSelect.vue

@@ -2,6 +2,7 @@
   <Select
     @dropdownVisibleChange="handleFetch"
     v-bind="attrs"
+    @change="handleChange"
     :options="getOptions"
     v-model:value="state"
   >
@@ -67,11 +68,12 @@
       const options = ref<OptionsItem[]>([]);
       const loading = ref(false);
       const isFirstLoad = ref(true);
+      const emitData = ref<any[]>([]);
       const attrs = useAttrs();
       const { t } = useI18n();
 
       // Embedded in the form, just use the hook binding to perform form verification
-      const [state] = useRuleFormItem(props);
+      const [state] = useRuleFormItem(props, 'value', 'change', emitData);
 
       const getOptions = computed(() => {
         const { labelField, valueField, numberToString } = props;
@@ -135,7 +137,11 @@
         emit('options-change', unref(options));
       }
 
-      return { state, attrs, getOptions, loading, t, handleFetch };
+      function handleChange(_, ...args) {
+        emitData.value = args;
+      }
+
+      return { state, attrs, getOptions, loading, t, handleFetch, handleChange };
     },
   });
 </script>

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

@@ -51,7 +51,12 @@ export default function ({
   const debounceUpdateAdvanced = useDebounceFn(updateAdvanced, 30);
 
   watch(
-    [() => unref(getSchema), () => advanceState.isAdvanced, () => unref(realWidthRef)],
+    [
+      // TODO
+      // () => unref(getSchema),
+      () => advanceState.isAdvanced,
+      () => unref(realWidthRef),
+    ],
     () => {
       const { showAdvancedButton } = unref(getProps);
       if (showAdvancedButton) {