Add QR Code for Keypasses

This commit is contained in:
Ettore
2026-05-10 00:41:36 +02:00
parent 0cb35a30cb
commit ff097b31d1
6 changed files with 107 additions and 3 deletions

View File

@@ -142,7 +142,9 @@ async function loadKeypasses() {
<td>${expiresCell}</td>
<td>${badge}</td>
<td><div style="display:flex;gap:.5rem;justify-content:flex-end;white-space:nowrap">
${!kp.revoked ? `<button class="btn btn-ghost" style="font-size:.8rem;padding:.35rem .9rem"
${!kp.revoked && expMs >= now ? `<button class="btn btn-ghost" style="font-size:.8rem;padding:.35rem .9rem"
data-qr-kp-id="${kp.id}" data-qr-kp-desc="${esc(kp.description)}">QR</button>` : ""}
${!kp.revoked ? `<button class="btn btn-ghost" style="font-size:.8rem;padding:.35rem .9rem"
data-edit-kp='${JSON.stringify({id:kp.id, description:kp.description, expires_at:kp.expires_at, allowed_gate_ids:kp.allowed_gate_ids})}'>Edit</button>` : ""}
${!kp.revoked && expMs >= now ? `<button class="btn btn-danger" style="font-size:.8rem;padding:.35rem .9rem"
data-kp-id="${kp.id}">Revoke</button>` : ""}
@@ -189,6 +191,33 @@ async function loadKeypasses() {
document.getElementById("kp-edit-modal").classList.remove("hidden");
});
});
tbody.querySelectorAll("[data-qr-kp-id]").forEach(btn => {
btn.addEventListener("click", async () => {
const id = btn.dataset.qrKpId;
const desc = btn.dataset.qrKpDesc;
document.getElementById("qr-modal-desc").textContent = desc;
const img = document.getElementById("qr-img");
const dl = document.getElementById("qr-download");
img.src = "";
dl.removeAttribute("href");
document.getElementById("qr-modal").classList.remove("hidden");
try {
const res = await fetch(`/api/admin/keypasses/${id}/qr`, {
headers: { "Authorization": `Bearer ${getToken()}` },
});
if (!res.ok) throw new Error("Failed to load QR code");
const blob = await res.blob();
const blobUrl = URL.createObjectURL(blob);
img.src = blobUrl;
dl.href = blobUrl;
dl.download = `keypass-${id}-qr.png`;
} catch (e) {
showToast(e.message, true);
document.getElementById("qr-modal").classList.add("hidden");
}
});
});
tbody.querySelectorAll("[data-kp-id]").forEach(btn => {
btn.addEventListener("click", async () => {
if (!confirm("Revoke this keypass?")) return;
@@ -285,6 +314,13 @@ document.getElementById("kp-edit-gate-checks").addEventListener("change", () =>
document.getElementById("kp-edit-cancel").addEventListener("click", () => {
document.getElementById("kp-edit-modal").classList.add("hidden");
});
document.getElementById("qr-close").addEventListener("click", () => {
const img = document.getElementById("qr-img");
if (img.src.startsWith("blob:")) URL.revokeObjectURL(img.src);
img.src = "";
document.getElementById("qr-modal").classList.add("hidden");
});
document.getElementById("kp-edit-form").addEventListener("submit", async e => {
e.preventDefault();
const id = document.getElementById("kp-edit-id").value;