diff --git a/src/constants/endpoints.js b/src/constants/endpoints.js index 2aa1fe226..0e5b0f78a 100644 --- a/src/constants/endpoints.js +++ b/src/constants/endpoints.js @@ -47,6 +47,10 @@ const endpoints = { url: "/vehicle/api/v1/vehicle/lookup-vin-by-plate", method: "POST", }, + LookupVinByAddress: { + url: "/vehicle/api/v1/vehicle/lookup-vin-by-address", + method: "POST", + }, GetPartsOrQuestions: { url: "/parts/api/v1/parts/parts-or-questions", method: "POST", diff --git a/src/layouts/address-lookup/address-lookup.vue b/src/layouts/address-lookup/address-lookup.vue index dd98d95da..4ef9bbd6d 100644 --- a/src/layouts/address-lookup/address-lookup.vue +++ b/src/layouts/address-lookup/address-lookup.vue @@ -9,7 +9,7 @@ - + @@ -58,13 +59,18 @@ import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; import customerQuestions from "@/layouts/address-lookup/customer-questions/customer-questions"; import { Form } from "vee-validate"; +import { defineRule } from "vee-validate"; +import { required } from "@/helpers/validation-rules"; +import { regex } from "@/helpers/validation-rules"; +import { errorMessages } from "@/constants/error-messages"; // Supporting files import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; import store from "@/store"; -// import { storeActions } from "@/constants/store-actions"; -// import baseMixin from "@/mixins/base-mixin"; +import { storeActions } from "@/constants/store-actions"; +import { storeMutations } from "@/constants/store-mutations"; +import baseMixin from "@/mixins/base-mixin"; defineRule("service-zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED)); defineRule("service-zip-format", regex(/(^\d{5}$)|(^\d{5}-\d{4}$)/, errorMessages.SERVICE_ZIP_FORMAT)); @@ -102,7 +108,8 @@ export default { firstName: "", lastName: "", emailAddress: "", - } + }, + serviceZip: "", } }, methods: { @@ -122,84 +129,89 @@ export default { }, async forwardButtonAction() { + // Validate if the original zip provided is serviceable + const zipValidation = this.serviceZip ? await this.validateZip(this.serviceZip) : await this.validateZip(this.customerQuestions.addressQuestions.zip); + if (!zipValidation.data.isServiceable) { + this.displayNonServiceableZipAlert = true; + } - // look-up VIN by address - const vinLookup = await this.lookupVin(this.lastName, this.streetAddress, this.zip, this.state); + // Look-up VIN by address + const vinLookup = await this.lookupVin( + this.customerQuestions.lastName, + this.customerQuestions.addressQuestions.streetAddress, + this.customerQuestions.addressQuestions.zip, + this.customerQuestions.addressQuestions.state + ); - if (vinLookup.isStatePermissable) { - // State Restrictions allow lookup by address - if (vinLookup.vinVehicles.length == 0) { - // no VINs found - this.$refs.funnelFooter.removeLoader(); - this.displayVinNotFoundAlert = true; - } - - const zipValidation = this.serviceZip ? await this.validateZip(this.serviceZip) : await this.validateZip(this.zip); - if (!zipValidation.data.isServiceable) { - this.$refs.funnelFooter.removeLoader(); - this.displayNonServiceableZipAlert = true; - return; - } - - } else { + // Lookup VIN(s) with the provided address + if (vinLookup.vinVehicles.length == 0) { + // No VINs found + this.displayVinNotFoundAlert = true; + } else if (!vinLookup.isStatePermissable) { // State Restrictions forbid lookup by address - this.$refs.funnelFooter.removeLoader(); this.displayVinLookupByHomeAddressNotAllowedAlert = true; + } else if (vinLookup.vinVehicles.length == 1) { + // Car found does not match entered carId + if (vinLookup.data.vehicle.carId !== store.getters.vehicle.carId) { + // Alert Copy changes ("We found a <...>") + this.$refs.funnelFooter.updateButtonText(`Continue with ${vinLookup.data.vin} ${vinLookup.data.vehicle.year} ${vinLookup.data.vehicle.make} ${vinLookup.data.vehicle.model}`); + this.displayMatchedDifferentVehicleAlert = true; - } - - - // const vinLookup = await this.lookupVin(this.lastName, this.streetAddress, this.zip, this.state).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; + + } + } else if (vinLookup.vinVehicles.length > 1) { return; } - const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction( - this.storeActions.GET_PARTS_OR_QUESTIONS, - { - carId: store.getters.vehicle.carId, - glassArray: store.getters.damage.glassToReplace, - zipCode: this.zip, - vin: vinLookup.vin - }, false - ); - this.navigateForward(partsData); - }, - navigateForward(partsData){ - if(partsData.data.partsOrQuestions[0].partQuestions && partsData.data.partsOrQuestions[0].partQuestions.length > 0){ - this.$router.navigateAfterSave(this.navigationScenarios.CONTINUING_WITH_PARTS_QUESTION, this.$route, {}, {}, partsData.data); - return; - } else if((!partsData.data.partsOrQuestions[0].partQuestions || partsData.data.partsOrQuestions[0].partQuestions.length < 1) && partsData.data.partsOrQuestions[0].parts.length > 1) { - this.$router.navigateAfterSave(this.navigationScenarios.CONTINUING_WITH_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); - return; - } else { - this.$router.navigate(this.navigationScenarios.CONTINUING_WITH_SINGLE_PART, this.$route); - } + this.$refs.funnelFooter.removeLoader(); + + // const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction( + // this.storeActions.GET_PARTS_OR_QUESTIONS, + // { + // carId: store.getters.vehicle.carId, + // glassArray: store.getters.damage.glassToReplace, + // zipCode: this.zip, + // vin: vinLookup.vin + // }, false + // ); + // this.navigateForward(partsData); }, + // navigateForward(partsData){ + // if(partsData.data.partsOrQuestions[0].partQuestions && partsData.data.partsOrQuestions[0].partQuestions.length > 0){ + // this.$router.navigateAfterSave(this.navigationScenarios.CONTINUING_WITH_PARTS_QUESTION, this.$route, {}, {}, partsData.data); + // return; + // } else if((!partsData.data.partsOrQuestions[0].partQuestions || partsData.data.partsOrQuestions[0].partQuestions.length < 1) && partsData.data.partsOrQuestions[0].parts.length > 1) { + // this.$router.navigateAfterSave(this.navigationScenarios.CONTINUING_WITH_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); + // return; + // } else { + // this.$router.navigate(this.navigationScenarios.CONTINUING_WITH_SINGLE_PART, this.$route); + // } + // }, validateZip(zip) { return baseMixin.methods.dispatchNonBlockingStoreAction( storeActions.VALIDATE_ZIP, { zip }); - }, + }, lookupVin(lastName, streetAddress, zip, state) { return baseMixin.methods.dispatchNonBlockingStoreAction( storeActions.LOOKUP_VIN_BY_ADDRESS, { licenseLastName: lastName, - licenseStreetAddress: streetAddress, + licenseStreetAddress: streetAddress, licenseZip: zip, licenseState: state - } + }, false ); - }, + }, + }, + watch: { + customerQuestions: { + handler(newValue) { + // if they modify one of the lookup fields (address, city, state, zip, or lastName), then modify the button text back to “Get my personalized quote” + // TODO + }, + deep: true + } }, components: { funnelHeader, diff --git a/src/layouts/address-lookup/customer-questions/customer-questions.vue b/src/layouts/address-lookup/customer-questions/customer-questions.vue index e1c505c9e..075ac48e1 100644 --- a/src/layouts/address-lookup/customer-questions/customer-questions.vue +++ b/src/layouts/address-lookup/customer-questions/customer-questions.vue @@ -1,5 +1,5 @@