QR Code visible on web
This commit is contained in:
rodič
f5d019bccc
revize
685455040d
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "utxo22-web",
|
||||
"version": "1.2.1",
|
||||
"version": "1.3.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "utxo22-web",
|
||||
"version": "1.2.1",
|
||||
"version": "1.3.0",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
"@fontsource/fira-mono": "^4.5.0",
|
||||
|
@ -21,7 +21,9 @@
|
|||
"ethereum-blockies-base64": "^1.0.2",
|
||||
"fuse.js": "^6.5.3",
|
||||
"lodash": "^4.17.21",
|
||||
"qrcode-svg": "^1.1.0",
|
||||
"remove-markdown": "^0.3.0",
|
||||
"svelte-qrcode": "^1.0.0",
|
||||
"svelte-scrolling": "^1.1.1",
|
||||
"svelte-youtube": "^0.0.2"
|
||||
},
|
||||
|
@ -1742,6 +1744,14 @@
|
|||
"svelte": "^3.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/qrcode-svg": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/qrcode-svg/-/qrcode-svg-1.1.0.tgz",
|
||||
"integrity": "sha512-XyQCIXux1zEIA3NPb0AeR8UMYvXZzWEhgdBgBjH9gO7M48H9uoHzviNz8pXw3UzrAcxRRRn9gxHewAVK7bn9qw==",
|
||||
"bin": {
|
||||
"qrcode-svg": "bin/qrcode-svg.js"
|
||||
}
|
||||
},
|
||||
"node_modules/queue-microtask": {
|
||||
"version": "1.2.3",
|
||||
"resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
|
||||
|
@ -1954,6 +1964,11 @@
|
|||
"svelte": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/svelte-qrcode": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/svelte-qrcode/-/svelte-qrcode-1.0.0.tgz",
|
||||
"integrity": "sha512-WrOvyyxtUzu32gVIDxcFMy0A7uUpbl/8yHaTNOsUaI8W5V4wa7AmReCjffhNY2aS42CqCLJ6qdwUoj/KxmeZzA=="
|
||||
},
|
||||
"node_modules/svelte-scrolling": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/svelte-scrolling/-/svelte-scrolling-1.1.1.tgz",
|
||||
|
@ -3231,6 +3246,11 @@
|
|||
"dev": true,
|
||||
"requires": {}
|
||||
},
|
||||
"qrcode-svg": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/qrcode-svg/-/qrcode-svg-1.1.0.tgz",
|
||||
"integrity": "sha512-XyQCIXux1zEIA3NPb0AeR8UMYvXZzWEhgdBgBjH9gO7M48H9uoHzviNz8pXw3UzrAcxRRRn9gxHewAVK7bn9qw=="
|
||||
},
|
||||
"queue-microtask": {
|
||||
"version": "1.2.3",
|
||||
"resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
|
||||
|
@ -3361,6 +3381,11 @@
|
|||
"marked": "^4.0.10"
|
||||
}
|
||||
},
|
||||
"svelte-qrcode": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/svelte-qrcode/-/svelte-qrcode-1.0.0.tgz",
|
||||
"integrity": "sha512-WrOvyyxtUzu32gVIDxcFMy0A7uUpbl/8yHaTNOsUaI8W5V4wa7AmReCjffhNY2aS42CqCLJ6qdwUoj/KxmeZzA=="
|
||||
},
|
||||
"svelte-scrolling": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/svelte-scrolling/-/svelte-scrolling-1.1.1.tgz",
|
||||
|
|
|
@ -39,7 +39,9 @@
|
|||
"ethereum-blockies-base64": "^1.0.2",
|
||||
"fuse.js": "^6.5.3",
|
||||
"lodash": "^4.17.21",
|
||||
"qrcode-svg": "^1.1.0",
|
||||
"remove-markdown": "^0.3.0",
|
||||
"svelte-qrcode": "^1.0.0",
|
||||
"svelte-scrolling": "^1.1.1",
|
||||
"svelte-youtube": "^0.0.2"
|
||||
}
|
||||
|
|
|
@ -0,0 +1,25 @@
|
|||
<script>
|
||||
import QRCode from "qrcode-svg";
|
||||
|
||||
import { onMount, onDestroy, afterUpdate } from "svelte";
|
||||
|
||||
export let value = null;
|
||||
let svg = null;
|
||||
|
||||
function render() {
|
||||
if (value) {
|
||||
svg = new QRCode({
|
||||
content: value,
|
||||
padding: 1,
|
||||
ecl: "M",
|
||||
join: true,
|
||||
}).svg();
|
||||
}
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
render();
|
||||
});
|
||||
</script>
|
||||
|
||||
<div>{@html svg}</div>
|
|
@ -8,6 +8,7 @@
|
|||
import SvelteMarkdown from "svelte-markdown";
|
||||
import Link from "$lib/Link.svelte";
|
||||
import * as _ from "lodash";
|
||||
import QRCode from "$lib/QRCode.svelte";
|
||||
import {
|
||||
orderTicketForm,
|
||||
bundle,
|
||||
|
@ -385,6 +386,8 @@
|
|||
await loadOrders($userData);
|
||||
}
|
||||
}
|
||||
|
||||
let qrVisible = null;
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
|
@ -571,6 +574,27 @@
|
|||
>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="mt-2">
|
||||
{#if qrVisible === ticket.id}
|
||||
<div class="mt-2">
|
||||
<QRCode value="{ticket.id}:xxxxx" />
|
||||
<div class="mt-2">
|
||||
<a
|
||||
href="#"
|
||||
class="underline hover:no-underline"
|
||||
on:click={() => (qrVisible = null)}>Schovat QR kód</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
<a
|
||||
href="#"
|
||||
class="underline hover:no-underline"
|
||||
on:click={() => (qrVisible = ticket.id)}
|
||||
>Zobrazit QR kód</a
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
|
|
Načítá se…
Odkázat v novém úkolu