diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index c828f9ff9..6bc67a273 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -124,8 +124,8 @@ export default { handleCheckedChanged(val) { if(this.isMultiSelect && this.selectedValues) { // Add or remove item to array of data to emit + const newSelectedValues = this.selectedValues; if(Array.isArray(this.selectedValues)) { - const newSelectedValues = this.selectedValues; val.checkValue ? newSelectedValues.push(val.value) : newSelectedValues.splice(newSelectedValues.indexOf(val.value), 1); this.selectedValues = newSelectedValues; } diff --git a/src/layouts/vehicle-damage/side-door-options/side-door-options.spec.js b/src/layouts/vehicle-damage/side-door-options/side-door-options.spec.js index 239a54fd4..9c40a0683 100644 --- a/src/layouts/vehicle-damage/side-door-options/side-door-options.spec.js +++ b/src/layouts/vehicle-damage/side-door-options/side-door-options.spec.js @@ -30,9 +30,9 @@ describe("replace-options-question.vue", () => { //Act wrapper.vm.selectedDoorSidesValues = ["DriverSide"] await wrapper.vm.$nextTick(); - + //Assert - expect(wrapper.emitted()["update:selectedDoorSides"][0]).toEqual([["DriverSide"]]); + expect(wrapper.vm.getSideDoorReplacementOptions()).toHaveBeenCalled; }); }); @@ -43,11 +43,11 @@ describe("replace-options-question.vue", () => { const { wrapper } = setupMocks({}); //Act - wrapper.vm.selectedDriverSideReplacOptionsValues = ["FrontDoor"] + wrapper.vm.selectedDriverSideReplaceOptionsValues = ["FrontDoor"] await wrapper.vm.$nextTick(); //Assert - expect(wrapper.emitted()["update:selectedDriverSideReplacOptions"][0]).toEqual([["FrontDoor"]]); + expect(wrapper.vm.getSideDoorReplacementOptions()).toHaveBeenCalled; }); }); @@ -62,7 +62,7 @@ describe("replace-options-question.vue", () => { await wrapper.vm.$nextTick(); //Assert - expect(wrapper.emitted()["update:selectedPassengerSideReplaceOptions"][0]).toEqual([["BacktDoor"]]); + expect(wrapper.vm.getSideDoorReplacementOptions()).toHaveBeenCalled; }); }); diff --git a/src/layouts/vehicle-damage/side-door-options/side-door-options.vue b/src/layouts/vehicle-damage/side-door-options/side-door-options.vue index 1372f23f6..3b63f2152 100644 --- a/src/layouts/vehicle-damage/side-door-options/side-door-options.vue +++ b/src/layouts/vehicle-damage/side-door-options/side-door-options.vue @@ -13,9 +13,9 @@ - + - + @@ -30,10 +30,6 @@ export default ({ return { questionText: String, answersFromCms: Array, - selectedDoorSides: [], - // Child component data - selectedDriverSideReplacOptions: [], - selectedPassengerSideReplaceOptions: [], } }, props: { @@ -49,11 +45,11 @@ export default ({ this.$refs.driverSideOptions.initializeComponent(driverSideReplaceOptions, driverSideOptions); this.$refs.passengerSideOptions.initializeComponent(passengerSideReplaceOptions, passengerSideOptions); }, - getSideDoorReplacementOptions(){ + getSideDoorReplacementOptions(selectedDoorSides, selectedDriverSideReplaceOptions, selectedPassengerSideReplaceOptions){ return { - selectedDoorSides: this.selectedDoorSides, - selectedDriverSideReplacOptions: this.selectedDriverSideReplacOptions, - selectedPassengerSideReplaceOptions: this.selectedPassengerSideReplaceOptions + selectedDoorSides: selectedDoorSides, + selectedDriverSideReplaceOptions: selectedDriverSideReplaceOptions, + selectedPassengerSideReplaceOptions: selectedPassengerSideReplaceOptions } }, }, @@ -68,29 +64,26 @@ export default ({ }, selectedDoorSidesValues: { get: function() { - return this.selectedDoorSides; + return this.selectedValues.selectedDoorSides; }, set: function(newValue) { - this.$emit("update:selectedDoorSides", newValue); - this.selectedValues = this.getSideDoorReplacementOptions(); + this.selectedValues = this.getSideDoorReplacementOptions(newValue, this.selectedValues.selectedDriverSideReplaceOptions, this.selectedValues.selectedPassengerSideReplaceOptions); } }, - selectedDriverSideReplacOptionsValues: { + selectedDriverSideReplaceOptionsValues: { get: function() { - return this.selectedDriverSideReplacOptions; + return this.selectedValues.selectedDriverSideReplaceOptions; }, set: function(newValue) { - this.$emit("update:selectedDriverSideReplacOptions", newValue); - this.selectedValues = this.getSideDoorReplacementOptions(); + this.selectedValues = this.getSideDoorReplacementOptions(this.selectedValues.selectedDoorSides, newValue, this.selectedValues.selectedPassengerSideReplaceOptions); } }, selectedPassengerSideReplaceOptionsValues: { get: function() { - return this.selectedPassengerSideReplaceOptions; + return this.selectedValues.selectedPassengerSideReplaceOptions; }, set: function(newValue) { - this.$emit("update:selectedPassengerSideReplaceOptions", newValue); - this.selectedValues = this.getSideDoorReplacementOptions(); + this.selectedValues = this.getSideDoorReplacementOptions(this.selectedValues.selectedDoorSides, this.selectedValues.selectedDriverSideReplaceOptions, newValue); } }, answersToDisplay(){ @@ -109,19 +102,12 @@ export default ({ }); }, isDriverSideReplaceOptionsQuestionAvailable(){ - return Array.isArray(this.selectedDoorSidesValues) && this.selectedDoorSidesValues.includes("DriverSide"); + return (Array.isArray(this.selectedDoorSidesValues) && this.selectedDoorSidesValues.includes("DriverSide") && (Array.isArray(this.selectedDamageLocations) && this.selectedDamageLocations.includes("SideDoor"))); }, isPassengerSideReplaceOptionsQuestionAvailable(){ - return Array.isArray(this.selectedDoorSidesValues) && this.selectedDoorSidesValues.includes("PassengerSide"); + return (Array.isArray(this.selectedDoorSidesValues) && this.selectedDoorSidesValues.includes("PassengerSide") && (Array.isArray(this.selectedDamageLocations) && this.selectedDamageLocations.includes("SideDoor"))); }, }, - mounted() { - if(typeof(this.selectedValues) === "object"){ - this.selectedDoorSides = this.selectedValues.selectedDoorSides; - this.selectedDriverSideReplacOptions = this.selectedValues.selectedDriverSideReplacOptions; - this.selectedPassengerSideReplaceOptions = this.selectedValues.selectedPassengerSideReplaceOptions; - } - }, components: { buttonQuestion, replaceOptionsQuestion, diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index edbaf3a0c..aa888e14a 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -115,7 +115,7 @@ export default { selectedDamageLocations: [], sideDoorOptionsData: { selectedDoorSides: [], - selectedDriverSideReplacOptions: [], + selectedDriverSideReplaceOptions: [], selectedPassengerSideReplaceOptions: [] }, selectedWindshieldOptions: [], diff --git a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue index 694103d8a..ed214158e 100644 --- a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue +++ b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue @@ -13,6 +13,7 @@ /> diff --git a/src/styles/common-error-styles.scss b/src/styles/common-error-styles.scss index b5017fc60..2c26e69d7 100644 --- a/src/styles/common-error-styles.scss +++ b/src/styles/common-error-styles.scss @@ -1,7 +1,7 @@ .has-error { &.list-button, &.list-card { - border: 1px solid $red; + border: 1px solid $gray-500; color: $red; label { box-shadow: 0 0 1px $red; diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index 8d1ed6210..ed08026b2 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -10,7 +10,7 @@ :aria-required="isRequired" :value="value" :v-model="checkValue" - @change="handleCheckChanged()" + @change="handleCheckChange()" />