tpa confirmation updates

This commit is contained in:
Katie Kroell 2024-01-23 16:45:47 -05:00
parent ade55f6e3d
commit e4ab35b405
2 changed files with 39 additions and 25 deletions

View file

@ -27,13 +27,18 @@
id="tpaConfirmationBodyTwo"
ref="tpaConfirmationBodyTwo"
:customText="tpaConfirmationBodyTwo"
class="small text-color--darker-gray" />
<div class="contact-carrier">
class="small text-color--darker-gray mb-4" />
<textBlock
id="contactCarrierText"
ref="contactCarrierText"
:customText="contactCarrierText"
class="small text-color--darker-gray"
@click="setBailoutInfo()" />
<!-- <div class="contact-carrier">
<span
v-for="copy in splitContactCarrierText"
:key="copy">
<span
v-if="doesCopyContainRouterLink(copy)">
v-for="copy in splitContactCarrierText"
:key="copy">
<span v-if="doesCopyContainRouterLink(copy)">
<routerLink
:to="{
query: { issPage: `${getRouterLinkRouteFromCopy(copy)}` },
@ -45,15 +50,14 @@
v-html="copy">
</span>
</span>
</div>
</div> -->
<div>
<textBlock
id="tpaConfirmationOrderDetailsTitle"
ref="tpaConfirmationOrderDetailsTitle"
:customText="orderDetailsTitle"
:marginTopSizeOverride="4"
class="order-details"
@click-event="navigateWithScenario()" />
class="order-details" />
<deductibleBox ref="deductibleBox" :value="deductibleBoxValue" />
</div>
<siteFooter
@ -87,6 +91,7 @@ import BaseFormMixin from '@/mixins/base-form-mixin.js';
import { useMainStore } from '@/store';
import widgetFields from '@/constants/cms-widget-fields';
import { toTitleCase, toDisplayPhoneNumber, formatAmountInDollars } from '@/helpers/text-helper.js';
import bailoutMessage from '@/constants/bailoutMessage';
const VERIFYING_COVERAGE = 'Verifying coverage';
@ -123,17 +128,18 @@ export default {
return { mainStore };
},
data() {
const { companyName } = toTitleCase(useMainStore().order.serviceLocation.provider.companyName ?? '');
// const { companyName } = toTitleCase(useMainStore().order.serviceLocation.provider.companyName ?? '');
return {
widget: {
tpaConfirmation: 'TPAConfirmationContent',
orderDetails: 'OrderDetailsContent',
contactCarrier: 'ContactCarrierContent'
},
companyName,
customValueMap: {
glassShop: companyName
}
// companyName,
// customValueMap: {
// glassShop: companyName,
// carrierPhoneNumber
// }
};
},
computed: {
@ -174,12 +180,20 @@ export default {
return this.getCmsContent('TPAConfirmationContent', 'Image');
},
contactCarrierText() {
return this.getCmsContent(this.widget.contactCarrier, widgetFields.TEXT_BLOCK_WIDGET.TEXT);
return this.getCmsContent(this.widget.contactCarrier, widgetFields.TEXT_BLOCK_WIDGET.TEXT)
.replaceAll('{custom:carrierPhoneNumber}', this.carrierPhoneNumber);
},
splitContactCarrierText() {
return this.splitCopyOnCMSPlaceHolder(this.contactCarrierText);
// TODO: Replace with carrier number when account service is ready
carrierPhoneNumber() {
return '800-000-0000';
},
carrierDisplayURL() {
return this.mainStore.issConfig.clientName.replace(/\s/g, '');
}
},
mounted() {
this.$refs.siteFooter.updateButtonText(`Go back to ${this.carrierDisplayURL}.com`);
},
methods:
{
async forwardButtonAction() {
@ -202,8 +216,8 @@ export default {
return null;
}
},
navigate(scenario) {
this.$router.navigate(scenario, this.$route);
setBailoutInfo() {
this.mainStore.setBailout(this.$router.currentRoute, bailoutMessage.RequestCallback);
},
toDisplayPhoneNumber,
toTitleCase,
@ -241,7 +255,6 @@ export default {
color: $darker-gray;
line-height: 1.5rem;
font-size: 14px;
margin-bottom: 1rem;
strong {
color: $black;
@ -262,10 +275,11 @@ export default {
margin-top: 2rem;
}
.contact-carrier {
font-size: 14px;
#contactCarrierText {
line-height: 1.5rem;
color: $darker-gray;
margin-top: 1rem;
:deep(a) {
font-weight: 500;
}
}
</style>

View file

@ -64,7 +64,7 @@ import vinLocationInformation from '@/layouts/vin-lookup/vin-location-informatio
import vinLookupAlerts from '@/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue';
import vinQuestion from '@/layouts/vin-lookup/vin-question/vin-question.vue';
import bailoutCode from '@/constants/bailoutCode';
import bailoutMessage from "@/constants/bailoutMessage";
import bailoutMessage from '@/constants/bailoutMessage';
export default {
name: 'vin-lookup',