From d6762e85a85521c4c4f222ac91075558dae09b54 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Fri, 16 Jan 2026 12:20:52 -0500 Subject: [PATCH] More alert/error/etc updates --- src/constants/error-messages.js | 2 +- .../appointment-type-question.vue | 13 ++- .../service-location/service-location.vue | 110 +++++++++++------- .../shop-address/shop-address.vue | 30 ++++- src/styles/ux-variables.scss | 2 + src/ux-components/alert/alert.vue | 19 +-- 6 files changed, 119 insertions(+), 57 deletions(-) diff --git a/src/constants/error-messages.js b/src/constants/error-messages.js index ace5e564..98d19bf2 100644 --- a/src/constants/error-messages.js +++ b/src/constants/error-messages.js @@ -26,7 +26,7 @@ const errorMessages = Object.freeze({ SERVICE_ZIP_REQUIRED: 'ZIP code is required', SERVICE_ZIP_FORMAT: 'Invalid ZIP, please enter a new ZIP (5 characters)', MOBILE_SERVICE_ZIP_FORMAT: 'Invalid ZIP code', - NO_SERVICE_IN_ZIP: (zip) => `We're sorry, but we don't offer service in ${zip} at this time.`, + NO_SERVICE_IN_AREA: (area) => `We're sorry, but we don't offer service in ${area} at this time.`, PROVIDER_REQUIRED: 'Please select a provider.', INVALID_ZIP: 'The ZIP you entered was invalid. Please enter a valid ZIP.', ZIP_CODE_NOT_SERVICED_FOR_VEHICLE: 'We do not currently offer glass service for your vehicle in this ZIP code. Please try another ZIP code.', diff --git a/src/layouts/service-location/appointment-type-question/appointment-type-question.vue b/src/layouts/service-location/appointment-type-question/appointment-type-question.vue index d192a27f..f14c51c4 100644 --- a/src/layouts/service-location/appointment-type-question/appointment-type-question.vue +++ b/src/layouts/service-location/appointment-type-question/appointment-type-question.vue @@ -9,7 +9,7 @@ ref="buttonQuestion" v-model="selectedValues" customButtonQuestionId="appointmentTypeQuestion" - :answers="answersFromCms" + :answers="answersToDisplay" :groupName="groupName" :suppressError="suppressError" :validationRules="validationRules" @@ -45,8 +45,15 @@ export default { return this.getCmsContent(this.cmsWidgetName, 'QuestionText'); }, answersFromCms() { - const retCms = this.getCmsContent(this.cmsWidgetName, 'Answers'); - return retCms; + return this.getCmsContent(this.cmsWidgetName, 'Answers'); + }, + answersToDisplay() { + return this.answersFromCms + ? this.answersFromCms.filter((answer) => ( + (answer.Name === AppointmentTypeStrings.IN_SHOP) + || (answer.Name === AppointmentTypeStrings.MOBILE) + )) + : []; }, selectedValues: { get() { diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue index 9cc5f595..ab684447 100644 --- a/src/layouts/service-location/service-location.vue +++ b/src/layouts/service-location/service-location.vue @@ -13,18 +13,6 @@ - - -
- {{ appointmentQuestionText }} + {{ scheduleRecalText }} + {{ appointmentQuestionText }}
+ + +
@@ -105,6 +107,7 @@ cmsWidgetName="MobileFeeDisclaimerWidget" typeStyle="disclaimer" />
+ 0 && !foundMatch) { this.selectedProvider = providers.shopProviders[0]; } + else { + this.selectedProvider = null; + } } if (glassFees) { @@ -485,13 +502,6 @@ export default { setMobileProviderNumber(providerNumber) { this.mobileProviderNumber = providerNumber; }, - resetMobileLocation() { - this.streetAddress = ''; - this.streetAddress2 = ''; - this.city = ''; - - this.isVehicleProtected = null; - }, setServiceabilityDetails(serviceabilityDetails) { this.isGlassServiceableInshop = serviceabilityDetails.isGlassServiceableInshop; @@ -501,6 +511,9 @@ export default { serviceabilityDetails.isGlassServiceableMobile; this.isRecalibrationServiceableMobile = serviceabilityDetails.isRecalibrationServiceableMobile; + if (!this.isServiceableMobile) { + this.selectedAppointmentType = AppointmentTypeStrings.IN_SHOP; + } }, async updateMobileZip() { this.mobileZipError = ''; @@ -510,8 +523,10 @@ export default { if (!zipCodeData.isValid) { this.mobileZipError = errorMessages.INVALID_ZIP; } else if (!zipCodeData.isServiceable) { - this.mobileZipError = errorMessages.NO_SERVICE_IN_ZIP(this.mobileZipCode); + this.mobileZipError = errorMessages.NO_SERVICE_IN_AREA(toTitleCase(zipCodeData.city)); } else { + console.log('zipCodeData:', zipCodeData); + this.city = zipCodeData.city; this.zipCode = this.mobileZipCode; this.setCtuForMobile(zipCodeData.zipCodeCtu); this.setContainsMilitaryBase(zipCodeData.containsMilitaryBase); @@ -532,6 +547,9 @@ export default { if(providers.shopProviders.length > 0) { this.selectedProvider = providers.shopProviders[0]; } + else { + this.selectedProvider = null; + } } }); } @@ -539,6 +557,8 @@ export default { async handleInShopZipUpdated(newZip) { this.zipCode = newZip; const zipCodeData = await getZipCodeData(this.zipCode); + console.log('zipCodeData:', zipCodeData); + this.city = zipCodeData.city; this.setCtuForMobile(zipCodeData.zipCodeCtu); this.setContainsMilitaryBase(zipCodeData.containsMilitaryBase); @@ -547,7 +567,6 @@ export default { const details = result.data; if (details) { this.setServiceabilityDetails(details); - this.showMobileOption = this.isServiceableMobile; } }); } @@ -589,6 +608,11 @@ $page-side-padding: 1.5rem; margin-bottom: 1rem; font-size: 1rem; line-height: 1.625rem; + flex-direction: column; + .recal-text { + margin-bottom: 1.25rem; + font-weight: $font-weight-bold; + } } .mobile-service-zip-question { :deep(.form-test-error span) { diff --git a/src/layouts/service-location/shop-address/shop-address.vue b/src/layouts/service-location/shop-address/shop-address.vue index cf7239f6..6b4d7402 100644 --- a/src/layouts/service-location/shop-address/shop-address.vue +++ b/src/layouts/service-location/shop-address/shop-address.vue @@ -6,7 +6,9 @@ class="shop-address" aria-live="polite">
{{ questionText }}
-
+
{{ displayedShopName }} {{ modelValue.distanceInMiles?.toFixed(2) }} mi @@ -16,10 +18,22 @@ {{ getProviderCityZipState(modelValue) }}
+
+ {{ `No shops found within 100 miles of ${internalZipcode}` }} +
+