From f68d4ae44536c807db59928ec445f4d4d7a4adda Mon Sep 17 00:00:00 2001
From: Elmar Kresse <elmar.kresse@stud.htwk-leipzig.de>
Date: Thu, 6 Jun 2024 00:38:35 +0200
Subject: [PATCH] fix:#13 start end get

---
 frontend/src/components/CalendarViewer.vue | 48 ++++++++++++++--------
 1 file changed, 30 insertions(+), 18 deletions(-)

diff --git a/frontend/src/components/CalendarViewer.vue b/frontend/src/components/CalendarViewer.vue
index ac5e580..928cb1c 100644
--- a/frontend/src/components/CalendarViewer.vue
+++ b/frontend/src/components/CalendarViewer.vue
@@ -2,7 +2,7 @@
 
 import FullCalendar from "@fullcalendar/vue3";
 import { computed, ComputedRef, inject, Ref, ref, watch } from "vue";
-import { CalendarOptions, DatesSetArg } from "@fullcalendar/core";
+import { CalendarOptions, DatesSetArg, EventClickArg } from "@fullcalendar/core";
 import allLocales from "@fullcalendar/core/locales-all";
 import dayGridPlugin from "@fullcalendar/daygrid";
 import interactionPlugin from "@fullcalendar/interaction";
@@ -28,9 +28,7 @@ const props = defineProps({
 const op = ref();
 const clickedEvent = ref();
 
-const toggle = (info: any) => {
-
-
+const toggle = (info: EventClickArg) => {
 
   if (op.value.visible) {
     clickedEvent.value = null;
@@ -38,21 +36,35 @@ const toggle = (info: any) => {
     return;
   } else {
 
-    const start = info.event._instance.range.start;
-    const end = info.event._instance.range.end;
-    const timeZoneOffsetStart = start.getTimezoneOffset() * 60000;
-    const timeZoneOffsetEnd = end.getTimezoneOffset() * 60000;
+    const start = info.event.start
+    const end = info.event.end
 
-    clickedEvent.value = {
-      title: info.event._def.title,
-      start: new Date(start.getTime() + timeZoneOffsetStart),
-      end: new Date(end.getTime() + timeZoneOffsetEnd),
-      notes: info.event._def.extendedProps.notes,
-      allDay: info.event._def.allDay,
-      location: info.event._def.extendedProps.location,
-    };
+    if (!start || !end) {
+      clickedEvent.value = {
+        title: info.event._def.title,
+        start: "",
+        end: "",
+        notes: info.event._def.extendedProps.notes,
+        allDay: info.event._def.allDay,
+        location: info.event._def.extendedProps.location,
+      };
       op.value.show(info.jsEvent);
       op.value.target = info.el;
+    } else {
+      const timeZoneOffsetStart = start.getTimezoneOffset() * 60000;
+      const timeZoneOffsetEnd = end.getTimezoneOffset() * 60000;
+
+      clickedEvent.value = {
+        title: info.event._def.title,
+        start: new Date(start.getTime() + timeZoneOffsetStart),
+        end: new Date(end.getTime() + timeZoneOffsetEnd),
+        notes: info.event._def.extendedProps.notes,
+        allDay: info.event._def.allDay,
+        location: info.event._def.extendedProps.location,
+      };
+      op.value.show(info.jsEvent);
+      op.value.target = info.el;
+    }
   }
 
 
@@ -169,8 +181,8 @@ watch(mobilePage, () => {
       <div>
         <h3>{{ clickedEvent.title }}</h3>
         <p>Location: {{ clickedEvent.location }}</p>
-        <p>Start: {{ clickedEvent.start.toLocaleString()}}</p>
-        <p>End: {{ clickedEvent.end.toLocaleString() }}</p>
+        <p>Start: {{ clickedEvent.start?.toLocaleString()}}</p>
+        <p>End: {{ clickedEvent.end?.toLocaleString() }}</p>
         <p>Notes: {{ clickedEvent.notes }}</p>
       </div>
   </OverlayPanel>