From c2b5b178a547f71c458306a4ec7125ec99e3e37d Mon Sep 17 00:00:00 2001 From: Michael Bauer <michael-bauer@posteo.de> Date: Wed, 20 Mar 2024 12:44:45 +0100 Subject: [PATCH] Change date into url hash fragment --- .../components/coursebook/Coursebook.vue | 37 ++++++++++--------- aleksis/apps/alsijil/frontend/index.js | 10 ++--- 2 files changed, 25 insertions(+), 22 deletions(-) diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue index ec5a458e2..aee91432e 100644 --- a/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue +++ b/aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue @@ -80,7 +80,7 @@ </v-list-item-content> </v-list-item> - <date-select-footer :value="date" @click="handleDateMove" /> + <date-select-footer :value="$route.hash.substring(1)" @click="handleDateMove" /> </template> <template #loading> <CoursebookLoader /> @@ -139,12 +139,6 @@ export default { required: false, default: null, }, - // ISODate - date: { - type: String, - required: false, - default: "", - }, }, data() { return { @@ -168,10 +162,11 @@ export default { }, computed: { gqlQueryArgs() { + console.log('computing gqlQueryArgs'); + const date = this.$route.hash.substring(1) return { - // Assure courseId is a number own: this.filterType === "all" ? false : true, - objId: this.objId ? Number(this.objId) : null, + objId: this.objId ? Number(this.objId) : undefined, objType: this.objType?.toUpperCase(), dateStart: this.dateStart ?? this.date, dateEnd: @@ -203,15 +198,15 @@ export default { methods: { changeSelection(selection) { this.$router.push({ - name: "alsijil.coursebook_by_type_and_date", + name: "alsijil.coursebook", params: { filterType: selection.filterType ? selection.filterType : this.filterType, objType: selection.type, objId: selection.id, - date: this.date, }, + hash: this.$route.hash, }); }, // => [[dt doc ...] ...] @@ -256,12 +251,11 @@ export default { } this.$router.push({ - name: "alsijil.coursebook_by_type_and_date", + name: "alsijil.coursebook", params: { filterType: this.filterType, objType: this.objType, objId: this.objId, - date: newDate.toISODate(), }, }); @@ -290,12 +284,21 @@ export default { return "documentation_" + nearestId.toISODate(); }, + gotoDate(date, scroll) { + // show + this.$router.push({ hash: date.toISODate() }) + console.log('hash', this.$route.hash); + // assure + // scroll + }, }, mounted() { - this.dateStart = this.date; - this.dateEnd = DateTime.fromISO(this.dateStart) - .plus({ weeks: 1 }) - .toISODate(); + // assure date hash + console.log('mounted with hash', this.$route.hash); + if (!this.$route.hash) { + console.log('initialized hash'); + this.$router.push({ hash: DateTime.now().toISODate() }) + } }, }; </script> diff --git a/aleksis/apps/alsijil/frontend/index.js b/aleksis/apps/alsijil/frontend/index.js index 6cfb71044..1ec79280e 100644 --- a/aleksis/apps/alsijil/frontend/index.js +++ b/aleksis/apps/alsijil/frontend/index.js @@ -60,14 +60,14 @@ export default { component: () => import("./components/coursebook/Coursebook.vue"), redirect: () => { return { - name: "alsijil.coursebook_by_type_and_date", + name: "alsijil.coursebook", params: { - date: DateTime.now().toISODate(), filterType: "my", }, + hash: "#" + DateTime.now().toISODate(), }; }, - name: "alsijil.coursebook", + name: "alsijil.coursebook_landing", props: true, meta: { inMenu: true, @@ -79,9 +79,9 @@ export default { }, children: [ { - path: ":date(\\d\\d\\d\\d-\\d\\d-\\d\\d)/:filterType(my|all)/:objType(group|course|teacher)?/:objId(\\d+)?/", + path: ":filterType(my|all)/:objType(group|course|teacher)?/:objId(\\d+)?/", component: () => import("./components/coursebook/Coursebook.vue"), - name: "alsijil.coursebook_by_type_and_date", + name: "alsijil.coursebook", meta: { titleKey: "alsijil.coursebook.menu_title", toolbarTitle: "alsijil.coursebook.menu_title", -- GitLab