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

WIP

Browse source
This commit is contained in:
bmauger 2022-04-11 15:10:20 -04:00
parent 4ccda4ee93
commit 9cf7204059
3 changed files with 94 additions and 80 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/common-components/textbox-question/textbox-question.vue
View file

@ -1,25 +1,28 @@
<template>
<div class="textbox-question" :class="hasError ? 'has-error' : ''">
<div class="textbox-question" :class="[
errors.length > 0 ? 'has-error' : '',
hasError ? 'has-error' : '',
]">
<label :for="inputId" :aria-label="questionText" class="form-label" v-html="labelText"></label>
<input v-model="value"
<input v-model="value"
v-maska="mask"
:type="type"
class="form-control"
:ref="inputId"
:id="inputId"
:type="type"
class="form-control"
:ref="inputId"
:id="inputId"
:name="inputId"
:placeholder="placeholderText"
:aria-disabled="isDisabled"
:disabled="isDisabled"
:aria-required="isRequired"
autocomplete="off"
:placeholder="placeholderText"
:aria-disabled="isDisabled"
:disabled="isDisabled"
:aria-required="isRequired"
autocomplete="off"
:class="[hasIcon ? 'has-icon' : '', iconRight ? 'icon-right' : '']"
:validationRules="validationRules"
@input="handleChange"
@blur="handleBlur" />
<div v-show="errorMessage" class="row mt-2 form-test-error">
<span role="alert">{{ errorMessage }}</span>
</div>
</div>
</div>
</template>
@ -56,7 +59,7 @@ export default {
setup(props) {
const fieldOptions = {
type: "text",
value: props.modelValue,
value: props.modelValue,
};
const {
@ -64,15 +67,17 @@ export default {
handleBlur,
handleChange,
meta,
validate
validate,
errors,
} = useField(props.inputId, props.validationRules, fieldOptions);
return {
return {
errorMessage,
handleBlur,
handleChange,
validate,
meta,
meta,
errors,
};
},
computed: {
@ -86,7 +91,7 @@ export default {
set: function(newValue) {
this.$emit("update:modelValue", newValue);
}
},
},
labelText: {
get: function () {
let labelText = this.questionText;
@ -98,7 +103,7 @@ export default {
return labelText;
}
}
}
},
watch: {
value(newValue) {

2
src/helpers/heritage-integration/navigation-helper.js
View file

@ -46,7 +46,7 @@ export async function getPageToRouteExistingOrderTo(toRoute = {}, existingHerita
//return 'vehicle-damage'; //(uncomment)
return "vin-lookup"; //This may be temporary
} else {
return 'vehicle-damage';
return 'vin-lookup';
//return "estimate" (uncomment)
}
}

131
src/layouts/vin-lookup/vin-lookup.vue
View file

@ -31,59 +31,59 @@
</div>
<alert
class="my-3"
v-if="MatchedDifferentVehicle"
v-if="matchedDifferentVehicle"
alertClass="alert-danger"
:alertHeadline="MatchedDifferentVehicle.headline"
:alertCopy="MatchedDifferentVehicle.copy"
:alertHeadline="matchedDifferentVehicle.headline"
:alertCopy="matchedDifferentVehicle.copy"
/>
<alert
class="my-3"
v-if="NoMatchAlertWidget"
alertClass="alert-danger"
:alertHeadline="NoMatchAlertWidget.headline"
:alertCopy="NoMatchAlertWidget.copy"
/>
<alert
class="my-3"
v-if="NoServiceZipWidget"
v-if="noMatchAlert"
alertClass="alert-warning"
:alertHeadline="NoServiceZipWidget.headline"
:alertCopy="NoServiceZipWidget.copy"
:alertHeadline="noMatchAlertWidget.headline"
:alertCopy="noMatchAlertWidget.copy"
/>
<alert
class="my-3"
v-if="VinFoundWidget"
v-if="noServiceZip"
alertClass="alert-warning"
:alertHeadline="VinFoundWidget.headline"
:alertCopy="VinFoundWidget.copy"
:alertHeadline="noServiceZipWidget.headline"
:alertCopy="noServiceZipWidget.copy"
/>
<alert
class="my-3"
v-if="VinFoundReadOnlyWidget"
v-if="vinFound"
alertClass="alert-warning"
:alertHeadline="VinFoundReadOnlyWidget.headline"
:alertCopy="VinFoundReadOnlyWidget.copy"
:alertHeadline="vinFoundWidget.headline"
:alertCopy="vinFoundWidget.copy"
/>
<alert
class="my-3"
v-if="FoundWindshieldAlert"
v-if="vinFoundReadOnly"
alertClass="alert-warning"
:alertHeadline="FoundWindshieldAlert.headline"
:alertCopy="FoundWindshieldAlert.copy"
:alertHeadline="vinFoundReadOnlyWidget.headline"
:alertCopy="vinFoundReadOnlyWidget.copy"
/>
<alert
class="my-3"
v-if="VinNotFound"
v-if="foundWindshieldAlert"
alertClass="alert-warning"
:alertHeadline="VinNotFound.headline"
:alertCopy="VinNotFound.copy"
:alertHeadline="foundWindshieldAlertWidget.headline"
:alertCopy="foundWindshieldAlertWidget.copy"
/>
<alert
class="my-3"
v-if="PerfectMatchNewVinAlert"
v-if="vinNotFound"
alertClass="alert-warning"
:alertHeadline="PerfectMatchNewVinAlert.headline"
:alertCopy="PerfectMatchNewVinAlert.copy"
:alertHeadline="vinNotFoundWidget.headline"
:alertCopy="vinNotFoundWidget.copy"
/>
<alert
class="my-3"
v-if="perfectMatchNewVinAlert"
alertClass="alert-warning"
:alertHeadline="perfectMatchNewVinAlertWidget.headline"
:alertCopy="perfectMatchNewVinAlertWidget.copy"
/>
<funnelFooter
cmsWidgetName="FunnelFooterWidget"
@ -129,6 +129,8 @@ export default {
async beforeRouteEnter(to, from, next) {
// Call APIs
const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
// Settle promises and get results
const promiseResultMap = [
{
@ -136,24 +138,41 @@ export default {
promise: cmsContentPromise,
},
];
const resultMap = await settleAllPromises(promiseResultMap);
// Call the "next" function to complete the transition to this page.
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
vm.noServiceZipWidget = {
headline: resultMap.cmsContent.NoServiceZipWidget.HeadlineText,
copy: resultMap.cmsContent.NoServiceZipWidget.BodyText,
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.MatchedDifferentVehicle = {
headline: resultMap.cmsContent.MatchedDifferentVehicle.HeadlineText,
copy: resultMap.cmsContent.MatchedDifferentVehicle.BodyText
vm.noServiceZipWidget = {
headline: resultMap.cmsContent.NoServiceZipWidget.HeadlineText,
copy: resultMap.cmsContent.NoServiceZipWidget.BodyText
};
vm.PerfectMatchNewVinAlert = {
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
};
@ -164,15 +183,14 @@ export default {
},
data() {
return {
MatchedDifferentVehicle: false,
NoMatchAlertWidget: false,
PerfectMatchNewVinAlert: false,
NoServiceZipWidget: false,
VinFoundWidget: false,
VinFoundReadOnlyWidget: false,
FoundWindshieldAlert: false,
newServiceZipRequired: false,
VinNotFound: false,
matchedDifferentVehicle: false,
noMatchAlert: false,
noServiceZip: false,
vinFound: false,
vinFoundReadOnly: false,
foundWindshieldAlert: false,
vinNotFound: false,
perfectMatchNewVinAlert: false,
vin: '',
zip: '',
email: '',
@ -193,24 +211,18 @@ export default {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
},
async forwardButtonAction() {
const zipValidation = this.serviceZip ? await this.validateZip(this.serviceZip) : await this.validateZip(this.zip);
const zipValidation = await this.validateZip(this.zip);
console.log(zipValidation);
if (!zipValidation.data.isServiceable) {
//this.$refs.funnelFooter.removeLoader();
this.newServiceZipRequired = true;
this.$refs.funnelFooter.removeLoader();
this.noServiceZip = true;
return;
}
const vinLookup = await this.lookupVin(this.licensePlate, zipValidation.data.state).catch(() => {
const vinLookup = await this.lookupVin(this.vin).catch(() => {
this.$refs.funnelFooter.removeLoader();
this.vinNotValid = true;
return;
});
if (vinLookup.data.vehicle.carId !== store.getters.vehicle.carId) {
this.$refs.funnelFooter.updateButtonText(`Continue with ${vinLookup.data.vin} ${vinLookup.data.vehicle.year} ${vinLookup.data.vehicle.make} ${vinLookup.data.vehicle.model}`);
//this.$refs.funnelFooter.removeLoader();
this.vinDoesNotMatchCarId = true;
return;
}
const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(
this.storeActions.GET_PARTS_OR_QUESTIONS,
{
@ -240,10 +252,10 @@ export default {
{ zip }
);
},
lookupVin(plate, state) {
lookupVin(vin) {
return baseMixin.methods.dispatchNonBlockingStoreAction(
storeActions.LOOKUP_VIN_BY_PLATE,
{ licensePlate: plate, licenseState: state }
storeActions.LOOKUP_VEHICLE_BY_VIN,
{ vin }
);
},
updateStore() {
@ -260,9 +272,6 @@ export default {
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_REGISTRATION_LICENSE_PLATE, null);
store.commit(storeMutations.UPDATE_REGISTRATION_STATE, null);
store.commit(storeMutations.UPDATE_REGISTRATION_ZIP_CODE, null);
store.commit(storeMutations.UPDATE_SERVICE_LOCATION_ZIP, null);
store.commit(storeMutations.UPDATE_CUSTOMER_EMAIL_ADDRESS, null);
},