Add picks and apps to game details

frontend/src/vues/GameDetails.vue

@@ -1,9 +1,23 @@
 <template>
-  <div>{{ gameId }}</div>
-  <div>{{ game }}</div>
+  <div>#{{ game.id }} - {{game.title}}</div>
+  <div>{{game.gamemaster}}</div>
+  <div>
+    Payout 
+    <div>{{game.payoutEB}} eb</div>
+    <div>{{game.payoutIP}} IP</div>
+    <div>{{game.payoutLoot}}</div>
+
+    <div>Picks</div>
+    <div v-for="pick in picks">
+      {{pick.characterId}} - {{pick.characterName}}
+    </div>
+
+    <div>Apps</div>
+    <div v-for="app in apps">
+      {{app.characterId}} - {{app.characterName}}
+    </div>
+  </div>
 
-  <div>#{{ game.id }} - {{ game.title }}</div>
-  <div>{{ game.gamemaster }}</div>
 </template>
 
 <script setup lang="ts">
@@ -15,6 +29,8 @@ const route = useRoute()
 
 const gameId = ref(route.params.gameId)
 const game = ref({})
+const picks = ref({})
+const apps = ref({})
 
 loadGameDetails()
 
@@ -29,5 +45,18 @@ watch(
 async function loadGameDetails() {
   const response = await axios.get(`/api/game/${gameId.value}`)
   game.value = response.data
+  loadPicks()
+  loadApps()
 }
+
+async function loadPicks() {
+  const response = await axios.post(`/api/game/${gameId.value}/picks`)
+  picks.value = response.data
+}
+
+async function loadApps() {
+  const response = await axios.post(`/api/game/${gameId.value}/apps`)
+  apps.value = response.data
+}
+
 </script>