(change): Workflow improvements and force reloads on navigate

This commit is contained in:
2026-06-27 22:43:17 -04:00
parent 9602ed52a6
commit ff9265645c
7 changed files with 18 additions and 56 deletions
+1 -1
View File
@@ -6,7 +6,7 @@
<meta name="text-scale" content="scale" /> <meta name="text-scale" content="scale" />
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="tap"> <body data-sveltekit-reload>
<div style="display: contents">%sveltekit.body%</div> <div style="display: contents">%sveltekit.body%</div>
</body> </body>
</html> </html>
+4 -4
View File
@@ -2,9 +2,9 @@
<!-- Created with Inkscape (http://www.inkscape.org/) --> <!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg <svg
width="77.149315mm" width="300"
height="34.676437mm" height="300"
viewBox="0 0 77.149315 34.676437" viewBox="0 0 79.375 79.374999"
version="1.1" version="1.1"
id="svg1" id="svg1"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@@ -13,7 +13,7 @@
id="defs1" /> id="defs1" />
<g <g
id="layer1" id="layer1"
transform="translate(-6.761509,-12.267066)"> transform="translate(-5.6486658,10.082216)">
<path <path
id="rect1" id="rect1"
style="fill:#0000ff;stroke:#ffffff;stroke-width:0.264583" style="fill:#0000ff;stroke:#ffffff;stroke-width:0.264583"

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

@@ -1,6 +1,5 @@
<script> <script>
import { resolve } from '$app/paths'; import { resolve } from '$app/paths';
import { afterNavigate, beforeNavigate } from '$app/navigation';
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import { bS, bAS, iS, rBS } from '$lib/client/styles'; import { bS, bAS, iS, rBS } from '$lib/client/styles';
import HeaderBar from '$lib/client/components/HeaderBar.svelte'; import HeaderBar from '$lib/client/components/HeaderBar.svelte';
@@ -82,7 +81,7 @@
} }
}, },
prevLine: () => { prevLine: () => {
if (items[prevIdx]) { if (curIdx > 0) {
setTimeout(() => { setTimeout(() => {
focusIdx(prevIdx); focusIdx(prevIdx);
}, 1); }, 1);
@@ -130,19 +129,6 @@
}; };
const headers = ['Basket ID', 'Description', 'Donors', 'Save?']; const headers = ['Basket ID', 'Description', 'Donors', 'Save?'];
beforeNavigate(({ cancel }) => {
if (itemsBuffer.length > 0) {
if (!confirm('Are you sure you want to leave this page? There are unsaved changes!'))
cancel();
}
});
afterNavigate(() => {
items = [];
pager = { idFrom: 0, idTo: 0 };
curIdx = 0;
});
if (browser) { if (browser) {
window.addEventListener('beforeunload', (e) => { window.addEventListener('beforeunload', (e) => {
if (itemsBuffer.length > 0) e.preventDefault(); if (itemsBuffer.length > 0) e.preventDefault();
@@ -1,6 +1,5 @@
<script> <script>
import { resolve } from '$app/paths'; import { resolve } from '$app/paths';
import { afterNavigate, beforeNavigate } from '$app/navigation';
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import { bS, bAS, iS, rBS } from '$lib/client/styles'; import { bS, bAS, iS, rBS } from '$lib/client/styles';
import HeaderBar from '$lib/client/components/HeaderBar.svelte'; import HeaderBar from '$lib/client/components/HeaderBar.svelte';
@@ -82,7 +81,7 @@
} }
}, },
prevLine: () => { prevLine: () => {
if (items[prevIdx]) { if (curIdx > 0) {
setTimeout(() => { setTimeout(() => {
focusIdx(prevIdx); focusIdx(prevIdx);
}, 1); }, 1);
@@ -130,19 +129,6 @@
}; };
const headers = ['Basket ID', 'Description', 'Winning Ticket', 'Winner', 'Save?']; const headers = ['Basket ID', 'Description', 'Winning Ticket', 'Winner', 'Save?'];
beforeNavigate(({ cancel }) => {
if (itemsBuffer.length > 0) {
if (!confirm('Are you sure you want to leave this page? There are unsaved changes!'))
cancel();
}
});
afterNavigate(() => {
items = [];
pager = { idFrom: 0, idTo: 0 };
curIdx = 0;
});
if (browser) { if (browser) {
window.addEventListener('beforeunload', (e) => { window.addEventListener('beforeunload', (e) => {
if (itemsBuffer.length > 0) e.preventDefault(); if (itemsBuffer.length > 0) e.preventDefault();
@@ -36,7 +36,8 @@
{#each data.prefixes as p (p.prefix)} {#each data.prefixes as p (p.prefix)}
<a <a
href={resolve('/reports/byname/[prefix]', { prefix: p.prefix })} href={resolve('/reports/byname/[prefix]', { prefix: p.prefix })}
class={p.prefix == prefix.prefix ? bAS[p.color] : bS[p.color]}>{p.prefix}</a class={p.prefix == prefix.prefix ? bAS[p.color] : bS[p.color]}
>{p.prefix}</a
> >
{/each} {/each}
</HeaderBar> </HeaderBar>
@@ -36,7 +36,8 @@
{#each data.prefixes as p (p.prefix)} {#each data.prefixes as p (p.prefix)}
<a <a
href={resolve('/reports/byname/[prefix]', { prefix: p.prefix })} href={resolve('/reports/byname/[prefix]', { prefix: p.prefix })}
class={p.prefix == prefix.prefix ? bAS[p.color] : bS[p.color]}>{p.prefix}</a class={p.prefix == prefix.prefix ? bAS[p.color] : bS[p.color]}
>{p.prefix}</a
> >
{/each} {/each}
</HeaderBar> </HeaderBar>
@@ -1,6 +1,5 @@
<script> <script>
import { resolve } from '$app/paths'; import { resolve } from '$app/paths';
import { afterNavigate, beforeNavigate } from '$app/navigation';
import { browser } from '$app/environment'; import { browser } from '$app/environment';
import { bS, bAS, iS, rBS } from '$lib/client/styles'; import { bS, bAS, iS, rBS } from '$lib/client/styles';
import HeaderBar from '$lib/client/components/HeaderBar.svelte'; import HeaderBar from '$lib/client/components/HeaderBar.svelte';
@@ -22,7 +21,7 @@
curIdx = idx; curIdx = idx;
const elemIdx = document.getElementById(`${idx}_first`); const elemIdx = document.getElementById(`${idx}_first`);
if (elemIdx) { if (elemIdx) {
elemIdx.focus(); elemIdx.select();
} }
}; };
@@ -82,7 +81,7 @@
} }
}, },
prevLine: () => { prevLine: () => {
if (items[prevIdx]) { if (curIdx > 0) {
setTimeout(() => { setTimeout(() => {
focusIdx(prevIdx); focusIdx(prevIdx);
}, 1); }, 1);
@@ -118,31 +117,18 @@
['prefix', 't_id'].forEach((key) => delete buffer[key]); ['prefix', 't_id'].forEach((key) => delete buffer[key]);
window.localStorage.setItem('tam-ticket', JSON.stringify(buffer)); window.localStorage.setItem('tam-ticket', JSON.stringify(buffer));
} }
focusIdx(curIdx); setTimeout(() => focusIdx(curIdx), 1);
}, },
paste: () => { paste: () => {
if (items[curIdx]) { if (items[curIdx]) {
const buffer = JSON.parse(window.localStorage.getItem('tam-ticket')); const buffer = JSON.parse(window.localStorage.getItem('tam-ticket'));
items[curIdx] = { ...items[curIdx], ...buffer, changed: true }; items[curIdx] = { ...items[curIdx], ...buffer, changed: true };
} }
focusIdx(curIdx); setTimeout(() => focusIdx(curIdx), 1);
} }
}; };
const headers = ['Ticket ID', 'First Name', 'Last Name', 'Phone Number', 'Pref', 'Save?']; const headers = ['Ticket ID', 'First Name', 'Last Name', 'Phone Number', 'Pref', 'Save?'];
beforeNavigate(({ cancel }) => {
if (itemsBuffer.length > 0) {
if (!confirm('Are you sure you want to leave this page? There are unsaved changes!'))
cancel();
}
});
afterNavigate(() => {
items = [];
pager = { idFrom: 0, idTo: 0 };
curIdx = 0;
});
if (browser) { if (browser) {
window.addEventListener('beforeunload', (e) => { window.addEventListener('beforeunload', (e) => {
if (itemsBuffer.length > 0) e.preventDefault(); if (itemsBuffer.length > 0) e.preventDefault();
@@ -163,7 +149,8 @@
{#each prefixes as p (p.prefix)} {#each prefixes as p (p.prefix)}
<a <a
href={resolve('/tickets/[prefix]', { prefix: p.prefix })} href={resolve('/tickets/[prefix]', { prefix: p.prefix })}
class={prefix.prefix == p.prefix ? bAS[p.color] : bS[p.color]}>{p.prefix}</a class={prefix.prefix == p.prefix ? bAS[p.color] : bS[p.color]}
>{p.prefix}</a
> >
{/each} {/each}
</HeaderBar> </HeaderBar>
@@ -236,6 +223,7 @@
<td class="p-0.5 border" <td class="p-0.5 border"
><button ><button
class={bS[prefix.color]} class={bS[prefix.color]}
tabindex="-1"
onclick={() => { onclick={() => {
item.changed ? (item.changed = false) : (item.changed = true); item.changed ? (item.changed = false) : (item.changed = true);
}}>{item.changed ? 'Yes' : 'No'}</button }}>{item.changed ? 'Yes' : 'No'}</button