From 4d8e65f280dcc577fab98f073ba32b462626ea2e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Roman=20Kr=C4=8Dek?= Date: Fri, 27 Jun 2025 22:36:45 +0200 Subject: [PATCH] Responsivness improvements --- .../+page.server.ts => lib/helpers/event.ts} | 2 +- src/routes/private/events/+page.svelte | 46 ++++-- src/routes/private/events/event/+page.svelte | 151 ++++++++++++------ 3 files changed, 138 insertions(+), 61 deletions(-) rename src/{routes/private/events/event/+page.server.ts => lib/helpers/event.ts} (90%) diff --git a/src/routes/private/events/event/+page.server.ts b/src/lib/helpers/event.ts similarity index 90% rename from src/routes/private/events/event/+page.server.ts rename to src/lib/helpers/event.ts index d63e5a4..07fc008 100644 --- a/src/routes/private/events/event/+page.server.ts +++ b/src/lib/helpers/event.ts @@ -1,4 +1,4 @@ -export async function load({ locals, url }) { +export async function load({ data, url }) { const event_id = url.searchParams.get('id'); const { data: event_data, error: eventError } = await locals.supabase .from('events') diff --git a/src/routes/private/events/+page.svelte b/src/routes/private/events/+page.svelte index 1664850..e2b0007 100644 --- a/src/routes/private/events/+page.svelte +++ b/src/routes/private/events/+page.svelte @@ -1,20 +1,44 @@

All Events

- {#each data.events as event} - -
- {event.name} - {event.date} + {#if loading} + {#each Array(4) as _} +
+
+ + +
- - {/each} + {/each} + {:else} + {#each events as event} + +
+ {event.name} + {event.date} +
+ + {/each} + {/if}
+ import { onMount } from 'svelte'; + let { data } = $props(); - const scannedCount = data.participants.filter((p) => p.scanned).length; - const notScannedCount = data.participants.length - scannedCount; + let event_data: any = $state(null); + let participants: any[] = $state([]); + let loading = $state(true); + let scannedCount: number = $state(0); + let notScannedCount: number = $state(0); + onMount(async () => { + const event_id = new URLSearchParams(window.location.search).get('id'); + if (!event_id) { + loading = false; + return; + } + + const { data: event } = await data.supabase + .from('events') + .select('*') + .eq('id', event_id) + .single(); + event_data = event; + + const { data: parts } = await data.supabase + .from('participants') + .select('*, scanned_by:profiles (id, display_name)') + .eq('event', event_id); + participants = parts || []; + scannedCount = participants.filter((p) => p.scanned).length; + notScannedCount = participants.length - scannedCount; + loading = false; + });

Event Overview

- {data.event_data.name} - {data.event_data.date} + {#if loading} +
+
+ {:else} + {event_data?.name} + {event_data?.date} + {/if}
@@ -26,7 +59,11 @@ > - Scanned ({scannedCount}) + {#if loading} +
+ {:else} + Scanned ({scannedCount}) + {/if}
@@ -41,55 +78,71 @@ - Not scanned ({notScannedCount}) + {#if loading} +
+ {:else} + Not scanned ({notScannedCount}) + {/if}
-

Participants ({data.participants.length})

+

+ {#if loading} +
+ {:else} + Participants ({participants.length}) + {/if} +

    - {#each data.participants as p} -
  • - {#if p.scanned} - - - - {:else} - - - - - - {/if} - {p.name} {p.surname} - - {#if p.scanned_by} -
    - - {new Date(p.scanned_at).toLocaleTimeString([], { - hour: '2-digit', - minute: '2-digit', - hour12: false - })} - - by {p.scanned_by.display_name} -
    - {/if} + {#if loading} +
  • +
    • - {/each} + {:else} + {#each participants as p} +
  • + {#if p.scanned} + + + + {:else} + + + + + + {/if} + {p.name} {p.surname} + + {#if p.scanned_by} +
    + + {new Date(p.scanned_at).toLocaleTimeString([], { + hour: '2-digit', + minute: '2-digit', + hour12: false + })} + + by {p.scanned_by.display_name} +
    + {/if} +
    • + {/each} + {/if}