From 19c4d60e23514515ed5663d7e9b9880fc7bcf344 Mon Sep 17 00:00:00 2001 From: Scott Kiener Date: Thu, 22 Jun 2023 10:01:42 -0400 Subject: [PATCH] CSR-1449 | Add overnight drop-off functionality Also made same-day functional --- src/constants/schedule-constants.js | 7 +- src/layouts/schedule/schedule.vue | 1 + .../time-slot-modal-question.vue | 88 ++++++++++++++++--- 3 files changed, 82 insertions(+), 14 deletions(-) diff --git a/src/constants/schedule-constants.js b/src/constants/schedule-constants.js index 89b4a4c1a..76094e636 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..837a743f7 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,12 @@ 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 +136,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 +183,31 @@ 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 +278,19 @@ 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 +301,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) => {