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>

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

@@ -7,6 +7,8 @@ definePageMeta({
 });
 
 const app = useNuxtApp();
+
+const { user } = useUserSession();
 const { huntSlug, questSlug } = app.$slugData;
 
 const { t, locale } = useI18n();
@@ -86,6 +88,16 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
       :loading="pending"
       color="success"
       >{{ $t('layouts.refresh') }}</VaButton
+    >
+    <VaButton
+      v-if="user && user.role === 'ADMIN'"
+      color="danger"
+      :to="
+        $localePath(
+          `/hunt/${sluggy(data?.hunt || huntSlug!)}/${sluggy(data || questSlug)}/admin`
+        )
+      "
+      >Admin</VaButton
     ></VaButtonGroup
   >
   <div v-if="data">
@@ -131,7 +143,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
           <p>{{ data.answer.review }}</p>
         </VaCardContent>
       </VaCard>
-      <VaCard color="primary">
+      <VaCard color="primary" v-if="user && user.role !== 'ADMIN'">
         <VaCardTitle>Submission</VaCardTitle>
         <VaCardContent>
           <div class="flex flex-col gap-4">