From 3df24f131cf64c685437fa909535bc3ae84c50b0 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Fri, 14 Jan 2022 16:36:30 -0500 Subject: [PATCH] Cleanup, switched router over to use aysnc/await --- src/layouts/vehicle-style/vehicle-style.vue | 2 +- src/mixins/base-mixin.js | 12 ---- src/router/index.js | 71 ++++++++------------- 3 files changed, 26 insertions(+), 59 deletions(-) diff --git a/src/layouts/vehicle-style/vehicle-style.vue b/src/layouts/vehicle-style/vehicle-style.vue index 3ae0a593b..13ad52a7c 100644 --- a/src/layouts/vehicle-style/vehicle-style.vue +++ b/src/layouts/vehicle-style/vehicle-style.vue @@ -35,7 +35,7 @@ export default { }, computed: {}, - beforeRouteEnter(to, from, next) { + async beforeRouteEnter(to, from, next) { // Call APIs const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage); const styleQuestionInitialDataPromise = diff --git a/src/mixins/base-mixin.js b/src/mixins/base-mixin.js index 4d3363a84..c283894c2 100644 --- a/src/mixins/base-mixin.js +++ b/src/mixins/base-mixin.js @@ -3,8 +3,6 @@ import { storeActions } from "@/constants/store-actions.js"; import { storeMutations } from "@/constants/store-mutations.js"; import { navigationScenarios } from "@/router/router-constants/navigation-scenarios"; import { widgetNames } from "@/constants/widget-names.js"; -import { emitter } from "@/helpers/event-bus/event-bus"; -import { globalEvents } from "@/constants/events"; export default { data() { @@ -21,16 +19,6 @@ export default { return store.dispatch(type, payload); }, - emitGlobalMessage(headline, copy, isDismissible, type) { - emitter.emit(globalEvents.GLOBAL_ALERT, { - globalAlertMessage: { - messageHeadline: headline, - messageCopy: copy, - isDismissible: isDismissible, - type: type - } - }); - } }, computed: { storeActions() { diff --git a/src/router/index.js b/src/router/index.js index 2ffec3359..ce7b76bcd 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,11 +1,8 @@ // Supporting files import { createWebHistory, createRouter } from "vue-router"; import { storeActions } from "@/constants/store-actions"; -import { storeMutations } from "@/constants/store-mutations"; import { lazyLoadComponent } from "@/router/dynamic-routing/component-loader.js"; import { routingTable } from "@/router/router-constants/routing-table.js"; -import { globalEventTypes } from "@/constants/events"; -import baseMixin from "@/mixins/base-mixin"; import store from "@/store"; // Components @@ -14,10 +11,6 @@ import AddressPOC from "@/layouts/address-poc/address-poc.vue"; const FUNNEL_START_PAGE = 'vehicle-year'; const routes = [ - { - path: "/:pathMatch(.*)*", - name: "NotFound", - }, { path: "/component-test", // This is a temporary route for testing. name: "ComponentTest", @@ -30,7 +23,7 @@ const routes = [ }, { path: "/", - beforeEnter(to, from, next) { + async beforeEnter(to, from, next) { // If we have no query string, or we don't have the FmgPage query string. if (to.query.fmgPage === undefined) { GoToFunnelStartOn404(next); @@ -38,28 +31,21 @@ const routes = [ // If we already have our route, go to it. if (router.hasRoute(to.query.fmgPage)) { - return next({name: to.query.fmgPage,query: to.query}); + return next({ name: to.query.fmgPage, query: to.query }); } // Get route info for the given url. Names will have a 1:1 relationship with names in the Cms. - GetRouteInfoFromPageName(to.query.fmgPage) - .then((routeData) => { - // Add our dynamic route. - router.addRoute({ - path: routeData[0].path, // Always the same path, because we control it with query strings. - name: routeData[0].name, - component: routeData[0].component, - }); + const routeData = await GetRouteInfoFromPageName(to.query.fmgPage); - // Assign current query string parameters, as well as our fmgPage one. - next({name: routeData[0].name, query: Object.assign(to.query, { fmgPage: routeData[0].name })}); - }) - .catch((error) => { - // If we can't find the route, go to the last known page. - GoToFunnelStartOn404(next); + // Add our dynamic route. + router.addRoute({ + path: routeData[0].path, // Always the same path, because we control it with query strings. + name: routeData[0].name, + component: routeData[0].component, + }); - console.log("Cannot find route, navigating to last page:", error); - }); + // Assign current query string parameters, as well as our fmgPage one. + next({ name: routeData[0].name, query: Object.assign(to.query, { fmgPage: routeData[0].name }) }); } }, }, @@ -101,7 +87,7 @@ router.navigate = ( } }; -// Get navigation map depeding on the scenario and the current 'page' you're on. +// Get navigation map depending on the scenario and the current 'page' you're on. router.getNavigationMap = (scenario, currentRoute) => { const fmgPageValue = currentRoute.query.fmgPage; const matchedQueryValue = routingTable @@ -125,29 +111,22 @@ function navigateToUrl(url) { // Get route information by page name. // This will reach out to the Cms and there is a 1:1 relationship between page names and route names. -function GetRouteInfoFromPageName(pageName) { - return new Promise((resolve, reject) => { - store - .dispatch(storeActions.GET_ROUTE_INFO_ACTION, { pageName: pageName }) - .then((response) => { - // Add our route data and return our array. - let jsonFromResponse = JSON.parse(response.data.Result); - let routeData = []; +async function GetRouteInfoFromPageName(pageName) { + const response = await store.dispatch(storeActions.GET_ROUTE_INFO_ACTION, { pageName: pageName }); - Object.keys(jsonFromResponse).forEach((key) => { - routeData.push({ - path: "/", - name: `${key}`, - component: lazyLoadComponent(jsonFromResponse[key].LayoutName), - }); - }); + // Add our route data and return our array. + const jsonFromResponse = JSON.parse(response.data.Result); + let routeData = []; - resolve(routeData); - }) - .catch((error) => { - reject(error); - }); + Object.keys(jsonFromResponse).forEach((key) => { + routeData.push({ + path: "/", + name: `${key}`, + component: lazyLoadComponent(jsonFromResponse[key].LayoutName), + }); }); + + return routeData; } // Go to our start page on a 404.