ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Fix scroll position after back navigation 

Fixes MS-668 #complete
This commit is contained in:
Ramon Wenger 2023-03-28 13:09:26 +02:00
parent 4d476e687b
commit f8d0a9a83d
4 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
client/src/components/Chapter.vue
View File

@ -83,6 +83,7 @@ import CHAPTER_QUERY from '@/graphql/gql/queries/chapterQuery.gql';
import { getMe } from '@/mixins/me'; import { getMe } from '@/mixins/me';
import { useMutation } from '@vue/apollo-composable'; import { useMutation } from '@vue/apollo-composable';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { PAGE_LOAD_TIMEOUT } from '@/consts/navigation.consts';
export interface Props { export interface Props {
chapter: Chapter; chapter: Chapter;
@ -103,7 +104,7 @@ onMounted(() => {
setTimeout(() => { setTimeout(() => {
const rect = element.getBoundingClientRect(); const rect = element.getBoundingClientRect();
window.scrollTo({ top: rect.y, behavior: 'smooth' }); window.scrollTo({ top: rect.y, behavior: 'smooth' });
}, 750); }, PAGE_LOAD_TIMEOUT);
} }
} }
}); });

3
client/src/components/ContentBlock.vue
View File

@ -120,6 +120,7 @@ import DELETE_CONTENT_BLOCK_MUTATION from '@/graphql/gql/mutations/deleteContent
import type { ContentBlock } from '@/@types'; import type { ContentBlock } from '@/@types';
import type { Modal } from '@/plugins/modal.types'; import type { Modal } from '@/plugins/modal.types';
import { PAGE_LOAD_TIMEOUT } from '@/consts/navigation.consts';
export interface Props { export interface Props {
contentBlock: ContentBlock; contentBlock: ContentBlock;
@ -219,7 +220,7 @@ onMounted(() => {
setTimeout(() => { setTimeout(() => {
const rect = element.getBoundingClientRect(); const rect = element.getBoundingClientRect();
window.scrollTo({ top: rect.y, behavior: 'smooth' }); window.scrollTo({ top: rect.y, behavior: 'smooth' });
}, 750); }, PAGE_LOAD_TIMEOUT);
} }
} }
}); });

1
client/src/consts/navigation.consts.ts Normal file
View File

@ -0,0 +1 @@
export const PAGE_LOAD_TIMEOUT = 750;

7
client/src/router/index.js
View File

@ -12,6 +12,7 @@ import { LAYOUT_SIMPLE } from '@/router/core.constants';
import { EMAIL_NOT_VERIFIED_STATE, NO_VALID_LICENSE_STATE, SUCCESS_STATE } from './oauth.names'; import { EMAIL_NOT_VERIFIED_STATE, NO_VALID_LICENSE_STATE, SUCCESS_STATE } from './oauth.names';
import start from '@/pages/start'; import start from '@/pages/start';
import { PAGE_LOAD_TIMEOUT } from '@/consts/navigation.consts';
const instrument = () => import(/* webpackChunkName: "instruments" */ '@/pages/instrument'); const instrument = () => import(/* webpackChunkName: "instruments" */ '@/pages/instrument');
const instrumentOverview = () => import(/* webpackChunkName: "instruments" */ '@/pages/instrumentOverview'); const instrumentOverview = () => import(/* webpackChunkName: "instruments" */ '@/pages/instrumentOverview');
@ -110,7 +111,11 @@ const router = createRouter({
mode: 'history', mode: 'history',
scrollBehavior(to, from, savedPosition) { scrollBehavior(to, from, savedPosition) {
if (savedPosition) { if (savedPosition) {
return savedPosition; return new Promise((resolve) => {
setTimeout(() => {
resolve(savedPosition);
}, PAGE_LOAD_TIMEOUT);
});
} }
return { left: 0, top: 0 }; return { left: 0, top: 0 };
}, },