jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

CSR-319: improve repair/replace logic

Browse source
This commit is contained in:
Adam Caouette 2022-03-04 15:02:39 -05:00
parent f36d199670
commit 84b0257de2
5 changed files with 29 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/constants/error-messages.js
View file

@ -9,4 +9,4 @@ const errorMessages = {
REPLACE_OPTIONS_REQUIRED: "Please select rear window type", REPLACE_OPTIONS_REQUIRED: "Please select rear window type",
}; };
export default { errorMessages }; export { errorMessages };

2
src/layouts/vehicle-damage/damage-location-question/damage-location-question.vue
View file

@ -17,7 +17,7 @@ import buttonQuestion from "@/common-components/button-question/button-question"
import store from "@/store"; import store from "@/store";
import { defineRule } from "vee-validate"; import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
import errorMessages from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
// DEFINE VALIDATION RULES // DEFINE VALIDATION RULES
defineRule("damage-location-required", required(errorMessages.DAMAGE_LOCATION_REQUIRED)); defineRule("damage-location-required", required(errorMessages.DAMAGE_LOCATION_REQUIRED));

2
src/layouts/vehicle-damage/side-door-options/side-door-options.vue
View file

@ -40,7 +40,7 @@ import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-que
import store from "@/store"; import store from "@/store";
import { defineRule } from "vee-validate"; import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
import errorMessages from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
// DEFINE VALIDATION RULES // DEFINE VALIDATION RULES
defineRule("damage-side-required", required(errorMessages.DAMAGE_SIDE_REQUIRED)); defineRule("damage-side-required", required(errorMessages.DAMAGE_SIDE_REQUIRED));

