jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Relocated mobileLocationLinkPromptId to page level so that service-zip and mobile-location are the same

Browse source
This commit is contained in:
Leah Schumann 2023-03-06 07:57:49 -05:00
parent ebbc522c1c
commit 586be19eb4
2 changed files with 36 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue
View file

@ -1,10 +1,5 @@
<template>
<div class="text-center">
<label
for="mobileLocationLinkPromptId"
:aria-label="mobileLocationLinkPromptText"
class="form-label fw-bold w-100 ps-4 pe-4 pt-4"
v-html="mobileLocationLinkPromptText"></label>
<div class="update-mobile-location-text-link">
<textLink
ref="mobileLocationLink"
@ -15,10 +10,6 @@
@click-event="openModal"
aria-label="Modal window" />
</div>
<textBlock
:customText="mobileFeeText"
cmsWidgetName="MobileFeeDisclaimerWidget"
typeStyle="caption" />
</div>
<modal
:ref="modalName"
@ -90,9 +81,6 @@ export default {
alertInvalidZipWidgetName: String,
},
computed: {
mobileLocationLinkPromptText() {
return this.getCmsContent(this.linkWidgetName, "HeaderText");
},
mobileLocationLinkText() {
if (
this.addressModel.streetAddress !== null &&
@ -111,23 +99,9 @@ export default {
modalHeaderText() {
return this.getCmsContent(this.modalWidgetName, "HeaderText");
},
mobileFeeText() {
const cmsContentText = this.getCmsContent("MobileFeeDisclaimerWidget", "Text");
return cmsContentText.replaceAll("{custom:mobileFee}", this.mobileFee);
},
modalFooterText() {
return this.getCmsContent(this.modalWidgetName, "FooterText");
},
mobileFee() {
if (!this.modelValue.mobileFeePart) {
return 0;
}
return (
this.modelValue.mobileFeePart.laborAmount +
this.modelValue.mobileFeePart.sellingPrice +
this.modelValue.mobileFeePart.kitPrice
);
},
addressModel: {
get: function () {
return this.modelValue.addressQuestions;
@ -150,7 +124,6 @@ export default {
// Reinitialize the Address Auto Complete
this.$refs.addressQuestions.setupAddressLookup();
},
resetModel() {
// Address
this.internalModel.addressQuestions.streetAddress = "";
@ -160,7 +133,6 @@ export default {
// Is Vehicle Protected
this.internalModel.isVehicleProtected = null;
},
async setMobileLocation() {
// Validate the Zip Code
const zipCodeData = await this.getZipCodeData(

42
src/layouts/service-location/service-location.vue
View file

@ -10,11 +10,21 @@
ref="serviceZipCodeQuestion"
linkWidgetName="ServiceZipLinkWidget"
modalWidgetName="ServiceZipModalWidget" />
<div class="text-center">
<label
for="mobileLocationLinkPromptId"
:aria-label="mobileLocationLinkPromptText"
class="form-label fw-bold w-100 ps-4 pe-4 pt-4"
v-html="mobileLocationLinkPromptText"></label>
</div>
<mobileLocationModalQuestions
v-model="mobileLocationQuestions"
ref="mobileLocationModalQuestions"
linkWidgetName="MobileLocationLinkWidget"
modalWidgetName="MobileLocationModalWidget" />
<div class="text-center">
<textBlock :customText="mobileFeeDisclaimerText" typeStyle="caption" />
</div>
<funnel-footer
cmsWidgetName="FunnelFooterWidget"
ref="funnelFooter"
@ -39,6 +49,7 @@ import { settleAllPromises } from "@/helpers/layout-helper";
import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
import { getPricedMobileFeePart } from "@/helpers/service-location-helper";
import store from "@/store";
import textBlock from "@/digital-components/text-block/text-block";
export default {
name: "service-location",
@ -112,19 +123,37 @@ export default {
zipCode: this.zipCode,
},
isVehicleProtected: this.isVehicleProtected,
mobileFeePart: this.mobileFeePart
mobileFeePart: this.mobileFeePart,
};
},
set: function (newValue) {
this.streetAddress = newValue.addressQuestions.streetAddress;
this.apartmentNumberOrBusinessName = newValue.addressQuestions.apartmentNumberOrBusinessName,
this.apartmentNumberOrBusinessName =
newValue.addressQuestions.apartmentNumberOrBusinessName;
this.city = newValue.addressQuestions.city;
this.state = newValue.addressQuestions.state;
this.zipCode = newValue.addressQuestions.zipCode;
this.isVehicleProtected = newValue.isVehicleProtected,
this.isVehicleProtected = newValue.isVehicleProtected;
this.mobileFeePart = newValue.mobileFeePart;
},
},
mobileLocationLinkPromptText() {
return this.getCmsContent("MobileLocationLinkWidget", "HeaderText");
},
mobileFeeDisclaimerText() {
const cmsContentText = this.getCmsContent("MobileFeeDisclaimerWidget", "Text");
return cmsContentText.replaceAll("{custom:mobileFee}", this.mobileFee);
},
mobileFee() {
if (!this.mobileFeePart) {
return 0;
}
return (
this.mobileFeePart.laborAmount +
this.mobileFeePart.sellingPrice +
this.mobileFeePart.kitPrice
);
},
},
methods: {
arePagePrerequisitesValid() {
@ -157,13 +186,13 @@ export default {
},
resetMobileFeePart(serviceZipCode) {
getPricedMobileFeePart(serviceZipCode).then((pricedMobileFeePart) => {
this.mobileLocationQuestions.mobileFeePart = pricedMobileFeePart;
this.mobileFeePart = pricedMobileFeePart;
});
},
resetMobileLocation(updatedServiceZipCode) {
this.streetAddress = "";
this.apartmentNumberOrBusinessName = "",
this.city = "",
this.apartmentNumberOrBusinessName = "";
this.city = "";
this.isVehicleProtected = null;
this.$refs.mobileLocationModalQuestions.resetComponent();
@ -185,6 +214,7 @@ export default {
funnelSubHeader,
Form,
loadingModal,
textBlock,
},
};
</script>