Rename props/data for readability

This commit is contained in:
Scott Kiener 2025-07-16 13:54:55 -04:00
parent 5f3c24fb8f
commit 1217d2d333
2 changed files with 34 additions and 34 deletions

View file

@ -106,14 +106,14 @@
</div> </div>
<shopQuestionPopup <shopQuestionPopup
v-if="isShopQuestionDisplayed" v-if="isShopQuestionDisplayed"
:preSelectedProviderNumber="selectedProvider?.providerNumber" :selectedProviderNumberFromParent="selectedProvider?.providerNumber"
:shopProviderData="shopProviderData" :shopProviderDataFromParent="shopProviderData"
@updated-serviceability="setServiceabilityDetails" @updated-serviceability="setServiceabilityDetails"
@shop-selected="onShopSelected" @shop-selected="onShopSelected"
@updated-zipcode-ctu="setZipcodeCtu" @updated-zipcode-ctu="setZipcodeCtu"
@update-shop-provider-data="shopProviderData = $event" @update-shop-provider-data="shopProviderData = $event"
@updated-contains-military-base="setContainsMilitaryBase" @updated-contains-military-base="setContainsMilitaryBase"
:zipCode="zipCode" :zipCodeFromParent="zipCode"
cmsWidgetName="YourSafeliteShopWidget" /> cmsWidgetName="YourSafeliteShopWidget" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" /> <contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" />

View file

@ -17,7 +17,7 @@
:onModalClosedCallback="onModalClosed" :onModalClosedCallback="onModalClosed"
:footerButtonText="modalFooterText" :footerButtonText="modalFooterText"
:footerButtonDisabled=" :footerButtonDisabled="
displayInvalidZipAlert || displayNoShopsAlert || !selectedProviderNumber displayInvalidZipAlert || displayNoShopsAlert || !localSelectedProviderNumber
" "
@footer-button-event="setZipCodeAndShop"> @footer-button-event="setZipCodeAndShop">
<form @submit.prevent> <form @submit.prevent>
@ -25,7 +25,7 @@
ref="serviceZipQuestion" ref="serviceZipQuestion"
class="shop-question-zipcode" class="shop-question-zipcode"
customInputId="serviceZipCode" customInputId="serviceZipCode"
v-model="newZipCode" v-model="localZipCode"
cmsWidgetName="ServiceZipQuestionWidget" cmsWidgetName="ServiceZipQuestionWidget"
@search-icon-click="onSearchZip" @search-icon-click="onSearchZip"
@keydown.enter="onSearchZip" @keydown.enter="onSearchZip"
@ -56,9 +56,9 @@
:answers="answers" :answers="answers"
groupName="chooseShop" groupName="chooseShop"
textPosition="text-start" textPosition="text-start"
v-model="selectedProviderNumber" v-model="localSelectedProviderNumber"
isRequired isRequired
:validationRules="this.selectedProviderNumber ? '' : 'option-required'" /> :validationRules="this.localSelectedProviderNumber ? '' : 'option-required'" />
<div class="show-more-shops-link"> <div class="show-more-shops-link">
<textLink <textLink
v-if="displaySeeMoreLocationsLink" v-if="displaySeeMoreLocationsLink"
@ -108,23 +108,23 @@ export default {
mixins: [baseMixin], mixins: [baseMixin],
data() { data() {
return { return {
newZipCode: this.zipCode, localZipCode: this.zipCodeFromParent,
answers: [], answers: [],
shopListButton: shopListButton, shopListButton: shopListButton,
indexOfLastShopDisplayed: 0, indexOfLastShopDisplayed: 0,
localShopProviderData: this.shopProviderData, // Why does parent manage this sometimes, but not all of the time A: to prevent another call to get providers on initial load localShopProviderData: this.shopProviderDataFromParent, // Why does parent manage this sometimes, but not all of the time A: to prevent another call to get providers on initial load
selectedProviderNumber: null, // Revisit this, maybe not too hard localSelectedProviderNumber: null, // Revisit this, maybe not too hard
displayInvalidZipAlert: false, // part of big refactor of asyn calls displayInvalidZipAlert: false, // part of big refactor of asyn calls
displayNoShopsAlert: false, // part of big refactor of asyn calls displayNoShopsAlert: false, // part of big refactor of asyn calls
}; };
}, },
props: { props: {
shopProviderData: Object, shopProviderDataFromParent: Object,
zipCode: { zipCodeFromParent: {
type: String, type: String,
default: "", default: "",
}, },
preSelectedProviderNumber: { selectedProviderNumberFromParent: {
type: String, type: String,
default: null, default: null,
}, },
@ -222,28 +222,28 @@ export default {
this.pushEventToGA(this.GaCategories.SERVICE_LOCATION, this.GaActions.MORE_LOCATIONS_CLICKED, joinedShops, true); this.pushEventToGA(this.GaCategories.SERVICE_LOCATION, this.GaActions.MORE_LOCATIONS_CLICKED, joinedShops, true);
}, },
onModalOpened() { onModalOpened() {
const preSelectedIndex = this.shopProviders.findIndex( const selectedProviderNumberFromParentIndex = this.shopProviders.findIndex(
(provider) => provider.providerNumber == this.preSelectedProviderNumber (provider) => provider.providerNumber == this.selectedProviderNumberFromParent
); );
if (preSelectedIndex > -1) { if (selectedProviderNumberFromParentIndex > -1) {
this.indexOfLastShopDisplayed = Math.ceil((preSelectedIndex + 1) / 3) * 3; this.indexOfLastShopDisplayed = Math.ceil((selectedProviderNumberFromParentIndex + 1) / 3) * 3;
} else { } else {
this.indexOfLastShopDisplayed = 3; this.indexOfLastShopDisplayed = 3;
} }
this.localShopProviderData = this.shopProviderData; this.localShopProviderData = this.shopProviderDataFromParent;
this.answers = []; this.answers = [];
this.updateShopsForZip(this.newZipCode); this.updateShopsForZip(this.localZipCode);
this.selectedProviderNumber = this.preSelectedProviderNumber; this.localSelectedProviderNumber = this.selectedProviderNumberFromParent;
if ( if (
(!this.selectedProviderNumber || (!this.localSelectedProviderNumber ||
!this.shopProviders.some( !this.shopProviders.some(
(p) => p.providerNumber == this.selectedProviderNumber (p) => p.providerNumber == this.localSelectedProviderNumber
)) && )) &&
this.shopProviders.length > 0 this.shopProviders.length > 0
) { ) {
this.selectedProviderNumber = this.shopProviders[0].providerNumber; this.localSelectedProviderNumber = this.shopProviders[0].providerNumber;
} }
}, },
closeModal() { closeModal() {
@ -256,7 +256,7 @@ export default {
event.preventDefault(); event.preventDefault();
this.resetAlerts(); this.resetAlerts();
const zipCodeData = await this.getZipCodeData( const zipCodeData = await this.getZipCodeData(
this.newZipCode, this.localZipCode,
"service-location" "service-location"
); );
if (!zipCodeData.isValid) { if (!zipCodeData.isValid) {
@ -267,7 +267,7 @@ export default {
if (this.isVehicleHeavyTruck) { if (this.isVehicleHeavyTruck) {
// check the location endpoint to verify this zip can service a heavy truck // check the location endpoint to verify this zip can service a heavy truck
const closestShops = await getClosestApplicableShops( const closestShops = await getClosestApplicableShops(
this.newZipCode, this.localZipCode,
this.carId, this.carId,
"service-location" "service-location"
); );
@ -278,10 +278,10 @@ export default {
return null; return null;
} }
} else { } else {
getShopProviderData(this.newZipCode).then(async (result) => { getShopProviderData(this.localZipCode).then(async (result) => {
this.displayNoShopsAlert = false; this.displayNoShopsAlert = false;
this.localShopProviderData = result.data; this.localShopProviderData = result.data;
this.updateShopsForZip(this.newZipCode); this.updateShopsForZip(this.localZipCode);
}); });
} }
} }
@ -299,7 +299,7 @@ export default {
} }
const selectedIndex = this.shopProviders.findIndex( const selectedIndex = this.shopProviders.findIndex(
(provider) => provider.providerNumber == this.selectedProviderNumber (provider) => provider.providerNumber == this.localSelectedProviderNumber
); );
// If not found, only show the first 3 shops // If not found, only show the first 3 shops
@ -333,10 +333,10 @@ export default {
this.answers = mappedData; this.answers = mappedData;
// 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
if ( if (
this.selectedProviderNumber && this.localSelectedProviderNumber &&
!this.answers.some((a) => String(a.value) === String(this.selectedProviderNumber)) !this.answers.some((a) => String(a.value) === String(this.localSelectedProviderNumber))
) { ) {
this.selectedProviderNumber = null; this.localSelectedProviderNumber = null;
} }
this.indexOfLastShopDisplayed = mappedData.length; this.indexOfLastShopDisplayed = mappedData.length;
this.displayNoShopsAlert = this.answers.length === 0; this.displayNoShopsAlert = this.answers.length === 0;
@ -351,11 +351,11 @@ export default {
}, },
async setZipCodeAndShop() { async setZipCodeAndShop() {
const selectedProvider = this.shopProviders.find( const selectedProvider = this.shopProviders.find(
(provider) => provider.providerNumber == this.selectedProviderNumber (provider) => provider.providerNumber == this.localSelectedProviderNumber
); );
this.resetAlerts(); this.resetAlerts();
const zipCodeData = await this.getZipCodeData(this.newZipCode, "service-location"); const zipCodeData = await this.getZipCodeData(this.localZipCode, "service-location");
if (!zipCodeData.isValid) { if (!zipCodeData.isValid) {
this.displayInvalidZipAlert = true; this.displayInvalidZipAlert = true;
@ -413,7 +413,7 @@ export default {
this.$emit("shop-selected", { this.$emit("shop-selected", {
providerNumber: selectedProvider?.providerNumber, providerNumber: selectedProvider?.providerNumber,
address: selectedProvider?.address, address: selectedProvider?.address,
searchedZip: this.newZipCode, searchedZip: this.localZipCode,
searchedState: zipCodeData.state, searchedState: zipCodeData.state,
}); });