Pascal/pichunt
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(hunt): Style hunt admin

Browse Source
This commit is contained in:
Pascal
2026-08-03 01:57:35 +02:00
parent 2d8669708d
commit 8e5e60da87
11 changed files with 556 additions and 463 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/pages/index.vue
+14 -140
View File
@@ -1,18 +1,10 @@
<script setup lang="ts">
import { useI18nKey } from '~/composables/useI18nKey';
import { fullDate } from '~~/server/utils/date';
definePageMeta({
layout: 'landing'
});
const { loggedIn } = useUserSession();
const { data, pending, refresh } = await useFetch('/api/home');
const { t, d } = useI18n();
const { t } = useI18n();
const localePath = useLocalePath();
const { tKey, tSluggy } = useI18nKey();
watch(loggedIn, () => refresh());
const steps = [
{ icon: 'login', key: 'step_register' },
{ icon: 'groups', key: 'step_team' },
@@ -48,14 +40,18 @@ useHead({
{{ t('page.landing.hero_subtitle') }}
</p>
<div class="flex flex-wrap justify-center gap-4">
<VaButton
v-if="!loggedIn"
size="large"
color="success"
:to="localePath('/register')"
>
{{ t('page.landing.get_started') }}
</VaButton>
<AuthState>
<template #default="{ loggedIn }">
<VaButton
v-if="!loggedIn"
size="large"
color="success"
:to="localePath('/register')"
>
{{ t('page.landing.get_started') }}
</VaButton>
</template>
</AuthState>
<VaButton
size="large"
preset="secondary"
@@ -99,129 +95,7 @@ useHead({
</section>
<section class="bg-background-element px-4 py-16">
<div class="mx-auto max-w-6xl">
<VaButton
icon="refresh"
:disabled="pending"
class="mb-6"
@click="refresh"
>{{ t('layouts.refresh') }}</VaButton
>
<div v-if="data">
<div v-if="data.own !== null">
<h2 class="mb-6 text-2xl font-bold">
{{ t('page.home.joined_hunts') }}
</h2>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
<VaCard
v-for="hunt in data.own"
:key="hunt.id"
stripe
:to="localePath(`/hunt/${tSluggy(hunt).value}`)"
>
<VaCardTitle>{{ tKey(hunt, 'name') }}</VaCardTitle>
<ClickableImage
v-if="hunt.picture"
:src="hunt.picture?.url"
:title="tKey(hunt, 'name').value"
/>
<VaCardContent>
<h3 class="text-xl">{{ tKey(hunt, 'name') }}</h3>
<p class="line-clamp-4">{{ tKey(hunt, 'description') }}</p>
<VaDivider />
<div class="flex flex-col gap-2">
<p>{{ t('page.home.n_quests', hunt._count.quests) }}</p>
<p v-if="hunt.start">
{{
t('page.home.start', {
start: d(hunt.start, fullDate)
})
}}
</p>
<p v-if="hunt.end">
{{
t('page.home.end', {
start: d(hunt.end, fullDate)
})
}}
</p>
<p>
{{ t('page.home.n_teams_joined', hunt._count.teams) }}
</p>
</div>
</VaCardContent>
</VaCard>
<VaCard v-if="data.own.length <= 0">
<VaCardTitle>{{ t('page.home.no_hunt_joined') }}</VaCardTitle>
<VaCardContent>{{
t('page.home.click_hunt_below_to_join')
}}</VaCardContent>
</VaCard>
</div>
</div>
<div v-else class="text-center">
<p class="text-secondary mb-4">
{{ t('page.landing.login_to_see_hunts') }}
</p>
<VaButton color="info" icon="login" :to="localePath(`/login`)">{{
t('page.home.login_first')
}}</VaButton>
</div>
<div class="mt-12">
<VaDivider />
<h2 class="mb-6 mt-8 text-2xl font-bold">
{{ t('page.home.open_to_join') }}
</h2>
<div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
<VaCard
v-for="hunt in data.others"
:key="hunt.id"
:to="localePath(`/hunt/${tSluggy(hunt).value}`)"
>
<VaCardTitle>{{ tKey(hunt, 'name') }}</VaCardTitle>
<ClickableImage
v-if="hunt.picture"
:src="hunt.picture?.url"
:title="tKey(hunt, 'name').value"
/>
<VaCardContent>
<h3 class="text-xl">{{ tKey(hunt, 'name') }}</h3>
<p class="line-clamp-4">{{ tKey(hunt, 'description') }}</p>
<VaDivider />
<div class="flex flex-col gap-2">
<p>{{ t('page.home.n_quests', hunt._count.quests) }}</p>
<p v-if="hunt.start">
{{
t('page.home.start', {
start: d(hunt.start, fullDate)
})
}}
</p>
<p v-if="hunt.end">
{{
t('page.home.end', {
start: d(hunt.end, fullDate)
})
}}
</p>
<p>
{{ t('page.home.n_teams_joined', hunt._count.teams) }}
</p>
</div>
</VaCardContent>
</VaCard>
<VaCard v-if="data.others.length <= 0">
<VaCardTitle>{{ t('page.home.no_hunt_created') }}</VaCardTitle>
<VaCardContent>{{
t('page.home.new_hunts_soon')
}}</VaCardContent>
</VaCard>
</div>
</div>
</div>
</div>
<HuntList />
</section>
<footer class="px-4 py-8 text-center">