diff --git a/src/component/HomePage/ExportModel.vue b/src/component/HomePage/ExportModel.vue index 139ab8e3..d9ff6eb6 100644 --- a/src/component/HomePage/ExportModel.vue +++ b/src/component/HomePage/ExportModel.vue @@ -687,32 +687,46 @@ export default defineComponent({ lockRotation: true, }); } - let setExportCanvas = ()=>{ - var objects = canvas.getObjects(); - var maxHeight = 0; - - // 计算所有对象的最大高度 - objects.forEach(function(obj) { - var objBottom = obj.top + obj.height*obj.scaleY; - if (objBottom > maxHeight) { - maxHeight = objBottom; - } - }); - canvasWH.height = maxHeight+30 - // 调整 Canvas 的高度 - canvas.setDimensions({ height: canvasWH.height }); - - // 重新渲染 Canvas + let setExportCanvas = async ()=>{ + await calculateHeight() + canvas.setDimensions({ height: canvasWH.value.height }); canvas.renderAll(); return canvas.toDataURL({ - format: "png", // 导出格式为 PNG - quality: 1, // 图片质量为 1(最高质量) - }); + format: "png", // 导出格式为 PNG + quality: 1, // 图片质量为 1(最高质量) + }); + } + let calculateHeight = ()=>{ + return new Promise((resolve, reject) =>{ + var objects = canvas.getObjects(); + var maxHeight = 0; + Modal.confirm({ + title: useI18.t('exportModel.jsContent8'), + okText: 'Yes', + cancelText: 'No', + mask:false, + centered:true, + onOk() { + objects.forEach(function(obj) { + var objBottom = obj.top + obj.height*obj.scaleY; + if (objBottom > maxHeight) { + maxHeight = objBottom; + } + }); + canvasWH.value.height = Math.round(maxHeight)+30 + + resolve(canvasWH.value.height) + }, + onCancel(){ + resolve(canvasWH.value.height) + } + }); + }) } //设置导出 let setExport = async () => { initAligningGuidelines(canvas,false) - var imageDataURL = setExportCanvas() + var imageDataURL = await setExportCanvas() let a = document.createElement("a"); let img = []; let index = 0; @@ -1829,11 +1843,11 @@ export default defineComponent({ let toSvg = ()=>{ // console.log(canvas.toSvg()); } - let setShare = ()=>{ + let setShare = async ()=>{ initAligningGuidelines(canvas,false) let publishModal = publish.value publishModal.publishMask = true - var imageDataURL = setExportCanvas() + var imageDataURL = await setExportCanvas() let data = { "imgUrl":imageDataURL, userlikeGroupId:userlikeGroupId, diff --git a/src/lang/cn.ts b/src/lang/cn.ts index 95e539d1..f714cfb2 100644 --- a/src/lang/cn.ts +++ b/src/lang/cn.ts @@ -71,6 +71,7 @@ export default { jsContent5:'您选择的第{str}张图像在超分辨率增强后的分辨率超过2048。请选择较低的放大倍数。', jsContent6:'请选择需要超分的图片', jsContent7:'保存成功~', + jsContent8:'是否需要自动裁剪画布多余空间', }, upgradePlan:{ BuyCredlts:'购买积分', diff --git a/src/lang/en.ts b/src/lang/en.ts index 3827ae26..f03c56c7 100644 --- a/src/lang/en.ts +++ b/src/lang/en.ts @@ -72,6 +72,7 @@ export default { jsContent5:'After super-resolution enhancement, the {str} th image you selected has a resolution exceeding 2048, Please choose a lower magnification level.', jsContent6:'Please select the picture that requires upscale', jsContent7:'save successfully', + jsContent8:'Whether you need to automatically crop your canvas excess space', }, upgradePlan:{ BuyCredlts:'Buy credits',