From 8366f02df60a2230ee470770adf51db9536b827e Mon Sep 17 00:00:00 2001
From: Hangzhi Yu <hangzhi@protonmail.com>
Date: Wed, 24 Apr 2024 17:38:23 +0200
Subject: [PATCH] Adapt to generic infinite scrolling CRUD iterator
---
.../components/SubstitutionOverview.vue | 46 +++---------
.../substitutions/SubstitutionDay.vue | 75 -------------------
2 files changed, 10 insertions(+), 111 deletions(-)
delete mode 100644 aleksis/apps/chronos/frontend/components/substitutions/SubstitutionDay.vue
diff --git a/aleksis/apps/chronos/frontend/components/SubstitutionOverview.vue b/aleksis/apps/chronos/frontend/components/SubstitutionOverview.vue
index d8dc6742..3e7aae59 100644
--- a/aleksis/apps/chronos/frontend/components/SubstitutionOverview.vue
+++ b/aleksis/apps/chronos/frontend/components/SubstitutionOverview.vue
@@ -1,7 +1,6 @@
<script setup>
-import SubstitutionDay from "./substitutions/SubstitutionDay.vue";
-import CRUDIterator from "aleksis.core/components/generic/CRUDIterator.vue";
-import DateSelectFooter from "aleksis.core/components/generic/DateSelectFooter.vue";
+import SubstitutionCard from "./substitutions/SubstitutionCard.vue";
+import InfiniteScrollingDateSortedCRUDIterator from "aleksis.core/components/generic/InfiniteScrollingDateSortedCRUDIterator.vue";
import SubjectChip from "aleksis.apps.cursus/components/SubjectChip.vue";
import {
@@ -14,7 +13,7 @@ import dateSortedIteratorMixin from "../mixins/dateSortedIteratorMixin.js";
</script>
<template>
- <c-r-u-d-iterator
+ <infinite-scrolling-date-sorted-c-r-u-d-iterator
:gql-query="gqlQuery"
:gql-additional-query-args="gqlQueryArgs"
:gql-patch-mutation="gqlPatchMutation"
@@ -27,11 +26,6 @@ import dateSortedIteratorMixin from "../mixins/dateSortedIteratorMixin.js";
:enable-edit="true"
:elevated="false"
:force-model-item-update="true"
- @lastQuery="lastQuery = $event"
- fixed-header
- disable-pagination
- hide-default-footer
- use-deep-search
>
<template #additionalActions="{ attrs, on }">
<v-autocomplete
@@ -71,33 +65,15 @@ import dateSortedIteratorMixin from "../mixins/dateSortedIteratorMixin.js";
</v-alert>
</template>
- <template #default="{ items }">
- <substitution-day
- v-for="{ date, itemsOfDay, first, last } in groupItemsByDay(items)"
- v-intersect="{
- handler: intersectHandler(date, first, last),
- options: {
- rootMargin: '-' + topMargin + 'px 0px 0px 0px',
- threshold: [0, 1],
- },
- }"
- :date="date"
- :substitutions="itemsOfDay"
- :lastQuery="lastQuery"
- :focus-on-mount="initDate && initDate.toMillis() === date.toMillis()"
- @init="transition"
- :key="'day-' + date"
- ref="days"
- />
-
- <date-select-footer
- :value="currentDate"
- @input="gotoDate"
- @prev="gotoPrev"
- @next="gotoNext"
+ <template #item="{ item, lastQuery }">
+ <substitution-card
+ :substitution="item"
+ :affected-query="lastQuery"
+ :is-create="false"
+ :gql-patch-mutation="gqlPatchMutation"
/>
</template>
- </c-r-u-d-iterator>
+ </infinite-scrolling-date-sorted-c-r-u-d-iterator>
</template>
<script>
@@ -137,8 +113,6 @@ export default {
gqlQueryArgs() {
return {
objId: this.objId ? Number(this.objId) : null,
- dateStart: this.dateStart,
- dateEnd: this.dateEnd,
};
},
currentObj() {
diff --git a/aleksis/apps/chronos/frontend/components/substitutions/SubstitutionDay.vue b/aleksis/apps/chronos/frontend/components/substitutions/SubstitutionDay.vue
deleted file mode 100644
index 707f899f..00000000
--- a/aleksis/apps/chronos/frontend/components/substitutions/SubstitutionDay.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<script setup>
-import SubstitutionCard from "./SubstitutionCard.vue";
-
-import { patchAmendLessonsWithAmends } from "../amendLesson.graphql";
-</script>
-
-<template>
- <v-list-item two-line>
- <v-list-item-content>
- <v-subheader class="text-h6">{{
- $d(date, "dateWithWeekday")
- }}</v-subheader>
- <v-list max-width="100%" class="pt-0 mt-n1">
- <v-list-item
- v-for="substitution in substitutions"
- :key="'substitution-' + substitution.id"
- >
- <substitution-card
- :substitution="substitution"
- :affected-query="lastQuery"
- :is-create="false"
- :gql-patch-mutation="gqlPatchMutation"
- />
- </v-list-item>
- </v-list>
- </v-list-item-content>
- </v-list-item>
-</template>
-
-<script>
-export default {
- name: "SubstitutionDay",
- props: {
- date: {
- type: Object,
- required: true,
- },
- substitutions: {
- type: Array,
- required: true,
- },
- lastQuery: {
- type: Object,
- required: true,
- },
- focusOnMount: {
- type: Boolean,
- required: false,
- default: false,
- },
- },
- data() {
- return {
- gqlPatchMutation: patchAmendLessonsWithAmends,
- };
- },
- emits: ["init"],
- methods: {
- focus(how) {
- this.$el.scrollIntoView({
- behavior: how,
- block: "start",
- inline: "nearest",
- });
- console.log("focused @", this.date.toISODate());
- },
- },
- mounted() {
- if (this.focusOnMount) {
- this.$nextTick(this.focus("instant"));
- this.$emit("init");
- }
- },
-};
-</script>
--
GitLab