From 4797eaf649b2b20b86ab3ac4673a999d59316c6f Mon Sep 17 00:00:00 2001 From: credelinghuys Date: Tue, 10 Mar 2026 13:32:39 -0400 Subject: [PATCH 1/2] CASH-2458: Data events update for MultiLocationModal --- .../multi-location-modal.vue | 21 ++++++++++++++----- src/layouts/schedule/schedule.vue | 12 ----------- 2 files changed, 16 insertions(+), 17 deletions(-) diff --git a/src/layouts/schedule/multi-location-modal/multi-location-modal.vue b/src/layouts/schedule/multi-location-modal/multi-location-modal.vue index ef49fa2c2..85afe5211 100644 --- a/src/layouts/schedule/multi-location-modal/multi-location-modal.vue +++ b/src/layouts/schedule/multi-location-modal/multi-location-modal.vue @@ -80,7 +80,6 @@ export default { confirmedAppointment: false, multiLocationRadioButton: multiLocationRadioButton, selectedValue: null, - experimentSettings: "", }; }, methods: { @@ -124,8 +123,20 @@ export default { setIsModalOpen(isOpen) { this.isModalOpen = isOpen; }, - captureExperimentSettings(settingsString) { - this.experimentSettings = settingsString; + selectedSlotEventValue() { + const daysUntilAppointment = + (new Date(this.selectedAppointment.date) - new Date()) / (1000 * 60 * 60 * 24); + const isAM = this.selectedAppointment.timeSlot.startTime < "12:00:00"; + return ( + "AM: " + + isAM + + " | " + + "PM: " + + !isAM + + " | " + + "Days: " + + Math.ceil(daysUntilAppointment) + ); }, pushEvent() { let gaAction = this.confirmedAppointment ? this.GaActions.YES : this.GaActions.NO; @@ -143,7 +154,7 @@ export default { this.mobileAppointmentOption.date, true, null, - this.experimentSettings + this.selectedSlotEventValue() ); } else if ( this.selectedValue?.toLowerCase() === "inshop" && @@ -157,7 +168,7 @@ export default { this.inshopAppointmentOption.date, true, null, - this.experimentSettings + this.selectedSlotEventValue() ); } }, diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index 634f0c8bf..9aca972bf 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -2075,15 +2075,6 @@ export default { let maxDayRangeToShowAnyTimeslot = experimentMixin.methods.getSettingValue( experimentSettings.SHOW_NO_AVAILABILE_DAYS_MULTI_LOCATION ); - let experimentSettingsString = - "ShowPm:" + - maxDayRangeToShowPmTimeslot + - "|" + - "NoPm:" + - maxDayRangeToShowNoPmTimeslot + - "|" + - "NoAvail:" + - maxDayRangeToShowAnyTimeslot; let promotedMobileAppointment = null; let promotedInshopAppointment = null; const todaysDate = getTodayDate(); @@ -2205,9 +2196,6 @@ export default { promotedInshopAppointment ); this.$refs.multiLocationModal.openModal(); - this.$refs.multiLocationModal.captureExperimentSettings( - experimentSettingsString - ); } } } From c9e5ccff54ad208fdbdb7cd695448bf8a36f4f25 Mon Sep 17 00:00:00 2001 From: credelinghuys Date: Wed, 11 Mar 2026 14:14:46 -0400 Subject: [PATCH 2/2] Reapply "Merge pull request #3075 from Safelite/feature/CASH-1684" This reverts commit 27c7da1eb5891d761ae8267a690ee44dedc28697. --- src/assets/img/icons/alert-circle-yellow.svg | 3 ++ src/helpers/cms-content-helper.js | 11 +++++ src/layouts/schedule/schedule.vue | 42 ++++++++++++++++++-- src/ux-components/alert/alert.vue | 21 ++++++++++ 4 files changed, 73 insertions(+), 4 deletions(-) create mode 100644 src/assets/img/icons/alert-circle-yellow.svg diff --git a/src/assets/img/icons/alert-circle-yellow.svg b/src/assets/img/icons/alert-circle-yellow.svg new file mode 100644 index 000000000..904aefb98 --- /dev/null +++ b/src/assets/img/icons/alert-circle-yellow.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/helpers/cms-content-helper.js b/src/helpers/cms-content-helper.js index 727add296..450875d0f 100644 --- a/src/helpers/cms-content-helper.js +++ b/src/helpers/cms-content-helper.js @@ -343,3 +343,14 @@ export function splitCMSCopyOnParagraphTag(copy) { export function splitCMSCopyOnBR(copy) { return copy.split("
"); } + +// This function takes in a number and returns it formatted as USD currency, with or without cents depending on if the number is an integer or not. +export function formatToUSDollar(amount) { + const isInteger = amount % 1 === 0; + return new Intl.NumberFormat("en-US", { + style: "currency", + currency: "USD", + minimumFractionDigits: isInteger ? 0 : 2, + maximumFractionDigits: 2, + }).format(amount); +} diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue index 4ec065a75..c13026d36 100644 --- a/src/layouts/schedule/schedule.vue +++ b/src/layouts/schedule/schedule.vue @@ -81,6 +81,16 @@ cmsWidgetName="AlertNoShopsWidget" v-if="displayNoShopsAlert" alertClass="alert-warning" /> +

Info Icon + Warning Icon {{ alertHeadline }}

@@ -63,7 +69,9 @@ export default { name: "alert", props: { showInfoIcon: Boolean, + showWarningIcon: Boolean, showHorizontalRow: Boolean, + hasBorder: Boolean, isDismissible: Boolean, alertClass: String, /* @@ -96,6 +104,9 @@ export default { infoIcon() { return require(`@/assets/img/icons/info-circle-blue.svg`); }, + warningIcon() { + return require(`@/assets/img/icons/alert-circle-yellow.svg`); + }, pageQueryString() { return applicationConfig.PAGE_QUERYSTRING; }, @@ -211,12 +222,19 @@ export default { background-color: $yellow-100; .alert-heading { color: $yellow-600; + + .warning-icon { + height: 1rem; + } } svg { fill: $yellow-600; width: 1rem; height: 1rem; } + hr { + border-color: $yellow-800; + } } &.alert-success { background-color: $green-100; @@ -229,6 +247,9 @@ export default { height: 1rem; } } + &.bordered { + border: 1px solid; + } & p { font-size: 0.875rem; }