This commit is contained in:
Sneha 2023-12-11 20:20:36 +05:30
parent 1d7dc6c2c9
commit 2197f0c463

View file

@ -17,7 +17,7 @@
cmsWidgetName="VehicleYearQuestion" cmsWidgetName="VehicleYearQuestion"
validationRules="year-required" validationRules="year-required"
placeHolderText="Select year" placeHolderText="Select year"
inputId="yearQuestionField" /> customDropdownId="yearQuestionField" />
<vehicleQuestion <vehicleQuestion
ref="vehicleMakeQuestion" ref="vehicleMakeQuestion"
@ -27,7 +27,7 @@
cmsWidgetName="VehicleMakeQuestion" cmsWidgetName="VehicleMakeQuestion"
validationRules="make-required" validationRules="make-required"
placeHolderText="Select make" placeHolderText="Select make"
inputId="makeQuestionField" /> customDropdownId="makeQuestionField" />
<vehicleQuestion <vehicleQuestion
ref="vehicleModelQuestion" ref="vehicleModelQuestion"
@ -37,7 +37,7 @@
:options="modelOptions" :options="modelOptions"
validationRules="model-required" validationRules="model-required"
placeHolderText="Select model" placeHolderText="Select model"
inputId="modelQuestionField" /> customDropdownId="modelQuestionField" />
<vehicleQuestion <vehicleQuestion
ref="vehicleStyleQuestion" ref="vehicleStyleQuestion"
@ -47,7 +47,7 @@
:options="styleOptions" :options="styleOptions"
validationRules="style-required" validationRules="style-required"
placeHolderText="Select style" placeHolderText="Select style"
inputId="styleQuestionField" /> customDropdownId="styleQuestionField" />
<vehicleBanner <vehicleBanner
cmsWidgetName="VehicleBannerWidget" cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="displayGeneric" :displayGenericVehicleImage="displayGeneric"
@ -226,6 +226,7 @@ export default {
watch: { watch: {
async selectedYear(year) { async selectedYear(year) {
if (year) { if (year) {
this.yearDropdown.disabled = true;
const result = await this.getMakeOptions(year); const result = await this.getMakeOptions(year);
this.makeOptions = result?.data; this.makeOptions = result?.data;
if (this.selectedYearfromStore() !== year) { if (this.selectedYearfromStore() !== year) {
@ -234,6 +235,8 @@ export default {
this.selectedStyle = null; this.selectedStyle = null;
this.carId = null; this.carId = null;
} }
this.yearDropdown.disabled = false;
this.yearDropdown.focus();
} else { } else {
this.makeOptions = []; this.makeOptions = [];
this.selectedMake = null; this.selectedMake = null;
@ -244,6 +247,7 @@ export default {
}, },
async selectedMake(make) { async selectedMake(make) {
if (make) { if (make) {
this.makeDropdown.disabled = true;
const result = await this.getModelOptions(this.selectedYear, make); const result = await this.getModelOptions(this.selectedYear, make);
this.modelOptions = result?.data; this.modelOptions = result?.data;
if (this.modelOptions.length === 1) this.selectedModel = this.modelOptions[0]; if (this.modelOptions.length === 1) this.selectedModel = this.modelOptions[0];
@ -252,6 +256,8 @@ export default {
this.selectedStyle = null; this.selectedStyle = null;
this.carId = null; this.carId = null;
} }
this.makeDropdown.disabled = false;
this.makeDropdown.focus();
} else { } else {
this.modelOptions = []; this.modelOptions = [];
this.selectedModel = null; this.selectedModel = null;
@ -261,6 +267,7 @@ export default {
}, },
async selectedModel(model) { async selectedModel(model) {
if (model) { if (model) {
this.modelDropdown.disabled = true;
const result = await this.getStyleOptions( const result = await this.getStyleOptions(
this.selectedYear, this.selectedYear,
this.selectedMake, this.selectedMake,
@ -277,6 +284,8 @@ export default {
this.selectedStyle = null; this.selectedStyle = null;
this.carId = null; this.carId = null;
} }
this.modelDropdown.disabled = false;
this.modelDropdown.focus();
} else { } else {
this.styleOptions = []; this.styleOptions = [];
this.selectedStyle = null; this.selectedStyle = null;
@ -285,7 +294,10 @@ export default {
}, },
async selectedStyle(style) { async selectedStyle(style) {
if (style) { if (style) {
this.styleDropdown.disabled = true;
this.getVehicleDetails(); this.getVehicleDetails();
this.styleDropdown.disabled = false;
this.styleDropdown.focus();
} else { } else {
this.imageUrl = null; this.imageUrl = null;
this.carId = null; this.carId = null;
@ -303,6 +315,18 @@ export default {
else if (this.imageUrl == null && this.carId !== null) return false; else if (this.imageUrl == null && this.carId !== null) return false;
else return true; else return true;
}, },
yearDropdown() {
return document.getElementById("yearQuestionField");
},
makeDropdown() {
return document.getElementById("makeQuestionField");
},
modelDropdown() {
return document.getElementById("modelQuestionField");
},
styleDropdown() {
return document.getElementById("styleQuestionField");
},
allDataRetrieved() { allDataRetrieved() {
return ( return (
!!this.selectedYear && !!this.selectedYear &&