fix(frontend): lower QR code error correction level to reduce density

Payment QR codes used 'H' (30% redundancy) error correction which made
the codes too dense to scan on some phones. Lower to 'M' (15%) when a
logo overlay is present and 'L' (7%) without logo, significantly
reducing module density while maintaining scannability.

Closes #1607
This commit is contained in:
erio
2026-04-13 13:19:24 +08:00
parent 48d7c2d0ba
commit 47a13d3105
3 changed files with 4 additions and 4 deletions
@@ -154,7 +154,7 @@ async function renderQR() {
await QRCode.toCanvas(qrCanvas.value, qrUrl.value, {
width: 220,
margin: 2,
errorCorrectionLevel: logoSrc ? 'H' : 'M',
errorCorrectionLevel: logoSrc ? 'M' : 'L',
})
if (!logoSrc) return
const canvas = qrCanvas.value
@@ -199,7 +199,7 @@ async function renderQR() {
if (!qrCanvas.value || !qrUrl.value) return
await QRCode.toCanvas(qrCanvas.value, qrUrl.value, {
width: 220, margin: 2,
errorCorrectionLevel: 'H',
errorCorrectionLevel: 'M',
})
}
@@ -94,12 +94,12 @@ async function renderQR() {
await nextTick()
if (!qrCanvas.value || !qrUrl.value) return
// Use high error correction to support logo overlay
// Use medium error correction to support logo overlay while keeping QR code scannable
const logoSrc = getLogoForType()
await QRCode.toCanvas(qrCanvas.value, qrUrl.value, {
width: 256,
margin: 2,
errorCorrectionLevel: logoSrc ? 'H' : 'M',
errorCorrectionLevel: logoSrc ? 'M' : 'L',
})
if (!logoSrc) return