unverified scenarios WIP
This commit is contained in:
Katie Kroell
parent
e78e96ab37
commit
d7cd7f0063
4 changed files with 44 additions and 22 deletions
|
|
@ -4,7 +4,7 @@ const bailoutCode = Object.freeze({
|
|||
VehicleNotFound: 2,
|
||||
VehicleVinLookupError: 3,
|
||||
CoverageStatementInvalidState: 4,
|
||||
DoNotSeeMyShop: 5,
|
||||
NeedHelp: 5,
|
||||
PricingResponseError: 6,
|
||||
TPANotEnabled: 7,
|
||||
RequestCallback: 8,
|
||||
|
|
|
|||
|
|
@ -33,9 +33,9 @@ const bailoutMessage = Object.freeze({
|
|||
code: bailoutCode.CoverageStatementInvalidState,
|
||||
message: 'Coverage Statement has entered an invalid state'
|
||||
}),
|
||||
doNotSeeMyShop: () => ({
|
||||
code: bailoutCode.DoNotSeeMyShop,
|
||||
message: 'User does not see their shop.'
|
||||
needHelp: () => ({
|
||||
code: bailoutCode.NeedHelp,
|
||||
message: 'User clicked Need Help link.'
|
||||
}),
|
||||
pricingResponseError: (lineItems, error) => ({
|
||||
code: bailoutCode.PricingResponseError,
|
||||
|
|
@ -66,9 +66,9 @@ const bailoutMessage = Object.freeze({
|
|||
message: 'User selected to continue a referral where a TPA shop was previously selected.'
|
||||
}),
|
||||
vehicleYMMSLookupError: (year, make, model, style, error) => {
|
||||
const baseMessage = "An error occurred looking up vehicle";
|
||||
const baseMessage = 'An error occurred looking up vehicle';
|
||||
const errorMessage = `Error: ${getItemData(error)}`;
|
||||
|
||||
|
||||
const getMessage = (year, make, model, style) => {
|
||||
if (!year) return `${baseMessage} years. ${errorMessage}`;
|
||||
if (!make) return `${baseMessage} makes for Year: ${year}. ${errorMessage}`;
|
||||
|
|
@ -76,12 +76,12 @@ const bailoutMessage = Object.freeze({
|
|||
if (!style) return `${baseMessage} styles for Year: ${year}, Make: ${make}, Model: ${model}. ${errorMessage}`;
|
||||
return `${baseMessage} with Year: ${year}, Make: ${make}, Model: ${model}, Style: ${style}. ${errorMessage}`;
|
||||
};
|
||||
|
||||
|
||||
return {
|
||||
code: bailoutCode.VehicleYMMSLookupError,
|
||||
message: getMessage(year, make, model, style)
|
||||
};
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
export default bailoutMessage;
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ export const pageProgressMapper = {
|
|||
percent: 50
|
||||
},
|
||||
'coverage-statement': {
|
||||
percent: 55
|
||||
percent: 50
|
||||
},
|
||||
'provider-preference': {
|
||||
percent: 60
|
||||
|
|
|
|||
|
|
@ -15,26 +15,32 @@
|
|||
<div class="coverage-statement-container iss-heritage-content-container-width">
|
||||
<h5
|
||||
ref="siteSubHeader"
|
||||
class="sub-header text-black mt-4"
|
||||
class="sub-header text-black"
|
||||
v-html="coverageStatementSubHeader"></h5>
|
||||
<div
|
||||
ref="explanatoryText"
|
||||
class="body-text mt-2"
|
||||
class="body-text"
|
||||
v-html="explanatoryText"></div>
|
||||
<div
|
||||
ref="secondaryText"
|
||||
class="mt-4 mb-1 fw-bold text-black"
|
||||
v-html="secondaryText"></div>
|
||||
<div class="itac-price-container" v-if="isITACQuoteVisible">
|
||||
<div
|
||||
v-if="isITACQuoteVisible"
|
||||
class="itac-price-container">
|
||||
<div class="itac-deductible-value-container">
|
||||
<div class="itac-deductible-value-text">Your deductible:</div>
|
||||
<div class="itac-deductible-value-text">
|
||||
Your deductible:
|
||||
</div>
|
||||
<div class="itac-deductible-value">
|
||||
{{ formatAmountInDollars(deductibleValue) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="separator"></div>
|
||||
<div class="itac-cost-container">
|
||||
<div class="itac-cost-text">Safelite price*:</div>
|
||||
<div class="itac-cost-text">
|
||||
Safelite price*:
|
||||
</div>
|
||||
<div class="cost">
|
||||
{{ formatAmountInDollars(totalServicePrice) }}
|
||||
</div>
|
||||
|
|
@ -57,30 +63,31 @@
|
|||
class="body-text"
|
||||
v-html="nextStepsBody"></div>
|
||||
<buttonMain
|
||||
v-if="isNoCompQuoteVisible || isITACQuoteVisible"
|
||||
ref="buttonMain"
|
||||
class="full-width-button mt-5"
|
||||
variant="navigation"
|
||||
buttonText="Continue scheduling"
|
||||
@clickEvent="continueToSchedule" />
|
||||
<textLink
|
||||
v-if="isNoCompQuoteVisible || isITACQuoteVisible"
|
||||
class="underlined-text cancel-link mt-5"
|
||||
linkType="text"
|
||||
text="No, I want to cancel"
|
||||
text="No, I want to cancel"
|
||||
href="#"
|
||||
@clickEvent="cancelClaim" />
|
||||
<textBlock
|
||||
class="mt-5"
|
||||
v-if="isDisclaimerVisible"
|
||||
class="mt-5"
|
||||
:customText="disclaimerText"
|
||||
typeStyle="caption" />
|
||||
<siteFooter
|
||||
v-if="isUnverifiedVisible || isDeductibleVisible"
|
||||
:ref="SITE_FOOTER_REF_NAME"
|
||||
class="mt-5"
|
||||
isForwardButtonHidden="true"
|
||||
cmsWidgetName="SiteFooterWidget"
|
||||
:isForwardActionDisabled="!meta.valid"
|
||||
@backClicked="navigateBackByVehicleQuestions"/>
|
||||
|
||||
@backClicked="navigateBackByVehicleQuestions" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -104,7 +111,6 @@
|
|||
import { Form } from 'vee-validate';
|
||||
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
||||
import siteHeader from '@/iss-components/site-header/site-header.vue';
|
||||
import alert from '@/ux-components/alert/alert.vue';
|
||||
import cancelClaimModal from '@/layouts/coverage-statement/cancel-claim-modal/cancel-claim-modal.vue';
|
||||
import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal.vue';
|
||||
import textBlock from '@/digital-components/text-block/text-block.vue';
|
||||
|
|
@ -145,7 +151,6 @@ export default {
|
|||
siteHeader,
|
||||
// eslint-disable-next-line vue/no-reserved-component-names
|
||||
Form,
|
||||
alert,
|
||||
cancelClaimModal,
|
||||
contentGroupModal,
|
||||
buttonMain,
|
||||
|
|
@ -354,6 +359,12 @@ export default {
|
|||
},
|
||||
isRepair() {
|
||||
return this.mainStore.order.damage.isRepair;
|
||||
},
|
||||
isUnverifiedADAS() {
|
||||
return this.isUnverifiedVisible && this.isADAS;
|
||||
},
|
||||
isUnverifiedNonADAS() {
|
||||
return this.isUnverifiedVisible && !this.isADAS;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
|
@ -487,6 +498,10 @@ export default {
|
|||
return !isRepair && this.isDeductibleVisible && this.deductibleValue <= 0;
|
||||
case 'verifiedReplaceDeductibleOverZero':
|
||||
return !isRepair && this.isDeductibleVisible && this.deductibleValue > 0;
|
||||
case 'unverifiedADAS':
|
||||
return this.isUnverifiedADAS;
|
||||
case 'unverifiedNonADAS':
|
||||
return this.isUnverifiedNonADAS;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
|
|
@ -534,6 +549,8 @@ export default {
|
|||
}
|
||||
.sub-header {
|
||||
line-height: 2rem;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.full-width-button {
|
||||
width: 100%;
|
||||
|
|
@ -569,6 +586,11 @@ export default {
|
|||
}
|
||||
:deep(.body-text) {
|
||||
line-height: 1.5rem;
|
||||
color: $darker-gray;
|
||||
strong {
|
||||
color: $black;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
:deep(.question-text) {
|
||||
margin-top: 1.5rem;
|
||||
|
|
@ -597,7 +619,7 @@ export default {
|
|||
font-weight: $font-weight-bold;
|
||||
color: $black;
|
||||
padding: 10px;
|
||||
|
||||
|
||||
.itac-deductible-value-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
|||
Loading…
Reference in a new issue