Get attendance day details in relevant views

client/src/pages/learningPath/learningContentPage/blocks/AttendanceDayBlock.vue

@@ -1,27 +1,31 @@
-<template>
-  <div class="container-medium">
-    <div class="lg:mt-8">
-      <p class="text-large my-4">
-        <pre>
-        {{ content.contents }}
-        {{ content.translation_key }}
-        {{ content.title }}
-        {{ content.slug }}
-        </pre>
-      </p>
-    </div>
-  </div>
-</template>
-
 <script setup lang="ts">
+import { useCourseSessionsStore } from "@/stores/courseSessions";
 import type { LearningContent } from "@/types";
+import { computed } from "vue";
+
+const courseSessionsStore = useCourseSessionsStore();
 
 interface Value {
   description: string;
 }
 
-defineProps<{
+const props = defineProps<{
   value: Value;
   content: LearningContent;
 }>();
+
+const attendanceDay = computed(() => {
+  return courseSessionsStore.findAttendanceDay(props.content.slug);
+});
 </script>
+
+<template>
+  <div class="container-medium">
+    <div class="lg:mt-8">
+      <div class="text-large my-4">
+        <div v-if="attendanceDay">{{ attendanceDay }}</div>
+        <div v-else>Keine Präsenztagdaten erfasst für diese Durchführung</div>
+      </div>
+    </div>
+  </div>
+</template>

client/src/stores/courseSessions.ts

@@ -3,6 +3,7 @@ import { deleteCircleDocument } from "@/services/files";
 import type {
   CircleDocument,
   CourseSession,
+  CourseSessionAttendanceDay,
   CourseSessionUser,
   ExpertSessionUser,
 } from "@/types";
@@ -211,6 +212,19 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
       courseSessionForRoute.value?.documents.filter((d) => d.id !== documentId);
   }
 
+  function findAttendanceDay(
+    contentSlug: string
+  ): CourseSessionAttendanceDay | undefined {
+    const currentCourseSession = courseSessionForRoute.value;
+    if (currentCourseSession) {
+      const attendanceDays =
+        currentCourseSession.additional_json_data?.attendanceDays ?? [];
+      return attendanceDays.find(
+        (attendanceDay) => attendanceDay.learningContentSlug === contentSlug
+      );
+    }
+  }
+
   return {
     currentCourseSlug,
     courseSessions,
@@ -227,5 +241,6 @@ export const useCourseSessionsStore = defineStore("courseSessions", () => {
     addDocument,
     startUpload,
     removeDocument,
+    findAttendanceDay,
   };
 });

client/src/types.ts

@@ -338,6 +338,16 @@ export interface CircleDocument {
   learning_sequence: number;
 }
 
+// TODO refactor, when a user can manually create these days
+export interface CourseSessionAttendanceDay {
+  learningContentSlug: string;
+  date: string;
+  startTime: string;
+  endTime: string;
+  location: string;
+  trainer: string;
+}
+
 export interface CourseSession {
   id: number;
   created_at: string;
@@ -350,7 +360,9 @@ export interface CourseSession {
   competence_url: string;
   course_url: string;
   media_library_url: string;
-  additional_json_data: unknown;
+  additional_json_data: {
+    attendanceDays?: CourseSessionAttendanceDay[];
+  };
   documents: CircleDocument[];
   users: CourseSessionUser[];
 }

server/vbv_lernwelt/course/management/commands/create_default_courses.py

@@ -144,6 +144,18 @@ def create_course_uk_de():
     cs = CourseSession.objects.create(
         course_id=COURSE_UK,
         title="Bern 2023 a",
+        additional_json_data={
+            "attendanceDays": [
+                {
+                    "learningContentSlug": "überbetriebliche-kurse-lp-circle-fahrzeug-lc-präsenztag-fahrzeug",
+                    "date": "2023-09-18",
+                    "startTime": "08:15",
+                    "endTime": "17:00",
+                    "location": "Handelsschule KV Bern, Zimmer 123, Eigerstrasse 16, 3012 Bern",
+                    "trainer": "Roland Grossenbacher, roland.grossenbacher@helvetia.ch",
+                }
+            ]
+        },
     )
 
     # figma demo users and data