From f3eb9b5e6d06deeff696954f9ad7519c90ea573d Mon Sep 17 00:00:00 2001
From: Michael Bauer <michael-bauer@posteo.de>
Date: Thu, 13 Jun 2024 17:21:07 +0200
Subject: [PATCH] Implement absence-creation-summary list
---
.../absences/AbsenceCreationSummary.vue | 51 +++++++++++++++++--
1 file changed, 48 insertions(+), 3 deletions(-)
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
index 4d981cf0a..8653abc2d 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/absences/AbsenceCreationSummary.vue
@@ -1,11 +1,16 @@
<template>
- <!-- TODO: Hide header -->
+ <!-- MAYBE introduce a minimal variant of CRUDIterator -->
+ <!-- with most features disabled for this list usecase -->
<c-r-u-d-iterator
+ i18n-key="TODO"
:gql-query="gqlQuery"
:gql-additional-query-args="gqlArgs"
+ :enable-search="false"
:enable-create="false"
:enable-edit="false"
:elevated="false"
+ disable-pagination
+ hide-default-footer
>
<template #default="{ items }">
<v-expansion-panels>
@@ -14,10 +19,42 @@
:key="person.id"
>
<v-expansion-panel-header>
- {{ persons.find((p) => p.id === person.id) }}
+ <div>
+ {{ persons.find((p) => p.id === person.id).fullName }}
+ </div>
+ <v-spacer />
+ <div>
+ <!-- TODO i18 Stunden -->
+ {{ person.lessons.length }} Stunden
+ </div>
</v-expansion-panel-header>
<v-expansion-panel-content>
- TODO
+ <v-divider />
+ <v-list-item
+ v-for="lesson in person.lessons"
+ class="px-0"
+ >
+ <!-- TODO: We should extract this display & share it -->
+ <time :datetime="lesson.datetimeStart" class="pr-2 text-no-wrap">
+ {{ $d(toDateTime(lesson.datetimeStart), "shortWithWeekday") }}
+ </time>
+ <span>(</span>
+ <time :datetime="lesson.datetimeStart" class="text-no-wrap">
+ {{ $d(toDateTime(lesson.datetimeStart), "shortTime") }}
+ </time>
+ <span>-</span>
+ <time :datetime="lesson.datetimeEnd" class="text-no-wrap">
+ {{ $d(toDateTime(lesson.datetimeEnd), "shortTime") }}
+ </time>
+ <span>)</span>
+ <v-spacer />
+ <div class="pr-2">
+ {{ lesson.course.name }}
+ </div>
+ <subject-chip
+ :subject="lesson.subject"
+ />
+ </v-list-item>
</v-expansion-panel-content>
</v-expansion-panel>
</v-expansion-panels>
@@ -27,12 +64,15 @@
<script>
import CRUDIterator from "aleksis.core/components/generic/CRUDIterator.vue";
+import SubjectChip from "aleksis.apps.cursus/components/SubjectChip.vue";
import { lessonsForPersons } from "./absenceCreation.graphql";
+import { DateTime } from "luxon";
export default {
name: "AbsenceCreationSummary",
components: {
CRUDIterator,
+ SubjectChip,
},
props: {
persons: {
@@ -62,5 +102,10 @@ export default {
};
},
},
+ methods: {
+ toDateTime(dateString) {
+ return DateTime.fromISO(dateString);
+ },
+ },
};
</script>
--
GitLab