From 5ca639101c9495d1e34929095c1400330bf4f7ca Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Tue, 17 Sep 2024 11:39:39 +0200
Subject: [PATCH] fixes Month display of LVs

---
 public/js/apps/Cis/Stundenplan.js             | 28 ++++--
 .../js/components/Calendar/CalendarModal.js   | 86 ++++++++++++-------
 public/js/components/Calendar/Month/Page.js   |  2 +-
 .../Cis/Mylv/Semester/Studiengang/Lv/Info.js  |  2 +-
 4 files changed, 75 insertions(+), 43 deletions(-)

diff --git a/public/js/apps/Cis/Stundenplan.js b/public/js/apps/Cis/Stundenplan.js
index 836586874..19d8870c0 100755
--- a/public/js/apps/Cis/Stundenplan.js
+++ b/public/js/apps/Cis/Stundenplan.js
@@ -8,7 +8,7 @@ const app = Vue.createApp({
 		return {
 			stunden: [],
 			events: null,
-			calendarWeek: new CalendarDate(new Date()),
+			calendarDate: new CalendarDate(new Date()),
 
 		}
 	},
@@ -17,19 +17,29 @@ const app = Vue.createApp({
 	},
 	computed:{
 		weekFirstDay: function () {
-			return this.calendarDateToString(this.calendarWeek.cdFirstDayOfWeek);
+			return this.calendarDateToString(this.calendarDate.cdFirstDayOfWeek);
 		},
 		weekLastDay: function () {
-			return this.calendarDateToString(this.calendarWeek.cdLastDayOfWeek);
+			return this.calendarDateToString(this.calendarDate.cdLastDayOfWeek);
+		},
+		monthFirstDay: function () {
+			return this.calendarDateToString(this.calendarDate.cdFirstDayOfCalendarMonth);
+		},
+		monthLastDay: function () {
+			return this.calendarDateToString(this.calendarDate.cdLastDayOfCalendarMonth);
 		},
 	},
 	methods:{
 
 		updateRange: function (data) {
-			this.calendarWeek = new CalendarDate(data.start);
-			Vue.nextTick(() => {
-				this.loadEvents();
-			});
+			let tmp_date = new CalendarDate(data.start);
+			// only load month data if the month or year has changed
+			if(tmp_date.m != this.calendarDate.m || tmp_date.y != this.calendarDate.y){
+				this.calendarDate = tmp_date;
+				Vue.nextTick(() => {
+					this.loadEvents();
+				});
+			}
 		},
 
 		calendarDateToString: function (calendarDate) {
@@ -42,8 +52,8 @@ const app = Vue.createApp({
 
 		loadEvents: function(){
 			Promise.allSettled([
-				this.$fhcApi.factory.stundenplan.getStundenplan(this.weekFirstDay, this.weekLastDay),
-				this.$fhcApi.factory.stundenplan.getStundenplanReservierungen(this.weekFirstDay, this.weekLastDay)
+				this.$fhcApi.factory.stundenplan.getStundenplan(this.monthFirstDay, this.monthLastDay),
+				this.$fhcApi.factory.stundenplan.getStundenplanReservierungen(this.monthFirstDay, this.monthLastDay)
 			]).then((result) => {
 				let promise_events = [];
 				result.forEach((promise_result) => {
diff --git a/public/js/components/Calendar/CalendarModal.js b/public/js/components/Calendar/CalendarModal.js
index 475deeaa2..5841b64b7 100644
--- a/public/js/components/Calendar/CalendarModal.js
+++ b/public/js/components/Calendar/CalendarModal.js
@@ -79,38 +79,60 @@ export default {
 		</template>
 		<template v-slot:default>
 			<template v-if="!isMenuSelected">
-				<div class="row">
-					<div class="col">
-						<h3>{{$p.t('lvinfo','lehrveranstaltungsinformationen')}}</h3>
-					</div>
-				</div>
-
-				<div class="row">
-					<div class="offset-3 col-4"><span>Datum:</span></div>
-					<div class=" col"><span>{{event.datum}}</span></div>
-				</div>
-				<div class="row">
-					<div class="offset-3 col-4"><span>Raum:</span></div>
-					<div class=" col"><span>{{event.ort_kurzbz}}</span></div>
-				</div>
-				<div class="row">
-					<div class="offset-3 col-4"><span>LV:</span></div>
-					<div class=" col"><span>{{'('+event.lehrform+') ' + event.lehrfach_bez}}</span></div>
-				</div>
-				<div class="row">
-					<div class="offset-3 col-4"><span>Lektor:</span></div>
-					<div class=" col"><span>{{event.lektor.map(lektor=>lektor.kurzbz).join("/")}}</span></div>
-				</div>
-				<div class="row">
-					<div class="offset-3 col-4"><span>Zeitraum:</span></div>
-					<div class=" col"><span>{{start_time + ' - ' + end_time}}</span></div>
-				</div>
-				<hr class="my-5">
-				<div v-if="menu" class="row">
-					<div class="col">
-						<h3>Lehrveranstaltungs Menu</h3>
-					</div>
-				</div>
+				<h3>{{$p.t('lvinfo','lehrveranstaltungsinformationen')}}</h3>
+				<table class="table table-hover mb-4">
+					<tbody>
+						<tr>
+							<th>{{
+								$p.t('global','datum')?
+								$p.t('global','datum')+':'
+								:''
+							}}</th>
+							<td>{{event.datum}}</td>
+						</tr>
+						<tr>
+							<th>{{
+								$p.t('global','raum')?
+								$p.t('global','raum')+':'
+								:''
+							}}</th>
+							<td>{{event.ort_kurzbz}}</td>
+						</tr>
+						<tr>
+							<th>{{
+								$p.t('lehre','lehrveranstaltung')?
+								$p.t('lehre','lehrveranstaltung')+':'
+								:''
+							}}</th>
+							<td>{{'('+event.lehrform+') ' + event.lehrfach_bez}}</td>
+						</tr>
+						<tr>
+							<th>{{
+								$p.t('lehre','lektor')?
+								$p.t('lehre','lektor')+':'
+								:''
+							}}</th>
+							<td>{{event.lektor.map(lektor=>lektor.kurzbz).join("/")}}</td>
+						</tr>
+						<tr>
+							<th>{{
+								$p.t('ui','zeitraum')?
+								$p.t('ui','zeitraum')+':'
+								:''
+							}}</th>
+							<td>{{start_time + ' - ' + end_time}}</td>
+						</tr>
+						<tr>
+							<th>{{
+								$p.t('lehre','organisationseinheit')?
+								$p.t('lehre','organisationseinheit')+':'
+								:''
+							}}</th>
+							<td>{{event.organisationseinheit}}</td>
+						</tr>
+					</tbody>
+				</table>
+				<h3>Lehrveranstaltungs Menu</h3>
 			</template>
 			<lv-menu v-model:isMenuSelected="isMenuSelected" :menu="menu"></lv-menu>
 		</template>
diff --git a/public/js/components/Calendar/Month/Page.js b/public/js/components/Calendar/Month/Page.js
index 5cb9cdc53..a535546fd 100755
--- a/public/js/components/Calendar/Month/Page.js
+++ b/public/js/components/Calendar/Month/Page.js
@@ -66,7 +66,7 @@ export default {
 				<span class="no">{{day.getDate()}}</span>
 				<span v-if="events[day.toDateString()] && events[day.toDateString()].length" class="events">
 					<span v-for="event in events[day.toDateString()]" :key="event.id" style="color:white" :style="{'background-color': event.color}">
-						{{event.title}}
+						{{event.topic}}
 					</span>
 				</span>
 			</a>
diff --git a/public/js/components/Cis/Mylv/Semester/Studiengang/Lv/Info.js b/public/js/components/Cis/Mylv/Semester/Studiengang/Lv/Info.js
index 764ebbc09..5d4b628a7 100755
--- a/public/js/components/Cis/Mylv/Semester/Studiengang/Lv/Info.js
+++ b/public/js/components/Cis/Mylv/Semester/Studiengang/Lv/Info.js
@@ -108,7 +108,7 @@ export default {
 				<div v-if="!info" class="text-center">
 					<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
 				</div>
-				<table v-else class="table table-hover">
+				<table v-else class="table table-hover mb-4">
 					<tbody>
 						<tr>
 							<th>{{p.t('lehre/lehrveranstaltung')}}</th>