From 449771b0020b746d56c0c7a7eb22c888cd0a32f3 Mon Sep 17 00:00:00 2001 From: Scott Kiener Date: Thu, 3 Jul 2025 10:00:02 -0400 Subject: [PATCH 1/2] CASH-814 | Most work done, need refactor and CSS --- .../button-question/button-question.vue | 26 ++- .../date-picker/date-picker.vue | 2 +- .../time-slot-question/time-slot-question.vue | 183 ++++++++++++++---- .../shop-question/shop-question.vue | 31 +-- 4 files changed, 186 insertions(+), 56 deletions(-) diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index 050dcdea0..dc1f50c15 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -36,7 +36,7 @@ https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Com
+
+ OR +
@@ -149,6 +156,11 @@ export default { required: false, default: false, }, + insertOrLabelBeforeFinalOption: { + type: Boolean, + required: false, + default: false, + }, }, setup(props) { const propsClone = Object.assign({}, props); @@ -390,4 +402,16 @@ export default { } } } +.or-label { + width: 100%; + text-align: center; + border-bottom: 1px solid black; + line-height: 1px; + margin: 10px 0 20px; + + span { + background: #fff; + padding: 0 10px; + } +} diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index 3d517fd85..642c90174 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -1373,7 +1373,7 @@ export default { } } } - :deep(.button-inner-wrapper) { + :deep(.timeslots .button-inner-wrapper) { display: flex; max-width: 100%; flex-wrap: wrap; diff --git a/src/layouts/schedule/time-slot-question/time-slot-question.vue b/src/layouts/schedule/time-slot-question/time-slot-question.vue index 58648746e..e3d2ef691 100644 --- a/src/layouts/schedule/time-slot-question/time-slot-question.vue +++ b/src/layouts/schedule/time-slot-question/time-slot-question.vue @@ -7,11 +7,30 @@ justifyText="center" typeStyle="small" class="duration-text-block" /> + +
+ +
+
{ + return this.isDropOffRouteCode(timeSlot.id); + }) + .map((timeSlot) => { + let buttonLabelValue; + if (timeSlot.id.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + buttonLabelValue = this.overnightDropoffButtonText; + } else if (this.isSameDay) { + buttonLabelValue = this.sameDayDropoffButtonText; + } else { + buttonLabelValue = this.dropoffButtonText; + } + return { + value: timeSlot.id, + buttonLabel: buttonLabelValue, + }; + }); + if ( + this.getAvailableTimeSlotsForInshop(this.timeSlotsForSelectedDate.timeSlots) + .length !== 0 + ) { + dropOffQuestionAnswers.push({ + value: PICK_A_TIME_BUTTON_VALUE, + buttonLabel: "Pick a time", + }); + } + return dropOffQuestionAnswers; + }, hasWaitListExperiment() { return experimentMixin.methods.hasSettingEqualTo( experimentSettings.DISPLAY_WAITLIST, @@ -360,6 +411,33 @@ export default { isDropOffAppointment() { return this.appointmentType === AppointmentTypeStrings.DROP_OFF; }, + shouldDisplayDropOffAlert() { + return this.isDropOffRouteCode(this.selectedAnswerForDropOff); + }, + dropOffTimeSlotAlertCMSWidgetName() { + if (this.selectedAnswerForDropOff.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { + return "OvernightDropOffTimeSlotAlert"; + } else if (this.isSameDay) { + return "SameDayDropOffTimeSlotAlert"; + } else { + return "DropOffTimeSlotAlert"; + } + }, + isDropOffAppointmentAvailable() { + console.log("its running"); + + return ( + this.answersForDropOffQuestion !== null && + this.answersForDropOffQuestion.length !== 0 && + this.answersForDropOffQuestion[0].value !== PICK_A_TIME_BUTTON_VALUE + ); + }, + shouldDisplayTimeSlotQuestion() { + return ( + this.selectedAnswerForDropOff == PICK_A_TIME_BUTTON_VALUE || + !this.isDropOffAppointmentAvailable + ); + }, }, methods: { async setSelectedTimeSlot() { @@ -382,31 +460,17 @@ export default { } }, getAvailableTimeSlotsForInshop(timeSlotsForSelectedDate) { - return timeSlotsForSelectedDate.map((timeSlot) => { - const readableTime = militaryToTwelveHourTime(timeSlot.startTime); - return { - value: timeSlot.id, - buttonLabel: readableTime, - }; - }); - }, - getAvailableTimeSlotsForDropOff(timeSlotsForSelectedDate) { - const availableTimeSlots = timeSlotsForSelectedDate.map((timeSlot) => { - let buttonLabelValue; - if (timeSlot.id.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { - buttonLabelValue = this.overnightDropoffButtonText; - } else if (this.isSameDay) { - buttonLabelValue = this.sameDayDropoffButtonText; - } else { - buttonLabelValue = this.dropoffButtonText; - } - return { - value: timeSlot.id, - buttonLabel: buttonLabelValue, - }; - }); - - return availableTimeSlots; + return timeSlotsForSelectedDate + .filter((timeSlot) => { + return !this.isDropOffRouteCode(timeSlot.id); + }) + .map((timeSlot) => { + const readableTime = militaryToTwelveHourTime(timeSlot.startTime); + return { + value: timeSlot.id, + buttonLabel: readableTime, + }; + }); }, getAvailableTimeSlotsForMobile(timeSlotsForSelectedDate) { const availableTimeSlots = timeSlotsForSelectedDate.map((timeSlot) => { @@ -463,9 +527,14 @@ export default { return store.getters.order.customer?.waitListRequested; }, autoSelectTimeSlotIfOnlyOneIsAvailable() { - const numberOfOptions = this.availableTimeSlots?.length; + console.log(this.timeSlotsForSelectedDate.timeSlots?.length); + const numberOfOptions = this.timeSlotsForSelectedDate.timeSlots?.length; if (numberOfOptions === 1) { - this.selectedRouteCode = this.availableTimeSlots[0].value; + if (this.availableTimeSlots.length > 0) { + this.selectedAnswerForTimeSlots = this.availableTimeSlots[0].value; + } else { + this.selectedAnswerForDropOff = this.answersForDropOffQuestion[0].value; + } } }, addPremiumFlagToInput(routeCode) { @@ -519,6 +588,12 @@ export default { successMessageElement.scrollIntoView({ behavior: "smooth" }); } }, + isDropOffRouteCode(routeCode) { + return ( + routeCode.includes(RouteCodeFlags.ALL_DAY_DROP_OFF) || + routeCode.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF) + ); + }, }, watch: { waitListRequested(newVal) { @@ -545,12 +620,24 @@ export default { this.setSelectedTimeSlot(); } }, + selectedAnswerForDropOff(newValue) { + if (newValue == PICK_A_TIME_BUTTON_VALUE) { + this.selectedRouteCode = null; + } else { + this.selectedAnswerForTimeSlots = null; + this.selectedRouteCode = newValue; + } + }, + selectedAnswerForTimeSlots(newValue) { + if (newValue) this.selectedRouteCode = newValue; + }, }, components: { // Removed modal textBlock, buttonQuestion, checkboxQuestion, + alert, }, }; @@ -623,5 +710,23 @@ export default { text-align: left; margin: 1.5rem 0 0; } + .drop-off-alert { + background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_13957_112512)'%3E%3Cpath d='M5.99865 0C4.81147 4.82643e-07 3.65095 0.352111 2.66392 1.01179C1.67688 1.67146 0.907678 2.60907 0.45361 3.70599C-0.000459241 4.80291 -0.11899 6.00986 0.113013 7.17415C0.345015 8.33845 0.917126 9.40778 1.75697 10.2469C2.59682 11.086 3.66666 11.6571 4.83117 11.8881C5.99567 12.119 7.20251 11.9994 8.29902 11.5443C9.39553 11.0893 10.3324 10.3192 10.9912 9.33159C11.65 8.34396 12.0011 7.18313 12 5.99594C11.9971 4.40566 11.3638 2.88142 10.2388 1.75742C9.11375 0.633431 7.58894 0.00143011 5.99865 0V0ZM5.99865 11.2478C4.96135 11.2473 3.94748 10.9392 3.08518 10.3627C2.22288 9.7861 1.55085 8.96685 1.15401 8.00846C0.75718 7.05006 0.653353 5.99554 0.855656 4.97815C1.05796 3.96077 1.55731 3.02618 2.29061 2.29251C3.0239 1.55884 3.95823 1.059 4.97551 0.856176C5.99279 0.653349 7.04737 0.756633 8.00597 1.15297C8.96457 1.54931 9.78416 2.22092 10.3612 3.08293C10.9382 3.94493 11.2467 4.95864 11.2478 5.99594C11.2478 7.38835 10.6949 8.72377 9.71053 9.70861C8.7262 10.6934 7.39106 11.2471 5.99865 11.2478V11.2478Z' fill='%2306577C'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.22736 8.84695C6.30613 8.76818 6.35038 8.66135 6.35038 8.54996V5.30996C6.35038 5.19857 6.30613 5.09174 6.22736 5.01298C6.1486 4.93421 6.04177 4.88996 5.93038 4.88996C5.81899 4.88996 5.71216 4.93421 5.63339 5.01298C5.55463 5.09174 5.51038 5.19857 5.51038 5.30996V8.54996C5.51038 8.66135 5.55463 8.76818 5.63339 8.84695C5.71216 8.92571 5.81899 8.96996 5.93038 8.96996C6.04177 8.96996 6.1486 8.92571 6.22736 8.84695ZM5.69704 3.97918C5.76611 4.02533 5.84731 4.04996 5.93038 4.04996C5.98558 4.05012 6.04026 4.03936 6.09129 4.01831C6.14232 3.99726 6.18868 3.96633 6.22771 3.9273C6.26675 3.88827 6.29768 3.8419 6.31873 3.79088C6.33978 3.73985 6.35053 3.68516 6.35038 3.62996C6.35038 3.54689 6.32574 3.46569 6.27959 3.39662C6.23344 3.32755 6.16785 3.27372 6.0911 3.24193C6.01436 3.21014 5.92991 3.20183 5.84844 3.21803C5.76697 3.23424 5.69213 3.27424 5.63339 3.33298C5.57465 3.39171 5.53465 3.46655 5.51845 3.54802C5.50224 3.6295 5.51056 3.71394 5.54235 3.79069C5.57414 3.86743 5.62797 3.93303 5.69704 3.97918Z' fill='%2306577C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_13957_112512'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); + background-repeat: no-repeat; + background-size: 0.75rem; + background-position: 0.5rem 0.75rem; + border-radius: 0.5rem; + display: flex; + flex-direction: row; + padding: 0.5rem 0.5rem 0.5rem 1.5rem; + gap: 0.25rem; + background-color: #e4f1f7; + + .alert-heading { + text-align: left; + font-size: 0.75rem; + line-height: 1.25rem; + } + } } diff --git a/src/layouts/service-location/shop-question/shop-question.vue b/src/layouts/service-location/shop-question/shop-question.vue index 5a9278d78..7191a1f07 100644 --- a/src/layouts/service-location/shop-question/shop-question.vue +++ b/src/layouts/service-location/shop-question/shop-question.vue @@ -277,23 +277,24 @@ export default { margin-top: 0.5rem; } } -} -.drop-off-alert { - background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_13957_112512)'%3E%3Cpath d='M5.99865 0C4.81147 4.82643e-07 3.65095 0.352111 2.66392 1.01179C1.67688 1.67146 0.907678 2.60907 0.45361 3.70599C-0.000459241 4.80291 -0.11899 6.00986 0.113013 7.17415C0.345015 8.33845 0.917126 9.40778 1.75697 10.2469C2.59682 11.086 3.66666 11.6571 4.83117 11.8881C5.99567 12.119 7.20251 11.9994 8.29902 11.5443C9.39553 11.0893 10.3324 10.3192 10.9912 9.33159C11.65 8.34396 12.0011 7.18313 12 5.99594C11.9971 4.40566 11.3638 2.88142 10.2388 1.75742C9.11375 0.633431 7.58894 0.00143011 5.99865 0V0ZM5.99865 11.2478C4.96135 11.2473 3.94748 10.9392 3.08518 10.3627C2.22288 9.7861 1.55085 8.96685 1.15401 8.00846C0.75718 7.05006 0.653353 5.99554 0.855656 4.97815C1.05796 3.96077 1.55731 3.02618 2.29061 2.29251C3.0239 1.55884 3.95823 1.059 4.97551 0.856176C5.99279 0.653349 7.04737 0.756633 8.00597 1.15297C8.96457 1.54931 9.78416 2.22092 10.3612 3.08293C10.9382 3.94493 11.2467 4.95864 11.2478 5.99594C11.2478 7.38835 10.6949 8.72377 9.71053 9.70861C8.7262 10.6934 7.39106 11.2471 5.99865 11.2478V11.2478Z' fill='%2306577C'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.22736 8.84695C6.30613 8.76818 6.35038 8.66135 6.35038 8.54996V5.30996C6.35038 5.19857 6.30613 5.09174 6.22736 5.01298C6.1486 4.93421 6.04177 4.88996 5.93038 4.88996C5.81899 4.88996 5.71216 4.93421 5.63339 5.01298C5.55463 5.09174 5.51038 5.19857 5.51038 5.30996V8.54996C5.51038 8.66135 5.55463 8.76818 5.63339 8.84695C5.71216 8.92571 5.81899 8.96996 5.93038 8.96996C6.04177 8.96996 6.1486 8.92571 6.22736 8.84695ZM5.69704 3.97918C5.76611 4.02533 5.84731 4.04996 5.93038 4.04996C5.98558 4.05012 6.04026 4.03936 6.09129 4.01831C6.14232 3.99726 6.18868 3.96633 6.22771 3.9273C6.26675 3.88827 6.29768 3.8419 6.31873 3.79088C6.33978 3.73985 6.35053 3.68516 6.35038 3.62996C6.35038 3.54689 6.32574 3.46569 6.27959 3.39662C6.23344 3.32755 6.16785 3.27372 6.0911 3.24193C6.01436 3.21014 5.92991 3.20183 5.84844 3.21803C5.76697 3.23424 5.69213 3.27424 5.63339 3.33298C5.57465 3.39171 5.53465 3.46655 5.51845 3.54802C5.50224 3.6295 5.51056 3.71394 5.54235 3.79069C5.57414 3.86743 5.62797 3.93303 5.69704 3.97918Z' fill='%2306577C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_13957_112512'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); - background-repeat: no-repeat; - background-size: 0.75rem; - background-position: 0.5rem 0.75rem; - border-radius: 0.5rem; - display: flex; - flex-direction: row; - padding: 0.5rem 0.5rem 0.5rem 1.5rem; - gap: 0.25rem; + .drop-off-alert { + background: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_13957_112512)'%3E%3Cpath d='M5.99865 0C4.81147 4.82643e-07 3.65095 0.352111 2.66392 1.01179C1.67688 1.67146 0.907678 2.60907 0.45361 3.70599C-0.000459241 4.80291 -0.11899 6.00986 0.113013 7.17415C0.345015 8.33845 0.917126 9.40778 1.75697 10.2469C2.59682 11.086 3.66666 11.6571 4.83117 11.8881C5.99567 12.119 7.20251 11.9994 8.29902 11.5443C9.39553 11.0893 10.3324 10.3192 10.9912 9.33159C11.65 8.34396 12.0011 7.18313 12 5.99594C11.9971 4.40566 11.3638 2.88142 10.2388 1.75742C9.11375 0.633431 7.58894 0.00143011 5.99865 0V0ZM5.99865 11.2478C4.96135 11.2473 3.94748 10.9392 3.08518 10.3627C2.22288 9.7861 1.55085 8.96685 1.15401 8.00846C0.75718 7.05006 0.653353 5.99554 0.855656 4.97815C1.05796 3.96077 1.55731 3.02618 2.29061 2.29251C3.0239 1.55884 3.95823 1.059 4.97551 0.856176C5.99279 0.653349 7.04737 0.756633 8.00597 1.15297C8.96457 1.54931 9.78416 2.22092 10.3612 3.08293C10.9382 3.94493 11.2467 4.95864 11.2478 5.99594C11.2478 7.38835 10.6949 8.72377 9.71053 9.70861C8.7262 10.6934 7.39106 11.2471 5.99865 11.2478V11.2478Z' fill='%2306577C'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.22736 8.84695C6.30613 8.76818 6.35038 8.66135 6.35038 8.54996V5.30996C6.35038 5.19857 6.30613 5.09174 6.22736 5.01298C6.1486 4.93421 6.04177 4.88996 5.93038 4.88996C5.81899 4.88996 5.71216 4.93421 5.63339 5.01298C5.55463 5.09174 5.51038 5.19857 5.51038 5.30996V8.54996C5.51038 8.66135 5.55463 8.76818 5.63339 8.84695C5.71216 8.92571 5.81899 8.96996 5.93038 8.96996C6.04177 8.96996 6.1486 8.92571 6.22736 8.84695ZM5.69704 3.97918C5.76611 4.02533 5.84731 4.04996 5.93038 4.04996C5.98558 4.05012 6.04026 4.03936 6.09129 4.01831C6.14232 3.99726 6.18868 3.96633 6.22771 3.9273C6.26675 3.88827 6.29768 3.8419 6.31873 3.79088C6.33978 3.73985 6.35053 3.68516 6.35038 3.62996C6.35038 3.54689 6.32574 3.46569 6.27959 3.39662C6.23344 3.32755 6.16785 3.27372 6.0911 3.24193C6.01436 3.21014 5.92991 3.20183 5.84844 3.21803C5.76697 3.23424 5.69213 3.27424 5.63339 3.33298C5.57465 3.39171 5.53465 3.46655 5.51845 3.54802C5.50224 3.6295 5.51056 3.71394 5.54235 3.79069C5.57414 3.86743 5.62797 3.93303 5.69704 3.97918Z' fill='%2306577C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_13957_112512'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); + background-repeat: no-repeat; + background-size: 0.75rem; + background-position: 0.5rem 0.75rem; + border-radius: 0.5rem; + display: flex; + flex-direction: row; + padding: 0.5rem 0.5rem 0.5rem 1.5rem; + gap: 0.25rem; + background-color: #e4f1f7; - .alert-heading { - text-align: left; - font-size: 0.75rem; - line-height: 1.25rem; + .alert-heading { + text-align: left; + font-size: 0.75rem; + line-height: 1.25rem; + } } } From c1a5dcdeef1c4fe8cd3ba82ddb48e0afe4971672 Mon Sep 17 00:00:00 2001 From: Scott Kiener Date: Mon, 7 Jul 2025 12:13:08 -0400 Subject: [PATCH 2/2] CASH-814 | Styling, cleanup, auto select, CMS integration --- .../button-question/button-question.vue | 2 +- .../date-picker/date-picker.spec.js | 2 +- .../date-picker/date-picker.vue | 2 + .../time-slot-question/time-slot-question.vue | 79 +++++++++---------- 4 files changed, 40 insertions(+), 45 deletions(-) diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index dc1f50c15..2eaf204ad 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -407,7 +407,7 @@ export default { text-align: center; border-bottom: 1px solid black; line-height: 1px; - margin: 10px 0 20px; + margin: 20px 0 20px; span { background: #fff; diff --git a/src/digital-components/date-picker/date-picker.spec.js b/src/digital-components/date-picker/date-picker.spec.js index e1fbf302f..09bf21d76 100644 --- a/src/digital-components/date-picker/date-picker.spec.js +++ b/src/digital-components/date-picker/date-picker.spec.js @@ -481,7 +481,7 @@ describe("date-picker.vue", () => { }, }); const spy = jest.spyOn(wrapper.vm, "setCalendarData"); - + wrapper.vm.$refs.timeSlotModalQuestion.initializeComponent = jest.fn(); wrapper.vm.$nextTick(); // Act diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue index e008021db..8f6b35f60 100644 --- a/src/digital-components/date-picker/date-picker.vue +++ b/src/digital-components/date-picker/date-picker.vue @@ -140,6 +140,7 @@ dropoffCmsWidgetName="DropOffTimeSlotModal" sameDayDropOffCmsWidgetName="SameDayDropOffTimeSlotModal" overnightDropOffCmsWidgetName="OvernightDropOffTimeSlotModal" + dropOffOrPickATimeQuestionCmsWidgetName="DropOffOrPickATimeQuestionWidget" :selectedDate="selectedDate" :appointmentType="appointmentType" :premiumAppointmentFee="premiumAppointmentFee" @@ -292,6 +293,7 @@ export default { methods: { initializeComponent(initialData) { this.setCalendarData(initialData); + this.$refs.timeSlotModalQuestion.initializeComponent(); }, fireDateSelectedEvent(event, date) { // Ignore if arrow key selected radioButton diff --git a/src/layouts/schedule/time-slot-question/time-slot-question.vue b/src/layouts/schedule/time-slot-question/time-slot-question.vue index 2d67ddc90..80d22cae5 100644 --- a/src/layouts/schedule/time-slot-question/time-slot-question.vue +++ b/src/layouts/schedule/time-slot-question/time-slot-question.vue @@ -10,7 +10,7 @@ { - let buttonLabelValue; - if (timeSlot.id.includes(RouteCodeFlags.ALL_DAY_DROP_OFF)) { - buttonLabelValue = this.dropoffButtonText; - } else if (timeSlot.id.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)) { - buttonLabelValue = this.overnightDropoffButtonText; - } else if (this.isSameDay) { - buttonLabelValue = this.sameDayDropoffButtonText; - } else { - buttonLabelValue = militaryToTwelveHourTime(timeSlot.startTime); - } - return { - value: timeSlot.id, - buttonLabel: buttonLabelValue, - }; - }); - - return availableTimeSlots; - }, getAvailableTimeSlotsForMobile(timeSlotsForSelectedDate) { const availableTimeSlots = timeSlotsForSelectedDate.map((timeSlot) => { const readableTime = `${militaryToTwelveHourTime(timeSlot.startTime)} - ${militaryToTwelveHourTime( @@ -529,27 +520,27 @@ export default { }, }; }, - getSelectedRouteCode() { - let selectedRouteCode; + setSelectedRouteCodeFromParent() { if (!this.modelValue?.timeSlot) { - selectedRouteCode = null; + return; } - + const routeCodeFromParent = this.modelValue.timeSlot.routeCode; if (this.modelValue?.isPremiumAppointment) { - selectedRouteCode = this.addPremiumFlagToInput( - this.modelValue?.timeSlot?.routeCode - ); + // Mobile Only + this.selectedAnswerForTimeSlots = this.addPremiumFlagToInput(routeCodeFromParent); } else { - selectedRouteCode = this.modelValue?.timeSlot?.routeCode; + if (this.isDropOffRouteCode(routeCodeFromParent)) { + this.selectedAnswerForDropOff = routeCodeFromParent; + } else { + this.selectedAnswerForDropOff = PICK_A_TIME_BUTTON_VALUE; + this.selectedAnswerForTimeSlots = routeCodeFromParent; + } } - - return selectedRouteCode; }, getWaitListRequestedFromStore() { return store.getters.order.customer?.waitListRequested; }, autoSelectTimeSlotIfOnlyOneIsAvailable() { - console.log(this.timeSlotsForSelectedDate.timeSlots?.length); const numberOfOptions = this.timeSlotsForSelectedDate.timeSlots?.length; if (numberOfOptions === 1) { if (this.availableTimeSlots.length > 0) { @@ -570,7 +561,6 @@ export default { if (routeCodeIncludesPremium) { routeCode = this.removePremiumFlagFromInput(routeCode); } - const timeSlot = this.timeSlotsForSelectedDate?.timeSlots?.find( (slot) => slot.id == routeCode ); @@ -611,6 +601,9 @@ export default { } }, isDropOffRouteCode(routeCode) { + if (!routeCode) { + return false; + } return ( routeCode.includes(RouteCodeFlags.ALL_DAY_DROP_OFF) || routeCode.includes(RouteCodeFlags.OVERNIGHT_DROP_OFF)