CSR-319: add new alert error if no windshield replace option is available
This commit is contained in:
parent
00e62c4240
commit
a3c8998345
1 changed files with 36 additions and 4 deletions
|
|
@ -1,12 +1,20 @@
|
|||
<template>
|
||||
<div class="windshield-options">
|
||||
<windshieldDamageTypeQuestion ref="windshieldDamageTypeQuestion"
|
||||
<windshieldDamageTypeQuestion ref="windshieldDamageTypeQuestion"
|
||||
:isAvailable=isWindshieldDamageLocation
|
||||
:suppressError="hasRepairReplaceConflict"
|
||||
:suppressError="hasRepairReplaceConflict || showNoReplaceAvailableError"
|
||||
groupName="WindshieldDamageTypeQuestion"
|
||||
v-model="selectedWindshieldDamageTypeValues"
|
||||
validationRules="windshield-damage-type-required|checkForRepairAndReplace:@DamageLocationQuestion"
|
||||
:validationRules="isWindshieldReplaceAvailable ? 'windshield-damage-type-required|checkForRepairAndReplace:@DamageLocationQuestion' : 'windshield-damage-type-required|checkForRepairAndReplace:@DamageLocationQuestion|repairOnly'"
|
||||
/>
|
||||
<alert
|
||||
class="my-3"
|
||||
v-show="showNoReplaceAvailableError"
|
||||
alertClass="alert-danger"
|
||||
alertHeadline="Service not available"
|
||||
alertCopy="We're sorry, but we currently offer only repair service for your vehicle type. Need help with next steps? Call us at 800-394-0288."
|
||||
:isDismissible="false"
|
||||
/>
|
||||
<windshieldChipCountQuestion ref="windshieldChipCountQuestion"
|
||||
:isAvailable="isRepairOptionSelected && !hasRepairReplaceConflict"
|
||||
groupName="WindshieldChipCountQuestion"
|
||||
|
|
@ -27,6 +35,8 @@
|
|||
import windshieldDamageTypeQuestion from"@/layouts/vehicle-damage/windshield-options/windshield-damage-type-question/windshield-damage-type-question";
|
||||
import windshieldChipCountQuestion from"@/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question";
|
||||
import replaceOptionsQuestion from"@/layouts/vehicle-damage/replace-options-question/replace-options-question";
|
||||
import alert from "@/ux-components/alert/alert";
|
||||
|
||||
import { defineRule } from "vee-validate";
|
||||
import { required } from "@/helpers/validation-rules";
|
||||
import { errorMessages } from "@/constants/error-messages";
|
||||
|
|
@ -47,9 +57,22 @@ defineRule("checkForRepairAndReplace", (value, [other]) => {
|
|||
return true;
|
||||
});
|
||||
|
||||
defineRule("repairOnly", (value) => {
|
||||
if (value.toString().toUpperCase() === 'REPAIR') {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
export default ({
|
||||
name: "windshieldOptions",
|
||||
|
||||
data(){
|
||||
return {
|
||||
isWindshieldReplaceAvailable: Boolean,
|
||||
}
|
||||
},
|
||||
|
||||
props: {
|
||||
modelValue: Array,
|
||||
selectedDamageLocations: Array,
|
||||
|
|
@ -63,6 +86,8 @@ export default ({
|
|||
this.$refs.windshieldDamageTypeQuestion.initializeComponent(windshieldDamageTypeQuestionFromCms);
|
||||
this.$refs.windshieldChipCountQuestion.initializeComponent(windshieldChipCountQuestionFromCms);
|
||||
this.$refs.replaceOptionsQuestion.initializeComponent(windshieldReplaceOptionsQuestionFromCms, windshieldAvailableReplacementOptions);
|
||||
|
||||
this.isWindshieldReplaceAvailable = !(Array.isArray(windshieldAvailableReplacementOptions) && windshieldAvailableReplacementOptions.length < 1);
|
||||
},
|
||||
getWindshieldOptions(selectedWindshieldDamageType, selectedWindshieldChipCount, selectedWindshieldReplaceOptions){
|
||||
return {
|
||||
|
|
@ -121,11 +146,18 @@ export default ({
|
|||
|
||||
return this.selectedWindshieldDamageTypeValues.some(val => val.toUpperCase() === "REPLACE") && this.isWindshieldDamageLocation;
|
||||
},
|
||||
showNoReplaceAvailableError() {
|
||||
if (this.isReplaceOptionSelected && !this.isWindshieldReplaceAvailable) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
},
|
||||
components: {
|
||||
windshieldDamageTypeQuestion,
|
||||
windshieldChipCountQuestion,
|
||||
replaceOptionsQuestion
|
||||
replaceOptionsQuestion,
|
||||
alert,
|
||||
},
|
||||
})
|
||||
</script>
|
||||
Loading…
Reference in a new issue