Merge pull request #702 from Safelite/feature/CSR-735
CSR-735 | Update list-button-horizontal
This commit is contained in:
commit
82bb777543
3 changed files with 24 additions and 10 deletions
|
|
@ -29,8 +29,7 @@ export default ({
|
||||||
get: function() {
|
get: function() {
|
||||||
// Convert to CMS answer name from bool
|
// Convert to CMS answer name from bool
|
||||||
var cmsAnswerValue = this.modelValue ? "InsuranceAnswer" : "CashAnswer";
|
var cmsAnswerValue = this.modelValue ? "InsuranceAnswer" : "CashAnswer";
|
||||||
// list-button-horizontal expects an array of values
|
return cmsAnswerValue;
|
||||||
return [cmsAnswerValue];
|
|
||||||
},
|
},
|
||||||
set: function(newValue) {
|
set: function(newValue) {
|
||||||
// Convert back to bool for parent component
|
// Convert back to bool for parent component
|
||||||
|
|
|
||||||
|
|
@ -194,7 +194,7 @@ describe("list-button-horizontal.vue", () => {
|
||||||
});
|
});
|
||||||
wrapper.vm.handleCheckChange();
|
wrapper.vm.handleCheckChange();
|
||||||
// Assert
|
// Assert
|
||||||
expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{value: "List Card Checkbox", checkValue: Boolean}]);
|
expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{value: "List Card Checkbox", checkValue: Boolean, buttonId: undefined, checkValue: undefined}]);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Should set checkValue data if selectedButtonIDs has value(s)", async () => {
|
it("Should set checkValue data if selectedButtonIDs has value(s)", async () => {
|
||||||
|
|
@ -215,7 +215,7 @@ describe("list-button-horizontal.vue", () => {
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
// Assert
|
// Assert
|
||||||
expect(wrapper.componentVM.checkValue).toEqual("Car-Front");
|
expect(wrapper.componentVM.checkValue).toEqual(["Car-Front"]);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("Should run handleCheckChange if selectingInitiatesLoad is false and handleInputChange is triggered", async () => {
|
it("Should run handleCheckChange if selectingInitiatesLoad is false and handleInputChange is triggered", async () => {
|
||||||
|
|
|
||||||
|
|
@ -24,6 +24,7 @@
|
||||||
<script>
|
<script>
|
||||||
import { useField } from "vee-validate";
|
import { useField } from "vee-validate";
|
||||||
import loader from "@/ux-components/loader/loader";
|
import loader from "@/ux-components/loader/loader";
|
||||||
|
import { toRef } from "vue";
|
||||||
import { queryStrings } from "@/constants/query-strings";
|
import { queryStrings } from "@/constants/query-strings";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
|
@ -57,14 +58,25 @@ export default {
|
||||||
checkValue: Boolean,
|
checkValue: Boolean,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
mounted() {
|
||||||
if (Array.isArray(this.selectedValues)) {
|
if (Array.isArray(this.validateValue)) {
|
||||||
this.checkValue = this.isMultiSelect
|
this.checkValue = this.isValueSelectedByArray(this.selectedValues);
|
||||||
? this.selectedValues.includes(this.value)
|
const isSelectedByValidator = this.isValueSelectedByArray(this.validateValue);
|
||||||
: this.selectedValues[0];
|
|
||||||
|
if (this.checkValue != isSelectedByValidator) {
|
||||||
|
this.handleChange(this.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.checkValue = this.selectedValues;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
isValueSelectedByArray(arr) {
|
||||||
|
return this.isMultiSelect
|
||||||
|
? arr.includes(this.value)
|
||||||
|
: arr[0];
|
||||||
|
},
|
||||||
displayLoader() {
|
displayLoader() {
|
||||||
this.isLoaderDisplayed = true;
|
this.isLoaderDisplayed = true;
|
||||||
},
|
},
|
||||||
|
|
@ -123,11 +135,14 @@ export default {
|
||||||
const {
|
const {
|
||||||
handleChange,
|
handleChange,
|
||||||
errors,
|
errors,
|
||||||
} = useField(props.groupName, props.validationRules, fieldOptions);
|
value
|
||||||
|
} = useField(toRef(props, "groupName"), toRef(props, "validationRules"), fieldOptions);
|
||||||
|
|
||||||
|
const validateValue = value;
|
||||||
return {
|
return {
|
||||||
handleChange,
|
handleChange,
|
||||||
errors,
|
errors,
|
||||||
|
validateValue,
|
||||||
fieldOptions, // only need to expose this for unit test purposes
|
fieldOptions, // only need to expose this for unit test purposes
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue