From 0112faf3ba2da916d0fb0f49c4fdce6d498bdbca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=B0=8F=E7=8E=8B=E5=AD=90?= Date: Tue, 5 Mar 2024 16:46:22 +0800 Subject: [PATCH] =?UTF-8?q?=E5=9B=BE=E7=89=87=E4=B8=8A=E4=BC=A0=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E5=A2=9E=E5=8A=A0=E5=8E=8B=E7=BC=A9=E5=8A=9F=E8=83=BD?= =?UTF-8?q?=E6=94=AF=E6=8C=81=EF=BC=8C=E5=8F=AF=E8=87=AA=E8=A1=8C=E5=BC=80?= =?UTF-8?q?=E5=85=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/ImageUpload/index.vue | 22 +++++++++++++++++++--- 1 file changed, 19 insertions(+), 3 deletions(-) diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue index ae5cd45..1c6dcd1 100644 --- a/src/components/ImageUpload/index.vue +++ b/src/components/ImageUpload/index.vue @@ -44,6 +44,7 @@ import { listByIds, delOss } from '@/api/system/oss'; import { OssVO } from '@/api/system/oss/types'; import { propTypes } from '@/utils/propTypes'; import { globalHeaders } from '@/utils/request'; +import { compressAccurately } from 'image-conversion'; const props = defineProps({ modelValue: { @@ -60,7 +61,14 @@ const props = defineProps({ isShowTip: { type: Boolean, default: true - } + }, + // 是否支持压缩,默认否 + compressSupport: { + type: Boolean, + default: false + }, + // 压缩目标大小,单位KB。默认300KB以上文件才压缩,并压缩至300KB以内 + compressTargetSize: propTypes.number.def(300) }); const { proxy } = getCurrentInstance() as ComponentInternalInstance; @@ -138,8 +146,16 @@ const handleBeforeUpload = (file: any) => { 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++; + } }; // 文件个数超出