many changes

spaces/pages/planningBoard.vue

@@ -40,12 +40,13 @@ const createEvent = async () => {
 
   if(error) {
     console.log(error)
-  } else {
-    openNewEventModal.value = false
-    newEventData.value = {}
-    dataStore.fetchEvents()
   }
 
+  console.log("OK")
+  openNewEventModal.value = false
+  newEventData.value = {}
+  dataStore.fetchEvents()
+
 
 }
 const calendarOptionsList = reactive({
@@ -61,11 +62,12 @@ const calendarOptionsTimeline = reactive({
   schedulerLicenseKey: "CC-Attribution-NonCommercial-NoDerivatives",
   locale: deLocale,
   plugins: [resourceTimelinePlugin, interactionPlugin],
-  initialView: "resourceTimelineDay",
+  initialView: "resourceTimeline3Hours",
+
   headerToolbar: {
     left: 'prev,next',
     center: 'title',
-    right: 'resourceTimelineDay,resourceTimelineWeek,resourceTimelineMonth'
+    right: 'resourceTimelineDay,resourceTimeline3Hours,resourceTimelineMonth'
   },
   initialEvents: events,
   selectable: true,
@@ -88,7 +90,29 @@ const calendarOptionsTimeline = reactive({
   },
   resourceGroupField: "type",
   resources: resources,
-  nowIndicator:true
+  nowIndicator:true,
+  views: {
+    resourceTimeline3Hours: {
+      type: 'resourceTimeline',
+      slotDuration: {hours: 3},
+      slotMinTime: "06:00:00",
+      slotMaxTime: "21:00:00",
+      /*duration: {days:7},*/
+      buttonText: "Woche",
+      visibleRange: function(currentDate) {
+        // Generate a new date for manipulating in the next step
+        var startDate = new Date(currentDate);
+        var endDate = new Date(currentDate);
+
+        // Adjust the start & end dates, respectively
+        startDate.setDate(startDate.getDate() - startDate.getDay() +1); // One day in the past
+        endDate.setDate(startDate.getDate() + 5); // Two days into the future
+
+        return { start: startDate, end: endDate };
+      }
+    }
+  },
+
 })
 
 </script>
@@ -124,6 +148,24 @@ const calendarOptionsTimeline = reactive({
             v-model="newEventData.title"
           />
         </UFormGroup>
+        <UFormGroup
+          label="Projekt:"
+        >
+          <USelectMenu
+            v-model="newEventData.project"
+            :options="dataStore.projects"
+            option-attribute="name"
+            value-attribute="id"
+            searchable
+            searchable-placeholder="Suche..."
+            :search-attributes="['name']"
+          >
+            <template #label>
+              {{dataStore.getProjectById(newEventData.project) ? dataStore.getProjectById(newEventData.project).name : "Kein Projekt ausgewählt"}}
+            </template>
+
+          </USelectMenu>
+        </UFormGroup>
         <UFormGroup
           label="Typ:"
         >