From 15115716a92c254450bad5f6060614e68fb78a54 Mon Sep 17 00:00:00 2001
From: Kroell <Katie.Kroell@safelite.com>
Date: Tue, 17 Jan 2023 16:31:45 -0500
Subject: [PATCH] updates to navigation

---
 .../license-plate-lookup.vue                  | 87 +++++++++++++------
 src/store/index.js                            |  2 +-
 2 files changed, 60 insertions(+), 29 deletions(-)

diff --git a/src/layouts/license-plate-lookup/license-plate-lookup.vue b/src/layouts/license-plate-lookup/license-plate-lookup.vue
index c59d327a..936e4987 100644
--- a/src/layouts/license-plate-lookup/license-plate-lookup.vue
+++ b/src/layouts/license-plate-lookup/license-plate-lookup.vue
@@ -10,8 +10,23 @@
         :display-generic-vehicle-image="false" />
       <siteSubHeader cms-widget-name="SiteSubHeaderWidget" />
       <div class="fade-on-route-transition sub-container make-tall mt-5">
-        <licensePlateLookupAlerts
-          :activeAlertType="activeVehicleLookupAlertType"
+        <alert
+            ref="alertVinNotFound"
+            v-if="displayVinNotFoundAlert"
+            class="mb-4"
+            cmsWidgetName="AlertVinNotFoundWidget"
+            alertClass="alert-danger"
+            v-bind:isDismissible="false" 
+        />
+        <alert
+            ref="alertMatchedDifferentVehicle"
+            v-if="displayMatchedDifferentVehicleAlert"
+            class="mb-4"
+            cmsWidgetName="AlertMatchedDifferentVehicleWidget"
+            :manualHeadline="AlertMatchedDifferentVehicleHeader"
+            :manualCopy="AlertMatchedDifferentVehicleBody"
+            alertClass="alert-warning"
+            v-bind:isDismissible="false" 
         />
         <textboxQuestion
           cmsWidgetName="LicensePlateNumberQuestionWidget"
@@ -42,7 +57,6 @@
 </template>
 <script>
 // Import Supporting Files
-import { computed } from 'vue';
 import vehicleLookupAlertTypes from '@/constants/vehicle-lookup-alert-types';
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { settleAllPromises } from '@/helpers/layout-helper';
@@ -50,7 +64,7 @@ import { useMainStore } from '@/store';
 import { errorMessages } from "@/constants/error-messages";
 import { required, regex } from "@/helpers/validation-rules";
 import { defineRule } from "vee-validate";
-import { isGlassAvailableForCarId } from '@/helpers/damage-helper.js';
+import { getDamageString, isGlassAvailableForCarId } from '@/helpers/damage-helper.js';
 import { routerParams } from '@/router/router-params.js'
 
 // Import Component
@@ -63,6 +77,7 @@ import siteSubHeader from '@/common-components/site-sub-header/site-sub-header.v
 import vehicleBanner from '@/common-components/vehicle-banner/vehicle-banner.vue';
 import textboxQuestion from '@/common-components/textbox-question/textbox-question.vue';
 import licensePlateLookupAlerts from '@/layouts/license-plate-lookup/license-plate-lookup-alerts/license-plate-lookup-alerts.vue';
+import alert from "@/ux-components/alert/alert";
 
 // Define Validation Rules
 defineRule("license-plate-required", required(errorMessages.LICENSE_PLATE_REQUIRED));
