diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue index 92a33108..83b56e02 100644 --- a/src/layouts/policy-vehicles/policy-vehicles.vue +++ b/src/layouts/policy-vehicles/policy-vehicles.vue @@ -154,23 +154,7 @@ export default { selectedVehicle() { const vehicle = this.mainStore.lookupVehicleByVin(this.selectedVehicleVin); return vehicle; - }, - //displayGeneric() { - // const selectedVehicle = useMainStore().lookupVehicleByVin(this.selectedVehicleVin); - // const styleOptions = this.mainStore.getVehicleStyles( - // selectedVehicle.year, - // selectedVehicle.make, - // selectedVehicle.model, - // ); - - - // const styleOptions = this.selectedVehicle.style; - - // if (styleOptions.length > 1) { - // return true; - // } - // return false; - //} + }, }, watch: { async selectedVehicleVin(value) { @@ -183,19 +167,30 @@ export default { else { // get vehicle details from selected vin const vehicle = await this.lookupVehicleByVin(value); + + if (vehicle.error) { + this.mainStore.resetVehicleState(); + this.displayGeneric = true; + } + // save selected vehicle to the store this.mainStore.updateVehicle(vehicle.data); - this.displayGeneric = false; - + this.displayGeneric = true; + const styleOptions = await this.mainStore.getVehicleStyles( vehicle.data.year, vehicle.data.make, vehicle.data.model ) - // if there is more than 1 style for the selected vehicle, display blurred image - if (styleOptions.length > 1) { + + // if there is more than 1 style for the selected vehicle, display generic/blurred image + if (styleOptions.data.length > 1) { this.displayGeneric = true; } + else { + // display clear image of vehicle + this.displayGeneric = false; + } } } },