Make last alert a computed

This commit is contained in:
Scott Kiener 2025-07-17 13:49:06 -04:00
parent 5b8d92fa74
commit 7341f0a88e

View file

@ -13,8 +13,8 @@
<modal <modal
ref="shopQuestionModal" ref="shopQuestionModal"
:headerText="modalHeaderText" :headerText="modalHeaderText"
:onModalClosedCallback="onModalClosed"
:onModalOpenedCallback="updateSelectedAnswer" :onModalOpenedCallback="updateSelectedAnswer"
:onModalClosedCallback="resetZipCodeData"
:footerButtonText="modalFooterText" :footerButtonText="modalFooterText"
:footerButtonDisabled="isModalFooterButtonDisabled" :footerButtonDisabled="isModalFooterButtonDisabled"
@footer-button-event="setZipCodeAndShop"> @footer-button-event="setZipCodeAndShop">
@ -108,7 +108,6 @@ export default {
numberOfShopsToDisplay: 0, numberOfShopsToDisplay: 0,
localShopProviderData: this.shopProviderDataFromParent, localShopProviderData: this.shopProviderDataFromParent,
localSelectedProviderNumber: null, localSelectedProviderNumber: null,
displayNoShopsAlert: false, // part of big refactor of asyn calls
zipCodeData: null, zipCodeData: null,
}; };
}, },
@ -139,6 +138,9 @@ export default {
displayInvalidZipAlert() { displayInvalidZipAlert() {
return this.zipCodeData && !this.zipCodeData.isValid; return this.zipCodeData && !this.zipCodeData.isValid;
}, },
displayNoShopsAlert() {
return !this.shopProviders.length && !this.displayInvalidZipAlert;
},
modal() { modal() {
return this.$refs.shopQuestionModal; return this.$refs.shopQuestionModal;
}, },
@ -187,6 +189,7 @@ export default {
methods: { methods: {
openModal() { openModal() {
// Reset local state from parent // Reset local state from parent
this.zipCodeData = null;
this.localShopProviderData = this.shopProviderDataFromParent; this.localShopProviderData = this.shopProviderDataFromParent;
this.localZipCode = this.zipCodeFromParent; this.localZipCode = this.zipCodeFromParent;
// This will be set once the modal is open (updateSelectedAnswer()) to ensure that the // This will be set once the modal is open (updateSelectedAnswer()) to ensure that the
@ -244,12 +247,8 @@ export default {
closeModal() { closeModal() {
this.modal.closeModal(); this.modal.closeModal();
}, },
onModalClosed() {
this.resetAlerts();
},
async onSearchZip(event) { async onSearchZip(event) {
event.preventDefault(); event.preventDefault();
this.resetAlerts();
this.zipCodeData = await this.getZipCodeData(this.localZipCode, "service-location"); this.zipCodeData = await this.getZipCodeData(this.localZipCode, "service-location");
// Add zipCode to zipCodeData as it does not come back from endpoint // Add zipCode to zipCodeData as it does not come back from endpoint
this.zipCodeData.zipCode = this.localZipCode; this.zipCodeData.zipCode = this.localZipCode;
@ -263,12 +262,11 @@ export default {
); );
if (!closestShops || closestShops.providers?.length === 0) { if (!closestShops || closestShops.providers?.length === 0) {
this.displayNoServiceAlert = true; // We need an alert for heavy trucks
return null; return null;
} }
} else { } else {
getShopProviderData(this.localZipCode).then(async (result) => { getShopProviderData(this.localZipCode).then(async (result) => {
this.displayNoShopsAlert = false;
this.localShopProviderData = result.data; this.localShopProviderData = result.data;
this.numberOfShopsToDisplay = 3; this.numberOfShopsToDisplay = 3;
this.updateShopsForZip(); this.updateShopsForZip();
@ -278,8 +276,6 @@ export default {
}, },
updateShopsForZip() { updateShopsForZip() {
if (!this.shopProviders.length) { if (!this.shopProviders.length) {
this.displayNoShopsAlert = true;
this.displaySeeMoreLocationsLink = false;
return; return;
} }
if ( if (
@ -290,11 +286,6 @@ export default {
this.localSelectedProviderNumber = null; this.localSelectedProviderNumber = null;
} }
// I think we should call our new pushGA Event here with new mapped data // I think we should call our new pushGA Event here with new mapped data
this.displayNoShopsAlert = this.answers.length === 0;
},
resetAlerts() {
this.displayNoServiceAlert = false;
this.displayNoShopsAlert = false;
}, },
async setZipCodeAndShop() { async setZipCodeAndShop() {
const selectedProvider = this.shopProviders.find( const selectedProvider = this.shopProviders.find(