From a1f47c2f07a7f129d2f252484259356d89179e5e Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 10:34:12 -0400 Subject: [PATCH 1/6] Add service-location-review component --- .../service-location-review.spec.js | 0 .../service-location-review.vue | 35 +++++++++++++++++++ src/layouts/review/review.vue | 12 +++++++ 3 files changed, 47 insertions(+) create mode 100644 src/layouts/review/review-sections/service-location-review/service-location-review.spec.js create mode 100644 src/layouts/review/review-sections/service-location-review/service-location-review.vue diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js new file mode 100644 index 000000000..e69de29bb diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.vue b/src/layouts/review/review-sections/service-location-review/service-location-review.vue new file mode 100644 index 000000000..9f8a1ed6a --- /dev/null +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.vue @@ -0,0 +1,35 @@ + + + diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index e28b8a95e..d89f6cfa0 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -62,6 +62,13 @@ :damage="damageInfo" :lineItems="lineItems" @edit-clicked="editServicePackage" /> + +
+ +
@@ -86,6 +93,7 @@ import textBlock from "@/digital-components/text-block/text-block"; import vehicleReview from "@/layouts/review/review-sections/vehicle-review/vehicle-review"; import damageReview from "@/layouts/review/review-sections/damage-review/damage-review"; import servicePackageReview from "@/layouts/review/review-sections/service-package-review/service-package-review"; +import serviceLocationReview from "@/layouts/review/review-sections/service-location-review/service-location-review"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; @@ -172,6 +180,9 @@ export default { lineItems() { return this.$store.getters.lineItems; }, + serviceLocationInfo() { + return this.$store.getters.order.serviceLocation; + }, }, components: { funnelHeader, @@ -182,6 +193,7 @@ export default { vehicleReview, damageReview, servicePackageReview, + serviceLocationReview, }, }; From e4997d67ca1cbb2ff56e7803523966ee6f775076 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 10:48:44 -0400 Subject: [PATCH 2/6] Add address rendering --- .../service-location-review.vue | 25 ++++++++++++++++++- 1 file changed, 24 insertions(+), 1 deletion(-) diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.vue b/src/layouts/review/review-sections/service-location-review/service-location-review.vue index 9f8a1ed6a..16f1de446 100644 --- a/src/layouts/review/review-sections/service-location-review/service-location-review.vue +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.vue @@ -25,7 +25,30 @@ export default { }, computed: { displayContent() { - return [`Address placeholder`]; + return [ + `${this.addressInfo.address}${this.addressInfo.address2 ? ", " : ""}${ + this.addressInfo.address2 + }, ${this.addressInfo.city}, ${this.addressInfo.state} ${this.addressInfo.zipCode}`, + ]; + }, + addressInfo() { + if (this.serviceLocation?.appointmentType === AppointmentTypeStrings.MOBILE) { + return { + address: this.serviceLocation?.address, + address2: this.serviceLocation?.address2, + city: this.serviceLocation?.city, + state: this.serviceLocation?.state, + zipCode: this.serviceLocation?.zipCode, + }; + } else { + return { + address: this.serviceLocation?.provider?.address?.streetAddress, + address2: "", + city: this.serviceLocation?.provider?.address?.city, + state: this.serviceLocation?.provider?.address?.state, + zipCode: this.serviceLocation?.provider?.address?.zipCode, + }; + } }, }, components: { From a289c03dc979a7a5326284638420f0b4763d07ff Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 11:33:46 -0400 Subject: [PATCH 3/6] Add back-navigation --- src/layouts/review/review.vue | 6 ++++++ src/router/router-constants/navigation-scenarios.js | 1 + src/router/router-constants/routing-table.js | 4 ++++ 3 files changed, 11 insertions(+) diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index d89f6cfa0..8780e75a7 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -160,6 +160,12 @@ export default { this.$route ); }, + editServiceLocation() { + this.$router.navigateWithoutSaving( + this.navigationScenarios.CLICKED_SERVICE_LOCATION_EDIT, + this.$route + ); + }, }, computed: { subHeaderTitle() { diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index 88ca110dd..ae1c880ae 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -50,6 +50,7 @@ const navigationScenarios = { CLICKED_VEHICLE_EDIT: "CLICKED_VEHICLE_EDIT", CLICKED_DAMAGE_EDIT: "CLICKED_DAMAGE_EDIT", CLICKED_SERVICE_PACKAGE_EDIT: "CLICKED_SERVICE_PACKAGE_EDIT", + CLICKED_SERVICE_LOCATION_EDIT: "CLICKED_SERVICE_LOCATION_EDIT", }; export { navigationScenarios }; diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index 4238b659a..017e1372a 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -480,6 +480,10 @@ const routingTable = function (store) { scenario: navigationScenarios.CLICKED_BACK, destinationFmgPageValue: fmgPageValues.CUSTOMER_DETAILS, }, + { + scenario: navigationScenarios.CLICKED_SERVICE_LOCATION_EDIT, + destinationFmgPageValue: fmgPageValues.SERVICE_LOCATION, + }, ], }, ]; From 23e4096a3cafb112dbe8fb989a5c9cc8222f3d5d Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 11:35:26 -0400 Subject: [PATCH 4/6] Convert null address2s to empty strings for mobile --- .../service-location-review/service-location-review.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.vue b/src/layouts/review/review-sections/service-location-review/service-location-review.vue index 16f1de446..db4f8188a 100644 --- a/src/layouts/review/review-sections/service-location-review/service-location-review.vue +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.vue @@ -35,7 +35,7 @@ export default { if (this.serviceLocation?.appointmentType === AppointmentTypeStrings.MOBILE) { return { address: this.serviceLocation?.address, - address2: this.serviceLocation?.address2, + address2: this.serviceLocation?.address2 ?? "", city: this.serviceLocation?.city, state: this.serviceLocation?.state, zipCode: this.serviceLocation?.zipCode, From 5be62aefb0032702b8ffa079c137d63974e6e9b7 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 13:00:28 -0400 Subject: [PATCH 5/6] Add tests --- .../service-location-review.spec.js | 123 ++++++++++++++++++ 1 file changed, 123 insertions(+) diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js index e69de29bb..5ddcffc86 100644 --- a/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js @@ -0,0 +1,123 @@ +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import serviceLocationReview from "@/layouts/review/review-sections/service-location-review/service-location-review"; + +import { AppointmentTypeStrings } from "@/constants/schedule-constants"; + +const cmsContent = { + ServiceLocationTitleWidget: { + Text: "Title Text", + }, +}; + +describe("Service Location Review Block", () => { + it("Should render mobile address if mobile appointment", async () => { + // Arrange + const props = generateDefaultProps(); + + const { wrapper } = setupMocks({ + propsData: props + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toEqual(["Mobile Address 1, Mobile Address 2, Mobile City, MO 11111"]); + }); + + it("Should render service location address if inshop appointment.", async () => { + // Arrange + let props = generateDefaultProps(); + + props.serviceLocation.appointmentType = AppointmentTypeStrings.IN_SHOP; + + const { wrapper } = setupMocks({ + propsData: props + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toEqual(["Service Location Address, Service Location City, SL 22222"]); + }); + + it("Should render service location address if drop-off appointment", async () => { + // Arrange + let props = generateDefaultProps(); + + props.serviceLocation.appointmentType = AppointmentTypeStrings.DROP_OFF; + + const { wrapper } = setupMocks({ + propsData: props + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toEqual(["Service Location Address, Service Location City, SL 22222"]); + }); + + it("Should not add comma or any text if address2 is null", async () => { + // Arrange + let props = generateDefaultProps(); + + props.serviceLocation.address2 = null; + + const { wrapper } = setupMocks({ + propsData: props + }); + + // Act + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.displayContent).toEqual(["Mobile Address 1, Mobile City, MO 11111"]); + }); +}); + +function generateDefaultProps() { + return { + cmsWidgetName: "ServiceLocationTitleWidget", + serviceLocation: { + address: "Mobile Address 1", + address2: "Mobile Address 2", + city: "Mobile City", + state: "MO", + zipCode: "11111", + zipCodeCtu: "", + appointmentType: AppointmentTypeStrings.MOBILE, + isVehicleProtected: false, + provider: { + providerNumber: "", + address: { + streetAddress: "Service Location Address", + city: "Service Location City", + state: "SL", + zipCode: "22222", + zipCodeCtu: "", + }, + }, + }, + }; +} + +function setupMocks(customMountOptions) { + const mountOptions = getMountOptions(customMountOptions); + + const mockMixin = { + methods: { + getCmsContent: jest.fn((widgetName, cmsFieldName) => { + return cmsContent?.[widgetName]?.[cmsFieldName] ?? ""; + }), + }, + }; + + mountOptions.global.mixins = [mockMixin]; + + const wrapper = shallowMount(serviceLocationReview, mountOptions); + wrapper.vm.setCmsContent = jest.fn(); + return { wrapper }; +} \ No newline at end of file From 05df252bb6a458057bc79d12aee78dd169161cce Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 26 Jul 2023 13:01:06 -0400 Subject: [PATCH 6/6] Formatting --- .../service-location-review.spec.js | 22 ++++++++++++------- 1 file changed, 14 insertions(+), 8 deletions(-) diff --git a/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js index 5ddcffc86..530e34f4a 100644 --- a/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js @@ -16,14 +16,16 @@ describe("Service Location Review Block", () => { const props = generateDefaultProps(); const { wrapper } = setupMocks({ - propsData: props + propsData: props, }); // Act await wrapper.vm.$nextTick(); // Assert - expect(wrapper.vm.displayContent).toEqual(["Mobile Address 1, Mobile Address 2, Mobile City, MO 11111"]); + expect(wrapper.vm.displayContent).toEqual([ + "Mobile Address 1, Mobile Address 2, Mobile City, MO 11111", + ]); }); it("Should render service location address if inshop appointment.", async () => { @@ -33,14 +35,16 @@ describe("Service Location Review Block", () => { props.serviceLocation.appointmentType = AppointmentTypeStrings.IN_SHOP; const { wrapper } = setupMocks({ - propsData: props + propsData: props, }); // Act await wrapper.vm.$nextTick(); // Assert - expect(wrapper.vm.displayContent).toEqual(["Service Location Address, Service Location City, SL 22222"]); + expect(wrapper.vm.displayContent).toEqual([ + "Service Location Address, Service Location City, SL 22222", + ]); }); it("Should render service location address if drop-off appointment", async () => { @@ -50,14 +54,16 @@ describe("Service Location Review Block", () => { props.serviceLocation.appointmentType = AppointmentTypeStrings.DROP_OFF; const { wrapper } = setupMocks({ - propsData: props + propsData: props, }); // Act await wrapper.vm.$nextTick(); // Assert - expect(wrapper.vm.displayContent).toEqual(["Service Location Address, Service Location City, SL 22222"]); + expect(wrapper.vm.displayContent).toEqual([ + "Service Location Address, Service Location City, SL 22222", + ]); }); it("Should not add comma or any text if address2 is null", async () => { @@ -67,7 +73,7 @@ describe("Service Location Review Block", () => { props.serviceLocation.address2 = null; const { wrapper } = setupMocks({ - propsData: props + propsData: props, }); // Act @@ -120,4 +126,4 @@ function setupMocks(customMountOptions) { const wrapper = shallowMount(serviceLocationReview, mountOptions); wrapper.vm.setCmsContent = jest.fn(); return { wrapper }; -} \ No newline at end of file +}