fixed autopopulation rules

This commit is contained in:
Jason Wheeler 2023-02-14 12:47:19 -05:00
parent 8aac1a1d0a
commit be3f574cac
3 changed files with 33 additions and 9 deletions

View file

@ -270,7 +270,7 @@ function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelV
const mountOptions = getMountOptions({
route: {
query: {
iisPage: "vehicle-parts",
issPage: "vehicle-parts",
},
},
});

View file

@ -4,7 +4,7 @@
</div>
<div class="nested-radio">
<div class="row my-2">
<div class="col">
<div class="col mx-1">
<buttonQuestion
v-model="selectedTint"
:answers="tintSelectionOptions"
@ -115,9 +115,10 @@ export default {
return this.modelValue?.partNumber;
},
set(newValue) {
console.log(this.selectedPartNumber)
this.$emit(
"update:modelValue",
this.partsForSelectedTint.filter((part) => part.partNumber == newValue)[0]
this.partsForSelectedTint.filter((part) => part.partNumber == newValue.value)[0]
);
},
},
@ -150,7 +151,6 @@ export default {
// Add onto the final object
arr[itemColor].push(mappedItem);
return arr;
}, {});
@ -158,7 +158,7 @@ export default {
},
PartDataFromApi() {
return this.mainStore.pageData(this.$route.query.iisPage) ?? {};
return this.mainStore.pageData(this.$route.query.issPage) ?? {};
},
},
methods: {
@ -190,7 +190,31 @@ export default {
// Check if only a single part is present for the tint and set the v-model if it is.
AutoSelectIfSinglePart() {
if (this.partsForSelectedTint?.length == 1) {
this.selectedPartNumber = this.partsForSelectedTint[0].partNumber;
this.selectedPartNumber = { value: this.partsForSelectedTint[0].partNumber };
this.$nextTick(() => {
//select element with matching partNumber
const element = document.querySelector('input[value=' + this.selectedPartNumber + ']').checked = true;
});
}
else{
if(this.selectedPartNumber && this.partsForSelectedTint.filter(x => x.partNumber == this.selectedPartNumber).length > 0)
{
this.$nextTick(() => {
//select element with matching partNumber
const element = document.querySelector('input[value=' + this.selectedPartNumber + ']').checked = true;
});
}
else{
this.selectedPartNumber = { value: this.partsForSelectedTint[0].partNumber }
this.$nextTick(() => {
//select element with matching partNumber
const element = document.querySelector('input[value=' + this.selectedPartNumber + ']').checked = true;
});
}
}
},
@ -198,7 +222,7 @@ export default {
LoadPreselectedValues() {
this.$nextTick(() => {
if (this.modelValue !== undefined) {
// Populate button-question model-value if parts data already exists in VueX
// Populate button-question model-value if parts data already exists in store
this.selectedTint = this.modelValue?.color;
}
});

View file

@ -7,7 +7,7 @@
cmsWidgetName="VehicleBannerWidget"
:displayGenericVehicleImage="false" />
<siteSubHeader ref="siteSubHeader" cmsWidgetName="SiteSubHeaderWidget" />
<div class="fade-on-route-transition sub-container make-tall">
<div class="fade-on-route-transition sub-container make-tall overflow-auto">
<div class="prevent-squish my-5">
<div class="row">
<div class="col">
@ -178,7 +178,7 @@ export default {
}
// If no parts could be matched, throw an error (isForwardActionDisabled is based off of matchedParts)
if (this.isForwardActionDisabled) {
this.$refs.funnelFooter.removeLoader();
this.$refs.siteFooter.removeLoader();
throw new Error("Could not match any parts to the selected parts");
}