CSR-2194 | Fix vehicle-damage validation
move continue button validation to top level
This commit is contained in:
parent
d5b36dbbde
commit
840dcb65d0
2 changed files with 103 additions and 7 deletions
|
|
@ -34,6 +34,7 @@ import {
|
||||||
handleInputComponentBlur,
|
handleInputComponentBlur,
|
||||||
} from "@/helpers/button-question-focus-helper";
|
} from "@/helpers/button-question-focus-helper";
|
||||||
import { inputButtonProps } from "@/digital-components/base-input-button/button-functionality-props";
|
import { inputButtonProps } from "@/digital-components/base-input-button/button-functionality-props";
|
||||||
|
import { v4 as uuidv4 } from "uuid";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "base-input-button",
|
name: "base-input-button",
|
||||||
|
|
@ -45,6 +46,7 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
valueToEmit: null,
|
valueToEmit: null,
|
||||||
|
buttonId: uuidv4()
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
@ -153,11 +155,6 @@ export default {
|
||||||
inputType() {
|
inputType() {
|
||||||
return this.isMultiSelect ? "checkbox" : "radio";
|
return this.isMultiSelect ? "checkbox" : "radio";
|
||||||
},
|
},
|
||||||
buttonId() {
|
|
||||||
return `${this.groupName?.replace(" ", "-")}-${this.value
|
|
||||||
?.toString()
|
|
||||||
?.replace(" ", "-")}`;
|
|
||||||
},
|
|
||||||
isValueSelectedOnClick() {
|
isValueSelectedOnClick() {
|
||||||
return this.isMultiSelect || this.selectingInitiatesLoad;
|
return this.isMultiSelect || this.selectingInitiatesLoad;
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
|
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm">
|
||||||
<div class="container-fluid page-container-grouped-styles vehicle-damage">
|
<div class="container-fluid page-container-grouped-styles vehicle-damage">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div class="col-md-6">
|
<div class="col-md-6">
|
||||||
|
|
@ -70,7 +70,7 @@
|
||||||
<div class="col-md-6 col-xl-4">
|
<div class="col-md-6 col-xl-4">
|
||||||
<navbar
|
<navbar
|
||||||
cmsWidgetName="FunnelFooterWidget"
|
cmsWidgetName="FunnelFooterWidget"
|
||||||
:isForwardActionDisabled="!meta.valid"
|
:isForwardActionDisabled="!isContinueEnabled"
|
||||||
:isBackButtonHidden="shouldHideBackButton"
|
:isBackButtonHidden="shouldHideBackButton"
|
||||||
@back-clicked="backButtonAction"
|
@back-clicked="backButtonAction"
|
||||||
@ForwardClicked="forwardButtonAction" />
|
@ForwardClicked="forwardButtonAction" />
|
||||||
|
|
@ -179,6 +179,36 @@ export default {
|
||||||
this.attachCustomEvents();
|
this.attachCustomEvents();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
clearChildEntries() {
|
||||||
|
if (!this.isSideDoorDamageLocation) {
|
||||||
|
this.sideDoorOptionsData = {
|
||||||
|
selectedDoorSides: [],
|
||||||
|
selectedDriverSideReplaceOptions: [],
|
||||||
|
selectedPassengerSideReplaceOptions: [],
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (!this.isDriverSideReplace) {
|
||||||
|
this.sideDoorOptionsData.selectedDriverSideReplaceOptions = [];
|
||||||
|
}
|
||||||
|
if (!this.isPassengerSideReplace) {
|
||||||
|
this.sideDoorOptionsData.selectedPassengerSideReplaceOptions = [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (!this.isRearWindowDamageLocation) {
|
||||||
|
this.selectedRearReplaceOptions = "";
|
||||||
|
}
|
||||||
|
if (!this.isWindshieldDamageLocation) {
|
||||||
|
this.selectedWindshieldOptions = {
|
||||||
|
selectedWindshieldDamageType: "",
|
||||||
|
selectedWindshieldChipCount: null,
|
||||||
|
selectedWindshieldReplaceOptions: []
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (!this.isWindshieldRepair) {
|
||||||
|
this.selectedWindshieldOptions.selectedWindshieldChipCount = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
arePagePrerequisitesValid() {
|
arePagePrerequisitesValid() {
|
||||||
if (store.getters.vehicle.carId) {
|
if (store.getters.vehicle.carId) {
|
||||||
return true;
|
return true;
|
||||||
|
|
@ -571,6 +601,75 @@ export default {
|
||||||
shouldHideBackButton() {
|
shouldHideBackButton() {
|
||||||
return this.$store.getters.requiresVerifiedRedirecting;
|
return this.$store.getters.requiresVerifiedRedirecting;
|
||||||
},
|
},
|
||||||
|
isContinueEnabled() {
|
||||||
|
return this.isAnyDamageSelected && this.isWindshieldValid && this.isRearGlassValid && this.isSideGlassValid;
|
||||||
|
},
|
||||||
|
isAnyDamageSelected() {
|
||||||
|
return this.selectedDamageLocations != null && this.selectedDamageLocations.length != 0;
|
||||||
|
},
|
||||||
|
isSideGlassValid() {
|
||||||
|
if (this.isSideDoorDamageLocation) {
|
||||||
|
if (this.sideDoorOptionsData.selectedDoorSides == null || this.sideDoorOptionsData.selectedDoorSides == 0) {
|
||||||
|
// SideDoor is selected, but "which side" question is unanswered
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
if (this.isPassengerSideReplace) {
|
||||||
|
if (this.sideDoorOptionsData.selectedPassengerSideReplaceOptions == null || this.sideDoorOptionsData.selectedPassengerSideReplaceOptions.length == 0) {
|
||||||
|
// PassengerSide is selected, but no sub option is
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (this.isDriverSideReplace) {
|
||||||
|
if (this.sideDoorOptionsData.selectedDriverSideReplaceOptions == null || this.sideDoorOptionsData.selectedDriverSideReplaceOptions.length == 0) {
|
||||||
|
// DriverSide is selected, but no sub option is
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
isRearGlassValid() {
|
||||||
|
if (this.isRearWindowDamageLocation) {
|
||||||
|
if (!this.selectedRearReplaceOptions) {
|
||||||
|
// RearDoor is selected, but rear option question is unanswered
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
isWindshieldValid() {
|
||||||
|
if (this.isWindshieldDamageLocation) {
|
||||||
|
if (!this.selectedWindshieldOptions.selectedWindshieldDamageType) {
|
||||||
|
// Windshield is selected but no replace/repair option is selected
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
if (this.hasSplitSingleConflict) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (this.isWindshieldRepair) {
|
||||||
|
if (this.hasRepairReplaceConflict) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (!this.selectedWindshieldOptions.selectedWindshieldChipCount) {
|
||||||
|
// Repair selected but no chips selected
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
if (this.selectedWindshieldOptions.selectedWindshieldReplaceOptions == null || this.selectedWindshieldOptions.selectedWindshieldReplaceOptions.length == 0) {
|
||||||
|
// Replace selected but follow-up split/single question not answered
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
selectedDamageLocations() {
|
||||||
|
this.clearChildEntries();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
components: {
|
components: {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue