From 3f8687f95163c418e6c8c67d913961339a5e4426 Mon Sep 17 00:00:00 2001
From: philipp lang <philipp@aweos.de>
Date: Thu, 1 Feb 2024 02:03:04 +0100
Subject: [PATCH] Add RegisterUrl to popup

---
 src/Eventindex.ce.vue    |  2 +-
 src/components/Popup.vue | 40 +++++++++++++---------------------------
 2 files changed, 14 insertions(+), 28 deletions(-)

diff --git a/src/Eventindex.ce.vue b/src/Eventindex.ce.vue
index a495153..0f5d093 100644
--- a/src/Eventindex.ce.vue
+++ b/src/Eventindex.ce.vue
@@ -18,7 +18,7 @@
     </a>
   </div>
 
-  <popup v-if="visibleEvent !== null" :event="visibleEvent" @close="hideEvent"></popup>
+  <popup v-if="visibleEvent !== null" :event="visibleEvent" :register-url="props.registerUrl" @close="hideEvent"></popup>
 </template>
 
 <script setup>
diff --git a/src/components/Popup.vue b/src/components/Popup.vue
index a3c0797..927b606 100644
--- a/src/components/Popup.vue
+++ b/src/components/Popup.vue
@@ -1,40 +1,22 @@
 <template>
-  <div
-    class="flex fixed top-0 left-0 w-full h-full items-center justify-center p-6 z-40 bg-black/40"
-    @click.self="emit('close')"
-  >
+  <div class="flex fixed top-0 left-0 w-full h-full items-center justify-center p-6 z-40 bg-black/40"
+    @click.self="emit('close')">
     <div
-      class="rounded bg-white p-4 shadow-2xl ring-1 ring-gray-900/5 relative text-gray-600 max-w-2xl max-h-full overflow-auto"
-    >
-      <h2
-        class="font-arvo text-primary text-sm md:text-base"
-        v-text="event.name"
-      ></h2>
+      class="rounded bg-white p-4 shadow-2xl ring-1 ring-gray-900/5 relative text-gray-600 max-w-2xl max-h-full overflow-auto">
+      <h2 class="font-arvo text-primary text-sm md:text-base" v-text="event.name"></h2>
       <div class="flex items-baseline text-sm">
         <calendar-icon class="w-3 h-3 flex-none text-secondary"></calendar-icon>
-        <span
-          class="text-sm font-semibold font-nunito text-gray-800 ml-2"
-          v-text="event.dates"
-        ></span>
+        <span class="text-sm font-semibold font-nunito text-gray-800 ml-2" v-text="event.dates"></span>
       </div>
 
-      <div
-        class="text-gray-800 mt-3 font-nunito"
-        v-html="event.description"
-      ></div>
+      <div class="text-gray-800 mt-3 font-nunito" v-html="event.description"></div>
       <div class="flex mt-3">
-        <a
-          href="#"
-          class="px-3 py-2 text-xs font-nunito font-semibold rounded sm:px-4 sm:py-2 sm:text-sm sm:rounded focus:ring-2 focus:ring-offset-1 focus:ring-primaryfg focus:outline-none bg-primary text-primaryfg"
-        >
+        <a :href="registerUrl.replace(':slug', event.slug)"
+          class="px-3 py-2 text-xs font-nunito font-semibold rounded sm:px-4 sm:py-2 sm:text-sm sm:rounded focus:ring-2 focus:ring-offset-1 focus:ring-primaryfg focus:outline-none bg-primary text-primaryfg">
           Zur Anmeldung
         </a>
       </div>
-      <a
-        class="absolute block mt-3 mr-3 right-0 top-0"
-        href="#"
-        @click.prevent="emit('close')"
-      >
+      <a class="absolute block mt-3 mr-3 right-0 top-0" href="#" @click.prevent="emit('close')">
         <close-icon class="text-gray-700 w-5 h-5"></close-icon>
       </a>
     </div>
@@ -50,5 +32,9 @@ const props = defineProps({
   event: {
     required: true,
   },
+  registerUrl: {
+    required: true,
+    type: String,
+  },
 });
 </script>