图片上传组件增加压缩功能支持,可自行开关
This commit is contained in:
parent
ce275d9590
commit
0112faf3ba
@ -44,6 +44,7 @@ import { listByIds, delOss } from '@/api/system/oss';
|
|||||||
import { OssVO } from '@/api/system/oss/types';
|
import { OssVO } from '@/api/system/oss/types';
|
||||||
import { propTypes } from '@/utils/propTypes';
|
import { propTypes } from '@/utils/propTypes';
|
||||||
import { globalHeaders } from '@/utils/request';
|
import { globalHeaders } from '@/utils/request';
|
||||||
|
import { compressAccurately } from 'image-conversion';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: {
|
modelValue: {
|
||||||
@ -60,7 +61,14 @@ const props = defineProps({
|
|||||||
isShowTip: {
|
isShowTip: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default: true
|
||||||
}
|
},
|
||||||
|
// 是否支持压缩,默认否
|
||||||
|
compressSupport: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
// 压缩目标大小,单位KB。默认300KB以上文件才压缩,并压缩至300KB以内
|
||||||
|
compressTargetSize: propTypes.number.def(300)
|
||||||
});
|
});
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||||
@ -138,8 +146,16 @@ const handleBeforeUpload = (file: any) => {
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
proxy?.$modal.loading('正在上传图片,请稍候...');
|
|
||||||
number.value++;
|
//压缩图片,开启压缩并且大于指定的压缩大小时才压缩
|
||||||
|
if (props.compressSupport && file.size / 1024 > props.compressTargetSize) {
|
||||||
|
proxy?.$modal.loading('正在上传图片,请稍候...');
|
||||||
|
number.value++;
|
||||||
|
return compressAccurately(file, props.compressTargetSize);
|
||||||
|
} else {
|
||||||
|
proxy?.$modal.loading('正在上传图片,请稍候...');
|
||||||
|
number.value++;
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// 文件个数超出
|
// 文件个数超出
|
||||||
|
Loading…
Reference in New Issue
Block a user