diff --git a/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap b/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap index eccaa6d2..37a7a4ee 100644 --- a/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap +++ b/src/iss-components/cart-dropdown/__snapshots__/cart-dropdown.spec.js.snap @@ -11,6 +11,7 @@ Object { "isExpanded": false, "widget": Object { "amountDue": "AmountDueTextWidget", + "amountPaid": "AmountPaidTextWidget", "basePrice": "BasePriceWidget", "deductible": "DeductibleWidget", "mobileFee": "MobileServiceWidget", diff --git a/src/iss-components/cart-dropdown/cart-dropdown.spec.js b/src/iss-components/cart-dropdown/cart-dropdown.spec.js index 5a850fb8..ed02ba8a 100644 --- a/src/iss-components/cart-dropdown/cart-dropdown.spec.js +++ b/src/iss-components/cart-dropdown/cart-dropdown.spec.js @@ -253,6 +253,27 @@ describe('cart-dropdown component', () => { // Assert expect(salesTax.exists()).toBeTruthy(); }); + test('amount paid when Pay in Advance', () => { + // Arrange + const reference = '#cart-amount-paid'; + const isExpanded = true; + const showAsPaid = true; + const initialPropsData = { isExpanded, showAsPaid }; + const storeData = { + order: { + payment: { + isPayInAdvance: true + } + } + }; + const { wrapper } = getMountedComponent(storeData, {}, initialPropsData); + + // Act + const amountPaid = wrapper.find(reference); + + // Assert + expect(amountPaid.exists()).toBeTruthy(); + }); test('bottom amount due', () => { // Arrange const reference = '#bottom-amount-due'; @@ -631,7 +652,13 @@ describe('cart-dropdown component', () => { vaps: null }, payment: { - insuranceCoverage: { isVerified: true } + insuranceCoverage: { + coverageStatus: coverageStatuses.VERIFIED + } + }, + policy: { + noCoverage: false, + isITAC: false } }, issConfig: { @@ -669,7 +696,9 @@ describe('cart-dropdown component', () => { ] }, payment: { - insuranceCoverage: { isVerified: true } + insuranceCoverage: { + coverageStatus: coverageStatuses.VERIFIED + } } }, issConfig: { @@ -1784,7 +1813,13 @@ describe('cart-dropdown component', () => { isNoComp: false, policyLookupSuccessful: true }, - currentDeductible: 321 + currentDeductible: 321, + policyLookupSuccessful: true, + payment: { + insuranceCoverage: { + coverageStatus: coverageStatuses.VERIFIED + } + } } }; const { wrapper } = getMountedComponent(storeData); diff --git a/src/iss-components/cart-dropdown/cart-dropdown.vue b/src/iss-components/cart-dropdown/cart-dropdown.vue index fd703f77..662108f8 100644 --- a/src/iss-components/cart-dropdown/cart-dropdown.vue +++ b/src/iss-components/cart-dropdown/cart-dropdown.vue @@ -129,6 +129,13 @@ {{ salesTaxLabel }} {{ formatAmountInDollars(salesTax) }} +
+ {{ amountPaidLabel }} + {{ getDisplayed(amountPaid) }} +
lineItem.partNumber === partNumberStrings.RECYCLE_FEE); }, baseServiceLineItems() { - const { supportingItems, glassParts, otherParts } = useMainStore().lineItems; + const { supportingItems, glassParts, otherParts } = this.lineItems; const parts = [ ...(supportingItems ?? []), ...(glassParts ?? []), @@ -220,8 +232,21 @@ export default { baseServicePrice() { return getPriceOfLineItems(this.baseServiceLineItems) ?? 0; }, + isVerifiedCoverageStatus() { + return this.submittedOrder ? this.submittedOrder.payment.insuranceCoverage.isVerified : useMainStore().isVerifiedCoverageStatus; + }, + isUnverified() { + return !this.isNoComp && !this.isITAC + && (this.deductible == null || !this.isVerifiedCoverageStatus); + }, + isITAC() { + return this.submittedOrder ? this.submittedOrder.policy.isITAC : useMainStore().isITAC; + }, + isNoComp() { + return this.submittedOrder ? this.submittedOrder.policy.noCoverage : useMainStore().isNoComp; + }, subTotal() { - const { supportingItems, glassParts, otherParts, vaps, mobileFee } = useMainStore().lineItems; + const { supportingItems, glassParts, otherParts, vaps, mobileFee } = this.lineItems; const allLineItems = [ ...(supportingItems ?? []), ...(glassParts ?? []), @@ -229,12 +254,12 @@ export default { ...(vaps ?? []), mobileFee ]; - return !useMainStore().isNoComp && !useMainStore().isITAC + return !this.isNoComp && !this.isITAC ? this.deductible + getPriceOfLineItems([...this.feeLineItems, ...(vaps ?? [])]) : getPriceOfLineItems(allLineItems); }, feeLineItems() { - const { mobileFee } = useMainStore().lineItems; + const { mobileFee } = this.lineItems; const result = []; if (mobileFee) { result.push(mobileFee); @@ -251,8 +276,8 @@ export default { let result = 0; - if (!useMainStore().isUnverified) { - if (useMainStore().isITAC || useMainStore().isNoComp) { + if (!this.isUnverified) { + if (this.isITAC || this.isNoComp) { result += sumTax(this.baseServiceLineItems); } else { // deductible-case need to show tax for Recycle Fee @@ -260,7 +285,7 @@ export default { } } - result += sumTax(useMainStore().lineItems.vaps ?? []); + result += sumTax(this.lineItems.vaps ?? []); return result; }, @@ -269,8 +294,13 @@ export default { ? 0 : this.subTotal + this.salesTax; }, + amountPaid() { + return !this.showAsPaid + ? 0 + : this.subTotal + this.salesTax; + }, availableLineItems() { - const { supportingItems, glassParts, otherParts, mobileFee } = useMainStore().lineItems; + const { supportingItems, glassParts, otherParts, mobileFee } = this.lineItems; const result = [ ...(supportingItems ?? []), ...(glassParts ?? []), @@ -282,9 +312,12 @@ export default { } return result; }, + vehicleDamage() { + return this.submittedOrder ? this.submittedOrder.damage : useMainStore().damage; + }, servicePackageTier() { - const { glassToReplace, isRepair } = useMainStore().damage; - const { vaps } = useMainStore().lineItems; + const { glassToReplace, isRepair } = this.vehicleDamage; + const { vaps } = this.lineItems; return getHighestFullySatisfiedTier( glassToReplace ?? [], this.availableLineItems, @@ -293,7 +326,7 @@ export default { ); }, partTypesInServicePackage() { - const { glassToReplace, isRepair } = useMainStore().damage; + const { glassToReplace, isRepair } = this.vehicleDamage; return getPackageContents( glassToReplace ?? [], this.availableLineItems, @@ -315,7 +348,7 @@ export default { return items; }, nonServicePackageCartItems() { - const vapPartTypesInOrder = Array.from(new Set(useMainStore().lineItems.vaps?.map((vap) => vap.partType) ?? [])); + const vapPartTypesInOrder = Array.from(new Set(this.lineItems.vaps?.map((vap) => vap.partType) ?? [])); const vapPartTypesInOrderButNotPackage = vapPartTypesInOrder .filter((partType) => !this.partTypesInServicePackage.includes(partType)) ?? []; @@ -358,6 +391,9 @@ export default { amountDueLabel() { return this.getCmsContent(this.widget.amountDue, widgetFields.TEXT_BLOCK_WIDGET.TEXT); }, + amountPaidLabel() { + return this.getCmsContent(this.widget.amountPaid, widgetFields.TEXT_BLOCK_WIDGET.TEXT); + }, deductibleLabel() { return this.getCmsContent(this.widget.deductible, widgetFields.TEXT_BLOCK_WIDGET.TEXT); }, @@ -396,7 +432,7 @@ export default { : null; }, mobileFeeCartItem() { - const mobileFeeLineItem = useMainStore().lineItems.mobileFee; + const mobileFeeLineItem = this.lineItems.mobileFee; return mobileFeeLineItem ? this.getCartItem( this.getCmsContent(this.widget.mobileFee, widgetFields.TEXT_BLOCK_WIDGET.TEXT), @@ -415,9 +451,9 @@ export default { this.isExpanded = !this.isExpanded; }, getDisplayed(amount) { - return useMainStore().isUnverified - && !useMainStore().isNoComp - && !useMainStore().isITAC + return this.isUnverified + && !this.isNoComp + && !this.isITAC ? VERIFYING_COVERAGE : formatAmountInDollars(amount); }, @@ -441,7 +477,7 @@ export default { }, getCartItemForVapsPart(partType) { const label = this.getCmsContentForVapsType(partType); - const lineItems = useMainStore().lineItems.vaps + const lineItems = this.lineItems.vaps ?.filter((vapsLineItem) => vapsLineItem.partType === partType) ?? []; return this.getCartItem(label, lineItems, cartItemType.VAP, partType); }, diff --git a/src/layouts/order-confirmation/order-confirmation.spec.js b/src/layouts/order-confirmation/order-confirmation.spec.js index 2eb8208e..83ae6067 100644 --- a/src/layouts/order-confirmation/order-confirmation.spec.js +++ b/src/layouts/order-confirmation/order-confirmation.spec.js @@ -14,7 +14,8 @@ jest.mock('@/helpers/layout-helper.js', () => jest.fn()); jest.mock('@/helpers/cms-content-helper', () => ({ fetchCmsContentForPage: jest.fn(), - processIfStatements: jest.fn() + processIfStatements: jest.fn(), + splitCopyOnCMSPlaceHolder: jest.fn() })); const wordingText = 'wording text {custom:address}'; @@ -105,7 +106,17 @@ const sessionStorage = { zipCode: '12345' } } - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; const sessionStorageMock = (() => { @@ -302,7 +313,17 @@ describe('OrderConfirmation.vue', () => { }, serviceLocation: { appointmentType: 'Mobile' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -331,7 +352,17 @@ describe('OrderConfirmation.vue', () => { zipCode: '12345' } } - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -368,7 +399,17 @@ describe('OrderConfirmation.vue', () => { state: 'AZ', zipCode: '12345', appointmentType: 'Mobile' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -397,7 +438,17 @@ describe('OrderConfirmation.vue', () => { } }, appointmentType: 'Dropoff' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -426,7 +477,17 @@ describe('OrderConfirmation.vue', () => { } }, appointmentType: 'Inshop' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -452,7 +513,17 @@ describe('OrderConfirmation.vue', () => { state: 'AZ', zipCode: '12345', appointmentType: 'Mobile' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -481,7 +552,17 @@ describe('OrderConfirmation.vue', () => { } }, appointmentType: 'Inshop' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -507,7 +588,17 @@ describe('OrderConfirmation.vue', () => { state: 'AZ', zipCode: '12345', appointmentType: 'Mobile' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -536,7 +627,17 @@ describe('OrderConfirmation.vue', () => { } }, appointmentType: 'Dropoff' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); @@ -566,7 +667,17 @@ describe('OrderConfirmation.vue', () => { } }, appointmentType: 'Inshop' - } + }, + payment: { + isPayInAdvance: false + }, + lineItems: { + vaps: [] + }, + policy: { + noCoverage: false + }, + damage: {} }; window.sessionStorage.setItem('submittedOrder', JSON.stringify(testSessionStorage)); const { wrapper } = getMountedComponent(); diff --git a/src/layouts/order-confirmation/order-confirmation.vue b/src/layouts/order-confirmation/order-confirmation.vue index b7e1af75..7189fab3 100644 --- a/src/layouts/order-confirmation/order-confirmation.vue +++ b/src/layouts/order-confirmation/order-confirmation.vue @@ -47,6 +47,14 @@ v-html="appointmentWordingText2">
+
+ +
@@ -69,6 +77,8 @@ 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 addToCalendar from '@/layouts/order-confirmation/add-to-calendar/add-to-calendar.vue'; +import cartDropdown from '@/iss-components/cart-dropdown/cart-dropdown.vue'; + // Supporting files import { fetchCmsContentForPage, processIfStatements } from '@/helpers/cms-content-helper'; import settleAllPromises from '@/helpers/layout-helper'; @@ -91,22 +101,26 @@ export default { siteHeader, vehicleBanner, siteFooter, - addToCalendar + addToCalendar, + cartDropdown }, mixins: [BaseFormMixin], async beforeRouteEnter(to, from, next) { - console.log('beforeRouteEnter just called'); useMainStore().createSubmittedOrder(); // Call APIs const cmsContentPromise = fetchCmsContentForPage(to.query.issPage); + // Settle promises and get results const promiseResultMap = [ { resultKey: 'cmsContent', promise: cmsContentPromise - }]; - // use resultMap to populate layout content. + } + ]; + + // use resultMap to populate layout content. const resultMap = await settleAllPromises(promiseResultMap); + next((vm) => { vm.setCmsContent(resultMap.cmsContent); }); @@ -263,6 +277,12 @@ export default { this.submittedOrder.schedule.jobMaxMinutes ); return inshopDurationTime; + }, + isPayInAdvance() { + return this.submittedOrder.payment.isPayInAdvance; + }, + selectedVaps() { + return this.submittedOrder.lineItems.vaps; } }, mounted() {