<script setup> import CancelledCalendarStatusChip from "aleksis.core/components/calendar/CancelledCalendarStatusChip.vue"; import SubjectChip from "aleksis.apps.cursus/components/SubjectChip.vue"; import { DateTime } from "luxon"; </script> <template> <v-card-text> <cancelled-calendar-status-chip v-if="lesson.cancelled" class="mr-2" /> <div :class="{ 'text-decoration-line-through': lesson.cancelled, 'text--secondary': lesson.cancelled, }" > {{ $d(toDateTime(lesson.datetimeStart), "shortTime") }} – {{ $d(toDateTime(lesson.datetimeEnd), "shortTime") }} {{ getCourse(lesson)?.name }} </div> <subject-chip v-if="getSubject(lesson)" :subject="getSubject(lesson)" /> </v-card-text> </template> <script> export default { name: "LessonInformation", props: { lesson: { type: Object, required: true, }, cancelled: { type: Boolean, required: false, default: false, }, }, methods: { toDateTime(dateString) { return DateTime.fromISO(dateString); }, getSubject(lesson) { return lesson.subject ? lesson.subject : lesson.course?.subject ? lesson.course.subject : lesson.amends?.subject ? lesson.amends.subject : undefined; }, getCourse(lesson) { return lesson.course ? lesson.course : lesson.amends?.course ? lesson.amends.course : undefined; }, }, }; </script>