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..530e34f4a --- /dev/null +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.spec.js @@ -0,0 +1,129 @@ +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 }; +} 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..db4f8188a --- /dev/null +++ b/src/layouts/review/review-sections/service-location-review/service-location-review.vue @@ -0,0 +1,58 @@ + + + diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index e28b8a95e..8780e75a7 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"; @@ -152,6 +160,12 @@ export default { this.$route ); }, + editServiceLocation() { + this.$router.navigateWithoutSaving( + this.navigationScenarios.CLICKED_SERVICE_LOCATION_EDIT, + this.$route + ); + }, }, computed: { subHeaderTitle() { @@ -172,6 +186,9 @@ export default { lineItems() { return this.$store.getters.lineItems; }, + serviceLocationInfo() { + return this.$store.getters.order.serviceLocation; + }, }, components: { funnelHeader, @@ -182,6 +199,7 @@ export default { vehicleReview, damageReview, servicePackageReview, + serviceLocationReview, }, }; 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, + }, ], }, ];