kickoff

src/views/Search.vue

@@ -0,0 +1,58 @@
+<template>
+    <h1>Suche</h1>
+    <form @submit.prevent="submitSearch()">
+        <div class="row">
+            <div class="col">
+                <input
+                    type="text"
+                    class="form-control"
+                    id="searchText"
+                    v-model="searchText"
+                    required
+                    />
+            </div>
+            <div class="col">
+                 <button type="submit" class="btn btn-primary mb-4">Suche Starten</button>
+            </div>
+        </div>
+    </form>
+    <div class="alert alert-danger mb-4 mt-4" role="alert" v-if="showErrorMessage">
+        Bei der Suche ist ein Fehler aufgetreten
+    </div>
+</template>
+<script>
+import axios from 'axios'
+
+export default {
+    name: 'Search',
+  data(){
+      return {
+          showErrorMessage: false,
+          searchText: '',
+      }
+  },
+  methods: {
+      async submitSearch(){
+          this.showErrorMessage = false
+          try{
+              const loginResult = await axios.post(
+                `${this.apiUrl}/search`,
+                // Beispiel Hafte Daten
+                {
+                    searchText: this.searchText,
+                })
+                if(loginResult.status === 200){
+                    //success login
+                    router.push({path: 's/search'})
+                }
+                else{
+                    this.showErrorMessage = true
+                }
+          }catch(error){
+              console.error()
+                this.showErrorMessage = true
+          }
+      }
+  }
+}
+</script>