Checking in before merging from develop

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",

src/layouts/address-lookup/address-lookup.vue

@@ -9,7 +9,7 @@
 			<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
 			<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false />
 			<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" ref="funnelSubHeader" />		
-			<customerQuestions ref="customerQuestions" v-model="customerQuestions" />
+			<customerQuestions ref="customerQuestions" v-model="customerQuestions" @change="addressChanged" />
 			<alert ref="alertVinNotFound" v-show="displayVinNotFoundAlert"
 				cmsWidgetName="AlertVinNotFoundWidget"
 				alertClass="alert-danger"
@@ -43,6 +43,7 @@
 				cmsWidgetName="FunnelFooterWidget"
 				ref="funnelFooter"
 				:isDisabled="!meta.valid"
+				@ForwardClicked="forwardButtonAction"
 			/>
 			
 		</div>
@@ -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 { storeActions } from "@/constants/store-actions";
-// import baseMixin from "@/mixins/base-mixin";
+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
+			// Look-up VIN by address
-			const vinLookup = await this.lookupVin(this.lastName, this.streetAddress, this.zip, this.state);
+			const vinLookup = await this.lookupVin(
+				this.customerQuestions.lastName, 
+				this.customerQuestions.addressQuestions.streetAddress, 
+				this.customerQuestions.addressQuestions.zip, 
+				this.customerQuestions.addressQuestions.state
+			);
 
-			if (vinLookup.isStatePermissable) {
+			// Lookup VIN(s) with the provided address
-				// State Restrictions allow lookup by address
+			if (vinLookup.vinVehicles.length == 0) {
-				if (vinLookup.vinVehicles.length == 0) {
+				// No VINs found					
-					// no VINs found
+				this.displayVinNotFoundAlert = true;					
-					this.$refs.funnelFooter.removeLoader();
+			} else if (!vinLookup.isStatePermissable) {
-					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 {
 				// 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;
 
-			}
+					
-
+				}
-
+			} else if (vinLookup.vinVehicles.length > 1) {
-			// 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;
 				return;
 			}
 
-			const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(
+			this.$refs.funnelFooter.removeLoader();
-				this.storeActions.GET_PARTS_OR_QUESTIONS,
+
-					{
+			// const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(
-						carId: store.getters.vehicle.carId,
+			// 	this.storeActions.GET_PARTS_OR_QUESTIONS,
-						glassArray: store.getters.damage.glassToReplace,
+			// 		{
-						zipCode: this.zip,
+			// 			carId: store.getters.vehicle.carId,
-						vin: vinLookup.vin
+			// 			glassArray: store.getters.damage.glassToReplace,
-					}, false
+			// 			zipCode: this.zip,
-				);
+			// 			vin: vinLookup.vin
-			this.navigateForward(partsData);
+			// 		}, false
-		},
+			// 	);
-		navigateForward(partsData){
+			// this.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);
-			}
 		},
+		// 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,

src/layouts/address-lookup/customer-questions/customer-questions.vue

@@ -1,5 +1,5 @@
 <template>
-	<addressQuestions ref="addressQuestions" v-model="customerModel.addressQuestions" :alertNotifications="alertNotifications" />
+	<addressQuestions ref="addressQuestions" v-model="customerModel.addressQuestions" :alertNotifications="alertNotifications" @update:modelValue="emitAddressChange" />
 	<div class="row my-4">
 		<div class="col">
 			<textboxQuestion cmsWidgetName="FirstNameQuestionWidget" v-model="customerModel.firstName" ref="firstName" inputId="08497a2efd9a4a73a70360ab47b4838d" disableAutoFill validationRules="first-name-required" />

src/store/index.js

@@ -253,6 +253,18 @@ export const actions = {
       },
     });
   },
+  lookupVinByAddress(context, { licenseLastName, licenseStreetAddress, licenseZip, licenseState }) {
+    return globalMethods.callHttpClient({
+      method: endpoints.LookupVinByAddress.method,
+      endpoint: endpoints.LookupVinByAddress.url,
+      payload: {
+        licenseLastName: licenseLastName, 
+        licenseStreetAddress: licenseStreetAddress,
+        licenseZip: licenseZip,
+        licenseState: licenseState
+      },
+    });
+  },  
   getVehicleMakes(context, { year }) {
     return globalMethods.callHttpClient({
       method: endpoints.GetVehicleMakes.method,