Merge pull request #18 from KevinMidboe/feat/lottery-endpoint

Feat/lottery endpoint

src/api.js

@@ -245,6 +245,18 @@ const postWineChosen = (id, wineName) => {
   });
 };
 
+const historyAll = () => {
+  const url = new URL(`/api/lottery/all`, BASE_URL);
+
+  return fetch(url.href).then(resp => {
+    if (resp.ok) {
+      return resp.json();
+    } else {
+      return handleErrors(resp);
+    }
+  });
+}
+
 export {
   statistics,
   colorStatistics,
@@ -270,5 +282,6 @@ export {
   getChatHistory,
   finishedDraw,
   getAmIWinner,
-  postWineChosen
+  postWineChosen,
+  historyAll
 };

src/components/HistoryPage.vue

@@ -0,0 +1,34 @@
+<template>
+  <div>
+    <h1>Historie fra tidligere lotteri</h1>
+
+    <div v-if="lotteries.length" v-for="lottery in lotteries">
+      <Winners :winners="lottery.winners" :title="`Vinnere fra ${lottery.dateString}`" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { historyAll } from '@/api'
+import Winners from '@/ui/Winners'
+
+export default {
+  name: 'History page of prev lotteries',
+  components: { Winners },
+  data() {
+    return {
+      lotteries: [],
+    }
+  },
+  created() {
+    historyAll()
+      .then(history => this.lotteries = history.lotteries.reverse())
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+h1 {
+  text-align: center;
+}
+</style>

src/routes/vinlottisRouter.js

@@ -10,6 +10,7 @@ import AdminPage from "@/components/AdminPage";
 
 import WinnerPage from "@/components/WinnerPage";
 import LotteryPage from "@/components/LotteryPage";
+import HistoryPage from "@/components/HistoryPage";
 
 const routes = [
   {
@@ -47,6 +48,10 @@ const routes = [
   {
     path: "/winner/:id",
     component: WinnerPage
+  },
+  {
+    path: "/history",
+    component: HistoryPage
   }
 ];
 

src/ui/Winners.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <h2 v-if="winners.length > 0">Vinnere</h2>
+    <h2 v-if="winners.length > 0"> {{ title ? title : 'Vinnere' }}</h2>
     <div class="winners" v-if="winners.length > 0">
       <div class="winner" v-for="(winner, index) in winners" :key="index">
         <div :class="winner.color + '-ballot'" class="ballot-element">{{ winner.name }}</div>
@@ -14,6 +14,10 @@ export default {
   props: {
     winners: {
       type: Array
+    },
+    title: {
+      type: String,
+      required: false
     }
   }
 };