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

coverage-statement navigation scenarios and content

Browse source
This commit is contained in:
Katie Kroell 2023-07-13 16:36:06 -04:00
parent af577f2445
commit e25a37ef41
3 changed files with 133 additions and 117 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

240
src/layouts/coverage-statement/coverage-statement.vue
View file

@ -7,26 +7,31 @@
<div class="container-fluid pb-2">
<div class="row px-3">
<div class="col">
<div class="select-car-form rounded pb-1 mt-4">
<div class="pb-1 mt-4">
<h5
v-html="coverageStatementSubHeader"
class="d-flex justify-content-center text-black">
class="text-center text-black">
</h5>
<div>
<p class="d-flex justify-content-center">
<span v-html="secondaryText"></span>
<span class="text"></span>
</p>
<div
v-html="explanatoryText"
class="body-text text-center mt-4">
</div>
<div>
<p class="d-flex justify-content-center secondary-text" v-if="verifiedDeductible">
{{ formattedDeductible }}
</p>
<div>
<p class="d-flex justify-content-center secondary-text" v-if="verifiedITAC">
{{ formattedServicePrice }}
</p>
<p v-if="verifiedITAC">Your deductible is: {{ formattedDeductible }}</p>
<div
v-html="secondaryText"
class="text-center mt-4 fw-bold text-black">
</div>
<div
v-if="verifiedDeductible"
class="d-flex justify-content-center cost">
{{ formattedDeductible }}
<div
v-if="displayQuote"
class="d-flex justify-content-center cost" >
{{ formattedServicePrice }}
</div>
<div
v-if="verifiedITAC">Your deductible is:
{{ formattedDeductible }}
</div>
</div>
<alert
@ -37,36 +42,26 @@
alertClass="alert-success"
v-bind:isDismissible="false">
</alert>
<p
v-html="explanatoryText"
id="explanatory">
</p>
<div
v-html="nextStepsHeader"
class="fw-bold text-black mb-2">
</div>
<div
v-html="nextStepsBody"
id="nextStepsBody">
</div>
<!-- <textBlock
cmsWidgetName="verifyingCoverageStatement"
typeStyle="h5"
justifyText="center"
class="mt-4 mb-4"
id="coverage-statement-text-block" /> -->
<!-- <div>
<p v-html="continueWithSchedulingBodyText" class="mt-0 small" ></p>
</div> -->
<!-- <textBlock
cmsWidgetName="whatHappensNextCopy"
class="mt-4 mb-2 fw-bold"
id="coverage-statement-text-block" /> -->
<div>
<!-- <p class="small" v-html="bodyText" ref="coverageStatementBodyText"></p> -->
class="body-text">
</div>
<steeringText cmsWidgetName="MASteeringText" ></steeringText>
<buttonQuestion
v-if="displayQuote"
cmsWidgetName="ServiceProviderQuestion"
:questionText="questionText"
:answers="answersFromCms"
buttonTypeString="listButton"
isRequired
v-model="selectedProvider"
validationRules="selection-required"
id="coverage-button-question">
</buttonQuestion>
</div>
<siteFooter
class="mt-5"
@ -89,7 +84,7 @@
// Import Component
import baseFormMixin from '@/mixins/base-form-mixin';
import { Form } from 'vee-validate';
import { Form, defineRule } from 'vee-validate';
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
import siteHeader from '@/iss-components/site-header/site-header.vue';
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
@ -97,7 +92,8 @@ import textBlock from "@/digital-components/text-block/text-block";
import recalModal from '@/layouts/coverage-statement/recal-modal/recal-modal.vue';
import steeringText from "@/iss-components/steering-text/steering-text.vue";
import alert from "@/ux-components/alert/alert";
import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal';
import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal';
import buttonQuestion from "@/digital-components/button-question/button-question";
// Import Supporting Files
import { fetchCmsContentForPage, setupModalLinks } from '@/helpers/cms-content-helper';
@ -106,6 +102,11 @@ import { getDamageString } from '@/helpers/damage-helper.js';
import { useMainStore } from "@/store";
import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
import { processIfStatements } from '@/helpers/cms-content-helper';
import { required } from "@/helpers/validation-rules";
import { errorMessages } from "@/constants/error-messages";
// DEFINE VALIDATION RULES
defineRule("selection-required", required(errorMessages.OPTION_REQUIRED));
const store = useMainStore();
@ -167,7 +168,8 @@ export default {
recalModal,
steeringText,
alert,
contentGroupModal
contentGroupModal,
buttonQuestion
},
mounted() {
setupModalLinks(this);
@ -179,6 +181,7 @@ export default {
supportingItems: [],
pricedGlassParts: [],
availableLineItems: [],
selectedProvider: "",
}
},
computed: {
@ -202,44 +205,6 @@ export default {
let body = this.getBodyTextFromCms("NextStepsWidget").replaceAll("{custom:damage}", this.damageText);
return body;
},
// coverageStatementContent() {
// if (!this.cmsWidgetName) return [];
// const cmsContent = [];
// cmsContent.push(
// {
// Name: 'SubHeader',
// cmsWidgetName: 'SiteSubHeaderWidget'
// },
// {
// Name: 'ExplanatoryText',
// cmsWidgetName: 'ExplanatoryTextWidget'
// },
// {
// Name: 'NextSteps',
// cmsWidgetName: 'NextStepsWidget'
// }
// );
// //if cms content has not yet loaded, skip
// if (this.getCmsContent(cmsAnswersContent[0].cmsWidgetName, 'HeaderText') == '') {
// return {};
// }
// bodyText() {
// if (useMainStore().damage.isRepair) {
// return this.unverifiedNonADASRepairBodyText;
// }
// else {
// let parts = useMainStore().lineItems.glassParts;
// // if ADAS, display ADASNextSteps
// if (parts != null && parts.filter(part => part.requiresRecalibration).length > 0) {
// return this.unverifiedADASNextStepsBodyText;
// }
// // if non-ADAS, display NonADASNextSteps
// else {
// return this.unverifiedNonADASNextStepsBodyText;
// }
// }
// },
continueWithSchedulingBodyText() {
return this.getCmsContent("continueWithSchedulingCopy", "BodyText");
},
@ -256,12 +221,6 @@ export default {
var damageString = getDamageString();
return damageString == "match" ? "" : damageString;
},
// selectedVehiclePolicyInfo() {
// const matchingVehicle = this.policyVehicles.filter(
// (vehicle) => vehicle.vin === store.order.vehicle.vin
// )
// return matchingVehicle;
// },
vehicleDeductible() {
if (this.coverageVerified) {
if (store.order.damage.isRepair) {
@ -273,19 +232,19 @@ export default {
return replaceDeductible;
}
}
//console.log(this.selectedVehicle[0].coverages[0].deductible);
//const deductible = this.selectedVehiclePolicyInfo[0].coverages[0].deductible;
//console.log(!this.selectedVehiclePolicyInfo[0].coverages[0]);
//return deductible;
},
formattedDeductible() {
return this.getDeductibleString(this.vehicleDeductible);
},
isDeductibleZero() {
return this.vehicleDeductible === 0;
if (this.coverageVerified && !this.verifiedNoComp) {
return this.vehicleDeductible === 0;
}
},
deductibleOverZero() {
return this.vehicleDeductible > 0;
if (this.coverageVerified && !this.verifiedNoComp) {
return !this.isDeductibleZero;
}
},
coverageVerified() {
return true;
@ -301,14 +260,14 @@ export default {
}
},
verifiedITAC() {
if (this.coverageVerified) {
if (this.coverageVerified && !this.verifiedNoComp) {
if (this.vehicleDeductible > this.totalServicePrice) {
return true;
}
}
},
verifiedDeductible() {
if (this.coverageVerified) {
if (this.coverageVerified && !this.verifiedNoComp) {
if (this.totalServicePrice > this.vehicleDeductible) {
return true;
}
@ -344,9 +303,19 @@ export default {
return this.getServicePriceString(this.totalServicePrice);
},
costSavings() {
return this.getITACCostSavings(this.vehicleDeductible, this.totalServicePrice);
},
questionText() {
return this.getCmsContent("ServiceProviderQuestion", "QuestionText");
},
answersFromCms() {
return this.getCmsContent("ServiceProviderQuestion", "Answers");
},
displayQuote() {
if (this.verifiedITAC || this.verifiedNoComp) {
return true;
}
}
},
methods: {
@ -356,6 +325,35 @@ export default {
}
return false;
},
async forwardButtonAction() {
return await this.navigateForward();
},
async navigateForward() {
if (this.coverageUnverified || this.verifiedDeductible) {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD,
this.$route
)
}
else if (this.verifiedITAC || this.verifiedNoComp) {
if (this.selectedProvider === "Safelite") {
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_SAFELITE,
this.$route
)
}
else if (store.issConfig.enableTPAFlow){
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_THIRD_PARTY,
this.$route
)
}
else {
//display TPA bailout modal
}
}
},
openModalAction(modalName) {
this.$refs[modalName.args].openModal();
},
@ -396,6 +394,10 @@ export default {
return this.nonADASReplace;
case 'nonADASRepair':
return this.nonADASRepair;
case 'deductibleOverZero':
return this.deductibleOverZero
case 'isDeductibleZero':
return this.isDeductibleZero
default:
return null;
}
@ -404,8 +406,6 @@ export default {
return lineItem.kitPrice + lineItem.laborAmount + lineItem.sellingPrice;
},
getDeductibleString(deductible) {
console.log(this.vehicleDeductible);
console.log(this.deductibleOverZero);
const formattedDeductibleFloat = parseFloat(deductible).toFixed(2);
return '$' + formattedDeductibleFloat;
},
@ -418,38 +418,44 @@ export default {
return savings;
}
},
watch: {
selectedProvider() {
if (this.selectedProvider === "Safelite") {
this.$refs.siteFooter.updateButtonText('Continue with Safelite');
}
else {
this.$refs.siteFooter.updateButtonText('Continue');
}
}
}
};
</script>
<style lang="scss">
ol {
margin-left: -1rem;
margin-bottom:0;
li {
margin-bottom: .5rem;
line-height: 1.5rem;
a {
line-height: 1.5rem;
padding: 0;
}
.body-text {
p {
font-size: 14px;
line-height: 24px;
margin-bottom: 8px;
}
}
#coverage-statement-text-block {
color: $black;
}
p strong {
color: $black;
font-weight: 500;
}
p.small{
margin-bottom:0;
}
.secondary-text {
.cost {
color: $green;
font-size: 32px;
font-weight: 300;
margin-bottom: 24px;
line-height: 44px;
}
#coverage-button-question {
.question-text {
margin-bottom: 8px;
}
.question-text > span {
text-align: left;
line-height: 24px;
}
}
</style>

2
src/router/router-constants/navigation-scenarios.js
View file

@ -54,6 +54,8 @@ const navigationScenarios = {
// Coverage Statement
CLICKED_BACK_WITH_REPAIR: "CLICKED_BACK_WITH_REPAIR",
CLICKED_FORWARD_WITH_SAFELITE: "CLICKED_FORWARD_WITH_SAFELITE",
CLICKED_FORWARD_WITH_THIRD_PARTY: "CLICKED_FORWARD_WITH_THIRD_PARTY",
//Provider Preference
CLICKED_FORWARD_WITH_SAFELITE: "CLICKED_FORWARD_WITH_SAFELITE",

8
src/router/router-constants/routing-table.js
View file

@ -430,6 +430,14 @@ const routingTable = function(store) {
scenario: navigationScenarios.CLICKED_FORWARD,
destinationIssPageValue: issPageValues.PROVIDER_PREFERENCE
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_SAFELITE,
destinationIssPageValue: issPageValues.SERVICE_LOCATION
},
{
scenario: navigationScenarios.CLICKED_FORWARD_WITH_THIRD_PARTY,
destinationIssPageValue: issPageValues.TPA_SEARCH
},
]
},
{