Cleanup, switched router over to use aysnc/await
This commit is contained in:
parent
5f8108e4b8
commit
3df24f131c
3 changed files with 26 additions and 59 deletions
|
|
@ -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 =
|
||||
|
|
|
|||
|
|
@ -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() {
|
||||
|
|
|
|||
|
|
@ -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.
|
||||
|
|
|
|||
Loading…
Reference in a new issue