diff --git a/src/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue b/src/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue
index f9be7ede..495881b9 100644
--- a/src/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue
+++ b/src/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue
@@ -3,15 +3,20 @@
id="vin-lookup-alerts-wrapper"
:class="wrapperCssClass">
+ v-if="isVehicleNotFoundVisible"
+ class="mt-5" />
+ v-if="isTwoIdenticalYMMVehicleFoundVisible"
+ class="mt-5" />
+ v-else-if="isVehicleNotMatchedVisible"
+ class="mt-5" />
+ v-else-if="isPerfectMatchVisible"
+ class="mt-5" />
+ v-else-if="isNoServiceVisible"
+ class="mt-5" />
+
+
diff --git a/src/layouts/vin-lookup/vin-lookup.vue b/src/layouts/vin-lookup/vin-lookup.vue
index 6585d865..e4b5ea85 100644
--- a/src/layouts/vin-lookup/vin-lookup.vue
+++ b/src/layouts/vin-lookup/vin-lookup.vue
@@ -13,13 +13,12 @@
+ class="mt-4" />
@@ -48,6 +47,7 @@ import { isGlassAvailableForCarId } from '@/helpers/damage-helper';
import settleAllPromises from '@/helpers/layout-helper';
import routerParams from '@/router/router-constants/router-params';
import { useMainStore } from '@/store';
+import showIssLoadingModal from '@/helpers/loading-modal-helper.js';
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
@@ -140,7 +140,9 @@ export default {
// TODO: Side effects in computed.
if (this.vinPopulatedOnPageLoad) {
// TODO: Modify to remove side effects in computed
+ // eslint-disable-next-line vue/no-side-effects-in-computed-properties
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.PERFECT_MATCH;
+ // eslint-disable-next-line vue/no-side-effects-in-computed-properties
this.needToLookupVehicle = false;
const lastSixChars = this.vin.substring(11, this.vin.length);
return `!X!X!X!X!X!X!X!X!X!X!X${lastSixChars}`;
@@ -174,6 +176,7 @@ export default {
this.resetActiveAlert();
// Temp solution to reset the 'disabled' style on the Continue button
this.$refs.siteFooter.enableForwardAction();
+ showIssLoadingModal(true);
if (this.needToLookupVehicle) {
const vehicleLookupResponse = await this.lookupVehicleByVin(this.vin);
@@ -186,6 +189,7 @@ export default {
// because the form itself actually passes its client-side validation.
// SSR-189 Scenario #4.
this.$refs.siteFooter.enableForwardAction();
+ showIssLoadingModal(false);
return;
}
@@ -193,6 +197,7 @@ export default {
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NO_SERVICE;
this.resetVehicleFromLookup();
this.$refs.siteFooter.disableForwardButton();
+ showIssLoadingModal(false);
return;
}
@@ -220,8 +225,8 @@ export default {
`${this.vehicleFromLookup.year} ${this.vehicleFromLookup.make} ${this.vehicleFromLookup.model} ${this.forwardButtonCarStyle}`;
this.$refs.siteFooter.updateButtonText(`Continue with ${vehicleYearMakeModelStyle}`);
this.needToLookupVehicle = false;
-
- return null;
+ showIssLoadingModal(false);
+ return;
}
let isSelectedGlassAvailableForVehicle = true;
@@ -242,7 +247,7 @@ export default {
);
// navigate() doesn't stop the processing flow
- return null;
+ return;
}
// save vehicle to store if it hasn't already been saved
@@ -255,7 +260,7 @@ export default {
this.navigationScenarios.CORRECTED_VIN_FROM_POLICY_VEHICLE,
this.$route
);
- return null;
+ return;
}
const partsOrQuestionsResponse = await this.getPartsOrQuestions();