diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index 02337bf0..aa685e88 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -62,7 +62,8 @@ class="morning-row-cell" :class="[showMorningAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments' , checkIsSelectedDay(n - 1, 'morning') ? 'selected-date' : '']" - @click="showMorningTimes(n - 1)"> + @click="showMorningTimes(n - 1)" + @keydown.enter="showMorningTimes(n - 1)"> Morning {{ showMorningAvailabilityForIndex(n - 1) }} available @@ -79,7 +80,8 @@ class="afternoon-row-cell" :class="[showAfternoonAvailabilityForIndex(n - 1) > 0 ? 'has-appointments' : 'no-appointments' , checkIsSelectedDay(n - 1, 'afternoon') ? 'selected-date' : '']" - @click="showAfternoonTimes(n - 1)"> + @click="showAfternoonTimes(n - 1)" + @keydown.enter="showAfternoonTimes(n - 1)"> Afternoon {{ showAfternoonAvailabilityForIndex(n - 1) }} available @@ -98,6 +100,15 @@
@@ -180,7 +183,7 @@ export default { default: '' } }, - emits: ['update:modelValue', 'dateSelected', 'timeSlotSelected'], + emits: ['dateSelected', 'timeSlotSelected'], setup(props) { const uuid = crypto.randomUUID(); const componentId = !props.customComponentId @@ -556,6 +559,11 @@ export default { this.selectedTime = null; } }, + timeSlotFocused(timeSlot) { + if (timeSlot && this.selectedTime === null) { + this.selectTimeSlotForDay(timeSlot); + } + }, timeSlotInputChanged(timeSlot) { this.selectTimeSlotForDay(timeSlot); }, @@ -648,6 +656,9 @@ export default { this.findInitialDate(config.preSelectedDate, pageIndexObj.initialDayIndex); } else { this.findFirstAvailableDateInView(); + while (!this.selectedDate) { + this.gotoNextPage(); + } } this.isLoading = false; @@ -665,7 +676,9 @@ export default { await this.updateSelectableDates( startDateToFetchString, endDateToFetchString - ); + ).catch(() => { + showIssLoadingModal(false); + }); showIssLoadingModal(false); },