From dd1852d4c3c50306655027564f41bcdff1e8562b Mon Sep 17 00:00:00 2001 From: Matt Caimi Date: Wed, 7 May 2025 10:15:45 -0400 Subject: [PATCH] CASH-376 fix for error message appearing when address modal is open --- src/digital-components/modal/modal.vue | 2 ++ .../mobile-location-modal-questions.vue | 2 ++ .../service-location/service-location.spec.js | 14 +++++++------- src/layouts/service-location/service-location.vue | 11 +++++++++-- 4 files changed, 20 insertions(+), 9 deletions(-) diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index 74cfc0964..7b89b7e57 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -119,12 +119,14 @@ export default { }, onModalOpened() { this.onModalOpenedCallback?.(); + this.$emit("isModalOpened", true); }, onModalClosed() { this.resetButtonStyle(); this.onModalClosedCallback?.(); if (this.suppressPageScroll) document.querySelector("body").classList.remove("prevent-modal-scroll"); + this.$emit("isModalOpened", false); }, openModal() { if (this.suppressPageScroll) diff --git a/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue index ac597c72b..c72f7d4dd 100644 --- a/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue +++ b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue @@ -97,6 +97,7 @@ export default { "updated-contains-military-base", "updated-bill-to-account-number", "setMobileLocationAndProceed", + "updated-modal-opened", ], data() { return { @@ -228,6 +229,7 @@ export default { }, setModalStatus(isOpened) { this.isModalOpened = isOpened; + this.$emit("updated-modal-opened", isOpened); }, closeModal() { this.modal.closeModal(); diff --git a/src/layouts/service-location/service-location.spec.js b/src/layouts/service-location/service-location.spec.js index 3b20c69f0..3a499b2ca 100644 --- a/src/layouts/service-location/service-location.spec.js +++ b/src/layouts/service-location/service-location.spec.js @@ -343,7 +343,7 @@ describe("service-location.vue", () => { zipCode: "43054", }, isVehicleProtected: true, - isMobileSelected: true, + isMobileSelectedAndModalClosed: true, }; wrapper.vm.mobileLocationQuestions = mobileLocationQuestions; @@ -356,7 +356,7 @@ describe("service-location.vue", () => { zipCode: "61606", }, isVehicleProtected: null, - isMobileSelected: false, + isMobileSelectedAndModalClosed: false, }; // Act @@ -459,7 +459,7 @@ describe("service-location.vue", () => { zipCode: "", }, isVehicleProtected: null, - isMobileSelected: false, + isMobileSelectedAndModalClosed: false, }; wrapper.vm.mobileLocationQuestions = mobileLocationQuestions; const newMobileLocationQuestions = { @@ -471,7 +471,7 @@ describe("service-location.vue", () => { zipCode: "43054", }, isVehicleProtected: true, - isMobileSelected: true, + isMobileSelectedAndModalClosed: true, }; wrapper.vm.closeModalAction = jest.fn(); @@ -521,7 +521,7 @@ describe("service-location.vue", () => { zipCode: "", }, isVehicleProtected: null, - isMobileSelected: false, + isMobileSelectedAndModalClosed: false, mobileFeePart: null, }; wrapper.vm.mobileLocationQuestions = mobileLocationQuestions; @@ -535,7 +535,7 @@ describe("service-location.vue", () => { zipCode: "43081", }, isVehicleProtected: true, - isMobileSelected: true, + isMobileSelectedAndModalClosed: true, mobileFeePart: null, }; @@ -599,7 +599,7 @@ describe("service-location.vue", () => { zipCode: "43081", }, isVehicleProtected: "YesAnswer", - isMobileSelected: true, + isMobileSelectedAndModalClosed: true, }; wrapper.vm.closeModalAction = jest.fn(); diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue index 88cedcee2..ef27cbbb8 100644 --- a/src/layouts/service-location/service-location.vue +++ b/src/layouts/service-location/service-location.vue @@ -98,6 +98,7 @@ @updated-serviceability="setServiceabilityDetails" @updated-contains-military-base="setContainsMilitaryBase" @updated-mobile-ctu="setCtuForMobile" + @updated-modal-opened="setMobileLocationModalOpened" validationRules="mobile-location-required" ref="mobileLocationQuestions" linkWidgetName="MobileLocationLinkWidget" @@ -172,7 +173,7 @@ const MOBILE_FEE_PART_TYPE = "MOBILE FEE"; // DEFINE VALIDATION RULES defineRule("mobile-location-required", (value) => { if ( - value.isMobileSelected && + value.isMobileSelectedAndModalClosed && (!value.addressQuestions.streetAddress || !value.addressQuestions.city || !value.addressQuestions.state || @@ -211,6 +212,7 @@ export default { billToAccountNumber: null, shopProviderData: null, navigatingForward: false, + mobileLocationModalOpened: false, }; }, async beforeRouteEnter(to, from, next) { @@ -301,7 +303,9 @@ export default { zipCode: this.zipCode, }, isVehicleProtected: this.isVehicleProtected, - isMobileSelected: this.selectedAppointmentType === "Mobile", + isMobileSelectedAndModalClosed: + this.selectedAppointmentType === "Mobile" && + !this.mobileLocationModalOpened, }; }, }, @@ -502,6 +506,9 @@ export default { setRecycleFeePart(recycleFeePart) { this.recycleFeePart = recycleFeePart; }, + setMobileLocationModalOpened(isModalOpened) { + this.mobileLocationModalOpened = isModalOpened; + }, //creating async function as the computed property can not directly handle asynchronous operations or promises. async setMobileLocationQuestions(newValue) { var newZipCode = newValue.addressQuestions.zipCode;