@@ -96,7 +111,9 @@ export default {
       activeVehicleLookupAlertType: null,
       vehicleFromLookup: null,
       licensePlate: null, 
+      licenseState: null,
       registrationZipCode: null,
+      serviceZipCode: this.serviceZipCode,
       displayVinNotFoundAlert: false,
       displayMatchedDifferentVehicleAlert: false,
       previouslyEnteredCarId: "",
@@ -127,58 +144,72 @@ export default {
     async forwardButtonAction() {
       this.resetWarningsAndErrors();
 
-      // Lookup vin
-      const vinLookupResponse = useMainStore().lookupVinByPlate({
-          licensePlate: this.licensePlate,
-      }
-      ).catch(() => {
-          // No VIN found
-          this.displayVinNotFoundAlert = true;
-          return this.$refs.siteFooter.removeLoader();
-      });
-      // If no VIN was found, stop processing after displaying alert
-      if (!vinLookupResponse) {
-          return;
-      }
-
+      // Lookup VIN
+      const vinLookupResponse = useMainStore().lookupVinByPlate(
+          this.licensePlate, this.licenseState);
+      const registrationZipValidationResponse = useMainStore().validateZip( { zip: this.registrationZipCode });
+          
       // Settle promises and get results
       const promiseResultMap = [
         {
           resultKey: "vinLookupResponse",
           promise: vinLookupResponse,
         },
+        {
+          resultKey: "registrationZipValidationResponse",
+          promise: registrationZipValidationResponse,
+        },
+        {
+          // If serviceZipCode is not set, then sets the response to the registrationZipValidationResponse. Calls VALIDATE_ZIP if the serviceZipCode is set.
+          resultKey: "serviceZipValidationResponse",
+          promise: this.serviceZipCode
+              ? useMainStore().validateZip({zip: this.serviceZipCode})
+              : registrationZipValidationResponse,
+        },
       ];
 
       const resultMap = await settleAllPromises(promiseResultMap);
+      
+      // No VIN found
+      if (resultMap.vinLookupResponse.error) {
+          this.displayVinNotFoundAlert = true;
+          return this.$refs.siteFooter.removeLoader();
+      }
+      // If no VIN was found, stop processing after displaying alert
+      if (!resultMap.vinLookupResponse) {
+          return;
+      }
+      
+      const vehicleFromLookup = resultMap.vinLookupResponse.vehicle;
 
       // Check if the CarId has changed.
       this.isCarIdDifferent =
-                vinLookupResponse.vehicle.carId !== useMainStore().order.vehicle.carId;
+          vehicleFromLookup.carId !== useMainStore().order.vehicle.carId;
       // Handle changing car
       if (
           this.isCarIdDifferent &&
-          vinLookupResponse.data.carId !== this.previouslyEnteredCarId
+          vehicleFromLookup.carId !== this.previouslyEnteredCarId
       ) {
           // Display Alert
-          this.previouslyEnteredCarId = vinLookupResponse.data.vehicle.carId;
-          this.customAlertData.vehicleInfo = vinLookupResponse.data.vehicle;
+          this.previouslyEnteredCarId = vehicleFromLookup.carId;
+          this.customAlertData.vehicleInfo = vehicleFromLookup;
           this.displayMatchedDifferentVehicleAlert = true;
           this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(
-              vinLookupResponse.data.vehicle.carId
+              vehicleFromLookup.carId
           );
 
           // Update button "Continue with..."
           this.$refs.siteFooter.updateButtonText(
-              `Continue with ${vinLookup.data.vehicle.year} ${vinLookup.data.vehicle.make} ${vinLookup.data.vehicle.model}`
+              `Continue with ${vehicleFromLookup.year} ${vehicleFromLookup.make} ${vehicleFromLookup.model}`
           );
           return this.$refs.siteFooter.removeLoader();
       }
 
-      // Save vehicle, customer, service and registration information
+      // Save vehicle, license plate, and registration information
       await useMainStore().saveRegistrationLicensePlateLookup(
           {
               isSelectedGlassAvailableForVehicle: this.isSelectedGlassAvailableForVehicle,
-              vehicleInfo: Object.assign(vinLookup.data.vehicle, { vin: vinLookup.data.vin }),
+              vehicleInfo: Object.assign(this.mainStore.order.vehicle),
               registrationInfo: {
                   licensePlate: this.licensePlate,
                   state: resultMap.registrationZipValidationResponse.state,
@@ -211,7 +242,7 @@ export default {
   },
   mounted() {
       this.attachCustomEvents();
-    },
+  },
   computed: {
       AlertMatchedDifferentVehicleHeader() {
             return this.getCmsContent(
@@ -249,7 +280,7 @@ export default {
     vehicleBanner,
     textboxQuestion,
     licensePlateLookupAlerts,
-    isGlassAvailableForCarId
+    alert
   },
 };
 </script>
diff --git a/src/store/index.js b/src/store/index.js
index a9a7a8cf..37cfb4c8 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -253,7 +253,7 @@ export const useMainStore = defineStore({
         });
       },
 
-      async lookupVinByPlate(licensePlate) {
+      async lookupVinByPlate(licensePlate, licenseState) {
       try {
         const response = await globalMethods.callHttpClient({
           method: endpoints.LookupVinByPlate.method,