105 lines
2.9 KiB
Svelte
105 lines
2.9 KiB
Svelte
<script>
|
|
import { resolve } from '$app/paths';
|
|
import HeaderBar from '$lib/client/components/HeaderBar.svelte';
|
|
import { bAS, bS } from '$lib/client/styles';
|
|
|
|
let currentFilter = $state('');
|
|
let { data } = $props();
|
|
let prefix = $derived(data.prefix);
|
|
|
|
let pageTitle = $derived(`${prefix.prefix} Winners by Name | TAM`);
|
|
let filterTitle = $state('All Winners');
|
|
|
|
const headers = ['Basket ID', 'Description', 'Winning Ticket', 'Winner Name', 'Phone Number'];
|
|
|
|
let reportLines = $derived.by(() => {
|
|
if (currentFilter == 'CALL') {
|
|
return data.reportLines.filter((l) => l.pref == 'CALL');
|
|
} else if (currentFilter == 'TEXT') {
|
|
return data.reportLines.filter((l) => l.pref == 'TEXT');
|
|
} else {
|
|
return data.reportLines;
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{pageTitle}</title>
|
|
</svelte:head>
|
|
|
|
<table class="w-full box-border border-separate p-1">
|
|
<thead>
|
|
<tr class="print:hidden">
|
|
<td colspan="50">
|
|
<HeaderBar>
|
|
<div>By Name Reports:</div>
|
|
{#each data.prefixes as p (p.prefix)}
|
|
<a
|
|
href={resolve('/reports/byname/[prefix]', { prefix: p.prefix })}
|
|
class={p.prefix == prefix.prefix ? bAS[p.color] : bS[p.color]}>{p.prefix}</a
|
|
>
|
|
{/each}
|
|
</HeaderBar>
|
|
<div class="flex flex-row gap-1 py-1 justify-between">
|
|
<div class="flex flex-row gap-1">
|
|
<button
|
|
class={bS[prefix.color]}
|
|
onclick={() => {
|
|
currentFilter = '';
|
|
filterTitle = 'All Winners';
|
|
}}>All Preferences</button
|
|
>
|
|
<button
|
|
class={bS[prefix.color]}
|
|
onclick={() => {
|
|
currentFilter = 'CALL';
|
|
filterTitle = 'Winners Preferring a CALL';
|
|
}}>Call Preference</button
|
|
>
|
|
<button
|
|
class={bS[prefix.color]}
|
|
onclick={() => {
|
|
currentFilter = 'TEXT';
|
|
filterTitle = 'Winners Preferring a TEXT';
|
|
}}>Text Preference</button
|
|
>
|
|
</div>
|
|
<div class="flex flex-row gap-1">
|
|
<button class={bS[prefix.color]} onclick={() => window.print()}>Print</button>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="50"><h1 class="text-lg text-left">{pageTitle}</h1></th>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="50"><h2 class="italic text-left">{filterTitle}</h2></th>
|
|
</tr>
|
|
<tr class="text-sm">
|
|
{#each headers as header (header)}
|
|
<th class="text-left border p-0.5">{header}</th>
|
|
{/each}
|
|
</tr>
|
|
</thead>
|
|
<tbody class="text-sm">
|
|
{#each reportLines as line, idx (idx)}
|
|
<tr>
|
|
<td class="p-0.5 border">{line.b_id}</td>
|
|
<td class="p-0.5 border">{line.description || ''}</td>
|
|
<td class="p-0.5 border">{line.winning_ticket}</td>
|
|
<td class="p-0.5 border">{line.last_name || ''}, {line.first_name || ''}</td>
|
|
<td class="p-0.5 border">{line.phone_number || ''}</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="50" class="text-center text-xs">{data.venueName}</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="50" class="text-center text-xs">© 2026 Ticket Auction Manager</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|