fix: HEIC双重回退+标签文案统一+accept格式
Some checks failed
PR Preview / teardown-preview (pull_request) Has been skipped
Test / unit-test (push) Successful in 5s
Test / build-check (push) Successful in 4s
PR Preview / test (pull_request) Successful in 5s
PR Preview / deploy-preview (pull_request) Successful in 15s
Test / e2e-test (push) Failing after 56s

- HEIC转换:heic2any失败后用createImageBitmap回退
- accept限定具体格式让iOS自动转HEIC
- 品牌名称标签改为"显示在卡片右上角二维码下方"

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-10 17:32:36 +00:00
parent 07a40977e1
commit 812da98abc

View File

@@ -125,7 +125,7 @@
<img v-if="brandQrImage" :src="brandQrImage" class="upload-box-img" />
<span v-else class="upload-box-hint">点击上传</span>
</div>
<input ref="qrInput" type="file" accept="image/*" style="display:none" @change="handleUpload('qr', $event)" />
<input ref="qrInput" type="file" accept="image/jpeg,image/png,image/webp,image/heic,image/heif" style="display:none" @change="handleUpload('qr', $event)" />
<button v-if="brandQrImage" class="btn-clear" @click="clearBrandImage('qr')">清除</button>
</div>
@@ -137,7 +137,7 @@
<img v-if="brandBg" :src="brandBg" class="upload-box-img" />
<span v-else class="upload-box-hint">点击上传</span>
</div>
<input ref="bgInput" type="file" accept="image/*" style="display:none" @change="handleUpload('bg', $event)" />
<input ref="bgInput" type="file" accept="image/jpeg,image/png,image/webp,image/heic,image/heif" style="display:none" @change="handleUpload('bg', $event)" />
<button v-if="brandBg" class="btn-clear" @click="clearBrandImage('bg')">清除</button>
</div>
@@ -149,14 +149,14 @@
<img v-if="brandLogo" :src="brandLogo" class="upload-box-img" />
<span v-else class="upload-box-hint">点击上传</span>
</div>
<input ref="logoInput" type="file" accept="image/*" style="display:none" @change="handleUpload('logo', $event)" />
<input ref="logoInput" type="file" accept="image/jpeg,image/png,image/webp,image/heic,image/heif" style="display:none" @change="handleUpload('logo', $event)" />
<button v-if="brandLogo" class="btn-clear" @click="clearBrandImage('logo')">清除</button>
</div>
</div>
<!-- Brand name -->
<div class="form-group">
<label class="form-label">品牌名称或标语显示在二维码下方</label>
<label class="form-label">品牌名称或标语显示在卡片右上角二维码下方</label>
<textarea v-model="brandName" class="form-control" rows="2" placeholder="扫码申请成为优惠顾客&#10;我的精油小屋" style="max-width:350px;font-size:13px" @blur="saveBrandSettings"></textarea>
<div style="display:flex;gap:6px;margin-top:6px">
<button class="btn-align" :class="{ active: brandAlign === 'left' }" @click="brandAlign='left'; saveBrandSettings()">靠左</button>
@@ -580,15 +580,26 @@ async function handleUpload(type, event) {
const isHeic = file.name.toLowerCase().match(/\.hei[cf]$/) ||
file.type === 'image/heic' || file.type === 'image/heif'
if (isHeic) {
ui.showToast('正在转换HEIC格式...')
ui.showToast('正在转换格式...')
try {
const heic2any = (await import('heic2any')).default
let blob = await heic2any({ blob: file, toType: 'image/jpeg', quality: 0.8 })
if (Array.isArray(blob)) blob = blob[0]
file = new File([blob], 'photo.jpg', { type: 'image/jpeg' })
} catch (e) {
ui.showToast('HEIC转换失败请手动转为JPG后上传')
return
} catch {
// Fallback: try createImageBitmap (works on some browsers)
try {
const bmp = await createImageBitmap(file)
const canvas = document.createElement('canvas')
canvas.width = bmp.width
canvas.height = bmp.height
canvas.getContext('2d').drawImage(bmp, 0, 0)
const jpegBlob = await new Promise(r => canvas.toBlob(r, 'image/jpeg', 0.8))
file = new File([jpegBlob], 'photo.jpg', { type: 'image/jpeg' })
} catch {
ui.showToast('该格式暂不支持,请在相册中选择"自动"格式或转为JPG后上传')
return
}
}
}
let base64 = await readFileAsBase64(file)