last updates for this card for now.
remove vehicle banner blindly make header/css changes
This commit is contained in:
parent
4d14c07fcd
commit
1413140bef
10 changed files with 67 additions and 80 deletions
|
|
@ -166,7 +166,6 @@ export default {
|
||||||
referralNumber: referralNumber?.toString(),
|
referralNumber: referralNumber?.toString(),
|
||||||
widgets: {
|
widgets: {
|
||||||
siteHeader: 'SiteHeaderWidget',
|
siteHeader: 'SiteHeaderWidget',
|
||||||
vehicleBanner: 'VehicleBannerWidget',
|
|
||||||
emailConfirmation: 'EmailConfirmationWordingWidget',
|
emailConfirmation: 'EmailConfirmationWordingWidget',
|
||||||
orderConfirmation: 'OrderConfirmationContent',
|
orderConfirmation: 'OrderConfirmationContent',
|
||||||
mobile: 'MobileWordingWidget',
|
mobile: 'MobileWordingWidget',
|
||||||
|
|
|
||||||
|
|
@ -83,7 +83,6 @@ import { Form } from 'vee-validate';
|
||||||
import issPageValues from '@/router/router-constants/issPage-values';
|
import issPageValues from '@/router/router-constants/issPage-values';
|
||||||
import bailoutMessage from '@/constants/bailoutMessage';
|
import bailoutMessage from '@/constants/bailoutMessage';
|
||||||
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
import { AppointmentTypeStrings } from '@/constants/schedule-constants';
|
||||||
import VehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
|
|
||||||
import { saveSession, submitWorkOrder } from '@/helpers/order-helper.js';
|
import { saveSession, submitWorkOrder } from '@/helpers/order-helper.js';
|
||||||
import { experimentSettings } from '@/constants/experiments';
|
import { experimentSettings } from '@/constants/experiments';
|
||||||
import submitType from '@/constants/submit-type';
|
import submitType from '@/constants/submit-type';
|
||||||
|
|
@ -101,8 +100,7 @@ export default {
|
||||||
reviewDropdown,
|
reviewDropdown,
|
||||||
cartDropdown,
|
cartDropdown,
|
||||||
paymentMethodQuestion,
|
paymentMethodQuestion,
|
||||||
alert,
|
alert
|
||||||
VehicleBanner
|
|
||||||
},
|
},
|
||||||
mixins: [baseFormMixin],
|
mixins: [baseFormMixin],
|
||||||
async beforeRouteEnter(to, from, next) {
|
async beforeRouteEnter(to, from, next) {
|
||||||
|
|
|
||||||
|
|
@ -191,7 +191,7 @@ const defaultOrder = {
|
||||||
damage: {
|
damage: {
|
||||||
isRepair: false,
|
isRepair: false,
|
||||||
numberOfChips: null,
|
numberOfChips: null,
|
||||||
glassToReplace: [{location: 'windshield'}]
|
glassToReplace: [{ location: 'windshield' }]
|
||||||
},
|
},
|
||||||
lineItems: {
|
lineItems: {
|
||||||
glassParts: [parts.windshield],
|
glassParts: [parts.windshield],
|
||||||
|
|
@ -380,7 +380,7 @@ describe('payment-page.vue', () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
const { wrapper } = getMountedComponent(defaultOrder);
|
const { wrapper } = getMountedComponent(defaultOrder);
|
||||||
|
|
||||||
const outerDiv = wrapper.find('.container-fluid');
|
const outerDiv = wrapper.find('.fade-on-route-transition');
|
||||||
const clickFn = jest.fn();
|
const clickFn = jest.fn();
|
||||||
outerDiv.element.addEventListener('click', clickFn);
|
outerDiv.element.addEventListener('click', clickFn);
|
||||||
|
|
||||||
|
|
@ -443,7 +443,7 @@ describe('payment-page.vue', () => {
|
||||||
const { wrapper } = getMountedComponent(defaultOrder);
|
const { wrapper } = getMountedComponent(defaultOrder);
|
||||||
useMainStore().order.payment.paymentMethod = paymentMethods.PayNow;
|
useMainStore().order.payment.paymentMethod = paymentMethods.PayNow;
|
||||||
|
|
||||||
useMainStore().savePaymentMethodChoice = jest.fn().mockImplementation((value) => {useMainStore().order.payment.paymentMethod = value});
|
useMainStore().savePaymentMethodChoice = jest.fn().mockImplementation((value) => { useMainStore().order.payment.paymentMethod = value; });
|
||||||
|
|
||||||
// Act
|
// Act
|
||||||
wrapper.vm.handleIFrameContentWindowMessage(event);
|
wrapper.vm.handleIFrameContentWindowMessage(event);
|
||||||
|
|
|
||||||
|
|
@ -4,16 +4,14 @@
|
||||||
v-slot="{ meta }"
|
v-slot="{ meta }"
|
||||||
@submit="onSubmit"
|
@submit="onSubmit"
|
||||||
@invalidSubmit="onInvalidSubmit">
|
@invalidSubmit="onInvalidSubmit">
|
||||||
<div class="container-fluid fade-on-route-transition service-packages">
|
<div class="fade-on-route-transition service-packages">
|
||||||
<div class="row justify-content-center">
|
<div class="justify-content-center">
|
||||||
<div class="col-md-6 px-0 px-md-2">
|
<siteHeader cmsWidgetName="SiteHeaderWidget" />
|
||||||
<siteHeader cmsWidgetName="SiteHeaderWidget" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="row justify-content-center">
|
<div class="iss-heritage-container-width">
|
||||||
<div class="col-md-6 col-xl-4">
|
<div class="service-packages-container iss-heritage-content-container-width">
|
||||||
<siteSubHeader
|
<siteSubHeader
|
||||||
class="mb-2 mt-4"
|
class="mt-4"
|
||||||
subHeaderClasses="mt-5"
|
subHeaderClasses="mt-5"
|
||||||
justification="left"
|
justification="left"
|
||||||
cmsWidgetName="SiteSubHeaderWidget"
|
cmsWidgetName="SiteSubHeaderWidget"
|
||||||
|
|
@ -199,6 +197,15 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.iss-heritage-container-width {
|
||||||
|
.service-packages-container {
|
||||||
|
position: relative;
|
||||||
|
min-height: 1px;
|
||||||
|
padding-left: .9375rem;
|
||||||
|
padding-right: .9375rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.subheader-secondary {
|
.subheader-secondary {
|
||||||
margin-top: 0.5rem;
|
margin-top: 0.5rem;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
|
|
|
||||||
|
|
@ -78,18 +78,18 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu
|
||||||
const defaultOrder = {
|
const defaultOrder = {
|
||||||
serviceLocation: {
|
serviceLocation: {
|
||||||
provider: {
|
provider: {
|
||||||
companyName: "Hershey",
|
companyName: 'Hershey',
|
||||||
phoneNumber: "726-117-0377"
|
phoneNumber: '726-117-0377'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
currentDeductible: 479,
|
currentDeductible: 479,
|
||||||
isVerified: false,
|
isVerified: false,
|
||||||
carrierPhoneNumber: "757-277-0388",
|
carrierPhoneNumber: '757-277-0388',
|
||||||
vehicle: {
|
vehicle: {
|
||||||
imageUrl: 'url for image',
|
imageUrl: 'url for image',
|
||||||
category: 'car'
|
category: 'car'
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
|
|
||||||
describe('TPAConfirmation.vue', () => {
|
describe('TPAConfirmation.vue', () => {
|
||||||
describe('Rendering', () => {
|
describe('Rendering', () => {
|
||||||
|
|
@ -108,13 +108,6 @@ describe('TPAConfirmation.vue', () => {
|
||||||
// Assert
|
// Assert
|
||||||
expect(siteHeader.exists()).toBe(true);
|
expect(siteHeader.exists()).toBe(true);
|
||||||
});
|
});
|
||||||
test('Should render Vehicle Banner', () => {
|
|
||||||
// Act
|
|
||||||
const vehicleBanner = wrapper.findComponent({ ref: 'vehicleBanner' });
|
|
||||||
|
|
||||||
// Assert
|
|
||||||
expect(vehicleBanner.exists()).toBe(true);
|
|
||||||
});
|
|
||||||
test('Should render Confirmation Body One', () => {
|
test('Should render Confirmation Body One', () => {
|
||||||
// Act
|
// Act
|
||||||
const bodyOne = wrapper.findComponent({ ref: 'tpaConfirmationBodyOne' });
|
const bodyOne = wrapper.findComponent({ ref: 'tpaConfirmationBodyOne' });
|
||||||
|
|
@ -249,7 +242,7 @@ describe('TPAConfirmation.vue', () => {
|
||||||
[false, false, 0],
|
[false, false, 0],
|
||||||
[false, false, 500],
|
[false, false, 500],
|
||||||
[true, true, 0],
|
[true, true, 0],
|
||||||
[false, true, 500]
|
[false, true, 500]
|
||||||
])('with argument zeroDeductible', (expected, isVerified, deductible) => {
|
])('with argument zeroDeductible', (expected, isVerified, deductible) => {
|
||||||
test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => {
|
test(`returns ${expected} when coverageStatus is ${getEnumName(coverageStatuses, status)} and currentDeductible is ${deductible}`, () => {
|
||||||
// Arrange
|
// Arrange
|
||||||
|
|
|
||||||
|
|
@ -4,21 +4,14 @@
|
||||||
v-slot="{ meta }"
|
v-slot="{ meta }"
|
||||||
@submit="onSubmit"
|
@submit="onSubmit"
|
||||||
@invalidSubmit="onInvalidSubmit">
|
@invalidSubmit="onInvalidSubmit">
|
||||||
<div class="container-fluid fade-on-route-transition">
|
<div class="fade-on-route-transition">
|
||||||
<div class="row justify-content-center">
|
<div class="justify-content-center">
|
||||||
<div class="col-md-6 px-0 px-md-2">
|
<siteHeader
|
||||||
<siteHeader
|
ref="siteHeader"
|
||||||
ref="siteHeader"
|
cmsWidgetName="SiteHeaderWidget" />
|
||||||
cmsWidgetName="SiteHeaderWidget" />
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="row justify-content-center">
|
<div class="iss-heritage-container-width">
|
||||||
<div class="col-md-6 col-xl-4">
|
<div class="tpa-confirmation-container iss-heritage-content-container-width">
|
||||||
<vehicleBanner
|
|
||||||
ref="vehicleBanner"
|
|
||||||
class="mb-4"
|
|
||||||
cmsWidgetName="VehicleBannerWidget"
|
|
||||||
:displayGenericVehicleImage="false" />
|
|
||||||
<div class="d-flex justify-content-center align-items-center text-color--black pb-2 fs-5">
|
<div class="d-flex justify-content-center align-items-center text-color--black pb-2 fs-5">
|
||||||
<img :src="tpaConfirmationImage" />
|
<img :src="tpaConfirmationImage" />
|
||||||
<span
|
<span
|
||||||
|
|
@ -69,7 +62,6 @@
|
||||||
<script>
|
<script>
|
||||||
// Components
|
// Components
|
||||||
import siteHeader from '@/iss-components/site-header/site-header.vue';
|
import siteHeader from '@/iss-components/site-header/site-header.vue';
|
||||||
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
|
|
||||||
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
||||||
import textBlock from '@/digital-components/text-block/text-block.vue';
|
import textBlock from '@/digital-components/text-block/text-block.vue';
|
||||||
import deductibleBox from '@/layouts/tpa-submit/deductible-box/deductible-box.vue';
|
import deductibleBox from '@/layouts/tpa-submit/deductible-box/deductible-box.vue';
|
||||||
|
|
@ -96,7 +88,6 @@ export default {
|
||||||
components: {
|
components: {
|
||||||
siteHeader,
|
siteHeader,
|
||||||
siteFooter,
|
siteFooter,
|
||||||
vehicleBanner,
|
|
||||||
textBlock,
|
textBlock,
|
||||||
deductibleBox,
|
deductibleBox,
|
||||||
// eslint-disable-next-line vue/no-reserved-component-names
|
// eslint-disable-next-line vue/no-reserved-component-names
|
||||||
|
|
@ -219,6 +210,15 @@ export default {
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.iss-heritage-container-width {
|
||||||
|
.tpa-confirmation-container {
|
||||||
|
position: relative;
|
||||||
|
min-height: 1px;
|
||||||
|
padding-left: .9375rem;
|
||||||
|
padding-right: .9375rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.text-color--black {
|
.text-color--black {
|
||||||
color: $black;
|
color: $black;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,6 @@ Object {
|
||||||
"shop": "PreferredShopSubTitle",
|
"shop": "PreferredShopSubTitle",
|
||||||
"vehicle": "VehicleSubTitle",
|
"vehicle": "VehicleSubTitle",
|
||||||
},
|
},
|
||||||
"vehicleBanner": "VehicleBannerWidget",
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|
|
||||||
|
|
@ -161,7 +161,6 @@ export default {
|
||||||
siteHeader: 'SiteHeaderWidget',
|
siteHeader: 'SiteHeaderWidget',
|
||||||
siteSubHeader: 'SiteSubHeaderWidget',
|
siteSubHeader: 'SiteSubHeaderWidget',
|
||||||
serviceSummary: 'ServiceSummaryContent',
|
serviceSummary: 'ServiceSummaryContent',
|
||||||
vehicleBanner: 'VehicleBannerWidget',
|
|
||||||
subheader: {
|
subheader: {
|
||||||
vehicle: 'VehicleSubTitle',
|
vehicle: 'VehicleSubTitle',
|
||||||
damage: 'DamageSubTitle',
|
damage: 'DamageSubTitle',
|
||||||
|
|
|
||||||
|
|
@ -62,10 +62,6 @@ function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {}
|
||||||
const apiResponses = {
|
const apiResponses = {
|
||||||
cmsContent: {
|
cmsContent: {
|
||||||
SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
|
SiteSubHeaderWidget: pageHeaderWidgetHeaderText,
|
||||||
VehicleBannerWidget: {
|
|
||||||
GenericVehicleImage:
|
|
||||||
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/blurred-image.jpg`
|
|
||||||
},
|
|
||||||
FunnelHeaderWidget: {
|
FunnelHeaderWidget: {
|
||||||
LogoImage:
|
LogoImage:
|
||||||
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`
|
`${applicationConfig.ISS_DEV_CMS_DOMAIN}/images/default-source/default-album/logos/insuranceLogo.jpg`
|
||||||
|
|
|
||||||
|
|
@ -1,47 +1,36 @@
|
||||||
<template>
|
<template>
|
||||||
<Form ref="theForm" @submit="onSubmit" @invalidSubmit="onInvalidSubmit">
|
<Form
|
||||||
<div class="container-fluid fade-on-route-transition">
|
ref="theForm"
|
||||||
<div class="row justify-content-center">
|
@submit="onSubmit"
|
||||||
<div class="col-md-6 px-0 px-md-2">
|
@invalidSubmit="onInvalidSubmit">
|
||||||
<siteHeader cmsWidgetName="SiteHeaderWidget" />
|
<div class="fade-on-route-transition">
|
||||||
</div>
|
<div class="justify-content-center">
|
||||||
|
<siteHeader cmsWidgetName="SiteHeaderWidget" />
|
||||||
</div>
|
</div>
|
||||||
<div class="row justify-content-center">
|
<div class="iss-heritage-container-width">
|
||||||
<div class="col-md-6 col-xl-4">
|
<div class="vehicle-parts-container iss-heritage-content-container-width">
|
||||||
<vehicleBanner
|
|
||||||
ref="vehicleBanner"
|
|
||||||
class="mt-2 mb-4"
|
|
||||||
cmsWidgetName="VehicleBannerWidget"
|
|
||||||
:displayGenericVehicleImage="false" />
|
|
||||||
<siteSubHeader
|
<siteSubHeader
|
||||||
ref="siteSubHeader"
|
ref="siteSubHeader"
|
||||||
|
class="mt-4"
|
||||||
cmsWidgetName="SiteSubHeaderWidget" />
|
cmsWidgetName="SiteSubHeaderWidget" />
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row justify-content-center">
|
|
||||||
<div class="col-md-6 col-xl-4">
|
|
||||||
<alert
|
<alert
|
||||||
id="vehicle-parts-alert"
|
id="vehicle-parts-alert"
|
||||||
class="mt-3 mb-3"
|
class="mt-3 mb-3"
|
||||||
alertClass="alert-warning"
|
alertClass="alert-warning"
|
||||||
cmsWidgetName="AlertWidget"
|
cmsWidgetName="AlertWidget"
|
||||||
:isDismissible="false" />
|
:isDismissible="false" />
|
||||||
<div v-for="(item, i) in PartsOrQuestions" :key="i">
|
<div
|
||||||
|
v-for="(item, i) in PartsOrQuestions"
|
||||||
|
:key="i">
|
||||||
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
|
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
|
||||||
<hr v-if="i > 0" />
|
<hr v-if="i > 0" />
|
||||||
<glassPartQuestion
|
<glassPartQuestion
|
||||||
:ref="`${RefPrefix}-${item.glassLocation}-${item.glassName}`"
|
:ref="`${RefPrefix}-${item.glassLocation}-${item.glassName}`"
|
||||||
v-model="
|
v-model="selectedGlassParts[item.glassLocation + '-' + item.glassName]"
|
||||||
selectedGlassParts[
|
|
||||||
item.glassLocation + '-' + item.glassName
|
|
||||||
]
|
|
||||||
"
|
|
||||||
:glassLocation="item.glassLocation"
|
:glassLocation="item.glassLocation"
|
||||||
:glassName="item.glassName"
|
:glassName="item.glassName"
|
||||||
:colorAnswers="item.colorAnswers"
|
:colorAnswers="item.colorAnswers"
|
||||||
:alreadyPopulatedPartsData="
|
:alreadyPopulatedPartsData="alreadyPopulatedPartsData" />
|
||||||
alreadyPopulatedPartsData
|
|
||||||
" />
|
|
||||||
</div>
|
</div>
|
||||||
<siteFooter
|
<siteFooter
|
||||||
ref="siteFooter"
|
ref="siteFooter"
|
||||||
|
|
@ -60,7 +49,6 @@
|
||||||
// Components
|
// Components
|
||||||
import glassPartQuestion from '@/layouts/vehicle-parts/glass-part-question/glass-part-question.vue';
|
import glassPartQuestion from '@/layouts/vehicle-parts/glass-part-question/glass-part-question.vue';
|
||||||
import siteHeader from '@/iss-components/site-header/site-header.vue';
|
import siteHeader from '@/iss-components/site-header/site-header.vue';
|
||||||
import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
|
|
||||||
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
|
import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
|
||||||
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
import siteFooter from '@/iss-components/site-footer/site-footer.vue';
|
||||||
import alert from '@/ux-components/alert/alert.vue';
|
import alert from '@/ux-components/alert/alert.vue';
|
||||||
|
|
@ -81,7 +69,6 @@ export default {
|
||||||
Form,
|
Form,
|
||||||
glassPartQuestion,
|
glassPartQuestion,
|
||||||
siteHeader,
|
siteHeader,
|
||||||
vehicleBanner,
|
|
||||||
siteSubHeader,
|
siteSubHeader,
|
||||||
siteFooter,
|
siteFooter,
|
||||||
alert
|
alert
|
||||||
|
|
@ -239,9 +226,18 @@ export default {
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
#vehicle-parts-alert {
|
.iss-heritage-container-width {
|
||||||
.alert-heading {
|
.vehicle-parts-container {
|
||||||
margin-top: 0.25rem !important;
|
position: relative;
|
||||||
|
min-height: 1px;
|
||||||
|
padding-left: .9375rem;
|
||||||
|
padding-right: .9375rem;
|
||||||
|
|
||||||
|
#vehicle-parts-alert {
|
||||||
|
.alert-heading {
|
||||||
|
margin-top: 0.25rem !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue