Make answers a computed
This commit is contained in:
parent
10ca9ce8ba
commit
8889e59352
1 changed files with 24 additions and 35 deletions
|
|
@ -91,10 +91,7 @@ import baseMixin from "@/mixins/base-mixin.js";
|
||||||
import { AppointmentTypeStrings } from "@/constants/schedule-constants";
|
import { AppointmentTypeStrings } from "@/constants/schedule-constants";
|
||||||
|
|
||||||
import {
|
import {
|
||||||
getPricedMobileFeePart,
|
|
||||||
getPricedRecycleFeePart,
|
|
||||||
getServiceabilityDetails,
|
getServiceabilityDetails,
|
||||||
getBillToAccountNumber,
|
|
||||||
getClosestApplicableShops,
|
getClosestApplicableShops,
|
||||||
getShopProviderData,
|
getShopProviderData,
|
||||||
} from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
|
} from "@/layouts/service-location/helpers/service-location-helper/service-location-helper";
|
||||||
|
|
@ -107,11 +104,10 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
localZipCode: this.zipCodeFromParent,
|
localZipCode: this.zipCodeFromParent,
|
||||||
answers: [],
|
|
||||||
shopListButton: shopListButton,
|
shopListButton: shopListButton,
|
||||||
numberOfShopsToDisplay: 0,
|
numberOfShopsToDisplay: 0,
|
||||||
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
|
localShopProviderData: this.shopProviderDataFromParent,
|
||||||
localSelectedProviderNumber: null, // Revisit this, maybe not too hard
|
localSelectedProviderNumber: null,
|
||||||
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
|
||||||
zipCodeData: null,
|
zipCodeData: null,
|
||||||
|
|
@ -165,6 +161,26 @@ export default {
|
||||||
!this.localSelectedProviderNumber
|
!this.localSelectedProviderNumber
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
answers() {
|
||||||
|
const updatedProvidersToDisplay = this.shopProviders.slice(0, this.numberOfShopsToDisplay);
|
||||||
|
return updatedProvidersToDisplay.map(
|
||||||
|
(shopProvider) => {
|
||||||
|
const streetAddress = this.toTitleCase(shopProvider.address.streetAddress);
|
||||||
|
const city = this.toTitleCase(shopProvider.address.city);
|
||||||
|
const state = shopProvider.address.state;
|
||||||
|
const zipCode = shopProvider.address.zipCode;
|
||||||
|
const distanceInMiles = Math.round(shopProvider.distanceInMiles * 2) / 2;
|
||||||
|
|
||||||
|
return {
|
||||||
|
buttonLabel: city,
|
||||||
|
buttonLabelSubCopy: `${distanceInMiles} mi`,
|
||||||
|
buttonBodyCopy: `${streetAddress}, ${city}, ${state} ${zipCode}`,
|
||||||
|
additionalButtonData: this.additionalButtonData,
|
||||||
|
value: shopProvider.providerNumber,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
openModal() {
|
openModal() {
|
||||||
|
|
@ -197,37 +213,11 @@ export default {
|
||||||
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
updateShopListWithNextShops(numberToGet = 3) {
|
updateShopListWithNextShops() {
|
||||||
//gaAction = this.GaActions.SHOPS_FIRST_DISPLAYED; --This needs to actually fire on initial display, can never happen here
|
//gaAction = this.GaActions.SHOPS_FIRST_DISPLAYED; --This needs to actually fire on initial display, can never happen here
|
||||||
|
this.numberOfShopsToDisplay += 3;
|
||||||
this.updateShopAnswersFromProviderList({ extraShopsToDisplay: 3 });
|
|
||||||
this.pushShopsDisplayedGAEvent(this.answers);
|
this.pushShopsDisplayedGAEvent(this.answers);
|
||||||
},
|
},
|
||||||
updateShopAnswersFromProviderList({ extraShopsToDisplay }) {
|
|
||||||
const indexOfLastShopToReturn = this.numberOfShopsToDisplay + extraShopsToDisplay;
|
|
||||||
const updatedProvidersToDisplay = this.shopProviders.slice(0, indexOfLastShopToReturn);
|
|
||||||
this.numberOfShopsToDisplay = updatedProvidersToDisplay.length;
|
|
||||||
|
|
||||||
const shopAnswersToDisplayFromProviderList = updatedProvidersToDisplay.map(
|
|
||||||
(shopProvider) => {
|
|
||||||
const streetAddress = this.toTitleCase(shopProvider.address.streetAddress);
|
|
||||||
const city = this.toTitleCase(shopProvider.address.city);
|
|
||||||
const state = shopProvider.address.state;
|
|
||||||
const zipCode = shopProvider.address.zipCode;
|
|
||||||
const distanceInMiles = Math.round(shopProvider.distanceInMiles * 2) / 2;
|
|
||||||
|
|
||||||
return {
|
|
||||||
buttonLabel: city,
|
|
||||||
buttonLabelSubCopy: `${distanceInMiles} mi`,
|
|
||||||
buttonBodyCopy: `${streetAddress}, ${city}, ${state} ${zipCode}`,
|
|
||||||
additionalButtonData: this.additionalButtonData,
|
|
||||||
value: shopProvider.providerNumber,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
this.answers = shopAnswersToDisplayFromProviderList;
|
|
||||||
},
|
|
||||||
pushShopsDisplayedGAEvent(nextShopListAnswers) {
|
pushShopsDisplayedGAEvent(nextShopListAnswers) {
|
||||||
var shops = nextShopListAnswers.map((shop) => {
|
var shops = nextShopListAnswers.map((shop) => {
|
||||||
if (shop.value.length > 5 && shop.value.startsWith("00")) {
|
if (shop.value.length > 5 && shop.value.startsWith("00")) {
|
||||||
|
|
@ -287,7 +277,6 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
updateShopsForZip() {
|
updateShopsForZip() {
|
||||||
this.updateShopAnswersFromProviderList({ extraShopsToDisplay: 0 });
|
|
||||||
if (!this.shopProviders.length) {
|
if (!this.shopProviders.length) {
|
||||||
this.displayNoShopsAlert = true;
|
this.displayNoShopsAlert = true;
|
||||||
this.displaySeeMoreLocationsLink = false;
|
this.displaySeeMoreLocationsLink = false;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue