From b30683972e130f2d8cde4ec3320f004a0a143c44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Martin=20D=C3=BCnkelmann?= <nc-duenkekl3@netcologne.de>
Date: Wed, 22 Mar 2023 14:34:30 +0100
Subject: [PATCH] feat(RTF): add universal popup component and add it to the
 rtf page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Martin Dünkelmann <nc-duenkekl3@netcologne.de>
---
 src/components/pages/DPopup.vue              | 26 ++++++++++++++++++++
 src/models/builder/events/TourBuilder.ts     | 11 +++++++--
 src/models/entities/events/Tour.ts           |  6 +++--
 src/pages/events/tours/events/rtfs/index.vue |  2 ++
 src/store/events/Tour.ts                     |  8 +++++-
 5 files changed, 48 insertions(+), 5 deletions(-)
 create mode 100644 src/components/pages/DPopup.vue

diff --git a/src/components/pages/DPopup.vue b/src/components/pages/DPopup.vue
new file mode 100644
index 000000000..78fc95c18
--- /dev/null
+++ b/src/components/pages/DPopup.vue
@@ -0,0 +1,26 @@
+<template>
+    <v-dialog id="DPopup" v-model="dialog" scrollable width="auto">
+        <v-card>
+            <v-toolbar color="primary" flat>
+                <v-toolbar-title class="accent--text">{{ props.value.title }}</v-toolbar-title>
+            </v-toolbar>
+            <!-- TODO style="padding: 16px" IS A WORKAROUND FOR https://github.com/vuetifyjs/vuetify/issues/12170 -->
+            <v-card-text style="padding: 16px">
+                <span class="black--text text-pre-wrap" v-html="props.value.text" />
+            </v-card-text>
+            <v-card-actions>
+                <v-spacer />
+                <v-btn class="font-weight-black" color="primary" text @click="dialog = false">OK</v-btn>
+            </v-card-actions>
+        </v-card>
+    </v-dialog>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import Popup from '~/models/entities/Popup'
+
+const props = defineProps<{ value: Popup }>()
+
+const dialog = ref(true)
+</script>
diff --git a/src/models/builder/events/TourBuilder.ts b/src/models/builder/events/TourBuilder.ts
index b5b084c28..9666c6be1 100644
--- a/src/models/builder/events/TourBuilder.ts
+++ b/src/models/builder/events/TourBuilder.ts
@@ -1,8 +1,9 @@
 import ABuilder from '~/models/builder/ABuilder'
-import EEvent from '~/models/enums/EEvent'
-import GalleryEntry from '~/models/entities/rtc-cologne/gallery/GalleryEntry'
+import PopupBuilder from '~/models/builder/PopupBuilder'
 import Tour from '~/models/entities/events/Tour'
 import Control from '~/models/entities/events/tours/Control'
+import GalleryEntry from '~/models/entities/rtc-cologne/gallery/GalleryEntry'
+import EEvent from '~/models/enums/EEvent'
 
 export default class TourBuilder<T extends Tour> extends ABuilder {
     protected tour = new Tour()
@@ -41,6 +42,12 @@ export default class TourBuilder<T extends Tour> extends ABuilder {
         return this
     }
 
+    setPopup(text: string, title: string): TourBuilder<T> {
+        this.tour.popup = new PopupBuilder().setId('04ad6a7c-7fff-4224-bdb6-b52fb64f1785').setText(text).setTitle(title).build()
+
+        return this
+    }
+
     setText(value: string): TourBuilder<T> {
         this.tour.text = value
 
diff --git a/src/models/entities/events/Tour.ts b/src/models/entities/events/Tour.ts
index 037cb8b0b..568b30c37 100644
--- a/src/models/entities/events/Tour.ts
+++ b/src/models/entities/events/Tour.ts
@@ -1,7 +1,8 @@
-import EEvent from '~/models/enums/EEvent'
-import GalleryEntry from '~/models/entities/rtc-cologne/gallery/GalleryEntry'
 import AEntity from '~/models/entities/AEntity'
 import Control from '~/models/entities/events/tours/Control'
+import Popup from '~/models/entities/Popup'
+import GalleryEntry from '~/models/entities/rtc-cologne/gallery/GalleryEntry'
+import EEvent from '~/models/enums/EEvent'
 
 export default class Tour extends AEntity {
     active = true
@@ -9,6 +10,7 @@ export default class Tour extends AEntity {
     controls: Control[] = []
     images: GalleryEntry[] = []
     lastChange!: Date
+    popup?: Popup
     text!: string
     title!: string
     urls: Record<string, URL> = {}
diff --git a/src/pages/events/tours/events/rtfs/index.vue b/src/pages/events/tours/events/rtfs/index.vue
index b2ecb11d1..55361e733 100644
--- a/src/pages/events/tours/events/rtfs/index.vue
+++ b/src/pages/events/tours/events/rtfs/index.vue
@@ -139,11 +139,13 @@
                 </v-col>
             </v-row>
         </v-card-text>
+        <d-popup v-if="value.popup" :value="value.popup" />
     </v-card>
 </template>
 
 <script lang="ts" setup>
 import { computed, getCurrentInstance, ref } from 'vue'
+import DPopup from '~/components/pages/DPopup.vue'
 import DView from '~/components/pages/rtc-cologne/galleries/album/DView.vue'
 import Event from '~/models/entities/events/tours/Event'
 import Fee from '~/models/entities/events/tours/events/Fee'
diff --git a/src/store/events/Tour.ts b/src/store/events/Tour.ts
index f96328c0a..b2bea360c 100644
--- a/src/store/events/Tour.ts
+++ b/src/store/events/Tour.ts
@@ -169,7 +169,13 @@ Gemeinsam geht es auf dem Radweg Richtung Altenrath weiter.`
                         .setImageUrl('content.rtc-koeln.de/pages/events/tours/events/rtfs/2023 Flyer.jpg')
                         .build()
                 )
-                .setLastChange('2023-01-28')
+                .setLastChange('2023-03-22')
+                .setPopup(
+                    `Natürlich sind all unsere Strecken ausgeschildert.
+
+Euer RTC Köln e.V.`,
+                    'Hinweis'
+                )
                 .setText(
                     `Liebe Radsportlerinnen und Radsportler,