Feature: QR-Code mit Logo im Referral-Block — SW by-v441, APP_VER 420
qrcode.min.js (qrcodejs) lazy geladen; QRCode.CorrectLevel.H damit Logo-Overlay (icon-180.png, 36px) den Code noch lesbar lässt; App.loadScript() public gemacht.
This commit is contained in:
parent
b4c3698a3a
commit
e35a7a2692
4 changed files with 26 additions and 3 deletions
|
|
@ -696,6 +696,17 @@ window.Page_settings = (() => {
|
|||
overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${r.link}</div>
|
||||
<button class="btn btn-primary btn-sm" id="ref-share-btn">${UI.icon('arrow-square-out')} Teilen</button>
|
||||
</div>
|
||||
|
||||
<!-- QR-Code -->
|
||||
<div style="display:flex;justify-content:center;margin-bottom:var(--space-4)">
|
||||
<div style="position:relative;width:160px;height:160px">
|
||||
<div id="ref-qr" style="width:160px;height:160px;border-radius:var(--radius-md);overflow:hidden"></div>
|
||||
<img src="/icons/icon-180.png" alt=""
|
||||
style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
|
||||
width:36px;height:36px;border-radius:8px;border:2px solid #fff">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="font-size:var(--text-sm);color:var(--c-text-secondary)">
|
||||
${UI.icon('users')} <strong>${r.count}</strong> ${r.count === 1 ? 'Person' : 'Personen'} über deinen Link registriert
|
||||
</div>
|
||||
|
|
@ -714,6 +725,16 @@ window.Page_settings = (() => {
|
|||
UI.toast.success('Link kopiert!');
|
||||
}
|
||||
});
|
||||
// QR-Code rendern (Bibliothek lazy laden)
|
||||
await App.loadScript('/js/qrcode.min.js');
|
||||
new QRCode(document.getElementById('ref-qr'), {
|
||||
text: r.link,
|
||||
width: 160,
|
||||
height: 160,
|
||||
colorDark: '#000000',
|
||||
colorLight: '#ffffff',
|
||||
correctLevel: QRCode.CorrectLevel.H,
|
||||
});
|
||||
} catch { el.innerHTML = ''; }
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue