Not Found .... :(
- diff --git a/src/main.js b/src/main.js index c78696333..b6d4c4ce3 100644 --- a/src/main.js +++ b/src/main.js @@ -4,9 +4,11 @@ import App from "./App.vue"; import router from "./router"; import store from "@/store"; import baseMixin from "@/mixins/base-mixin.js"; +import mitt from 'mitt'; import "../node_modules/bootstrap/dist/js/bootstrap.js"; // Vue App Setup +const emitter = mitt(); const vueApp = createApp(App); vueApp.use(router); @@ -14,4 +16,6 @@ vueApp.use(store); vueApp.use(LoadScript); vueApp.mixin(baseMixin); +vueApp.config.globalProperties.emitter = emitter; + vueApp.mount("#app"); diff --git a/src/mixins/base-mixin.js b/src/mixins/base-mixin.js index a31a5368f..fcf63c7e1 100644 --- a/src/mixins/base-mixin.js +++ b/src/mixins/base-mixin.js @@ -7,6 +7,7 @@ import { widgetNames } from "@/constants/widget-names.js"; export default { data() { return { + routedToLastKnownPage: false, }; }, methods: { @@ -19,6 +20,9 @@ export default { return store.dispatch(type, payload); }, }, + mounted(){ + console.log(this.$route.params); + }, computed: { storeActions() { return storeActions; diff --git a/src/router/index.js b/src/router/index.js index b1aa88493..4ade682eb 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,18 +1,21 @@ +// Supporting files import { createWebHistory, createRouter } from "vue-router"; -import { storeActions } from "@/constants/store-actions.js"; +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 ComponentTest from "@/layouts/component-test/component-test.vue"; +import store from "@/store"; +import mitt from 'mitt' +// Components +import ComponentTest from "@/layouts/component-test/component-test.vue"; import AddressPOC from "@/layouts/address-poc/address-poc.vue"; -import NotFound from "@/layouts/not-found/not-found.vue"; -import store from "@/store"; + const routes = [ { path: "/:pathMatch(.*)*", - component: NotFound, name: "NotFound", }, { @@ -30,7 +33,7 @@ const routes = [ beforeEnter(to, from, next) { // If we have no query string, or we don't have the FmgPage query string. if (to.query.fmgPage === undefined) { - RetainStructureAndGoTo404(to, next); + GoToLastPageFor404(next, store.getters.navigation.lastPage); } else { // If we already have our route, go to it. if (router.hasRoute(to.query.fmgPage)) { @@ -50,6 +53,9 @@ const routes = [ component: routeData[0].component, }); + // Assign last route information + store.commit(storeMutations.UPDATE_LAST_PAGE, from.query.fmgPage); + // Assign current query string parameters, as well as our fmgPage one. next({ name: routeData[0].name, @@ -57,11 +63,10 @@ const routes = [ }); }) .catch((error) => { - // If we can't find the route, go to the 404 page. - RetainStructureAndGoTo404(to, next); + // If we can't find the route, go to the last known page. + GoToLastPageFor404(next, store.getters.navigation.lastPage); - console.log("error:"); - console.log(error); + console.log("Cannot find route, navigating to last page:", error); }); } }, @@ -153,13 +158,13 @@ function GetRouteInfoFromPageName(pageName) { }); } -// Go to our 404 page but retain our structure when we go there (path, queryString, hash). -function RetainStructureAndGoTo404(to, next) { +// Go to our last known page the user was on for a 404. +function GoToLastPageFor404(next, lastPageName) { + + next({ - name: "NotFound", - params: { pathMatch: to.path.split("/").slice(1) }, - query: to.query, - hash: to.hash, + path: '/', + query: { fmgPage: lastPageName }, }); } diff --git a/src/store/index.js b/src/store/index.js index 742e4be25..ff6faf05d 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -5,11 +5,7 @@ import createPersistedState from "vuex-persistedstate"; import globalMethods from "@/global-methods"; export default createStore({ - plugins: [ - createPersistedState({ - storage: window.sessionStorage, - }), - ], + plugins: [createPersistedState()], // IMPORTANT: Be VERY careful when modifying these fields for at least a few reasons: // * The CMS can reference the fields by name @@ -58,6 +54,9 @@ export default createStore({ }, applicationUser: { experiments: null, + navigation: { + lastPage: 'vehicle-year' // our default value is the start page. + } }, }, // See IMPORTANT note at top of "state" declaration. @@ -78,10 +77,14 @@ export default createStore({ updateVehicle(state, data) { state.order.vehicle.carId = data.carId; state.order.vehicle.category = data.category; + }, + updateLastPage(state, page) { + state.applicationUser.navigation.lastPage = page; } }, getters: { - vehicle: state => state.order.vehicle + vehicle: state => state.order.vehicle, + navigation: state => state.applicationUser.navigation }, actions: { // Vehicle API Actions