Merge pull request #600 from Safelite/feature/SSR-1152

add page pre-reqs to order-confirmation page

src/layouts/order-confirmation/order-confirmation.spec.js

@@ -8,6 +8,7 @@ import settleAllPromises from '@/helpers/layout-helper.js';
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { mount } from '@vue/test-utils';
 import { createTestingPinia } from '@pinia/testing';
+import { nextTick } from 'vue';
 
 jest.mock('@/helpers/layout-helper.js', () => jest.fn());
 
@@ -67,6 +68,16 @@ const initialStore = {
                     zipCode: '12345'
                 }
             }
+        },
+        payment: {
+            isInsurance: true,
+            isPayInAdvance: false
+        },
+        contactInfo: {
+            firstName: 'Test',
+            lastName: 'Test',
+            phoneNumber: '111-111-1111',
+            emailAddress: 'test@email.com'
         }
     }
 };
@@ -167,6 +178,20 @@ describe('OrderConfirmation.vue', () => {
     afterEach(() => {
         window.sessionStorage.removeItem('submittedOrder');
     });
+    describe('Page pre-requisites', () => {
+        test('If submitted order saved to store, page pre-reqs return true', async () => {
+            // Arrange
+            window.sessionStorage.setItem('submittedOrder', JSON.stringify(sessionStorage));
+            const { wrapper } = getMountedComponent(initialStore);
+
+            // Act
+            const arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid();
+            await nextTick();
+
+            // Assert
+            expect(arePagePrerequisitesValid).toBe(true);
+        });
+    });
     describe('Rendering', () => {
         test('Should render Site Header', () => {
             // Arrange

src/layouts/order-confirmation/order-confirmation.vue

@@ -95,6 +95,7 @@ export default {
     },
     mixins: [BaseFormMixin],
     async beforeRouteEnter(to, from, next) {
+        console.log('beforeRouteEnter just called');
         useMainStore().createSubmittedOrder();
         // Call APIs
         const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@@ -270,6 +271,68 @@ export default {
         }
     },
     methods: {
+        arePagePrerequisitesValid() {
+            const hasSubmittedOrder = useMainStore().hasSubmittedOrder();
+            if (hasSubmittedOrder) {
+                return true;
+            }
+
+            // Service Location
+            const { serviceLocation } = useMainStore().order;
+            const mobileReqs = !!(
+                serviceLocation.address
+                && serviceLocation.city
+                && serviceLocation.state
+                && serviceLocation.zipCode
+            );
+
+            const providerLocation = serviceLocation.provider.address;
+            const dropOffInShopReqs = !!(
+                providerLocation.streetAddress
+                && providerLocation.city
+                && providerLocation.state
+                && providerLocation.zipCode
+            );
+
+            const isMobile = serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE
+                || serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP;
+
+            const serviceLocationReqs =
+                (isMobile && mobileReqs) || (!isMobile && dropOffInShopReqs);
+
+            // Insurance
+            const isInsuranceSet = useMainStore().order.payment.isInsurance !== null;
+
+            // Schedule
+            const { schedule } = useMainStore().order;
+            const scheduleReqs = !!(
+                schedule.date
+                && schedule.startTime
+                && schedule.endTime
+                && schedule.jobMaxMinutes
+                && schedule.jobMinMinutes
+            );
+
+            // Contact Info
+            const { contactInfo } = useMainStore().order;
+            const contactInfoReqs = !!(
+                contactInfo.firstName
+                && contactInfo.lastName
+                && contactInfo.phoneNumber
+                && contactInfo.emailAddress
+            );
+
+            // Payment
+            const paymentMethodReqs = useMainStore().order.payment.isPayInAdvance === false;
+
+            return (
+                serviceLocationReqs
+                && isInsuranceSet
+                && scheduleReqs
+                && contactInfoReqs
+                && paymentMethodReqs
+            );
+        },
         forwardButtonAction() {
             this.$router.navigateToExternalUrl(this.carrierUrl);
         },
@@ -355,5 +418,9 @@ $page-side-padding: 1.5rem;
         font-weight: $font-weight-bold;
         text-decoration: none;
     }
+    :deep(strong) {
+        font-weight: $font-weight-bold;
+        color: $black;
+    }
 }
 </style>