WIP
This commit is contained in:
parent
9cf7204059
commit
e1f20ad3a8
2 changed files with 50 additions and 77 deletions
|
|
@ -31,59 +31,59 @@
|
|||
</div>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="matchedDifferentVehicle"
|
||||
alertClass="alert-danger"
|
||||
:alertHeadline="matchedDifferentVehicle.headline"
|
||||
:alertCopy="matchedDifferentVehicle.copy"
|
||||
cmsWidgetName="MatchedDifferentVehicle"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="noMatchAlert"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="noMatchAlertWidget.headline"
|
||||
:alertCopy="noMatchAlertWidget.copy"
|
||||
cmsWidgetName="NoMatchAlertWidget"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="noServiceZip"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="noServiceZipWidget.headline"
|
||||
:alertCopy="noServiceZipWidget.copy"
|
||||
cmsWidgetName="NoServiceZipWidget"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="vinFound"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="vinFoundWidget.headline"
|
||||
:alertCopy="vinFoundWidget.copy"
|
||||
cmsWidgetName="VinFoundWidget"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="vinFoundReadOnly"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="vinFoundReadOnlyWidget.headline"
|
||||
:alertCopy="vinFoundReadOnlyWidget.copy"
|
||||
cmsWidgetName="VinFoundReadOnlyWidget"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="foundWindshieldAlert"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="foundWindshieldAlertWidget.headline"
|
||||
:alertCopy="foundWindshieldAlertWidget.copy"
|
||||
cmsWidgetName="FoundWindshieldAlert"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="vinNotFound"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="vinNotFoundWidget.headline"
|
||||
:alertCopy="vinNotFoundWidget.copy"
|
||||
cmsWidgetName="VinNotFound"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-model="customAlertData"
|
||||
v-if="perfectMatchNewVinAlert"
|
||||
alertClass="alert-warning"
|
||||
:alertHeadline="perfectMatchNewVinAlertWidget.headline"
|
||||
:alertCopy="perfectMatchNewVinAlertWidget.copy"
|
||||
cmsWidgetName="PerfectMatchNewVinAlert"
|
||||
/>
|
||||
<funnelFooter
|
||||
cmsWidgetName="FunnelFooterWidget"
|
||||
|
|
@ -144,38 +144,6 @@ export default {
|
|||
// Call the "next" function to complete the transition to this page.
|
||||
next((vm) => {
|
||||
vm.setCmsContent(resultMap.cmsContent);
|
||||
vm.matchedDifferentVehicleWidget = {
|
||||
headline: resultMap.cmsContent.MatchedDifferentVehicle.HeadlineText,
|
||||
copy: resultMap.cmsContent.MatchedDifferentVehicle.BodyText
|
||||
};
|
||||
vm.noMatchAlertWidget = {
|
||||
headline: resultMap.cmsContent.NoMatchAlertWidget.HeadlineText,
|
||||
copy: resultMap.cmsContent.NoMatchAlertWidget.BodyText
|
||||
};
|
||||
vm.noServiceZipWidget = {
|
||||
headline: resultMap.cmsContent.NoServiceZipWidget.HeadlineText,
|
||||
copy: resultMap.cmsContent.NoServiceZipWidget.BodyText
|
||||
};
|
||||
vm.vinFoundWidget = {
|
||||
headline: resultMap.cmsContent.VinFoundWidget.HeadlineText,
|
||||
copy: resultMap.cmsContent.VinFoundWidget.BodyText
|
||||
};
|
||||
vm.vinFoundReadOnlyWidget = {
|
||||
headline: resultMap.cmsContent.VinFoundReadOnlyWidget.HeadlineText,
|
||||
copy: resultMap.cmsContent.VinFoundReadOnlyWidget.BodyText
|
||||
};
|
||||
vm.foundWindshieldAlertWidget = {
|
||||
headline: resultMap.cmsContent.FoundWindshieldAlert.HeadlineText,
|
||||
copy: resultMap.cmsContent.FoundWindshieldAlert.BodyText
|
||||
};
|
||||
vm.vinNotFoundWidget = {
|
||||
headline: resultMap.cmsContent.VinNotFound.HeadlineText,
|
||||
copy: resultMap.cmsContent.VinNotFound.BodyText
|
||||
};
|
||||
vm.perfectMatchNewVinAlertWidget = {
|
||||
headline: resultMap.cmsContent.PerfectMatchNewVinAlert.HeadlineText,
|
||||
copy: resultMap.cmsContent.PerfectMatchNewVinAlert.BodyText
|
||||
};
|
||||
});
|
||||
},
|
||||
props: {
|
||||
|
|
@ -194,6 +162,7 @@ export default {
|
|||
vin: '',
|
||||
zip: '',
|
||||
email: '',
|
||||
customAlertData: {},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -212,17 +181,25 @@ export default {
|
|||
},
|
||||
async forwardButtonAction() {
|
||||
const zipValidation = await this.validateZip(this.zip);
|
||||
console.log(zipValidation);
|
||||
if (!zipValidation.data.isServiceable) {
|
||||
this.customAlertData.zip = this.zip;
|
||||
this.$refs.funnelFooter.removeLoader();
|
||||
this.noServiceZip = true;
|
||||
return;
|
||||
}
|
||||
const vinLookup = await this.lookupVin(this.vin).catch(() => {
|
||||
this.$refs.funnelFooter.removeLoader();
|
||||
this.vinNotValid = true;
|
||||
this.noMatchAlert = true;
|
||||
return;
|
||||
});
|
||||
if (vinLookup.data.carId !== store.getters.vehicle.carId) {
|
||||
this.customAlertData.vehicleInfo = vinLookup.data.vehicle;
|
||||
this.$refs.funnelFooter.removeLoader();
|
||||
this.foundWindshieldAlert = true;
|
||||
return;
|
||||
}
|
||||
const carInfo = this.vinDoesNotMatchCarId ? vinLookup.data : store.getters.vehicle;
|
||||
this.updateStore(carInfo)
|
||||
const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(
|
||||
this.storeActions.GET_PARTS_OR_QUESTIONS,
|
||||
{
|
||||
|
|
@ -258,22 +235,22 @@ export default {
|
|||
{ vin }
|
||||
);
|
||||
},
|
||||
updateStore() {
|
||||
updateStore(carInfo) {
|
||||
// if(vehicleDamage){
|
||||
// store.dispatch(storeActions.RESET_DAMAGE_STATE_AND_DEPENDENCIES);
|
||||
// }
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_VIN, null);
|
||||
store.commit(storeMutations.UPDATE_YEAR, null);
|
||||
store.commit(storeMutations.UPDATE_MAKE, null);
|
||||
store.commit(storeMutations.UPDATE_MODEL, null);
|
||||
store.commit(storeMutations.UPDATE_STYLE, null);
|
||||
store.commit(storeMutations.UPDATE_CAR_ID, null);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_CATEGORY, null);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_URL, null);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_VIF_NUMBER, null);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_COLOR, null);
|
||||
store.commit(storeMutations.UPDATE_SERVICE_LOCATION_ZIP, null);
|
||||
store.commit(storeMutations.UPDATE_CUSTOMER_EMAIL_ADDRESS, null);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_VIN, this.vin);
|
||||
store.commit(storeMutations.UPDATE_YEAR, carInfo.year);
|
||||
store.commit(storeMutations.UPDATE_MAKE, carInfo.make);
|
||||
store.commit(storeMutations.UPDATE_MODEL, carInfo.model);
|
||||
store.commit(storeMutations.UPDATE_STYLE, carInfo.style);
|
||||
store.commit(storeMutations.UPDATE_CAR_ID, carInfo.carId);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_CATEGORY, carInfo.category);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_URL, carInfo.imageUrl);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_VIF_NUMBER, carInfo.imageVifNumber);
|
||||
store.commit(storeMutations.UPDATE_VEHICLE_IMAGE_COLOR, carInfo.imageColor);
|
||||
store.commit(storeMutations.UPDATE_SERVICE_LOCATION_ZIP, this.zip);
|
||||
store.commit(storeMutations.UPDATE_CUSTOMER_EMAIL_ADDRESS, this.email);
|
||||
},
|
||||
},
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -5,12 +5,7 @@
|
|||
:class="[isDismissible ? 'alert-dismissible' : '', this.alertClass]"
|
||||
>
|
||||
<p class="m-0 fw-bold small alert-heading">{{ alertHeadline }}</p>
|
||||
<span v-if="isMultiParagraph">
|
||||
<p class="m-1 text-body small" v-for="(para, index) in alertCopy" :key="index">
|
||||
{{ para }}
|
||||
</p>
|
||||
</span>
|
||||
<p class="m-0 text-body small" v-else>{{ alertCopy }}</p>
|
||||
<p class="m-0 text-body small">{{ alertCopy }}</p>
|
||||
<button
|
||||
type="button"
|
||||
class="btn-close p-2"
|
||||
|
|
@ -34,8 +29,6 @@
|
|||
export default {
|
||||
name: "alert",
|
||||
props: {
|
||||
alertHeadline: String,
|
||||
alertCopy: [Array, String],
|
||||
isDismissible: Boolean,
|
||||
/*
|
||||
alertClass class names:
|
||||
|
|
@ -45,14 +38,17 @@ export default {
|
|||
alert-info (blue)
|
||||
*/
|
||||
alertClass: String,
|
||||
cmsWidgetName: String,
|
||||
manualHeadline: String,
|
||||
manualCopy: String,
|
||||
},
|
||||
computed: {
|
||||
isMultiParagraph() {
|
||||
if (typeof this.alertCopy == "string") {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
alertHeadline(){
|
||||
return this.cmsWidgetName ? this.getCmsContent(this.cmsWidgetName, 'HeadlineText') : this.manualHeadline;
|
||||
},
|
||||
alertCopy(){
|
||||
return this.cmsWidgetName ? this.getCmsContent(this.cmsWidgetName, 'BodyText') : this.manualCopy;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue