Change date into url hash fragment

aleksis/apps/alsijil/frontend/components/coursebook/Coursebook.vue

@@ -39,7 +39,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 />
@@ -96,12 +96,6 @@ export default {
       required: false,
       default: null,
     },
-    // ISODate
-    date: {
-      type: String,
-      required: false,
-      default: "",
-    },
   },
   data() {
     return {
@@ -117,10 +111,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:
@@ -147,15 +142,15 @@ export default {
           Object.hasOwn(selectedFilters, "objType")
         ) {
           this.$router.push({
-            name: "alsijil.coursebook_by_type_and_date",
+            name: "alsijil.coursebook",
             params: {
               filterType: selectedFilters.filterType
                 ? selectedFilters.filterType
                 : this.filterType,
               objType: selectedFilters.objType,
               objId: selectedFilters.objId,
-              date: this.date,
             },
+            hash: this.$route.hash,
           });
         }
       },
@@ -204,12 +199,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(),
         },
       });
 
@@ -238,12 +232,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>

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",