diff --git a/jest.config.js b/jest.config.js index fe6eeb04d..f808293eb 100644 --- a/jest.config.js +++ b/jest.config.js @@ -11,17 +11,9 @@ module.exports = { "!src/constants/*.js", "!src/router/**/*.js", "!src/helpers/unit-test-helper.js", - "!src/layouts/component-test/component-test.vue", - "!src/layouts/form-test/form-test.vue", - "!src/layouts/vin-lookup/vin-lookup.vue", - "!src/layouts/vehicle-damage/windshield-damage-type-question/windshield-damage-type-question.vue", "!src/layouts/vehicle-damage/windshield-options/windshield-options.vue", "!src/layouts/part-questions/**/*.vue", - "!src/layouts/reveal/**/*.vue", - "!src/layouts/estimate/**/*.vue", - // TODO REMOVE THESE AFTER WRITING UNIT TESTS - "!src/ux-components/alert/alert.vue", - "!src/helpers/validation-rules.js", + "!src/layouts/reveal/**/*.vue" // END ], // ! means exclude from coverage. testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], diff --git a/src/common-components/question-chain/question-chain.vue b/src/common-components/question-chain/question-chain.vue index ef56c4041..8ab4ea4f1 100644 --- a/src/common-components/question-chain/question-chain.vue +++ b/src/common-components/question-chain/question-chain.vue @@ -24,7 +24,6 @@ export default { name: "questionChain", data() { return { - models: Array, currentQuestion: 1, answeredQuestions: [], }; diff --git a/src/helpers/damage-helper.js b/src/helpers/damage-helper.js index 55d10738d..ed353e51b 100644 --- a/src/helpers/damage-helper.js +++ b/src/helpers/damage-helper.js @@ -19,7 +19,7 @@ export function getDamageString() { if (damageLocations.length > 1) { returnString = "match" } else { - switch(damageLocations[0]?.location) { + switch(damageLocations[0]?.glassLocation) { case "Windshield": returnString = "windshield" break; @@ -36,7 +36,7 @@ export function getDamageString() { export function getIsWindshieldOnly () { const damageLocations = store.getters.damage.glassToReplace; - const returnString = damageLocations.length === 1 && damageLocations[0]?.location === "Windshield" ? "windshield" : "glass"; + const returnString = damageLocations.length === 1 && damageLocations[0]?.glassLocation === "Windshield" ? "windshield" : "glass"; return returnString; } @@ -56,7 +56,7 @@ export async function isGlassAvailableForCarId(carId){ } for(const option of currentGlassOptions){ - if(!newGlassOptions.data[optionsMap[option.location]].availableReplacementOptions.includes(option.name)){ + if(!newGlassOptions.data[optionsMap[option.glassLocation]].availableReplacementOptions.includes(option.glassName)){ return false; } } diff --git a/src/helpers/damage-helper.spec.js b/src/helpers/damage-helper.spec.js index 2a46978dc..210bf96cc 100644 --- a/src/helpers/damage-helper.spec.js +++ b/src/helpers/damage-helper.spec.js @@ -16,7 +16,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ it("Should return match when multiple selected damage options are in the store", () => { // Arrange / Act - store.getters.damage.glassToReplace = [{location: "Windshield", name: "windshield"}, {location: "Passenger", name: "sideWindow"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Windshield", glassName: "windshield"}, {glassLocation: "Passenger", glassName: "sideWindow"}]; const damage = getDamageString(); @@ -29,7 +29,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ it("Should return windshield when Windshield is the only selected damage option in the store", () => { // Arrange / Act - store.getters.damage.glassToReplace = [{location: "Windshield", name: "windshield"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Windshield", glassName: "windshield"}]; const damage = getDamageString(); @@ -42,7 +42,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ it("Should return side window when Driver or Passenger is the only selected damage option in the store", () => { // Arrange / Act - store.getters.damage.glassToReplace = [{location: "Passenger", name: "sideWindow"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Passenger", glassName: "sideWindow"}]; const damage = getDamageString(); @@ -55,7 +55,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ it("Should return rear window when Rear is the only selected damage option in the store", () => { // Arrange / Act - store.getters.damage.glassToReplace = [{location: "Rear", name: "rear"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Rear", glassName: "rear"}]; const damage = getDamageString(); @@ -67,7 +67,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ describe("damage-helper.js", () => { it("Should return true if no mismatches between each array exist", async () => { // Arrange - store.getters.damage.glassToReplace = [{location: "Windshield", name: "windshield"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Windshield", glassName: "windshield"}]; // Act const isGlassAvailable = await isGlassAvailableForCarId(); @@ -80,7 +80,7 @@ jest.mock("@/mixins/base-mixin.js", () => ({ describe("damage-helper.js", () => { it("Should return false if any mismatches between each array exist", async () => { // Arrange - store.getters.damage.glassToReplace = [{location: "Windshield", name: "sideWindow"}]; + store.getters.damage.glassToReplace = [{glassLocation: "Windshield", glassName: "sideWindow"}]; const isGlassAvailable = await isGlassAvailableForCarId(); diff --git a/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js index d030c7c76..04bcdb366 100644 --- a/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js +++ b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.spec.js @@ -39,7 +39,7 @@ describe("addressVehiclesQuestion.vue", () => { // Act const localThis = { $emit: jest.fn() } - addressVehiclesQuestion.computed.selectedVehicleVin.set.call(localThis, 'newValue'); + addressVehiclesQuestion.computed.selectedVehicleVinAsArray.set.call(localThis, ['newValue']); // Assert expect(localThis.$emit).toBeCalledWith("update:modelValue", "newValue"); diff --git a/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue index 95d2b1fd0..0c7a75ea7 100644 --- a/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue +++ b/src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue @@ -5,7 +5,7 @@ groupName="ChooseAddressVehicle" :questionText="questionText" :answers="vehicles" - v-model="selectedVehicleVin" + v-model="selectedVehicleVinAsArray" isRequired=true :validation-rules="validationRules" /> @@ -62,16 +62,18 @@ export default { questionText() { return this.getCmsContent("VehicleConfirmationQuestion", "QuestionText"); }, - selectedVehicleVin: { + selectedVehicleVinAsArray: { get: function() { - return this.modelValue; + const modelValueAsArray = this.modelValue ? [this.modelValue] : []; + return modelValueAsArray; }, set: function(newValue) { - this.$emit("update:modelValue", newValue); + const newValueAsScalar = newValue && newValue.length > 0 ? newValue[newValue.length-1] : null; + this.$emit("update:modelValue", newValueAsScalar); } }, - selectedVehicle() { - return this.vehicles.find( ({ vin }) => vin === this.selectedVehicleVin[0] ); + selectedVehicle() { // this computed is only needed for the computed differentVehicleAlertBody text above + return this.vehicles.find( ({ vin }) => vin === this.selectedVehicleVinAsArray[this.selectedVehicleVinAsArray.length-1] ); }, }, components: { diff --git a/src/layouts/address-vehicles/address-vehicles.spec.js b/src/layouts/address-vehicles/address-vehicles.spec.js index 74b8a02bb..fcccb1d94 100644 --- a/src/layouts/address-vehicles/address-vehicles.spec.js +++ b/src/layouts/address-vehicles/address-vehicles.spec.js @@ -57,7 +57,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', }); wrapper.vm.backButtonAction(); @@ -87,7 +87,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', }); await wrapper.vm.forwardButtonAction(); @@ -117,7 +117,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', }); await wrapper.vm.forwardButtonAction(); wrapper.vm.$nextTick(); @@ -144,7 +144,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', isSelectedGlassAvailableForVehicle: false, isCarIdDifferent: true, }); @@ -176,7 +176,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', isCarIdDifferent: false, }); await wrapper.vm.resetDependentState(); @@ -194,7 +194,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', isCarIdDifferent: false, }); await wrapper.vm.resetDependentState(); @@ -213,7 +213,7 @@ describe("addressVehicles.vue", () => { // Act await wrapper.setData({ - selectedVehicleVin: ['5NMS3CADXLH233004'], + selectedVehicleVin: '5NMS3CADXLH233004', isSelectedGlassAvailableForVehicle: false, isCarIdDifferent: true, }); diff --git a/src/layouts/address-vehicles/address-vehicles.vue b/src/layouts/address-vehicles/address-vehicles.vue index c9bcb95bb..8a36bb51f 100644 --- a/src/layouts/address-vehicles/address-vehicles.vue +++ b/src/layouts/address-vehicles/address-vehicles.vue @@ -102,7 +102,7 @@ export default { }, data() { return { - selectedVehicleVin: null, + selectedVehicleVin: "", isCarIdDifferent: false, isSelectedGlassAvailableForVehicle: true, }; @@ -145,7 +145,7 @@ export default { return store.getters.pageData(fmgPageValues.ADDRESS_VEHICLES); }, selectedVehicle() { - return this.VehiclesForQuestions.find( ({ vin }) => vin === this.selectedVehicleVin[0] ); + return this.VehiclesForQuestions.find( ({ vin }) => vin === this.selectedVehicleVin ); }, }, methods: { @@ -219,10 +219,13 @@ export default { }, watch: { - selectedVehicleVin() { - // does this vehicle match the previously selected carId? - this.isCarIdDifferent = this.selectedVehicle.vehicle.carId !== store.getters.vehicle.carId; - this.$refs.funnelFooter.updateButtonText(`Continue with ${this.selectedVehicle.vehicle.year} ${this.selectedVehicle.vehicle.make} ${this.selectedVehicle.vehicle.model}`); + selectedVehicleVin: { + handler() { + // does this vehicle match the previously selected carId? + this.isCarIdDifferent = this.selectedVehicle.vehicle.carId !== store.getters.vehicle.carId; + this.$refs.funnelFooter.updateButtonText(`Continue with ${this.selectedVehicle.vehicle.year} ${this.selectedVehicle.vehicle.make} ${this.selectedVehicle.vehicle.model}`); + }, + deep: true }, }, diff --git a/src/layouts/component-test/component-test.vue b/src/layouts/component-test/component-test.vue deleted file mode 100644 index 6cc264405..000000000 --- a/src/layouts/component-test/component-test.vue +++ /dev/null @@ -1,1201 +0,0 @@ - - - diff --git a/src/layouts/estimate/estimate.vue b/src/layouts/estimate/estimate.vue index fe62d7647..0efea0a07 100644 --- a/src/layouts/estimate/estimate.vue +++ b/src/layouts/estimate/estimate.vue @@ -52,6 +52,7 @@ import { required } from "@/helpers/validation-rules"; import { errorMessages } from "@/constants/error-messages"; import { Form, defineRule } from "vee-validate"; import store from "@/store"; +import { storeMutations } from "@/constants/store-mutations"; import { vinLookupMethodSelections } from "@/constants/vin-lookup-method-selections.js"; // Define Validation Rules defineRule("option-required", required(errorMessages.OPTION_REQUIRED)); @@ -94,21 +95,22 @@ export default { ); }, forwardButtonAction() { - if (this.selectedValues[0]===vinLookupMethodSelections.MANUALVIN) { + if (this.selectedValues[0] === vinLookupMethodSelections.MANUALVIN) { + store.commit(storeMutations.UPDATE_VEHICLE_VIN, null); this.$router.navigate( this.navigationScenarios.SELECTED_MANUAL_VIN, this.$route ); return; } - if (this.selectedValues[0]===vinLookupMethodSelections.LICENSEPLATE) { + if (this.selectedValues[0] === vinLookupMethodSelections.LICENSEPLATE) { this.$router.navigate( this.navigationScenarios.SELECTED_LICENSE_PLATE, this.$route ); return; } - if (this.selectedValues[0]===vinLookupMethodSelections.HOMEADDRESS) { + if (this.selectedValues[0] === vinLookupMethodSelections.HOMEADDRESS) { this.$router.navigate( this.navigationScenarios.SELECTED_HOME_ADDRESS, this.$route diff --git a/src/layouts/form-test/form-test.vue b/src/layouts/form-test/form-test.vue deleted file mode 100644 index 8489f9558..000000000 --- a/src/layouts/form-test/form-test.vue +++ /dev/null @@ -1,244 +0,0 @@ - - - diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue index 5e2253af7..b4ae47d42 100644 --- a/src/layouts/license-plate-lookup/license-plate-lookup.vue +++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue @@ -267,8 +267,7 @@ export default { `Continue with ${vinLookup.data.vehicle.year} ${vinLookup.data.vehicle.make} ${vinLookup.data.vehicle.model}` ); this.isVinValid = true; - this.isSelectedGlassAvailableForVehicle = - await isGlassAvailableForCarId(vinLookup.data.vehicle.carId); + this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(vinLookup.data.vehicle.carId); this.$refs.funnelFooter.removeLoader(); return; } diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index 46fa7763e..fd2d9964a 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -145,8 +145,8 @@ describe("vehicle-damage.vue", () => { wrapper.vm.selectedRearReplaceOptions = ["Stationary"]; - const expectedGlassToReplace = [{ location: "Windshield", name: "Single" }, { location: "Driver", name: "Back" }, - { location: "Passenger", name: "Quarter" }, { location: "Rear", name: "Stationary" }]; + const expectedGlassToReplace = [{ glassLocation: "Windshield", glassName: "Single" }, { glassLocation: "Driver", glassName: "Back" }, + { glassLocation: "Passenger", glassName: "Quarter" }, { glassLocation: "Rear", glassName: "Stationary" }]; //Act vehicleDamage.beforeRouteEnter.call( @@ -237,7 +237,7 @@ describe("vehicle-damage.vue", () => { selectedWindshieldDamageType: ["Replace"] }; - const expectedGlassToReplace = [{ location: "Windshield", name: "Single" },]; + const expectedGlassToReplace = [{ glassLocation: "Windshield", glassName: "Single" },]; //Act vehicleDamage.beforeRouteEnter.call( diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 266e2ba1a..77b28d3be 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -314,25 +314,25 @@ export default { const selectedGlassToReplace = []; if (this.isWindshieldDamageLocation && !this.isWindshieldRepair){ this.selectedWindshieldOptions.selectedWindshieldReplaceOptions.forEach(wsItem => { - selectedGlassToReplace.push({ location: damageLocationsSelected.WINDSHIELD, name: wsItem}); + selectedGlassToReplace.push({ glassLocation: damageLocationsSelected.WINDSHIELD, glassName: wsItem}); }) } if (this.isDriverSideReplace){ this.sideDoorOptionsData.selectedDriverSideReplaceOptions.forEach(driverItem => { - selectedGlassToReplace.push({ location: damageLocationsSelected.DRIVER, name: driverItem}); + selectedGlassToReplace.push({ glassLocation: damageLocationsSelected.DRIVER, glassName: driverItem}); }) } if (this.isPassengerSideReplace){ this.sideDoorOptionsData.selectedPassengerSideReplaceOptions.forEach(passengerItem => { - selectedGlassToReplace.push({ location: damageLocationsSelected.PASSENGER, name: passengerItem}); + selectedGlassToReplace.push({ glassLocation: damageLocationsSelected.PASSENGER, glassName: passengerItem}); }) } if (this.isRearWindowDamageLocation) { this.selectedRearReplaceOptions.forEach(rearItem => { - selectedGlassToReplace.push({ location: damageLocationsSelected.REAR, name: rearItem}); + selectedGlassToReplace.push({ glassLocation: damageLocationsSelected.REAR, glassName: rearItem}); }) } diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue index b52200dd4..b3ca243f0 100644 --- a/src/layouts/vin-lookup/vin-lookup.vue +++ b/src/layouts/vin-lookup/vin-lookup.vue @@ -23,11 +23,9 @@ isRequired disableAutoFill validationRules="vin-required|vin-format" - :isDisabled="isVinFieldReadOnly" + :isDisabled="vinPopulatedOnPageLoad" maxLength="17" :mask="vinMask" - @focus="setVinTouched" - @maska="rawVinValue = $event.target.dataset.maskRawValue" /> @@ -70,10 +68,10 @@ /> 0, - initialVin: this.getVinFromStore(), - vinTouched: false, - rawVinValue: "", + isInsuranceVerified: false, }; }, mounted() { this.attachCustomEvents(); if (this.vinPopulatedOnPageLoad) { - this.setupVinMask(); + this.setupVinMask(); + this.isInsuranceVerified = store.getters.payment.insuranceCoverage.isVerified || getFunnelCookie().HasDelayedClaimRegistration; } }, watch: { @@ -210,12 +205,6 @@ export default { }, }, computed: { - perfectMatchNewVinAlert() { - const vinToCheck = this.vinTouched ? this.rawVinValue : this.initialVin; - const isVinPerfectMatch = this.vinPopulatedOnPageLoad && vinToCheck === this.getVinFromStore(); - this.updateIsCarIdDifferent(isVinPerfectMatch); - return isVinPerfectMatch; - }, MatchedDifferentVehicleAlertHeader(){ const text = this.getCmsContent("MatchedDifferentVehicle", "HeadlineText").replaceAll("{custom:damage}", getDamageString()); @@ -231,41 +220,29 @@ export default { }, NoServiceZipHeader(){ const text = this.getCmsContent("NoServiceZipWidget", "HeadlineText").replaceAll("{custom:serviceZip}", this.invalidZip); - return text; }, NoServiceZipBody(){ return this.getCmsContent("NoServiceZipWidget", "BodyText"); }, - PerfectMatchNewVinAlertHeader() { - return this.getCmsContent("PerfectMatchNewVinAlert", "HeadlineText"); + PerfectMatchInsuranceNotVerifiedAlertHeader() { + return this.getCmsContent("PerfectMatchInsuranceNotVerifiedAlert", "HeadlineText"); }, - PerfectMatchNewVinAlertBody() { - return this.getCmsContent("PerfectMatchNewVinAlert", "BodyText").replaceAll("{custom:damage}", + PerfectMatchInsuranceNotVerifiedAlertBody() { + return this.getCmsContent("PerfectMatchInsuranceNotVerifiedAlert", "BodyText").replaceAll("{custom:damage}", getDamageString()) }, - PerfectMatchNewVinAlertReadOnlyHeader () { - return this.getCmsContent("PerfectMatchNewVinAlertReadOnly", "HeadlineText"); + PerfectMatchInsuranceVerifiedAlertHeader () { + return this.getCmsContent("PerfectMatchInsuranceVerifiedAlert", "HeadlineText"); }, - PerfectMatchNewVinAlertReadOnlyBody () { - return this.getCmsContent("PerfectMatchNewVinAlertReadOnly", "BodyText").replaceAll("{custom:damage}", + PerfectMatchInsuranceVerifiedAlertBody () { + return this.getCmsContent("PerfectMatchInsuranceVerifiedAlert", "BodyText").replaceAll("{custom:damage}", getIsWindshieldOnly()) }, - isVinFieldReadOnly(){ - return this.$store.getters.payment.insuranceCoverage.isVerified || getFunnelCookie().HasDelayedClaimRegistration; - }, }, methods: { - setVinTouched() { - if (!this.vinTouched) { - this.vinMask = "XXXXXXXXXXXXXXXXX"; - this.vin = this.initialVin; - } - - this.vinTouched = true; - }, setupVinMask() { - const lastSixChars = this.initialVin.substring(11, this.initialVin.length); + const lastSixChars = this.vin.substring(11, this.vin.length); this.vinMask = `!X!X!X!X!X!X!X!X!X!X!X${lastSixChars}`; }, arePagePrerequisitesValid() { @@ -315,17 +292,16 @@ export default { let vehicleLookupResponse; const zipValidation = this.validateZip(this.zip); - - if (this.vinTouched && this.vin != this.initialVin) { - // If the user has clicked on the VIN field, either they are doing a new VIN lookup or changing the VIN previously matched. - // Therefore we need to do a Vehicle Lookup - const vinToLookup = this.vinTouched ? this.vin : this.initialVin; - const vehicleLookup = this.lookupVehicle(vinToLookup); - + + // If this is a new VIN Lookup, do both a Vehicle Lookup and a Zip Validation + if (!this.vinPopulatedOnPageLoad) { + // Perform Zip Validation zipValidationResponse = await zipValidation; + + // Perform Vehicle Lookup + const vehicleLookup = this.lookupVehicle(this.vin); vehicleLookupResponse = await vehicleLookup.catch(() => { this.vinNotFound = true; - this.$refs.funnelFooter.removeLoader(); return false; }); @@ -335,44 +311,46 @@ export default { } if (!vehicleLookupResponse || !zipValidationResponse.data.isServiceable) { + // If either lookup fails, remove the loader and stop processing the page. this.$refs.funnelFooter.removeLoader(); return; } + + this.isCarIdDifferent = vehicleLookupResponse.data.carId !== store.getters.vehicle.carId; + + if (this.isCarIdDifferent && (vehicleLookupResponse.data.carId !== this.previouslyEnteredCarId)) { + this.previouslyEnteredCarId = vehicleLookupResponse.data.carId; + this.noServiceZip = false; + this.customAlertData.vehicleInfo = vehicleLookupResponse.data; + this.$refs.funnelFooter.updateButtonText(`Continue with ${vehicleLookupResponse.data.year} ${vehicleLookupResponse.data.make} ${vehicleLookupResponse.data.model}`); + this.isVinValid = true; + this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(vehicleLookupResponse.data.carId); + this.$refs.funnelFooter.removeLoader(); + this.isCarIdDifferent = true; + return; + } + + this.updateStore(vehicleLookupResponse.data, zipValidationResponse.data); + this.navigateForward(); + } else { + // If a VIN has already been found. Validate the Service Zip (in case of changes) const zipValidationResponse = await zipValidation; - // Check if Service Zip entered is serviceable, if not display an alert - if (!zipValidationResponse.data.isServiceable) { + // Check if Service Zip entered is serviceable + if (zipValidationResponse.data.isServiceable) { + // If the Service Zip entered is serviceable then save the Zip Info and Email Address and navigate forward + store.commit(storeMutations.UPDATE_SERVICE_LOCATION_ZIP_CODE, this.zip); + store.commit(storeMutations.UPDATE_SERVICE_LOCATION_STATE, zipValidationResponse.data.state); + store.commit(storeMutations.UPDATE_CUSTOMER_EMAIL_ADDRESS, this.email); + this.navigateForward(); + } else { + // If the Service Zip is NOT serviceable then show an alert this.setupUiForNonServiceableZip(this.zip); this.$refs.funnelFooter.removeLoader(); - return; - } else { - this.navigateForward(); - return; } } - if (!vehicleLookupResponse) { - return; - } - - this.isCarIdDifferent = vehicleLookupResponse.data.carId !== store.getters.vehicle.carId; - - if (this.isCarIdDifferent && (vehicleLookupResponse.data.carId !== this.previouslyEnteredCarId)) { - this.previouslyEnteredCarId = vehicleLookupResponse.data.carId; - this.noServiceZip = false; - this.customAlertData.vehicleInfo = vehicleLookupResponse.data; - this.$refs.funnelFooter.updateButtonText(`Continue with ${vehicleLookupResponse.data.year} ${vehicleLookupResponse.data.make} ${vehicleLookupResponse.data.model}`); - this.isVinValid = true; - this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(vehicleLookupResponse.data.carId); - this.$refs.funnelFooter.removeLoader(); - this.isCarIdDifferent = true; - return; - } - - this.updateStore(vehicleLookupResponse.data, zipValidationResponse.data); - this.navigateForward(); - }, navigateForward(){ if (this.isCarIdDifferent && !this.isSelectedGlassAvailableForVehicle) { diff --git a/src/router/index.js b/src/router/index.js index 2b2d09859..1d426a9e9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -18,22 +18,7 @@ import eventBus from "@/helpers/event-bus/event-bus"; import store from "@/store"; import analyticsMixin from "@/mixins/analytics-mixin"; -// Components -import ComponentTest from "@/layouts/component-test/component-test.vue"; -import FormTest from "@/layouts/form-test/form-test.vue"; - - const routes = [ - { - path: "/component-test", // This is a temporary route for testing. - name: "ComponentTest", - component: ComponentTest, - }, - { - path: "/form-test", // This is a temporary route for testing. - name: "FormTest", - component: FormTest, - }, { path: "/", name: "root",