diff --git a/src/constants/schedule-constants.js b/src/constants/schedule-constants.js index 89b4a4c1a..86c2a793c 100644 --- a/src/constants/schedule-constants.js +++ b/src/constants/schedule-constants.js @@ -8,4 +8,9 @@ const PREMIUM_TIME_SLOT_ID_FLAG = "-premium"; const PREMIUM_FEE_PART_TYPE = "EARLY BIRD"; -export { AppointmentTypeStrings, PREMIUM_TIME_SLOT_ID_FLAG, PREMIUM_FEE_PART_TYPE }; +const RouteCodeFlags = { + ALL_DAY_DROP_OFF: "ALL DAY DROP OFF", + OVERNIGHT_DROP_OFF: "OVERNIGHT DROP OFF", +}; + +export { AppointmentTypeStrings, PREMIUM_TIME_SLOT_ID_FLAG, PREMIUM_FEE_PART_TYPE, RouteCodeFlags }; diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index aa0065d89..6486cf5f3 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -25,6 +25,7 @@ mobileCmsWidgetName="MobileTimeSlotModal" dropoffCmsWidgetName="DropOffTimeSlotModal" sameDayDropOffCmsWidgetName="SameDayDropOffTimeSlotModal" + overnightDropOffCmsWidgetName="OvernightDropOffTimeSlotModal" v-model="selectedTimeSlotData" @time-slot-modal-closed="timeSlotModalClosed" :appointmentType="appointmentType" diff --git a/src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue b/src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue index 0b4c15441..589b12cc5 100644 --- a/src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue +++ b/src/layouts/schedule/time-slot-modal-question/time-slot-modal-question.vue @@ -28,8 +28,8 @@ v-if="supplementalInformationBlock" v-html="supplementalInformationBlock"> @@ -53,6 +53,7 @@ import { AppointmentTypeStrings, PREMIUM_TIME_SLOT_ID_FLAG, PREMIUM_FEE_PART_TYPE, + RouteCodeFlags, } from "@/constants/schedule-constants"; // Validation for the modal button @@ -69,6 +70,7 @@ export default { mobilePremiumCmsWidgetName: String, dropoffCmsWidgetName: String, sameDayDropOffCmsWidgetName: String, + overnightDropOffCmsWidgetName: String, appointmentType: String, dateAndTimeSlotData: Object, premiumAppointmentFee: Object, @@ -116,9 +118,15 @@ export default { ? this.mobilePremiumCmsWidgetName : this.mobileCmsWidgetName; } else { - appointmentTypeCmsWidgetName = this.isSameDay - ? this.sameDayDropOffCmsWidgetName - : this.dropoffCmsWidgetName; + if (!this.selectedTimeSlotId) { + return null; + } else { + appointmentTypeCmsWidgetName = + this.getRelevantDropOffCmsWidgetNameForSelectedTimeSlot( + this.selectedTimeSlotId, + true + ); + } } return this.getCmsContent(appointmentTypeCmsWidgetName, "BodyText"); }, @@ -131,12 +139,36 @@ export default { dropoffButtonText() { return this.getCmsContent(this.dropoffCmsWidgetName, "HeaderText"); }, + overnightDropoffButtonText() { + return this.getCmsContent(this.overnightDropOffCmsWidgetName, "HeaderText"); + }, dropoffDisclaimerText() { return this.getCmsContent(this.dropoffCmsWidgetName, "FooterText"); }, + overnightDropOffDisclaimerText() { + return this.getCmsContent(this.overnightDropOffCmsWidgetName, "FooterText"); + }, + disclaimerTextBlockCopy() { + if (this.appointmentType === AppointmentTypeStrings.DROP_OFF) { + if (this.isSameDay) { + return null; + } else if (this.selectedTimeSlotId?.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { + return this.dropoffDisclaimerText; + } else if (this.selectedTimeSlotId?.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + return this.overnightDropOffDisclaimerText; + } else { + return null; + } + } else { + return null; + } + }, dropOffDurationText() { return this.getCmsContent(this.dropoffCmsWidgetName, "SubheaderText"); }, + overnightDropoffDurationText() { + return this.getCmsContent(this.overnightDropOffCmsWidgetName, "SubheaderText"); + }, inshopDurationText() { const inshopDurationTextWithoutTime = this.getCmsContent( this.cmsWidgetName, @@ -154,15 +186,27 @@ export default { } else if (this.appointmentType === AppointmentTypeStrings.IN_SHOP) { return this.inshopDurationText; } else { - return this.dropOffDurationText; + if (this.selectedTimeSlotId?.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + return this.overnightDropoffDurationText; + } else if (this.selectedTimeSlotId?.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { + return this.dropOffDurationText; + } else { + return null; + } } }, shouldShowDropoffDisclaimerText() { return this.appointmentType === AppointmentTypeStrings.DROP_OFF && !this.isSameDay; }, isSameDay() { - return false; + if (!this.dateAndTimeSlotData) { + return false; + } + const selectedDate = this.dateAndTimeSlotData.date; + const todaysDate = new Date().toISOString().split("T")[0]; + return selectedDate === todaysDate; }, + dateSelectedReadableDate() { if (!this.dateAndTimeSlotData) { return null; @@ -233,6 +277,18 @@ export default { } return displayTextForDurationLength; }, + getRelevantDropOffCmsWidgetNameForSelectedTimeSlot( + selectedTimeSlotId, + isSameDayRelevant = false + ) { + if (selectedTimeSlotId.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + return this.overnightDropOffCmsWidgetName; + } else if (selectedTimeSlotId.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { + return this.isSameDay && isSameDayRelevant + ? this.sameDayDropOffCmsWidgetName + : this.dropoffCmsWidgetName; + } + }, getAvailableTimeSlotsForInshop(timeSlotsForSelectedDate) { return timeSlotsForSelectedDate.map((timeSlot) => { const readableTime = this.getDisplayTextForMilitaryTime(timeSlot.startTime); @@ -243,12 +299,16 @@ export default { }); }, getAvailableTimeSlotsForDropOff(timeSlotsForSelectedDate) { - return [ - { - value: timeSlotsForSelectedDate[0].id, - buttonLabel: this.dropoffButtonText, - }, - ]; + const availableTimeSlots = timeSlotsForSelectedDate.map((timeSlot) => { + const buttonLabelValue = timeSlot.id.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF) + ? this.overnightDropoffButtonText + : this.dropoffButtonText; + return { + value: timeSlot.id, + buttonLabel: buttonLabelValue, + }; + }); + return availableTimeSlots; }, getAvailableTimeSlotsForMobile(timeSlotsForSelectedDate) { const availableTimeSlots = timeSlotsForSelectedDate.map((timeSlot) => {