Do api call from within the component itself.

frontend/components/AllRequestedWines.vue

@@ -5,13 +5,18 @@
     <section class="requested-wines-container">
       <p v-if="wines == undefined || wines.length == 0">Ingen har foreslått noe enda!</p>
 
-      <RequestedWineCard v-for="requestedEl in wines" :key="requestedEl.wine._id" :requestedElement="requestedEl" @wineDeleted="filterOutDeletedWine" :showDeleteButton="isAdmin"/>
+      <RequestedWineCard
+        v-for="requestedWine in wines"
+        :key="requestedWine.wine._id"
+        :requestedElement="requestedWine"
+        @wineDeleted="filterOutDeletedWine"
+        :showDeleteButton="isAdmin"
+      />
     </section>
   </main>
 </template>
 
 <script>
-import { allRequestedWines } from "@/api";
 import RequestedWineCard from "@/ui/RequestedWineCard";
 export default {
   components: {
@@ -20,22 +25,27 @@ export default {
   data() {
     return {
       wines: undefined,
-      canRequest: true,
       isAdmin: false
-    }
+    };
+  },
+  mounted() {
+    this.fetchRequestedWines();
   },
   methods: {
     filterOutDeletedWine(wine) {
-      this.wines = this.wines.filter(item => item.wine._id !== wine._id)
+      this.wines = this.wines.filter(item => item.wine._id !== wine._id);
     },
-    async refreshData(){
+    fetchRequestedWines() {
-      [this.wines, this.isAdmin] = await allRequestedWines() || [[], false]
+      return fetch("/api/requests")
-    }
+        .then(resp => {
-  },
+          this.isAdmin = resp.headers.get("vinlottis-admin") == "true";
-  mounted() {
+          return resp;
-    this.refreshData()
+        })
+        .then(resp => resp.json())
+        .then(response => (this.wines = response.wines));
     }
   }
+};
 </script>
 
 <style lang="scss" scoped>