add search functionality

api/wineinfo.js

@@ -9,6 +9,52 @@ router.use((req, res, next) => {
   next();
 });
 
+const convertToOurWineObject = wine => {
+  console.log("traff her", wine)
+  return {
+    name: wine.basic.productShortName,
+    image: `https://bilder.vinmonopolet.no/cache/300x300-0/${wine.basic.productId}-1.jpg`,
+    rating: undefined,
+    price: wine.prices[0].salesPrice,
+    country: wine.origins.origin.country,
+    vivinoLink: undefined
+  }
+}
+
+router.route("/wineinfo/search").get(async (req, res) => {
+  console.log("h")
+  console.log(req)
+  const {query} = req.query
+  let url = new URL(`https://apis.vinmonopolet.no/products/v0/details-normal?productShortNameContains=test&maxResults=5`)
+  url.searchParams.set('productShortNameContains', query)
+
+  const vinmonopoletResponse = await fetch(url, {
+    headers: {
+      "Ocp-Apim-Subscription-Key": ""
+    }
+  })
+    .then(resp => resp.json())
+
+  const winesConverted = vinmonopoletResponse.map(convertToOurWineObject)
+  console.log(winesConverted)
+
+  if (vinmonopoletResponse.errors != null) {
+    return vinmonopoletResponse.errors.map(error => {
+      if (error.type == "UnknownProductError") {
+        return res.status(404).json({
+          message: error.message
+        })
+      } else {
+        return next()
+      }
+    })
+  }
+
+  res.send(winesConverted);
+});
+
+
+
 router.route("/wineinfo/:ean").get(async (req, res) => {
   const vinmonopoletResponse = await fetch("https://app.vinmonopolet.no/vmpws/v2/vmp/products/barCodeSearch/" + req.params.ean)
     .then(resp => resp.json())

src/api.js

@@ -160,6 +160,21 @@ const barcodeToVinmonopolet = id => {
   });
 };
 
+const searchForWine = searchString => {
+  const url = new URL("/api/wineinfo/search?query=" + searchString, BASE_URL);
+
+  return fetch(url.href).then(async resp => {
+    if (!resp.ok) {
+      if (resp.status == 404) {
+        throw await resp.json();
+      }
+    } else {
+      return resp.json();
+    }
+  });
+};
+
+
 const handleErrors = async resp => {
   if ([400, 409].includes(resp.status)) {
     throw await resp.json();
@@ -269,6 +284,7 @@ export {
   logWines,
   wineSchema,
   barcodeToVinmonopolet,
+  searchForWine,
   login,
   register,
   addAttendee,

src/components/RequestWine.vue

@@ -0,0 +1,44 @@
+<template>
+  <main>
+    <h1>
+      Anbefal en vin!
+    </h1>
+    <section>
+      <input type="text" v-model="searchString" >
+      <button @click=(fetchWineFromVin())>knapp</button>
+      <div v-for="(wine, index) in this.wines" :key="index">
+        <Wine :wine=wine >
+          <button>Pick</button>
+        </Wine>
+      </div>
+    </section>
+  </main>
+</template>
+
+<script>
+import { searchForWine } from "@/api";
+import Wine from "@/ui/Wine";
+
+export default {
+  components: {
+    Wine
+  },
+  data() {
+    return {
+      searchString: undefined,
+      res: undefined,
+      wines: undefined,
+    }
+  },
+  methods: {
+    fetchWineFromVin(){
+      searchForWine(this.searchString)
+        .then(res => this.wines = res)
+    },
+  },
+}
+</script>
+
+<style>
+
+</style>

src/routes/vinlottisRouter.js

@@ -12,6 +12,8 @@ import WinnerPage from "@/components/WinnerPage";
 import LotteryPage from "@/components/LotteryPage";
 import HistoryPage from "@/components/HistoryPage";
 
+import RequestWine from "@/components/RequestWine";
+
 const routes = [
   {
     path: "*",
@@ -52,6 +54,10 @@ const routes = [
   {
     path: "/history",
     component: HistoryPage
+  },
+  {
+    path: "/request",
+    component: RequestWine
   }
 ];