51
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -7,7 +7,7 @@
@submit="onSubmit" @submit="onSubmit"
@invalid-submit="onInvalidSubmit" @invalid-submit="onInvalidSubmit"
ref="theForm" ref="theForm"
v-slot="{ values, meta, errors }" v-slot="{ meta }"
> >
<damageLocationQuestion <damageLocationQuestion
ref="damageLocation" ref="damageLocation"
@ -17,12 +17,12 @@
<windshieldOptions <windshieldOptions
ref="windshieldOptions" ref="windshieldOptions"
v-model="selectedWindshieldOptions" v-model="selectedWindshieldOptions"
:suppressError="errors.WindshieldDamageTypeQuestion && errors.WindshieldDamageTypeQuestion.startsWith('checkForRepairAndReplace')" :hasRepairReplaceConflict="hasRepairReplaceConflict"
:selectedDamageLocations="selectedDamageLocations" :selectedDamageLocations="selectedDamageLocations"
/> />
<alert <alert
class="my-3" class="my-3"
v-if="errors.WindshieldDamageTypeQuestion && errors.WindshieldDamageTypeQuestion.startsWith('checkForRepairAndReplace')" v-show="hasRepairReplaceConflict"
alertClass="alert-danger" alertClass="alert-danger"
alertHeadline="You'll need to schedule separate appointments" alertHeadline="You'll need to schedule separate appointments"
alertCopy="Vehicle service requiring both glass repair and replacement must be scheduled separately, as they're performed by different technicians. Continue scheduling your first service now, and then come back to schedule the second service." alertCopy="Vehicle service requiring both glass repair and replacement must be scheduled separately, as they're performed by different technicians. Continue scheduling your first service now, and then come back to schedule the second service."
@ -32,32 +32,22 @@
ref="sideDoorOptions" ref="sideDoorOptions"
groupName="SideDoorSideQuestion" groupName="SideDoorSideQuestion"
v-model="sideDoorOptionsData" v-model="sideDoorOptionsData"
v-show="!hasRepairReplaceConflict"
:selectedDamageLocations="selectedDamageLocations" :selectedDamageLocations="selectedDamageLocations"
/> />
<replaceOptionsQuestion <replaceOptionsQuestion
ref="backGlassOptions" ref="backGlassOptions"
:isAvailable="isRearWindowDamageLocation" :isAvailable="isRearWindowDamageLocation && !hasRepairReplaceConflict"
v-model="selectedRearReplaceOptions" v-model="selectedRearReplaceOptions"
groupName="BackGlassReplaceOptionsQuestion" groupName="BackGlassReplaceOptionsQuestion"
validationRules="replace-options-required" validationRules="replace-options-required"
/> />
<funnel-footer <funnel-footer
ref="funnelFooter" ref="funnelFooter"
:isDisabled="!meta.valid" :isDisabled="!meta.valid"
@back-clicked="backButtonAction" @back-clicked="backButtonAction"
@ForwardClicked="forwardButtonAction" @ForwardClicked="forwardButtonAction"
/> />
<!-- KEEP TEMPORARILY FOR TROUBLESHOOTING VALIDATION -->
<div class="g-2 mt-6 mx-4 w-25 position-fixed fixed-top">
<p>Current Form, values:</p>
<pre>{{ values }}</pre>
<p>Errors:</p>
<pre>{{ errors }}</pre>
<p>Is Form Valid? (Meta.valid):</p>
<pre>{{ meta.valid }}</pre>
</div>
</Form> </Form>
</div> </div>
</template> </template>
@ -82,7 +72,7 @@ import store from "@/store";
import baseMixin from "@/mixins/base-mixin"; import baseMixin from "@/mixins/base-mixin";
import { Form, defineRule } from "vee-validate"; import { Form, defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
import errorMessages from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
import { damageLocationsParts } from "@/constants/damage-locations-parts.js"; import { damageLocationsParts } from "@/constants/damage-locations-parts.js";
import { damageLocationsCms } from "@/constants/damage-locations-cms.js"; import { damageLocationsCms } from "@/constants/damage-locations-cms.js";
@ -169,12 +159,12 @@ export default {
this.$route this.$route
); );
}, },
onSubmit(values) { // onSubmit(values) {
// window.alert('Success! Submitted values: ' + JSON.stringify(values, null ,2)) // // window.alert('Success! Submitted values: ' + JSON.stringify(values, null ,2))
// TODO - ADD IN SAVING OF DATA // // TODO - ADD IN SAVING OF DATA
// TODO - ADD IN ADVANCING TO NEXT PAGE // // TODO - ADD IN ADVANCING TO NEXT PAGE
console.log('submitted: ', JSON.stringify(values, null, 2)); // console.log('submitted: ', JSON.stringify(values, null, 2));
}, // },
onInvalidSubmit({ values, errors, results }) { onInvalidSubmit({ values, errors, results }) {
// identify the first error field and put focus on it // identify the first error field and put focus on it
// get error names array // get error names array
@ -260,7 +250,7 @@ export default {
return selectedGlassToReplace; return selectedGlassToReplace;
}, },
}, },
computed:{ computed: {
isWindshieldDamageLocation() { isWindshieldDamageLocation() {
return this.selectedDamageLocations.some(selectedDamages => return this.selectedDamageLocations.some(selectedDamages =>
{ {
@ -282,7 +272,7 @@ export default {
isWindshieldRepair() { isWindshieldRepair() {
if (!this.isWindshieldDamageLocation) return false; if (!this.isWindshieldDamageLocation) return false;
return this.selectedWindshieldOptions.selectedWindshieldDamageType.some(selectedDamageType => return this.selectedWindshieldOptions.selectedWindshieldDamageType && this.selectedWindshieldOptions.selectedWindshieldDamageType.some(selectedDamageType =>
{ {
return selectedDamageType.toUpperCase() === "REPAIR"; return selectedDamageType.toUpperCase() === "REPAIR";
}); });
@ -302,7 +292,10 @@ export default {
{ {
return selectedPassengerSide.toUpperCase() === damageLocationsCms.PASSENGERSIDE; return selectedPassengerSide.toUpperCase() === damageLocationsCms.PASSENGERSIDE;
}); });
} },
hasRepairReplaceConflict() {
return this.isWindshieldDamageLocation && this.selectedDamageLocations.length > 1 && this.isWindshieldRepair;
},
}, },
components: { components: {

8
src/layouts/vehicle-damage/windshield-options/windshield-options.vue
View file

@ -2,13 +2,13 @@
<div class="windshield-options"> <div class="windshield-options">
<windshieldDamageTypeQuestion ref="windshieldDamageTypeQuestion" <windshieldDamageTypeQuestion ref="windshieldDamageTypeQuestion"
:isAvailable=isWindshieldDamageLocation :isAvailable=isWindshieldDamageLocation
:suppressError="suppressError" :suppressError="hasRepairReplaceConflict"
groupName="WindshieldDamageTypeQuestion" groupName="WindshieldDamageTypeQuestion"
v-model="selectedWindshieldDamageTypeValues" v-model="selectedWindshieldDamageTypeValues"
validationRules="windshield-damage-type-required|checkForRepairAndReplace:@DamageLocationQuestion" validationRules="windshield-damage-type-required|checkForRepairAndReplace:@DamageLocationQuestion"
/> />
<windshieldChipCountQuestion ref="windshieldChipCountQuestion" <windshieldChipCountQuestion ref="windshieldChipCountQuestion"
:isAvailable=isRepairOptionSelected :isAvailable="isRepairOptionSelected && !hasRepairReplaceConflict"
groupName="WindshieldChipCountQuestion" groupName="WindshieldChipCountQuestion"
v-model="selectedWindshieldChipCountValues" v-model="selectedWindshieldChipCountValues"
validationRules="windshield-chip-count-required" validationRules="windshield-chip-count-required"
@ -29,7 +29,7 @@ import windshieldChipCountQuestion from"@/layouts/vehicle-damage/windshield-opti
import replaceOptionsQuestion from"@/layouts/vehicle-damage/replace-options-question/replace-options-question"; import replaceOptionsQuestion from"@/layouts/vehicle-damage/replace-options-question/replace-options-question";
import { defineRule } from "vee-validate"; import { defineRule } from "vee-validate";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
import errorMessages from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
// DEFINE VALIDATION RULES // DEFINE VALIDATION RULES
defineRule("windshield-damage-type-required", required(errorMessages.WINDSHIELD_DAMAGE_TYPE_REQUIRED)); defineRule("windshield-damage-type-required", required(errorMessages.WINDSHIELD_DAMAGE_TYPE_REQUIRED));
@ -49,7 +49,7 @@ export default ({
props: { props: {
modelValue: Array, modelValue: Array,
selectedDamageLocations: Array, selectedDamageLocations: Array,
suppressError: Boolean hasRepairReplaceConflict: Boolean
}, },
methods: { methods: {