Start admin pages

app/pages/hunt/[huntSlug]/[questSlug]/admin.vue

@@ -0,0 +1,72 @@
+<script setup lang="ts">
+import { useTitleStore } from '~/stores/title';
+
+definePageMeta({
+  middleware: ['admin']
+});
+
+const app = useNuxtApp();
+const { loggedIn } = useUserSession();
+const localePath = useLocalePath();
+const { t } = useI18n();
+const router = useRouter();
+
+const { huntSlug } = app.$slugData;
+const { name, id } = app.$slugData.questSlug!;
+const titleStore = useTitleStore();
+
+const { data, pending, refresh, error } = await useFetch(
+  `/api/admin/quest/${id}`
+);
+
+useHead({
+  title: t('layouts.title', {
+    title: data.value?.title || name
+  })
+});
+
+watch(loggedIn, (isLoggedIn) => {
+  if (!isLoggedIn) {
+    router.push(localePath('/login'));
+  }
+});
+
+titleStore.title = data.value?.title;
+// TODO: handle data!
+</script>
+
+<template>
+  <h1>quest admin</h1>
+  <VaButtonGroup>
+    <VaButton
+      icon="arrow_back"
+      :to="$localePath(`/hunt/${sluggy(data?.hunt || huntSlug!)}`)"
+      >Back to Hunt</VaButton
+    >
+    <VaButton icon="replay" color="success" @click="refresh">Refresh</VaButton>
+  </VaButtonGroup>
+  <div class="grid grid-cols-2 gap-2 p-2 md:flex md:flex-row">
+    <VaChip outline>In progress</VaChip>
+    <VaChip color="primary">Reviewable</VaChip>
+    <VaChip color="danger">Review or Score missing</VaChip>
+    <VaChip color="success">Reviewed</VaChip>
+  </div>
+  <div v-if="data">
+    <p>{{ data.points }} Points</p>
+    <p v-if="data.extraPoints">{{ data.extraPoints }} Extra points</p>
+    <p v-if="data.extraText">Extra: {{ data.extraText }}</p>
+  </div>
+  <div v-if="data && data.answers.length > 0">
+    <VaAccordion multiple stateful>
+      <AdminAnswer
+        v-for="answer in data.answers"
+        :key="answer.id"
+        :answer="answer"
+        :quest="data"
+      />
+    </VaAccordion>
+  </div>
+  <p v-else>No answers yet</p>
+</template>
+
+<style scoped></style>