diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue
index d5964fd2f..19e80d16e 100644
--- a/src/common-components/button-question/button-question.vue
+++ b/src/common-components/button-question/button-question.vue
@@ -50,6 +50,7 @@
:groupName="groupName"
:value="answer.value"
:modelValue="modelValue"
+ selectingInitiatesLoad
@change="(e) => handleAnswerChange(e)"
/>
diff --git a/src/layouts/vehicle-make/make-question/make-question.vue b/src/layouts/vehicle-make/make-question/make-question.vue
index d0046fe30..f346a6d81 100644
--- a/src/layouts/vehicle-make/make-question/make-question.vue
+++ b/src/layouts/vehicle-make/make-question/make-question.vue
@@ -7,7 +7,7 @@
:answers="makes"
groupName="ChooseVehicleMake"
textPosition="text-start"
- v-model="selectedValue"
+ v-model="selectedMake"
isRequired
/>
@@ -23,7 +23,8 @@ export default {
name: "make-question",
data() {
return {
- makes: Array,
+ makes: [],
+ selectedMake: null
};
},
props: {
@@ -34,14 +35,6 @@ export default {
questionText(){
return this.getCmsContent(this.cmsWidgetName, 'QuestionText');
},
- selectedValue: {
- get: function() {
- return this.modelValue
- },
- set: function(newValue) {
- this.$emit("update:modelValue", newValue);
- }
- }
},
components: {
buttonQuestion,
@@ -57,5 +50,10 @@ export default {
this.makes = initialData;
},
},
+ watch: {
+ selectedMake(selectedMake) {
+ this.$emit("update:modelValue", selectedMake)
+ }
+ }
};
diff --git a/src/layouts/vehicle-make/vehicle-make.vue b/src/layouts/vehicle-make/vehicle-make.vue
index f5a42eefe..2bd49498f 100644
--- a/src/layouts/vehicle-make/vehicle-make.vue
+++ b/src/layouts/vehicle-make/vehicle-make.vue
@@ -3,14 +3,21 @@
@@ -26,7 +33,6 @@ import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-he
// Supporting files
import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
import { settleAllPromises } from "@/helpers/layout-helper";
-import { storeMutations } from "@/constants/store-mutations";
import { storeActions } from "@/constants/store-actions";
import store from "@/store";
@@ -75,7 +81,7 @@ export default {
);
},
arePagePrerequisitesValid() {
- if (store.getters.vehicle.year){
+ if (store.getters.vehicle.year) {
return true;
}
return false;
@@ -84,7 +90,7 @@ export default {
watch: {
selectedMake(make) {
- this.dispatchStoreAction(storeActions.SAVE_VEHICLE_MAKE, make, false);
+ this.dispatchStoreAction(storeActions.SAVE_VEHICLE_MAKE, make, false);
this.$router.navigateWithSaving(
this.navigationScenarios.SELECTED_MAKE,
this.$route
diff --git a/src/layouts/vehicle-model/model-question/model-question.vue b/src/layouts/vehicle-model/model-question/model-question.vue
index 096f4d70c..bf21cec35 100644
--- a/src/layouts/vehicle-model/model-question/model-question.vue
+++ b/src/layouts/vehicle-model/model-question/model-question.vue
@@ -7,7 +7,7 @@
:answers="models"
groupName="ChooseVehicleModel"
textPosition="text-start"
- v-model="selectedValue"
+ v-model="selectedModel"
isRequired
/>
@@ -23,7 +23,8 @@ export default {
name: "model-question",
data() {
return {
- models: Array,
+ models: [],
+ selectedModel: null
};
},
props: {
@@ -34,14 +35,6 @@ export default {
questionText(){
return this.getCmsContent(this.cmsWidgetName, 'QuestionText');
},
- selectedValue: {
- get: function() {
- return this.modelValue
- },
- set: function(newValue) {
- this.$emit("update:modelValue", newValue);
- }
- }
},
components: {
buttonQuestion,
@@ -57,5 +50,10 @@ export default {
this.models = initialData;
},
},
+ watch: {
+ selectedModel(selectedModel) {
+ this.$emit("update:modelValue", selectedModel);
+ }
+ }
};
diff --git a/src/layouts/vehicle-style/style-question/style-question.vue b/src/layouts/vehicle-style/style-question/style-question.vue
index 4e6e90798..bfc51ea0e 100644
--- a/src/layouts/vehicle-style/style-question/style-question.vue
+++ b/src/layouts/vehicle-style/style-question/style-question.vue
@@ -7,7 +7,7 @@
:answers="styles"
groupName="ChooseVehicleStyle"
textPosition="text-start"
- v-model="selectedValue"
+ v-model="selectedStyle"
isRequired
/>
@@ -23,7 +23,8 @@ export default {
name: "style-question",
data() {
return {
- styles: Array,
+ styles: [],
+ selectedStyle: null
};
},
props: {
@@ -34,14 +35,6 @@ export default {
questionText(){
return this.getCmsContent(this.cmsWidgetName, 'QuestionText');
},
- selectedValue: {
- get: function() {
- return this.modelValue
- },
- set: function(newValue) {
- this.$emit("update:modelValue", newValue);
- }
- }
},
components: {
buttonQuestion,
@@ -61,5 +54,10 @@ export default {
this.styles = initialData;
},
},
+ watch: {
+ selectedStyle(selectedStyle) {
+ this.$emit("update:modelValue", selectedStyle);
+ }
+ }
};
diff --git a/src/layouts/vehicle-year/year-question/year-question.vue b/src/layouts/vehicle-year/year-question/year-question.vue
index bfb0de678..57f4b5bcb 100644
--- a/src/layouts/vehicle-year/year-question/year-question.vue
+++ b/src/layouts/vehicle-year/year-question/year-question.vue
@@ -1,18 +1,16 @@
- YQ: {{ selectedValue }}
-
+ class="radioQuestion"
+ isOverflowScrollable
+ selectingInitiatesLoad
+ :questionText="questionText"
+ :answers="years"
+ groupName="ChooseVehicleYear"
+ textPosition="text-start"
+ v-model="selectedYear"
+ isRequired
+ />
@@ -26,7 +24,7 @@ export default {
data() {
return {
years: [],
- selectedValue: null
+ selectedYear: null,
};
},
props: {
@@ -37,17 +35,9 @@ export default {
buttonQuestion,
},
computed: {
- questionText(){
- return this.getCmsContent(this.cmsWidgetName, 'QuestionText');
+ questionText() {
+ return this.getCmsContent(this.cmsWidgetName, "QuestionText");
},
- // selectedValue: {
- // get: function() {
- // return this.modelValue
- // },
- // set: function(newValue) {
- // this.$emit("update:modelValue", newValue);
- // }
- // }
},
methods: {
loadInitialData() {
@@ -60,5 +50,10 @@ export default {
this.years = initialData;
},
},
+ watch: {
+ selectedYear(selectedYear) {
+ this.$emit("update:modelValue", selectedYear)
+ }
+ }
};
diff --git a/src/mixins/button-mixin.js b/src/mixins/button-mixin.js
index 609a40399..146b5b6b3 100644
--- a/src/mixins/button-mixin.js
+++ b/src/mixins/button-mixin.js
@@ -33,10 +33,7 @@ export default {
type: String,
required: true,
},
- validationRules: {
- type: String,
- required: true,
- },
+ validationRules: String,
classes: [String, Array, Object],
},
methods: {
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index 0923d071a..ec0d0cf43 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -85,7 +85,10 @@ export default {
screenReaderOnlyText: String,
selectingInitiatesLoad: Boolean,
loaderColor: String,
- loaderPosition: String,
+ loaderPosition: {
+ type: String,
+ default: "right"
+ },
hasError: Boolean,
valueToLogType: String,
},
diff --git a/src/ux-components/loader/loader.vue b/src/ux-components/loader/loader.vue
index 9b3473eb1..1d6c83bce 100644
--- a/src/ux-components/loader/loader.vue
+++ b/src/ux-components/loader/loader.vue
@@ -27,6 +27,8 @@ export default {