Finishing touches on code

This commit is contained in:
Michaela Brydon 2023-10-30 16:25:04 -04:00
parent fc753e4253
commit 5fb68798a1
7 changed files with 100 additions and 129 deletions

View file

@ -3,6 +3,12 @@ const widgetFields = Object.freeze({
NAME: 'Name',
ANSWERS: 'Answers'
},
SUB_HEADER_WIDGET: {
NAME: 'Name',
SUB_HEADER_TEXT: 'SubHeaderText',
SECONDARY_TEXT: 'SecondaryText',
BACK_BUTTON_ACCESSIBLE_TEXT: 'BackButtonAccessibleText'
},
INPUT_QUESTION_WIDGET: {
NAME: 'Name',
QUESTION_TEXT: 'QuestionText',

View file

@ -61,14 +61,15 @@ function hasMatchingReplacementOption(vehicleDamageOptions, selectedGlassToRepla
export async function isGlassAvailableForCarId(carId) {
const mainStore = useMainStore();
try {
const vehicleDamageOptionsResponse = await mainStore.getDamageOptions(carId);
const selectedGlassToReplace = mainStore.damage.glassToReplace;
// try {
// const vehicleDamageOptionsResponse = await mainStore.getDamageOptions(carId);
// const selectedGlassToReplace = mainStore.damage.glassToReplace;
return hasMatchingReplacementOption(vehicleDamageOptionsResponse.data, selectedGlassToReplace);
} catch (error) {
return false;
}
// return hasMatchingReplacementOption(vehicleDamageOptionsResponse.data, selectedGlassToReplace);
// } catch (error) {
// return false;
// }
return false;
}
/**

View file

@ -9,18 +9,12 @@
cmsWidgetName="SiteHeaderWidget" />
<div class="main-content-container">
<siteSubHeader
v-if="isTpaEnabled"
cmsWidgetName="SiteSubHeaderWidget"
:cmsWidgetName="subHeaderCmsWidgetName"
:contentProperty="subHeaderContentProperty"
:stripRteStyle="stripRteStyle"
:subContentProperty="subContentProperty"
class="sub-header-content"
justification="left" />
<siteSubHeader
v-else
cmsWidgetName="ContentGroupNoTPAWidget"
class="sub-header-content"
contentProperty="HeaderText"
justification="left"
:stripRteStyle="true"
subContentProperty="BodyText" />
<textboxQuestion
ref="firstName"
v-model="bailoutPageModel.firstName"
@ -77,6 +71,8 @@ import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
import globalRules from '@/constants/global-rules';
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';
export default {
name: 'bailout-page',
@ -91,7 +87,6 @@ export default {
mixins: [BaseFormMixin],
async beforeRouteEnter(to, from, next) {
// Call APIs
console.log('bailout b4 route enter');
const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
// Settle promises and get results
const promiseResultMap = [
@ -102,24 +97,26 @@ export default {
];
// use resultMap to populate layout content.
const resultMap = await settleAllPromises(promiseResultMap);
console.log('about to enter next');
console.log(JSON.stringify(resultMap.cmsContent));
const pageData = useMainStore().pageData(to.query.issPage);
next((vm) => {
console.log('in next');
vm.setCmsContent(resultMap.cmsContent);
console.log('end of next');
vm.setNotSeeingPreferShop(pageData[routerParams.NOT_SEEING_PREFERRED_SHOP]);
});
console.log('end of before route enter');
},
setup() {
console.log('bailout setup');
const mainStore = useMainStore();
return { mainStore };
},
data() {
console.log('bailout data');
return {
notSeeingPreferredShop: false,
bailoutPageModel: this.getBailoutPageModelFromStore(),
widget: {
defaultSiteHeader: 'SiteSubHeaderWidget',
noTpa: 'ContentGroupNoTPAWidget',
notSeeingPreferredShop: 'ContentGroupNotSeeingPreferredShop'
},
rules: {
firstName: globalRules.FIRST_NAME_REQUIRED,
lastName: globalRules.LAST_NAME_REQUIRED,
@ -129,8 +126,31 @@ export default {
};
},
computed: {
subHeaderCmsWidgetName() {
if (!this.isTpaEnabled) {
return this.widget.noTpa;
}
if (this.notSeeingPreferredShop) {
return this.widget.notSeeingPreferredShop;
}
return this.widget.defaultSiteHeader;
},
subHeaderContentProperty() {
if (!this.isTpaEnabled || this.notSeeingPreferredShop) {
return widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT;
}
return widgetFields.SUB_HEADER_WIDGET.SUB_HEADER_TEXT;
},
subContentProperty() {
if (!this.isTpaEnabled || this.notSeeingPreferredShop) {
return widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT;
}
return widgetFields.SUB_HEADER_WIDGET.SECONDARY_TEXT;
},
stripRteStyle() {
return !this.isTpaEnabled || this.notSeeingPreferredShop;
},
isTpaEnabled() {
console.log(`Is TPA enabled: ${this.mainStore.issConfig.enableTPAFlow}`);
return this.mainStore.issConfig.enableTPAFlow;
}
},
@ -158,6 +178,9 @@ export default {
phoneNumber: this.mainStore.order.customer.phoneNumber,
email: this.mainStore.order.customer.emailAddress
};
},
setNotSeeingPreferShop(value) {
this.notSeeingPreferredShop = value ?? false;
}
}
};

View file

@ -15,7 +15,6 @@
class="text-center mt-5 mb-0 text-black w-100 search-question">
{{ tpaSearchQuestionLabel }}
</label>
<!-- TODO make this label for appropriate text box -->
<label
ref="searchInstructions"
for="tpaSearchQuestionField"
@ -118,6 +117,7 @@ import { useMainStore } from '@/store';
import BaseFormMixin from '@/mixins/base-form-mixin.js';
import globalRules from '@/constants/global-rules.js';
import widgetFields from '@/constants/cms-widget-fields.js';
import routerParams from '@/router/router-constants/router-params';
export default {
name: 'tpa-search',
@ -143,75 +143,37 @@ export default {
];
const resultMap = await settleAllPromises(promiseResultMap);
console.log(JSON.stringify(resultMap.cmsContent));
// const tpaProviders = await useMainStore().getTpaProviders(zipCode, radiusOptions[0]).then(async providers => {
// if (providers?.length === 0 ?? true) {
// return useMainStore().getTpaProviders(zipCode, radiusOptions[1]).then(result => {
// if (providers?.length === 0 ?? true) {
// return useMainStore().getTpaProviders(zipCode, radiusOptions[2]);
// }
// })
// }
// });
const radiusOptions = [25, 50, 100];
const { zipCode } = useMainStore().order.customer.address;
// get providers by zipCode and radius[0]
// if no providers, get providers by zipCode and radius[1]
// if no providers, get providers by zipCode and radius[2]
const tpaProvidersRadius25 = await useMainStore().getTpaProviders(zipCode, radiusOptions[0]);
const tpaProvidersRadius50 = await useMainStore().getTpaProviders(zipCode, radiusOptions[1]);
const tpaProvidersRadius100 = await useMainStore().getTpaProviders(zipCode, radiusOptions[2]);
let radius = '25 miles';
let providers = tpaProvidersRadius25;
if ((tpaProvidersRadius25?.data ?? []).length === 0) {
radius = '50 miles';
providers = tpaProvidersRadius50;
if ((tpaProvidersRadius50?.data ?? []).length === 0) {
radius = '100 miles';
providers = tpaProvidersRadius100;
}
}
next((vm) => {
vm.setCmsContent(resultMap.cmsContent);
// vm.setFilter(radius);
// vm.setProviders(providers);
vm.setFilter(radius);
vm.setProviders(providers);
});
},
async setup() {
// TODO get TPA shops within radius of zipcode for account
// Set initialFilter to value associated with the minimum distance required to return
// at least one shop
// const radiusOptions = [25, 50, 100];
// const { zipCode } = useMainStore().order.customer.address;
// const tpaProvidersRadius25 = useMainStore().getTpaProviders(zipCode, radiusOptions[0]);
// const tpaProvidersRadius50 = useMainStore().getTpaProviders(zipCode, radiusOptions[1]);
// const tpaProvidersRadius100 = useMainStore().getTpaProviders(zipCode, radiusOptions[2]);
// let radius = '25 miles';
// const providers = await tpaProvidersRadius25.then((result25) => {
// if ((result25?.data ?? []).length === 0) {
// radius = '50 miles';
// console.log(`radius 50: ${radius}`);
// return tpaProvidersRadius50.then((result50) => {
// console.log(`result 50: ${JSON.stringify(result50)}`);
// if ((result50?.data ?? []).length === 0) {
// radius = '100 miles';
// console.log(`radius 100: ${radius}`);
// return tpaProvidersRadius100;
// }
// return result50;
// });
// }
// return result25;
// });
// console.log(`providers: ${JSON.stringify(providers)}`);
// const filter = radius;
// return { filter, providers, zipCode };
const initialFilter = '25 miles';
return { initialFilter };
},
data() {
// const defaultRadius = 25;
// TODO should we default to this or policy.policyZipCode instead?
const { zipCode } = useMainStore().order.customer.address;
// const providers = useMainStore().getTpaProviders(this.zipCode, defaultRadius)?.data ?? [];
return {
// TODO should we default to this or policy.policyZipCode instead?
zipCode,
filter: this.initialFilter,
providers: [],
// selectedProviderNumber: providers.length === 1
// ? providers[0].value
// : '',
selectedProviderNumber: '',
widget: {
siteHeader: 'SiteHeaderWidget',
@ -285,35 +247,33 @@ export default {
}
},
watch: {
filter() {
console.log('filter changed');
this.providers = this.getProviders();
async filter() {
// TODO right now this results in getProviders being called once more than it needs to be
this.providers = await this.getProviders();
},
providers() {
console.log('providers changed');
if (this.providers?.length === 1 ?? false) {
console.log('one provider');
this.selectedProviderNumber = this.providers[0].value;
}
this.selectedProviderNumber = this.providers?.length === 1 ?? false
? this.providers[0].value
: '';
}
},
methods:
{
getProviders() {
return useMainStore().getTpaProviders(this.zipCode, this.radiusInMiles)?.data ?? [];
async getProviders() {
const getTpaProvidersResult = await useMainStore().getTpaProviders(this.zipCode, this.radiusInMiles);
return getTpaProvidersResult?.data ?? [];
},
doNotSeeMyShopLinkClick() {
// TODO text on the bailout page should be based on have not seen my shop
// TODO pass data along with navigation
console.log('to the bailout page');
this.$router.navigate(
this.navigationScenarios.CLICKED_DO_NOT_SEE_MY_SHOP_LINK,
this.$route
this.$route,
{},
{},
{ [routerParams.NOT_SEEING_PREFERRED_SHOP]: true }
);
},
searchClick() {
console.log('valid search');
this.providers = this.getProviders();
async searchClick() {
this.providers = await this.getProviders();
},
backButtonAction() {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);

View file

@ -220,6 +220,7 @@ export default {
}
// navigate back to vehicle-damage
console.log(`glass available: ${isSelectedGlassAvailableForVehicle}`);
if (this.isCarIdDifferentFromTheStore && !isSelectedGlassAvailableForVehicle) {
this.mainStore.updateVehicle(this.vehicleFromLookup);
this.mainStore.resetDamageState();

View file

@ -22,22 +22,18 @@ const routes = [
path: '/',
name: 'root',
async beforeEnter(to, from, next) {
console.log('beforeEnter');
try {
console.log('in try');
const issPageToUse = !to.query.issPage ? issPageValues.WELCOME_PAGE : to.query.issPage;
if ((issPageToUse === issPageValues.ACCESS_DENIED
|| (issPageToUse !== issPageValues.ENTRY_PAGE && !useMainStore().issConfig.parentAccountNumber))
&& process.env.VUE_APP_CURRENT_ENVIRONMENT !== 'Localhost'
) {
console.log('go to access is denied');
return await GoToAccessIsDenied(next);
}
// Do not run these for the main entry page - as it is not part of the user flow.
if (issPageToUse !== issPageValues.ENTRY_PAGE) {
console.log('not entry page');
if (analyticsMixin.methods.noSession()) {
await analyticsMixin.methods.initSession();
} else {
@ -49,7 +45,6 @@ const routes = [
// If the saved session has timed out, clear the session, execute 404 logic.
if (getISSCookie() !== null && !isSavedSessionStillActive()) {
console.log('go to start on 404');
// await baseMixin.methods.dispatchStoreAction(storeActions.RESET_STATE);
await GoToStartOn404(next);
}
@ -57,9 +52,7 @@ const routes = [
// Process ISS cookie.
updateOrCreateISSCookie();
// TODO check prerequisite stuff in here
if (router.hasRoute(issPageToUse)) {
console.log('has route');
// Since our route is already in scope, we can grab the component and call the arePagePrerequisitesValid function.
let component = router.getRoutes().filter((x) => x.name === issPageToUse)[0].components;
@ -69,17 +62,16 @@ const routes = [
}
if (!arePagePrerequisitesValid(component)) {
console.log('prereqs not valid');
await GoToStartOn404(next);
}
console.log('next 1');
console.log(`to: ${JSON.stringify(to)}`);
// console.log(`from: ${JSON.stringify(from)}`);
return next({ name: issPageToUse, query: to.query, params: to.params });
}
const routeData = await GetRouteInfoFromPageName(issPageToUse);
if (routeData[0].name.toLowerCase() === 'error') {
console.log('page not found');
throw new Error('Page not found!');
}
@ -98,22 +90,18 @@ const routes = [
.components.default();
if (!arePagePrerequisitesValid(nextComponent)) {
console.log('prereqs not valid');
const tempMsgCopy = 'Pre Requisites failed, need to handle. Default is Welcome Page.';
const tempMsgHeadline = `${issPageToUse}: pre-req failed...`;
await GoToStartOn404(next, tempMsgCopy, tempMsgHeadline);
}
console.log('next 2');
// Assign current query string parameters, as well as our issPage one.
next({
name: routeData[0].name,
query: Object.assign(to.query, { issPage: routeData[0].name }),
params: to.params
});
console.log('end try');
} catch (error) {
console.log('in error');
window.console.warn(error);
await GoToStartOn404(next);
}
@ -132,7 +120,6 @@ const router = createRouter({
});
router.afterEach(async (to, from) => {
console.log('afterEach');
/*eslint-disable-line*/
const store = useMainStore();
// Update lastPageVisited in the store
@ -159,7 +146,6 @@ router.afterEach(async (to, from) => {
// Push experiments to Data Layer
analyticsMixin.methods.pushExperimentsToDataLayer();
}
console.log('end after each');
});
router.navigateWithoutSaving = (
@ -169,7 +155,8 @@ router.navigateWithoutSaving = (
optionalParams = {},
optionalPageData = {}
) => {
navigate(scenario, currentRoute, false, optionalQuery, optionalParams, optionalPageData);
// TODO does not save session
navigate(scenario, currentRoute, optionalQuery, optionalParams, optionalPageData);
};
// Get route information by page name.
@ -210,7 +197,6 @@ router.overrideNavigation = (
optionalParams,
optionalPageData
);
console.log('next 3');
next();
};
@ -232,7 +218,6 @@ function navigate(
optionalParams = {},
optionalPageData = {}
) {
console.log('entering navigate');
/*eslint-disable-line*/
if (!scenario) {
window.console.error('No scenario provided. Please review the routing table.');
@ -247,15 +232,12 @@ function navigate(
return;
}
console.log('entering navigate');
if (scenario === navigationScenarios.CLICKED_BACK_PREVIOUS) {
// Update page to the prevous page in the router.
// If we need to worry about typing this in from outside of the app,
// we'll need to pre check history.length or if there is a previous page stored in state.
router.go(-1);
} else if (matchingScenarioMap.destinationIssPageValue) {
console.log(matchingScenarioMap);
console.log('else if 1');
// Update page data to the store for next page if provided. Otherwise, keep existing page data or set to empty object
const existingPageDataForPage = useMainStore().pageData(matchingScenarioMap.destinationIssPageValue);
baseMixin.methods.savePageDataToStore(
@ -267,16 +249,15 @@ function navigate(
// We're always pushing the same path, just changing query strings.
// Make sure our optional query strings get combined with our issPage one.
console.log(`optional params: ${JSON.stringify(optionalParams)}`);
router.push({
name: 'root',
query: Object.assign(optionalQuery, {
issPage: matchingScenarioMap.destinationIssPageValue
}),
params: optionalParams
params: optionalParams // TODO I don't think this actually works
});
} else if (matchingScenarioMap.destinationUrl) {
console.log(matchingScenarioMap.destinationUrl);
console.log('else if 2');
navigateToUrl(matchingScenarioMap.destinationUrl, optionalQuery);
}
}
@ -317,7 +298,6 @@ async function GoToAccessIsDenied(next) {
component: lazyLoadComponent(errorPageName)
});
console.log('next 4');
next({
name: errorPageName,
query: { issPage: errorPageName }
@ -340,7 +320,6 @@ async function GoToStartOn404(next, msgCopy = null, msgHeadline = null) {
type: globalEventTypes.Danger
});
console.log('next 5');
next({
name: errorPageName,
query: { issPage: errorPageName }

View file

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