couple updates

This commit is contained in:
Bill Richardson 2026-01-14 14:59:33 -05:00
parent cb0ef2b627
commit 88bd6b239d

View file

@ -62,7 +62,8 @@
class="morning-row-cell" class="morning-row-cell"
:class="[showMorningAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments' :class="[showMorningAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments'
, checkIsSelectedDay(n - 1, 'morning') ? 'selected-date' : '']" , checkIsSelectedDay(n - 1, 'morning') ? 'selected-date' : '']"
@click="showMorningTimes(n - 1)"> @click="showMorningTimes(n - 1)"
@keydown.enter="showMorningTimes(n - 1)">
<span class="span-block top-caption">Morning</span> <span class="span-block top-caption">Morning</span>
<span class="span-block bottom-caption"> <span class="span-block bottom-caption">
{{ showMorningAvailabilityForIndex(n - 1) }} available {{ showMorningAvailabilityForIndex(n - 1) }} available
@ -79,7 +80,8 @@
class="afternoon-row-cell" class="afternoon-row-cell"
:class="[showAfternoonAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments' :class="[showAfternoonAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments'
, checkIsSelectedDay(n - 1, 'afternoon') ? 'selected-date' : '']" , checkIsSelectedDay(n - 1, 'afternoon') ? 'selected-date' : '']"
@click="showAfternoonTimes(n - 1)"> @click="showAfternoonTimes(n - 1)"
@keydown.enter="showAfternoonTimes(n - 1)">
<span class="span-block top-caption">Afternoon</span> <span class="span-block top-caption">Afternoon</span>
<span class="span-block bottom-caption"> <span class="span-block bottom-caption">
{{ showAfternoonAvailabilityForIndex(n - 1) }} available {{ showAfternoonAvailabilityForIndex(n - 1) }} available
@ -98,6 +100,15 @@
<template <template
v-for="timeSlot in selectableTimeSlotsData" v-for="timeSlot in selectableTimeSlotsData"
:key="timeSlot.startTime"> :key="timeSlot.startTime">
<input
:id="`timeslot${timeSlot.startTime}`"
v-model="selectedTime"
type="radio"
name="time-slot"
class="sr-only"
:value="timeSlot.startTime"
@focus="timeSlotFocused(timeSlot)"
@change="timeSlotInputChanged(timeSlot)" />
<label <label
:for="`timeslot${timeSlot.startTime}`" :for="`timeslot${timeSlot.startTime}`"
class="time-slot-button" class="time-slot-button"
@ -106,14 +117,6 @@
@click="selectTimeSlotForDay(timeSlot)"> @click="selectTimeSlotForDay(timeSlot)">
{{ displayTimeSlotTime(timeSlot.startTime) }} {{ displayTimeSlotTime(timeSlot.startTime) }}
</label> </label>
<input
:id="`timeslot${timeSlot.startTime}`"
v-model="selectedTime"
type="radio"
name="time-slot"
class="sr-only"
:value="timeSlot.startTime"
@change="timeSlotInputChanged(timeSlot)" />
</template> </template>
</div> </div>
<div class="row form-test-error"> <div class="row form-test-error">
@ -180,7 +183,7 @@ export default {
default: '' default: ''
} }
}, },
emits: ['update:modelValue', 'dateSelected', 'timeSlotSelected'], emits: ['dateSelected', 'timeSlotSelected'],
setup(props) { setup(props) {
const uuid = crypto.randomUUID(); const uuid = crypto.randomUUID();
const componentId = !props.customComponentId const componentId = !props.customComponentId
@ -556,6 +559,11 @@ export default {
this.selectedTime = null; this.selectedTime = null;
} }
}, },
timeSlotFocused(timeSlot) {
if (timeSlot && this.selectedTime === null) {
this.selectTimeSlotForDay(timeSlot);
}
},
timeSlotInputChanged(timeSlot) { timeSlotInputChanged(timeSlot) {
this.selectTimeSlotForDay(timeSlot); this.selectTimeSlotForDay(timeSlot);
}, },
@ -648,6 +656,9 @@ export default {
this.findInitialDate(config.preSelectedDate, pageIndexObj.initialDayIndex); this.findInitialDate(config.preSelectedDate, pageIndexObj.initialDayIndex);
} else { } else {
this.findFirstAvailableDateInView(); this.findFirstAvailableDateInView();
while (!this.selectedDate) {
this.gotoNextPage();
}
} }
this.isLoading = false; this.isLoading = false;
@ -665,7 +676,9 @@ export default {
await this.updateSelectableDates( await this.updateSelectableDates(
startDateToFetchString, startDateToFetchString,
endDateToFetchString endDateToFetchString
); ).catch(() => {
showIssLoadingModal(false);
});
showIssLoadingModal(false); showIssLoadingModal(false);
}, },