diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 7f8eb56..1c26336 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -9,6 +9,7 @@ "version": "0.0.0", "dependencies": { "exceljs": "^4.4.0", + "heic2any": "^0.0.4", "html2canvas": "^1.4.1", "pinia": "^2.3.1", "vue": "^3.5.32", @@ -2871,6 +2872,12 @@ "node": ">= 0.4" } }, + "node_modules/heic2any": { + "version": "0.0.4", + "resolved": "https://registry.npmjs.org/heic2any/-/heic2any-0.0.4.tgz", + "integrity": "sha512-3lLnZiDELfabVH87htnRolZ2iehX9zwpRyGNz22GKXIu0fznlblf0/ftppXKNqS26dqFSeqfIBhAmAj/uSp0cA==", + "license": "MIT" + }, "node_modules/html-encoding-sniffer": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 2633374..e85f86c 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -15,6 +15,7 @@ }, "dependencies": { "exceljs": "^4.4.0", + "heic2any": "^0.0.4", "html2canvas": "^1.4.1", "pinia": "^2.3.1", "vue": "^3.5.32", diff --git a/frontend/src/views/MyDiary.vue b/frontend/src/views/MyDiary.vue index e26b0c3..9a3db5d 100644 --- a/frontend/src/views/MyDiary.vue +++ b/frontend/src/views/MyDiary.vue @@ -573,9 +573,16 @@ function checkSquare(base64) { } async function handleUpload(type, event) { - const file = event.target.files[0] + let file = event.target.files[0] if (!file) return try { + // Convert HEIC/HEIF to JPEG + if (file.name.toLowerCase().match(/\.hei[cf]$/)) { + ui.showToast('正在转换HEIC格式...') + const heic2any = (await import('heic2any')).default + const blob = await heic2any({ blob: file, toType: 'image/jpeg', quality: 0.8 }) + file = new File([blob], file.name.replace(/\.hei[cf]$/i, '.jpg'), { type: 'image/jpeg' }) + } let base64 = await readFileAsBase64(file) // QR: check if square, offer to crop @@ -590,8 +597,8 @@ async function handleUpload(type, event) { } } - const maxSize = type === 'bg' ? 1000000 : 500000 - const maxDim = type === 'bg' ? 1200 : 800 + const maxSize = type === 'bg' ? 600000 : 300000 + const maxDim = type === 'bg' ? 1000 : 600 base64 = await compressImage(base64, maxSize, maxDim) const fieldMap = { logo: 'brand_logo', bg: 'brand_bg', qr: 'qr_code' } const field = fieldMap[type]