Update vehicle.vue

This commit is contained in:
Sneha 2023-08-29 13:00:48 +05:30
parent 957488c3fb
commit a462d768c0

View file

@ -29,6 +29,7 @@
:isDisabled="!makeOptions.length"
:options="makeOptions"
cmsWidgetName="VehicleMakeQuestion"
v-validate="{ rules: 'required', disabled: !makeOptions.length }"
validationRules="make-required"
placeHolderText="Select make"
inputId="makeQuestionField" />
@ -40,6 +41,7 @@
cmsWidgetName="VehicleModelQuestion"
:isDisabled="!modelOptions.length"
:options="modelOptions"
v-validate="{ rules: 'required', disabled: !modelOptions.length }"
validationRules="model-required"
placeHolderText="Select model"
inputId="modelQuestionField" />
@ -51,6 +53,7 @@
cmsWidgetName="VehicleStyleQuestion"
:isDisabled="!styleOptions.length"
:options="styleOptions"
v-validate="{ rules: 'required', disabled: !styleOptions.length }"
validationRules="style-required"
placeHolderText="Select style"
inputId="styleQuestionField" />
@ -99,10 +102,34 @@ import { storeActions } from "@/constants/store-actions.js";
import baseMixin from "@/mixins/base-mixin.js";
//define validation rules
defineRule("year-required", required(errorMessages.YEAR_REQUIRED));
defineRule("make-required", required(errorMessages.MAKE_REQUIRED));
defineRule("model-required", required(errorMessages.MODEL_REQUIRED));
defineRule("style-required", required(errorMessages.STYLE_REQUIRED));
defineRule("year-required", (value) => {
if (!value || !value.length ) {
return errorMessages.YEAR_REQUIRED;
}
return true;
});
defineRule("make-required", (value) => {
if (!value || !value.length) {
return errorMessages.MAKE_REQUIRED;
}
return true;
});
defineRule("model-required", (value) => {
if (!value || !value.length) {
return errorMessages.MODEL_REQUIRED;
}
return true;
});
defineRule("style-required", (value) => {
if (!value || !value.length) {
return errorMessages.STYLE_REQUIRED;
}
return true;
});
// defineRule("year-required", required(errorMessages.YEAR_REQUIRED));
// defineRule("make-required", required(errorMessages.MAKE_REQUIRED));
// defineRule("model-required", required(errorMessages.MODEL_REQUIRED));
// defineRule("style-required", required(errorMessages.STYLE_REQUIRED));
export default {
name: "vehicle",
@ -242,6 +269,9 @@ export default {
}
} else {
this.makeOptions = [];
this.selectedMake = null;
this.selectedModel = null;
this.selectedStyle = null;
}
},
async selectedMake(make) {
@ -255,6 +285,8 @@ export default {
}
} else {
this.modelOptions = [];
this.selectedModel = null;
this.selectedStyle = null;
}
},
async selectedModel(model) {
@ -271,6 +303,7 @@ export default {
}
} else {
this.styleOptions = [];
this.selectedStyle = null;
}
},
async selectedStyle(style) {