Update Boat selection component

src/components/scheduling/BoatSelection.vue

@@ -66,7 +66,7 @@
           <q-option-group
             :options="boatoptions(boat)"
             type="radio"
-            :model-value="selectedTime"
+            v-model="selectedBoatTime"
           >
             <template v-slot:label="opt">
               <div class="row items-center">
@@ -110,6 +110,7 @@ const calendar = ref();
 const boatStore = useBoatStore();
 const scheduleStore = useScheduleStore();
 const selectedDate = ref(today());
+const selectedBoatTime = ref();
 
 const formattedMonth = computed(() => {
   const date = new Date(selectedDate.value);
@@ -122,10 +123,6 @@ const disabledBefore = computed(() => {
   return addToDate(todayTs, { day: -1 }).date;
 });
 
-const selectedTime = computed(() => {
-  return boatStore.boats[0] + ':09:00';
-});
-
 function monthFormatter() {
   try {
     return new Intl.DateTimeFormat('en-CA' || undefined, {
@@ -152,9 +149,11 @@ const boatoptions = (boat: Boat) => {
       const conflicts = getConflicts(x, boat);
       return {
         label: x.start.time + ' to ' + x.end.time,
-        value: boat.name + ':' + x.start.time,
+        value: boat.id + ':' + x.start.time,
         disable: conflicts.length > 0,
         user: conflicts[0]?.user,
+        boat: boat,
+        timeblock: x,
       };
     });
   return options;