Add create and show page for competition

This commit is contained in:
unurled 2025-07-03 20:18:53 +02:00
parent 1485f3daf5
commit 744308d0cb
10 changed files with 151 additions and 72 deletions

View file

@ -87,11 +87,11 @@
<div class="flex flex-col gap-2 text-sm">
<div class="flex items-center gap-2">
<Calendar class="h-4 w-4 text-muted-foreground" />
<span>{formatDate(tournament.date)}</span>
<span>{formatDate(tournament.start_date)}</span>
</div>
<div class="flex items-center gap-2">
<Users class="h-4 w-4 text-muted-foreground" />
<span>{tournament.participantsCount} participants</span>
<span>{tournament.max_teams} participants</span>
</div>
</div>
</CardContent>
@ -107,7 +107,7 @@
</div>
</TabsContent>
<TabsContent value="my" class="mt-6">
<div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
<div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3 w-full">
{#if !userTournaments.original.data || userTournaments.original.data.length === 0}
<div class="flex flex-col items-center justify-center rounded-lg border border-dashed p-8 text-center">
<Trophy class="h-10 w-10 text-muted-foreground" />
@ -118,47 +118,45 @@
</Button>
</div>
{:else}
<div class="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
{#each userTournaments.original.data as tournament (tournament.id)}
<Card>
<CardHeader>
<CardTitle class="flex items-center gap-2">
<Trophy class="h-5 w-5 text-primary" />
{tournament.name}
</CardTitle>
<CardDescription>{tournament.description}</CardDescription>
</CardHeader>
<CardContent>
<div class="flex flex-col gap-2 text-sm">
<div class="flex items-center gap-2">
<Calendar class="h-4 w-4 text-muted-foreground" />
<span>{formatDate(tournament.date)}</span>
</div>
<div class="flex items-center gap-2">
<Users class="h-4 w-4 text-muted-foreground" />
<span>{tournament.participantsCount} participants</span>
</div>
<div class="flex items-center gap-2">
<User class="h-4 w-4 text-muted-foreground" />
<span>Created by you</span>
</div>
{#each userTournaments.original.data as tournament (tournament.id)}
<Card>
<CardHeader>
<CardTitle class="flex items-center gap-2">
<Trophy class="h-5 w-5 text-primary" />
{tournament.name}
</CardTitle>
<CardDescription>{tournament.description}</CardDescription>
</CardHeader>
<CardContent>
<div class="flex flex-col gap-2 text-sm">
<div class="flex items-center gap-2">
<Calendar class="h-4 w-4 text-muted-foreground" />
<span>{formatDate(tournament.start_date)}</span>
</div>
</CardContent>
<CardFooter class="flex gap-2">
<Button variant="outline" class="flex-1">
<Link href={`/tournaments/${tournament.id}`} class="flex items-center justify-center w-full"
>View</Link
>
</Button>
<Button variant="secondary" class="flex-1">
<Link href={`/tournaments/${tournament.id}/edit`} class="flex items-center justify-center w-full">
Edit
</Link>
</Button>
</CardFooter>
</Card>
{/each}
</div>
<div class="flex items-center gap-2">
<Users class="h-4 w-4 text-muted-foreground" />
<span>{tournament.max_teams} participants</span>
</div>
<div class="flex items-center gap-2">
<User class="h-4 w-4 text-muted-foreground" />
<span>Created by you</span>
</div>
</div>
</CardContent>
<CardFooter class="flex gap-2">
<Button variant="outline" class="flex-1">
<Link href={`/tournaments/${tournament.id}`} class="flex items-center justify-center w-full"
>View</Link
>
</Button>
<Button class="flex-1">
<Link href={`/tournaments/${tournament.id}/edit`} class="flex items-center justify-center w-full">
Edit
</Link>
</Button>
</CardFooter>
</Card>
{/each}
{/if}
</div>
</TabsContent>