SSR-586 - Save Bailout & Callback

This commit is contained in:
Josh Dassinger 2024-01-09 13:58:37 -06:00
parent fdb11b365c
commit f3ae5d4996
14 changed files with 293 additions and 210 deletions

View file

@ -0,0 +1,12 @@
const bailoutCode = Object.freeze({
Unknown: 0,
SaveSessionError: 1,
VehicleNotFound: 2,
VehicleLookupError: 3,
CoverageStatementInvalidState: 4,
DoNotSeeMyShop: 5,
PricingResponseError: 6,
TPANotEnabled: 7
});
export default bailoutCode;

View file

@ -0,0 +1,21 @@
import { useMainStore } from '@/store';
import BailoutCode from '@/constants/bailoutCode';
function canBailoutNavigateBack() {
const code = useMainStore().order.bailout.bailoutCode;
if (code == null) {
return true;
}
switch (code) {
case BailoutCode.VehicleNotFound:
case BailoutCode.DoNotSeeMyShop:
case BailoutCode.TPANotEnabled:
return false;
default:
return false;
}
}
export default canBailoutNavigateBack;

View file

@ -2,13 +2,13 @@
exports[`Bailout page returns the initial data 1`] = `
Object {
"bailoutCode": null,
"bailoutPageModel": Object {
"email": "alexander.hamilton45@gmail.com",
"firstName": "Alexander",
"lastName": "Hamilton",
"phoneNumber": "6145550909",
},
"notSeeingPreferredShop": false,
"rules": Object {
"email": "email-required|email-address-format",
"firstName": "first-name-required",

View file

@ -9,6 +9,7 @@ import routerParams from '@/router/router-constants/router-params';
import { useMainStore } from '@/store';
import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import settleAllPromises from '@/helpers/layout-helper.js';
import BailoutCode from '@/constants/bailoutCode';
// Mock fetchCmsContentForPage
jest.mock('@/helpers/cms-content-helper', () => ({
@ -146,30 +147,35 @@ describe('Bailout page', () => {
});
describe('computed', () => {
describe('subHeaderCmsWidgetName', () => {
test.each([true, false])(
'returns noTpa widget name when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNoTPAWidget';
// Act
const name = wrapper.vm.subHeaderCmsWidgetName;
// Assert
expect(name).toBe(expected);
}
);
test('returns notSeeingPreferredShop widget name when tpa enabled and notSeeingPreferredShop true', () => {
test('returns noTpa widget name when bailout code is BailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.TPANotEnabled
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNoTPAWidget';
// Act
const name = wrapper.vm.subHeaderCmsWidgetName;
// Assert
expect(name).toBe(expected);
});
test('returns notSeeingPreferredShop widget name when bailout code is BailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
order: {
bailout: {
bailoutCode: BailoutCode.DoNotSeeMyShop
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'ContentGroupNotSeeingPreferredShop';
@ -179,12 +185,16 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test('returns default widget name when tpa enabled and notSeeingPreferredShop false', () => {
test('returns default widget name when BailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.Unknown
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SiteSubHeaderWidget';
@ -196,12 +206,16 @@ describe('Bailout page', () => {
});
});
describe('subHeaderContentProperty', () => {
test('returns "SubHeaderText" when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns "SubHeaderText" when BailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.Unknown
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SubHeaderText';
@ -211,30 +225,35 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test.each([true, false])(
'returns "HeaderText" when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
// Act
const name = wrapper.vm.subHeaderContentProperty;
// Assert
expect(name).toBe(expected);
}
);
test('returns "HeaderText" when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns "HeaderText" when BailoutCode is BailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
order: {
bailout: {
bailoutCode: BailoutCode.TPANotEnabled
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
// Act
const name = wrapper.vm.subHeaderContentProperty;
// Assert
expect(name).toBe(expected);
});
test('returns "HeaderText" when BailoutCode is BailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
order: {
bailout: {
bailoutCode: BailoutCode.DoNotSeeMyShop
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'HeaderText';
@ -246,12 +265,16 @@ describe('Bailout page', () => {
});
});
describe('subContentProperty', () => {
test('returns "SecondaryText" when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns "SecondaryText" when BailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.Unknown
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'SecondaryText';
@ -261,30 +284,35 @@ describe('Bailout page', () => {
// Assert
expect(name).toBe(expected);
});
test.each([true, false])(
'returns "BodyText" when tpa flow not enabled',
(notSeeingPreferredShop) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
};
const initialData = { notSeeingPreferredShop };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
// Act
const name = wrapper.vm.subContentProperty;
// Assert
expect(name).toBe(expected);
}
);
test('returns "BodyText" when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns "BodyText" when BailoutCode is BailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.TPANotEnabled
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
// Act
const name = wrapper.vm.subContentProperty;
// Assert
expect(name).toBe(expected);
});
test('returns "BodyText" when BailoutCode is BailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
order: {
bailout: {
bailoutCode: BailoutCode.DoNotSeeMyShop
}
}
};
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = 'BodyText';
@ -296,12 +324,16 @@ describe('Bailout page', () => {
});
});
describe('stripRteStyle', () => {
test('returns false when tpa flow enabled and not seeing preferred shop flag false', () => {
test('returns false when BailoutCode does not match any other content bailout codes', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.Unknown
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = false;
@ -311,12 +343,16 @@ describe('Bailout page', () => {
// Assert
expect(flag).toBe(expected);
});
test('returns true when tpa flow not enabled and not seeing preferred shop flag false', () => {
test('returns true when BailoutCode is BailoutCode.TPANotEnabled', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: false }
order: {
bailout: {
bailoutCode: BailoutCode.TPANotEnabled
}
}
};
const initialData = { notSeeingPreferredShop: false };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = true;
@ -326,12 +362,16 @@ describe('Bailout page', () => {
// Assert
expect(flag).toBe(expected);
});
test('returns true when tpa flow enabled and not seeing preferred shop flag true', () => {
test('returns true when when BailoutCode is BailoutCode.DoNotSeeMyShop', () => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow: true }
order: {
bailout: {
bailoutCode: BailoutCode.DoNotSeeMyShop
}
}
};
const initialData = { notSeeingPreferredShop: true };
const initialData = { };
const { wrapper } = getMountedComponent(mainInitialState, initialData);
const expected = true;
@ -342,24 +382,6 @@ describe('Bailout page', () => {
expect(flag).toBe(expected);
});
});
describe('isTpaEnabled', () => {
test.each([true, false])(
'matches enableTPAFlow in store',
(enableTPAFlow) => {
// Arrange
const mainInitialState = {
issConfig: { enableTPAFlow }
};
const { wrapper } = getMountedComponent(mainInitialState);
// Act
const flag = wrapper.vm.isTpaEnabled;
// Assert
expect(flag).toBe(enableTPAFlow);
}
);
});
});
describe('method', () => {
describe('backButtonAction', () => {
@ -390,8 +412,7 @@ describe('Bailout page', () => {
wrapper.vm.navigationScenarios.CLICKED_FORWARD,
wrapper.vm.$route,
{},
{},
wrapper.vm.bailoutPageModel
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
});
});
@ -426,62 +447,5 @@ describe('Bailout page', () => {
});
});
});
describe('setNotSeeingPreferShop', () => {
test.each([true, false])(
'updates notSeeingPreferredShop value',
(flag) => {
// Arrange
const { wrapper } = getMountedComponent();
// Act
wrapper.vm.setNotSeeingPreferShop(flag);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(flag);
}
);
test('sets notSeeingPreferredShop to true when null is passed', () => {
// Arrange
const { wrapper } = getMountedComponent();
// Act
wrapper.vm.setNotSeeingPreferShop(null);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(false);
});
});
});
describe('before entering the route', () => {
test.each([true, false])(
'sets notSeeingPreferredShop flag based value returned by store method pageData',
async (notSeeingPreferredShop) => {
// Arrange
const page = 'bailout-page';
const initialStoreState = {
applicationUser: {
pageData: {
[page]: {
[routerParams.NOT_SEEING_PREFERRED_SHOP]: notSeeingPreferredShop,
turtle: 5
}
}
}
};
const { wrapper } = getMountedComponent(initialStoreState);
// Act
await bailoutPage.beforeRouteEnter.call(
wrapper.vm,
{ query: { issPage: page } },
undefined,
(c) => c(wrapper.vm)
);
// Assert
expect(wrapper.vm.notSeeingPreferredShop).toBe(notSeeingPreferredShop);
}
);
});
});

View file

@ -55,6 +55,7 @@
class="footer-content-container"
cmsWidgetName="SiteFooterWidget"
:isForwardActionDisabled="!meta.valid"
:isBackButtonHidden="!canNavigateBack"
@backClicked="backButtonAction"
@ForwardClicked="forwardButtonAction" />
</div>
@ -76,6 +77,8 @@ import settleAllPromises from '@/helpers/layout-helper';
import { useMainStore } from '@/store';
import widgetFields from '@/constants/cms-widget-fields.js';
import routerParams from '@/router/router-constants/router-params';
import canNavigateBackFromBailout from '@/helpers/bailout-helper';
import BailoutCode from '@/constants/bailoutCode';
export default {
name: 'bailout-page',
@ -101,18 +104,18 @@ export default {
// use resultMap to populate layout content.
const resultMap = await settleAllPromises(promiseResultMap);
const pageData = useMainStore().pageData(to.query.issPage);
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
if (pageData && pageData[routerParams.NOT_SEEING_PREFERRED_SHOP]) {
vm.setNotSeeingPreferShop(pageData[routerParams.NOT_SEEING_PREFERRED_SHOP]);
}
});
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
return {
notSeeingPreferredShop: false,
bailoutPageModel: this.getBailoutPageModelFromStore(),
bailoutCode: this.mainStore.order.bailout.bailoutCode,
widget: {
defaultSiteHeader: 'SiteSubHeaderWidget',
noTpa: 'ContentGroupNoTPAWidget',
@ -128,43 +131,64 @@ export default {
},
computed: {
subHeaderCmsWidgetName() {
if (!this.isTpaEnabled) {
return this.widget.noTpa;
switch (this.bailoutCode) {
case BailoutCode.TPANotEnabled:
return this.widget.noTpa;
case BailoutCode.DoNotSeeMyShop:
return this.widget.notSeeingPreferredShop;
default:
return this.widget.defaultSiteHeader;
}
if (this.notSeeingPreferredShop) {
return this.widget.notSeeingPreferredShop;
}
return this.widget.defaultSiteHeader;
},
subHeaderContentProperty() {
return !this.isTpaEnabled || this.notSeeingPreferredShop
? widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT
: widgetFields.SUB_HEADER_WIDGET.SUB_HEADER_TEXT;
switch (this.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT;
default:
return widgetFields.SUB_HEADER_WIDGET.SUB_HEADER_TEXT;
}
},
subContentProperty() {
return !this.isTpaEnabled || this.notSeeingPreferredShop
? widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT
: widgetFields.SUB_HEADER_WIDGET.SECONDARY_TEXT;
switch (this.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT;
default:
return widgetFields.SUB_HEADER_WIDGET.SECONDARY_TEXT;
}
},
stripRteStyle() {
return !this.isTpaEnabled || this.notSeeingPreferredShop;
switch (this.bailoutCode) {
case BailoutCode.TPANotEnabled:
case BailoutCode.DoNotSeeMyShop:
return true;
default:
return false;
}
},
isTpaEnabled() {
return useMainStore().issConfig.enableTPAFlow;
canNavigateBack() {
return canNavigateBackFromBailout();
}
},
methods: {
backButtonAction() {
// route to move backwards
this.mainStore.resetBailout();
this.$router.navigate(this.navigationScenarios.CLICKED_BACK_PREVIOUS, this.$route);
},
forwardButtonAction() {
this.mainStore.setBailoutContactInfo(this.bailoutPageModel);
this.$router.navigate(
this.navigationScenarios.CLICKED_FORWARD,
this.$route,
{},
{},
this.bailoutPageModel
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
},
getBailoutPageModelFromStore() {
@ -174,9 +198,6 @@ export default {
phoneNumber: useMainStore().order.customer.phoneNumber,
email: useMainStore().order.customer.emailAddress
};
},
setNotSeeingPreferShop(value) {
this.notSeeingPreferredShop = value ?? false;
}
}
};

View file

@ -128,6 +128,7 @@ import baseFormMixin from '@/mixins/base-form-mixin.js';
import navigationScenarios from '@/router/router-constants/navigation-scenarios.js';
import routerParams from '@/router/router-constants/router-params';
import issPageValues from '@/router/router-constants/issPage-values';
import bailoutCode from '@/constants/bailoutCode';
export default {
name: 'coverage-statement',
@ -175,17 +176,9 @@ export default {
await useMainStore().getFinalDeductible();
pricingResults = await useMainStore().getPriceOrderItems(availableLineItems)
.catch((err) => {
const errorPageData = {
errorData: err.data,
functionLocation: 'beforeRouteEnter',
functionName: 'getPriceOrderItems',
functionParameters: {
availableLineItems
},
routeFrom: from,
routeTo: to
};
useMainStore().updatePageData({ page: issPageValues.BAILOUT_PAGE, data: errorPageData });
this.mainStore.setBailout(this.$router, bailoutCode.PricingResponseError, 'An error occurred in getPriceOrderItems.'
+ `</ br> ${availableLineItems.join(', ')}`
+ `</ br> ${err.data}`);
next(`/?issPage=${issPageValues.BAILOUT_PAGE}`);
});
}
@ -394,6 +387,7 @@ export default {
{ [routerParams.SAVE_SESSION_SYNCHRONOUS]: true }
);
} else {
this.mainStore.setBailout(this.$router, bailoutCode.TPANotEnabled, 'User selected TPA when TPA is not enabled for this client');
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED,
this.$route,
@ -402,6 +396,7 @@ export default {
);
}
} else {
this.mainStore.setBailout(this.$router, bailoutCode.CoverageStatementInvalidState, 'Coverage Statement has entered an invalid state');
this.$router.navigate(
navigationScenarios.CLICKED_FORWARD_WITH_INVALID_STATE,
this.$route,

View file

@ -10,6 +10,7 @@ import { getRandomString, getRandomInt } from '@/helpers/data-generation';
import endorsementOptions from '@/constants/endorsement-options';
import { createTestingPinia } from '@pinia/testing';
import vehicleSelectionOptions from '@/constants/vehicle-selection-options';
import bailoutCode from "@/constants/bailoutCode";
// Mock fetchCmsContentForPage
jest.mock('@/helpers/cms-content-helper', () => ({
@ -73,6 +74,10 @@ function setupMocks() {
return { wrapper };
}
beforeEach(() => {
useMainStore().order.bailout.bailoutCode = null;
});
describe('policy-vehicles.vue', () => {
test('Should navigate to CLICKED_BACK if backButtonAction is run', async () => {
// Arrange
@ -100,7 +105,6 @@ describe('policy-vehicles.vue', () => {
policyVehicles: [
{ vin }
],
bailout: false,
policyVinFound: true
});
@ -241,19 +245,25 @@ describe('policy-vehicles.vue', () => {
async () => {
// Arrange
const { wrapper } = setupMocks({});
wrapper.vm.lookupVehicleByVin = jest.fn().mockReturnValue({ error: true, status: 500 });
const lookupReturnValue = { error: true, status: 500, data: 'error' };
wrapper.vm.lookupVehicleByVin = jest.fn().mockReturnValue(lookupReturnValue);
const vin = getRandomString(17, 17);
await wrapper.setData({
selectedVehicleVin: vin,
bailout: false
policyVehicles: [
{
vin
}
]
});
// Act
wrapper.vm.mainStore.order.bailout.bailoutCode = bailoutCode.VehicleLookupError;
await wrapper.vm.forwardButtonAction();
// Assert
expect(wrapper.vm.bailout).toBeTruthy();
expect(wrapper.vm.mainStore.setBailout).toHaveBeenCalledWith(wrapper.vm.$router, bailoutCode.VehicleLookupError, `An error occurred looking up Vin: ${vin}. Error: ${lookupReturnValue.data}`);
expect(wrapper.vm.$router.navigate).toHaveBeenCalledWith(
navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
undefined,
@ -274,7 +284,6 @@ describe('policy-vehicles.vue', () => {
const vin = getRandomString(17, 17);
await wrapper.setData({
selectedVehicleVin: vin,
bailout: false,
policyVinFound: true,
policyVehicles: [{
vin,

View file

@ -53,6 +53,7 @@ import vehicleSelectionOptions from '@/constants/vehicle-selection-options.js';
import endorsementOptions from '@/constants/endorsement-options.js';
import globalRules from '@/constants/global-rules.js';
import { useMainStore } from '@/store/index.js';
import bailoutCode from '@/constants/bailoutCode';
export default {
name: 'policy-vehicles',
@ -71,6 +72,10 @@ export default {
vm.setCmsContent(cmsContentPromise);
});
},
setup() {
const mainStore = useMainStore();
return { mainStore };
},
data() {
const policyVehicles = useMainStore().order.policy.vehicles;
return {
@ -78,7 +83,6 @@ export default {
selectedVehicleVin: '',
displayGeneric: true,
policyVinFound: true,
bailout: false,
rules: {
optionRequired: globalRules.OPTION_REQUIRED
}
@ -197,7 +201,7 @@ export default {
return this.navigateForward();
}
this.bailout = true;
this.mainStore.setBailout(this.$router, bailoutCode.VehicleLookupError, `An error occurred looking up Vin: ${vehicle.vin}. Error: ${vehicleLookupResponse.data}`);
return this.navigateForward();
}
@ -215,7 +219,7 @@ export default {
return this.navigateForward();
},
navigateForward() {
if (this.bailout) {
if (this.mainStore.isBailout) {
this.$router
.navigate(
this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
@ -260,7 +264,8 @@ export default {
} catch (responseError) {
return {
error: true,
status: responseError.status
status: responseError.status,
data: responseError.data
};
}
}

View file

@ -68,6 +68,7 @@ import steeringModal from '@/layouts/provider-preference/steering-modal/steering
import shopPreferenceModal from '@/layouts/provider-preference/shop-preference-modal/shop-preference-modal.vue';
import tpaRecalModal from '@/layouts/provider-preference/tpa-recal-modal/tpa-recal-modal.vue';
import globalRules from '@/constants/global-rules';
import bailoutCode from '@/constants/bailoutCode';
const options = { SAFELITE: 'SafeliteOption', TPA: 'TPAOption' };
@ -197,6 +198,7 @@ export default {
}
scenario = this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_ENABLED;
} else {
this.mainStore.setBailout(this.$router, bailoutCode.TPANotEnabled, 'User selected TPA when TPA is not enabled for this client');
scenario = this.navigationScenarios.CLICKED_FORWARD_WITH_TPA_DISABLED;
}
break;

View file

@ -134,6 +134,7 @@ import widgetFields from '@/constants/cms-widget-fields.js';
import { shallowRef } from 'vue';
import routerParams from '@/router/router-constants/router-params';
import { toTitleCase, toDisplayPhoneNumber } from '@/helpers/text-helper.js';
import bailoutCode from '@/constants/bailoutCode';
const radiusFilterPairs = [
{ radius: 15, filter: '15 miles' },
@ -325,12 +326,10 @@ export default {
return getTpaProvidersResult?.data?.shopProviders ?? [];
},
doNotSeeMyShopLinkClick() {
this.mainStore.setBailout(this.$router, bailoutCode.DoNotSeeMyShop, 'User does not see their shop.');
this.$router.navigate(
this.navigationScenarios.CLICKED_DO_NOT_SEE_MY_SHOP_LINK,
this.$route,
{},
{},
{ [routerParams.NOT_SEEING_PREFERRED_SHOP]: true }
this.$route
);
},
async searchClick() {

View file

@ -63,6 +63,7 @@ import vehicleBanner from '@/iss-components/vehicle-banner/vehicle-banner.vue';
import vinLocationInformation from '@/layouts/vin-lookup/vin-location-information/vin-location-information.vue';
import vinLookupAlerts from '@/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue';
import vinQuestion from '@/layouts/vin-lookup/vin-question/vin-question.vue';
import bailoutCode from '@/constants/bailoutCode';
export default {
name: 'vin-lookup',
@ -183,14 +184,18 @@ export default {
if (vehicleLookupResponse.error) {
this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NOT_FOUND;
this.mainStore.setBailout(this.$router, bailoutCode.VehicleNotFound, `Failed to find vehicle in system with vin: ${this.vin}`);
this.resetVehicleFromLookup();
this.$refs.siteFooter.removeLoader();
// Temp solution to turn on 'disabled' style on the Continue button
// because the form itself actually passes its client-side validation.
// SSR-189 Scenario #4.
this.$refs.siteFooter.enableForwardAction();
return;
}
this.mainStore.resetBailout();
// Add vin bcs the response from the service doesn't contain vin
this.vehicleFromLookup = Object.assign(vehicleLookupResponse.data, { vin: this.vin });
}

View file

@ -15,7 +15,10 @@ import applicationConfig from '@/constants/application-config';
import analyticsMixin from '@/mixins/analytics-mixin';
import { saveSession } from '@/helpers/order-helper.js';
import routerParams from '@/router/router-constants/router-params';
import bailoutCode from '@/constants/bailoutCode';
import IssPageValues from '@/router/router-constants/issPage-values';
import navigationScenarios from './router-constants/navigation-scenarios';
import canBailoutNavigateBack from "@/helpers/bailout-helper";
const routes = [
{
@ -118,6 +121,15 @@ const router = createRouter({
}
});
router.beforeEach(async (to, from) => {
const store = useMainStore();
// Prevent navigating backwards if we enter a bailout that we are not allowed to go back on
if (store.isBailout && from.name === IssPageValues.BAILOUT_PAGE && to.name !== IssPageValues.CONTACT_CONFIRMATION
&& !canBailoutNavigateBack()) {
return false;
}
});
router.afterEach(async (to, from) => {
/*eslint-disable-line*/
const store = useMainStore();
@ -131,6 +143,7 @@ router.afterEach(async (to, from) => {
const saveSessionSynchronous = !!from.params[routerParams.SAVE_SESSION_SYNCHRONOUS];
await saveSession({ shouldAwaitSaveSessionQueue: saveSessionSynchronous }).catch((error) => {
if (from.name === issPageValues.WELCOME_PAGE) {
store.setBailout(router, bailoutCode.SaveSessionError, error.data);
router.navigate(
navigationScenarios.SAVE_SESSION_FAILED,
{ query: { issPage: issPageValues.WELCOME_PAGE } }

View file

@ -1,7 +1,6 @@
const routerParams = Object.freeze({
DISPLAY_VEHICLE_CHANGE_ALERT: 'displayVehicleChangeAlert',
SAVE_SESSION_SYNCHRONOUS: 'saveSessionSynchronous',
NOT_SEEING_PREFERRED_SHOP: 'notSeeingPreferredShop'
SAVE_SESSION_SYNCHRONOUS: 'saveSessionSynchronous'
});
export default routerParams;

View file

@ -163,6 +163,13 @@ const getDefaultState = () => ({
jobMaxMinutes: null,
jobMinMinutes: null
},
bailout: {
page: null,
url: null,
bailoutCode: null,
errorMessage: null,
submit: false
},
referralNumber: null,
referralDate: null,
referralCorrelationId: '00000000-0000-0000-0000-000000000000',
@ -221,6 +228,7 @@ export const useMainStore = defineStore({
|| state.order.serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE_NOT_ITAC_AND_NOT_NOCOMP,
isDropOffAppointment: (state) => state.order.serviceLocation.appointmentType === AppointmentTypeStrings.DROP_OFF,
isClaimRegistrationRequired: (state) => state.issConfig.isClaimRegistrationRequired,
isBailout: (state) => state.order.bailout.bailoutCode !== null,
eventBusItem: (state) => (eventCategory, eventSubCategory) => {
const matchedEvent = state.applicationUser.eventBus.find(({ category, subCategory }) => category === eventCategory && subCategory === eventSubCategory);
return matchedEvent?.eventValue;
@ -1148,6 +1156,12 @@ export const useMainStore = defineStore({
jobMaxMinutes: schedule.jobMaxMinutes,
jobMinMinutes: schedule.jobMinMinutes
},
bailout: this.order.bailout.submit ? {
page: this.order.bailout.page,
url: this.order.bailout.url,
bailoutCode: this.order.bailout.bailoutCode,
errorMessage: this.order.bailout.errorMessage
} : null,
referralDate: this.order.referralDate,
referralNumber: this.order.referralNumber?.toString(),
referralCorrelationId: this.order.referralCorrelationId,
@ -1404,6 +1418,14 @@ export const useMainStore = defineStore({
this.order.serviceLocation.isVehicleProtected = null;
},
resetBailout() {
this.order.bailout.url = null;
this.order.bailout.page = null;
this.order.bailout.bailoutCode = null;
this.order.bailout.errorMessage = null;
this.order.bailout.submit = false;
},
updateSupportingItems(partsData) {
this.order.lineItems.supportingItems = partsData;
},
@ -2047,6 +2069,21 @@ export const useMainStore = defineStore({
this.updateRegistration(registrationInfo);
},
setBailout(router, code, errorMessage) {
this.order.bailout.url = window.location.href;
this.order.bailout.page = router.currentRoute.value.name;
this.order.bailout.bailoutCode = code;
this.order.bailout.errorMessage = errorMessage;
},
setBailoutContactInfo(contact) {
this.order.customer.firstName = contact.firstName;
this.order.customer.lastName = contact.lastName;
this.order.customer.phoneNumber = contact.phoneNumber;
this.order.customer.emailAddress = contact.email;
this.order.bailout.submit = true;
},
resetRegistrationAndDependencies() {
this.resetRegistrationState();
this.resetGlassPartsState();
@ -2087,6 +2124,7 @@ export const useMainStore = defineStore({
this.order.customer.address.streetAddress2 = null;
this.resetVehicleState();
this.resetDamageState();
this.resetBailout();
}
},