SSR-403 Fix issue where page doesn't load at top...
of next page when changing routes.
This commit is contained in:
parent
32a5bbfdb7
commit
0f85033fdd
1 changed files with 17 additions and 13 deletions
|
|
@ -35,7 +35,7 @@ const routes = [
|
||||||
|
|
||||||
await runExperiments(to.query.issPage);
|
await runExperiments(to.query.issPage);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Process ISS cookie.
|
// Process ISS cookie.
|
||||||
updateOrCreateISSCookie();
|
updateOrCreateISSCookie();
|
||||||
|
|
||||||
|
|
@ -74,9 +74,13 @@ const routes = [
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHistory("/"),
|
history: createWebHistory("/"),
|
||||||
routes,
|
routes,
|
||||||
|
scrollBehavior(to, from, savedPosition) {
|
||||||
|
// always scroll to top
|
||||||
|
return { top: 0 }
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
router.afterEach((to, from) => {
|
router.afterEach((to, from) => {
|
||||||
|
|
||||||
const store = useMainStore();
|
const store = useMainStore();
|
||||||
// Update lastPageVisited in the store
|
// Update lastPageVisited in the store
|
||||||
|
|
@ -95,12 +99,12 @@ router.afterEach((to, from) => {
|
||||||
// Get route information by page name.
|
// 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.
|
// This will reach out to the Cms and there is a 1:1 relationship between page names and route names.
|
||||||
async function GetRouteInfoFromPageName(pageName) {
|
async function GetRouteInfoFromPageName(pageName) {
|
||||||
|
|
||||||
const response = await useMainStore().getRouteInfo(pageName);
|
const response = await useMainStore().getRouteInfo(pageName);
|
||||||
|
|
||||||
const jsonFromResponse = JSON.parse(response.data.Result);
|
const jsonFromResponse = JSON.parse(response.data.Result);
|
||||||
let routeData = [];
|
let routeData = [];
|
||||||
|
|
||||||
// Add our route data and return our array.
|
// Add our route data and return our array.
|
||||||
Object.keys(jsonFromResponse).forEach((key) => {
|
Object.keys(jsonFromResponse).forEach((key) => {
|
||||||
routeData.push({
|
routeData.push({
|
||||||
|
|
@ -137,7 +141,7 @@ router.overrideNavigation = (
|
||||||
router.navigate = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}, optionalPageData = {}) => {
|
router.navigate = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}, optionalPageData = {}) => {
|
||||||
|
|
||||||
navigate(scenario, currentRoute, optionalQuery, optionalParams, optionalPageData);
|
navigate(scenario, currentRoute, optionalQuery, optionalParams, optionalPageData);
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Navigate to the next route, depending on the scenario.
|
// Navigate to the next route, depending on the scenario.
|
||||||
|
|
@ -152,11 +156,11 @@ function navigate (scenario, currentRoute, optionalQuery = {}, optionalParams =
|
||||||
|
|
||||||
if (!matchingScenarioMap){
|
if (!matchingScenarioMap){
|
||||||
console.error("No matching scenario found. Please review the routing table.");
|
console.error("No matching scenario found. Please review the routing table.");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (matchingScenarioMap.destinationIssPageValue) {
|
if (matchingScenarioMap.destinationIssPageValue) {
|
||||||
|
|
||||||
// Update page data to the store for next page if provided. Otherwise, keep existing page data or set to empty object
|
// 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);
|
const existingPageDataForPage = useMainStore().pageData(matchingScenarioMap.destinationIssPageValue);
|
||||||
baseMixin.methods.savePageDataToStore(
|
baseMixin.methods.savePageDataToStore(
|
||||||
|
|
@ -183,11 +187,11 @@ function navigate (scenario, currentRoute, optionalQuery = {}, optionalParams =
|
||||||
function navigateToUrl(url, optionalQuery = {}) {
|
function navigateToUrl(url, optionalQuery = {}) {
|
||||||
// possibly show some loading screen in the future here.
|
// possibly show some loading screen in the future here.
|
||||||
let externalUrl = new URL(url);
|
let externalUrl = new URL(url);
|
||||||
|
|
||||||
for (const queryKey in optionalQuery) {
|
for (const queryKey in optionalQuery) {
|
||||||
externalUrl.searchParams.append(queryKey, optionalQuery[queryKey]);
|
externalUrl.searchParams.append(queryKey, optionalQuery[queryKey]);
|
||||||
}
|
}
|
||||||
|
|
||||||
window.location.assign(externalUrl);
|
window.location.assign(externalUrl);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -204,14 +208,14 @@ function getNavigationMap (scenario, currentRoute) {
|
||||||
);
|
);
|
||||||
|
|
||||||
let maps = matchedQueryValue ? matchedQueryValue.map((m) => m.maps.filter((map) => map.scenario === scenario))[0] : undefined;
|
let maps = matchedQueryValue ? matchedQueryValue.map((m) => m.maps.filter((map) => map.scenario === scenario))[0] : undefined;
|
||||||
|
|
||||||
return maps ? maps.filter(x => x.filter === true || x.filter === undefined)[0] : undefined;
|
return maps ? maps.filter(x => x.filter === true || x.filter === undefined)[0] : undefined;
|
||||||
}
|
}
|
||||||
catch (e) {
|
catch (e) {
|
||||||
console.error(e);
|
console.error(e);
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function GoToStartOn404(next) {
|
function GoToStartOn404(next) {
|
||||||
|
|
@ -260,4 +264,4 @@ async function runExperiments(nextPage) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
export default router;
|
export default router;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue