|
@@ -2,6 +2,7 @@
|
|
|
<div class="upload">
|
|
<div class="upload">
|
|
|
<a-upload :action="uploadUrl"
|
|
<a-upload :action="uploadUrl"
|
|
|
v-model:file-list="uploadImgList"
|
|
v-model:file-list="uploadImgList"
|
|
|
|
|
+ :before-upload="beforeUpload"
|
|
|
@change="uploadAction">
|
|
@change="uploadAction">
|
|
|
<a-button class="uploadBtn">上传</a-button>
|
|
<a-button class="uploadBtn">上传</a-button>
|
|
|
</a-upload>
|
|
</a-upload>
|
|
@@ -23,6 +24,7 @@ import { defineComponent } from '@/common/export/table';
|
|
|
import { handlePreviewImg, handleUplodImg } from '@/common/setup/upload';
|
|
import { handlePreviewImg, handleUplodImg } from '@/common/setup/upload';
|
|
|
import { FileInfo, FileItem } from '@/common/setup/upload/interface';
|
|
import { FileInfo, FileItem } from '@/common/setup/upload/interface';
|
|
|
import { PropType, watchEffect } from '@vue/runtime-core';
|
|
import { PropType, watchEffect } from '@vue/runtime-core';
|
|
|
|
|
+import { message } from 'ant-design-vue';
|
|
|
|
|
|
|
|
export default defineComponent({
|
|
export default defineComponent({
|
|
|
name: 'upload-img',
|
|
name: 'upload-img',
|
|
@@ -53,7 +55,17 @@ export default defineComponent({
|
|
|
uploadImgList.value = props.imgList;
|
|
uploadImgList.value = props.imgList;
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
+ // 文件上传校验
|
|
|
|
|
+ const beforeUpload = (file:any) => {
|
|
|
|
|
+ const isLt2M = file.size / 1024 / 1024 <= 1;
|
|
|
|
|
+ if (!isLt2M) {
|
|
|
|
|
+ message.error(file.name + "图片大小超出1M限制,请修改后重新上传", 0.8);
|
|
|
|
|
+ return isLt2M;
|
|
|
|
|
+ }
|
|
|
|
|
+ return isLt2M;
|
|
|
|
|
+ };
|
|
|
return {
|
|
return {
|
|
|
|
|
+ beforeUpload,
|
|
|
uploadUrl,
|
|
uploadUrl,
|
|
|
uploadAction,
|
|
uploadAction,
|
|
|
uploadChange,
|
|
uploadChange,
|