Clean up all kinds of typescript issues

src/pages/schedule/BoatReservationPage.vue

@@ -30,7 +30,7 @@
             rounded
             class="bg-warning text-grey-10"
             style="max-width: 95vw; margin: auto"
-            v-if="bookingForm.boat?.defects"
+            v-if="bookingForm.boat && bookingForm.boat.defects.length > 0"
           >
             <template v-slot:avatar>
               <q-icon name="warning" color="grey-10" />
@@ -63,7 +63,7 @@
           ><q-banner v-if="bookingForm.boat"
             >Passengers:
             {{ bookingForm.members.length + bookingForm.guests.length }} /
-            {{ bookingForm.boat.booking?.maxPassengers }}</q-banner
+            {{ bookingForm.boat.maxPassengers }}</q-banner
           >
           <q-item
             class="q-my-sm"

src/pages/schedule/BoatScheduleView.vue

@@ -85,22 +85,22 @@ function slotStyle(
 function reservationEvents(timestamp: Timestamp) {
   return scheduleStore.getBoatReservations(timestamp);
 }
-function onMoved(data) {
+function onMoved(data: Event) {
   console.log('onMoved', data);
 }
-function onChange(data) {
+function onChange(data: Event) {
   console.log('onChange', data);
 }
-function onClickDate(data) {
+function onClickDate(data: Event) {
   console.log('onClickDate', data);
 }
-function onClickTime(data) {
+function onClickTime(data: Event) {
   console.log('onClickTime', data);
 }
-function onClickInterval(data) {
+function onClickInterval(data: Event) {
   console.log('onClickInterval', data);
 }
-function onClickHeadDay(data) {
+function onClickHeadDay(data: Event) {
   console.log('onClickHeadDay', data);
 }
 </script>

src/pages/schedule/ManageCalendar.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="fit row wrap justify-start items-start content-start">
+    <div class="col-9">
+      <div class="scheduler">
+        <q-calendar-scheduler
+          ref="calendar"
+          v-model="selectedDate"
+          v-model:model-resources="resources"
+          view="week"
+          :drag-enter-func="onDragEnter"
+          :drag-over-func="onDragOver"
+          :drag-leave-func="onDragLeave"
+          :drop-func="onDrop"
+          :weekday-class="onWeekdayClass"
+          :day-class="onDayClass"
+          :weekdays="[1, 2, 3, 4, 5]"
+          hoverable
+          animated
+          bordered
+          :day-min-height="50"
+          :day-height="0"
+          style="max-width: 800px; width: 100%"
+          @change="onChange"
+          @moved="onMoved"
+          @click-date="onClickDate"
+          @click-day-resource="onClickDayResource"
+          @click-resource="onClickResource"
+          @click-head-resources="onClickHeadResources"
+          @click-head-day="onClickHeadDay"
+        ></q-calendar-scheduler>
+      </div>
+    </div>
+    HI!
+    <div class="col-3">
+      <!---->
+    </div>
+  </div>
+</template>
+
+<script setup type="ts">
+import {QCalendarScheduler, today} from '@quasar/quasar-ui-qcalendar'
+import { useBoatStore } from 'src/stores/boat';
+import { ref } from 'vue';
+
+const selectedDate = ref(today())
+const resources = ref(useBoatStore().boats)
+</script>

src/pages/schedule/ScheduleIndexPage.vue

@@ -23,5 +23,6 @@ const navlinks = [
     label: 'Create a Reservation',
   },
   { icon: 'calendar_month', to: '/schedule/view', label: 'View Schedule' },
+  { icon: 'edit_calendar', to: '/schedule/manage', label: 'Manage Calendar' },
 ];
 </script>