From 877070fc71ff266af64d9f1c374bbf05bdc76c0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Felix=20H=C3=B6ffken?= <felix@ctrl.alt.coop>
Date: Fri, 8 Dec 2023 07:20:26 +0100
Subject: [PATCH] Redirect to mete to add barcode on click (#14)

Add the option to click on the warning that the barcode is not known, so
that we can directly add it in mete.

To achieve this I added the `url` prop to `Mete.vue`.

NOTE: I had to cast `this.$root` to any - if you have better ideas
please share!

I assume this is quite hacky - nicer approaches welcome.

And help wanted to fix the checks :upside_down_face:

To test this add `this.addFromBarcode('asdf?!<');` to `Register.vue`'s
`mounted` function.
---
 src/App.vue                 | 11 ++++++++++-
 src/components/Mete.vue     |  8 +++++++-
 src/components/Register.vue |  3 ++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 12370c6..b15f293 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -26,7 +26,7 @@
     <el-main v-if="!mete">
       <Register ref="register" />
     </el-main>
-    <Mete v-if="mete" />
+    <Mete v-if="mete" :url='meteUrl' />
   </el-container>
 </template>
 
@@ -49,6 +49,7 @@ export default defineComponent({
     return {
       menu: false,
       mete: false,
+      meteUrl: '/mete',
       storno: false,
     };
   },
@@ -85,6 +86,14 @@ export default defineComponent({
     goMete($event: Event) {
       $event.preventDefault();
 
+      this.meteUrl = '/mete';
+      this.menu = false;
+      this.mete = true;
+    },
+    addNewBarCode($event: Event, barcode: string) {
+      $event.preventDefault();
+
+      this.meteUrl = '/mete/barcodes/new?id=' + encodeURIComponent(barcode);
       this.menu = false;
       this.mete = true;
     },
diff --git a/src/components/Mete.vue b/src/components/Mete.vue
index 3b2de2a..e173ccf 100644
--- a/src/components/Mete.vue
+++ b/src/components/Mete.vue
@@ -1,5 +1,5 @@
 <template>
-  <iframe ref="mete" class="meteframe" src="/mete" />
+  <iframe ref="mete" class="meteframe" :src="url" />
 </template>
 
 <script lang="ts">
@@ -7,5 +7,11 @@ import { defineComponent } from "vue";
 
 export default defineComponent({
   name: "Mete",
+  props: {
+    url: {
+      type: String,
+      required: true,
+    }
+  }
 });
 </script>
diff --git a/src/components/Register.vue b/src/components/Register.vue
index b656bae..74e18e8 100644
--- a/src/components/Register.vue
+++ b/src/components/Register.vue
@@ -121,8 +121,9 @@ export default defineComponent({
       } else {
         notify({
           title: "Unbekannter Barcode!",
-          message: `Bitte den Barcode ${barcode} im Administrationsbereich hinterlegen!`,
+          message: `Klicke hier um den Barcode ${barcode} im Administrationsbereich zu hinterlegen!`,
           type: "warning",
+          onClick:($event: Event) => { (this.$root as any)?.addNewBarCode($event, barcode); }
         });
       }
     },