start of masking vin when navigating back to vin-lookup

src/layouts/vin-lookup/vin-lookup.vue

@@ -24,6 +24,8 @@
 
           <vinQuestion
             v-model="vin"
+            :isDisabled="vinPopulatedOnPageLoad"
+            :mask="vinMask"
           />
 
           <vinLocationInformation />
@@ -85,7 +87,8 @@ export default {
       activeVehicleLookupAlertType: null,
       needToLookupVehicle: true,
       vehicleFromLookup: null,
-      vin: null,
+      vin: this.getVinFromStore(),
+      vinPopulatedOnPageLoad: this.getVinFromStore()?.length > 0,
     };
   },
   provide() {
@@ -116,12 +119,23 @@ export default {
         this.vehicleFromLookup !== null
         && this.vehicleFromLookup.carId !== this.mainStore.vehicle.carId
       );
-    }
+    },
+    vinMask() {
+      if (this.vinPopulatedOnPageLoad) {
+          const lastSixChars = this.vin.substring(11, this.vin.length);
+          return `!X!X!X!X!X!X!X!X!X!X!X${lastSixChars}`;
+      } else {
+          return "XXXXXXXXXXXXXXXXX";
+      }
+    },
   },
   methods: {
     arePagePrerequisiteValid() {
       return true;
     },
+    getVinFromStore() {
+      return this.mainStore.vehicle.vin;
+    },
     backButtonAction() {
       /**
        * this.navigationScenarios comes from base-mixin
@@ -183,7 +197,7 @@ export default {
         // navigate() doesn't stop the processing flow
         return;
       }
-
+      this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.PERFECT_MATCH;
       this.mainStore.updateVehicle(this.vehicleFromLookup);
       const partsOrQuestionsResponse = await this.getPartsOrQuestions();
       if (partsOrQuestionsResponse.error) {