Added reservation and username lookup

src/components/ResourceScheduleViewerComponent.vue

@@ -111,6 +111,7 @@ import {
   parseTimestamp,
   addToDate,
   Timestamp,
+  parsed,
 } from '@quasar/quasar-ui-qcalendar';
 import { Boat, useBoatStore } from 'src/stores/boat';
 import { useScheduleStore } from 'src/stores/schedule';
@@ -178,7 +179,7 @@ function getEvents(scope: ResourceIntervalScope) {
 
   return resourceEvents.map((event) => {
     return {
-      left: scope.timeStartPosX(parseDate(event.start)),
+      left: scope.timeStartPosX(parsed(event.start)),
       width: scope.timeDurationWidth(
         date.getDateDiff(event.end, event.start, 'minutes')
       ),

src/components/scheduling/IntervalTemplateComponent.vue

@@ -155,7 +155,6 @@ function onDragStart(e: DragEvent, template: IntervalTemplate) {
   }
 }
 const saveTemplate = (evt: Event, template: IntervalTemplate | undefined) => {
-  console.log(template);
   if (!template) return false;
   overlapped.value = timeTuplesOverlapped(template.timeTuples);
   if (overlapped.value.length > 0) {
@@ -163,7 +162,6 @@ const saveTemplate = (evt: Event, template: IntervalTemplate | undefined) => {
   } else {
     edit.value = false;
     if (template.$id && template.$id !== 'unsaved') {
-      console.log(template.$id);
       scheduleStore.updateIntervalTemplate(template, template.$id);
     } else {
       scheduleStore.createIntervalTemplate(template);

src/components/scheduling/boat/BoatScheduleTableComponent.vue

@@ -38,23 +38,23 @@
               {{ selectedBlock?.$id === block.$id ? 'Selected' : 'Available' }}
             </div>
           </div>
-          <!-- <div
-            v-for="r in boats[scope.columnIndex].reservations"
-            :key="r.id"
+          <div
+            v-for="reservation in getBoatReservations(scope)"
+            :key="reservation.$id"
           >
             <div
               class="reservation"
               :style="
                 reservationStyles(
-                  r,
+                  reservation,
                   scope.timeStartPos,
                   scope.timeDurationHeight
                 )
               "
             >
-              {{ r.user }}
+              {{ getUserName(reservation.user) || 'loading...' }}
             </div>
-          </div> -->
+          </div>
         </template>
       </QCalendarDay>
     </div>
@@ -76,7 +76,8 @@ import CalendarHeaderComponent from './CalendarHeaderComponent.vue';
 import { ref, computed } from 'vue';
 import { useBoatStore } from 'src/stores/boat';
 import { useScheduleStore } from 'src/stores/schedule';
-import { Interval } from 'src/stores/schedule.types';
+import { useAuthStore } from 'src/stores/auth';
+import { Interval, Reservation } from 'src/stores/schedule.types';
 import { storeToRefs } from 'pinia';
 
 const scheduleStore = useScheduleStore();
@@ -89,18 +90,22 @@ const calendar = ref<QCalendarDay | null>(null);
 function handleSwipe({ ...event }) {
   event.direction === 'right' ? calendar.value?.prev() : calendar.value?.next();
 }
-// function reservationStyles(
-//   reservation: Reservation,
-//   timeStartPos: (t: string) => string,
-//   timeDurationHeight: (d: number) => string
-// ) {
-//   return genericBlockStyle(
-//     parseDate(reservation.start) as Timestamp,
-//     parseDate(reservation.end) as Timestamp,
-//     timeStartPos,
-//     timeDurationHeight
-//   );
-// }
+function reservationStyles(
+  reservation: Reservation,
+  timeStartPos: (t: string) => string,
+  timeDurationHeight: (d: number) => string
+) {
+  return genericBlockStyle(
+    parseDate(new Date(reservation.start)) as Timestamp,
+    parseDate(new Date(reservation.end)) as Timestamp,
+    timeStartPos,
+    timeDurationHeight
+  );
+}
+
+function getUserName(userid: string) {
+  return useAuthStore().getUserNameById(userid);
+}
 
 function blockStyles(
   block: Interval,
@@ -176,8 +181,13 @@ const boatBlocks = computed((): BoatBlocks => {
 });
 
 function getBoatBlocks(scope: DayBodyScope): Interval[] {
-  return boats.value[scope.columnIndex]
-    ? boatBlocks.value[boats.value[scope.columnIndex].$id]
+  const boat = boats.value[scope.columnIndex];
+  return boat ? boatBlocks.value[boat.$id] : [];
+}
+function getBoatReservations(scope: DayBodyScope): Reservation[] {
+  const boat = boats.value[scope.columnIndex];
+  return boat
+    ? scheduleStore.getBoatReservations(scope.timestamp, boat.$id)
     : [];
 }
 

src/components/task/TaskEditComponent.vue

@@ -252,14 +252,11 @@ const dateRule = (val: string) => {
 const router = useRouter();
 
 async function onSubmit() {
-  //console.log(modifiedTask);
   try {
     if (modifiedTask.$id) {
       await taskStore.updateTask(modifiedTask);
-      console.log('Updated Task: ' + modifiedTask.$id);
     } else {
       await taskStore.addTask(modifiedTask);
-      console.log('Created Task');
     }
     router.go(-1);
   } catch (error) {