Merge branch 'master' into feature-61232/Studierendenverwaltung_Karteireiter_Projektarbeit_portieren

public/js/components/Betriebsmittel/Betriebsmittel.js

@@ -29,14 +29,24 @@ export default {
 		uid: {
 			type: [Number, String],
 			required: true
-		}
+		},
+		/** List of types to allow for creation */
+		betriebsmittelTypes: {
+			type: Array,
+			default: null
+		},
+		/**
+		 * If true: only show the types specified in 'betriebsmittelTypes'.
+		 * If false: show all available types.
+		 */
+		filterByProvidedTypes: Boolean
 	},
 	data() {
 		return {
 			tabulatorOptions: {
 				ajaxURL: 'dummy',
 				ajaxRequestFunc: () => this.$api.call(
-					this.endpoint.getAllBetriebsmittel(this.typeId, this.id)
+					this.endpoint.getAllBetriebsmittel(this.typeId, this.id, (this.filterByProvidedTypes ? this.betriebsmittelTypes : null))
 				),
 				ajaxResponse: (url, params, response) => response.data,
 				columns: [
@@ -294,7 +304,7 @@ export default {
 	},
 	created() {
 		return this.$api
-			.call(this.endpoint.getTypenBetriebsmittel())
+			.call(this.endpoint.getTypenBetriebsmittel(this.betriebsmittelTypes))
 			.then(result => {
 				this.listBetriebsmitteltyp = result.data;
 			})

public/js/components/Bootstrap/Modal.js

@@ -3,7 +3,8 @@
 export default {
 	name: 'BootstrapModal',
 	data: () => ({
-		modal: null
+		modal: null,
+		fullscreen: false
 	}),
 	props: {
 		backdrop: {
@@ -34,6 +35,10 @@ export default {
 		footerClass: {
 			type: [String,Array,Object],
 			default: ''
+		},
+		allowFullscreenExpand: {
+			type: Boolean,
+			default: false
 		}
 	},
 	emits: [
@@ -58,6 +63,9 @@ export default {
 		},
 		toggle() {
 			return this.modal.toggle();
+		},
+		toggleFullscreen() {
+			this.fullscreen = !this.fullscreen
 		}
 	},
 	mounted() {
@@ -122,13 +130,18 @@ export default {
 			});
 		});
 	},
-	template: `<div ref="modal" class="bootstrap-modal modal" tabindex="-1" @[\`hide.bs.modal\`]="$emit('hideBsModal')" @[\`hidden.bs.modal\`]="$emit('hiddenBsModal')" @[\`hidePrevented.bs.modal\`]="$emit('hidePreventedBsModal')" @[\`show.bs.modal\`]="$emit('showBsModal')" >
-		<div class="modal-dialog" :class="dialogClass">
+	template: `<div ref="modal" class="bootstrap-modal modal" tabindex="-1" @[\`hide.bs.modal\`]="$emit('hideBsModal')" @[\`hidden.bs.modal\`]="$emit('hiddenBsModal')" @[\`hidePrevented.bs.modal\`]="$emit('hidePreventedBsModal')" @[\`show.bs.modal\`]="$emit('showBsModal')" @[\`shown.bs.modal\`]="$emit('shownBsModal')">
+		<div class="modal-dialog" :class="fullscreen ? 'modal-fullscreen' : dialogClass">
 			<div class="modal-content">
 				<div v-if="$slots.title" class="modal-header" :class="headerClass">
 					<h5 class="modal-title"><slot name="title"/></h5>
-					<slot name="popoutButton"></slot>
-					<button v-if="!noCloseBtn" type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+					<div class="d-flex align-items-center ms-auto">
+						<button type="button" class="btn ms-auto" style="filter: invert(1)" v-if="allowFullscreenExpand" @click="toggleFullscreen">
+						  <i v-if="!fullscreen" class="fa-solid fa-expand"></i>
+						  <i v-else class="fa-solid fa-compress"></i>
+						</button>
+						<button v-if="!noCloseBtn" type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+					</div>
 					<slot name="modal-header-content"></slot>
 				</div>
 				<div class="modal-body" :class="bodyClass">

public/js/components/Calendar/Mode/Day.js

@@ -44,11 +44,16 @@ export default {
 	},
 	watch: {
 		currentDate() {
-			this.rangeOffset = this.currentDate.startOf('day').diff(this.focusDate.startOf('day'), 'days').days;
-			if (this.rangeOffset) {
-				this.$refs.view.$refs.grid.disableAutoScroll();
+			if (this.currentDate.locale != this.focusDate.locale) {
+				this.focusDate = this.currentDate;
 				this.$emit('update:range', this.range);
-				this.$refs.slider.slidePages(this.rangeOffset).then(this.updatePage);
+			} else {
+				this.rangeOffset = this.currentDate.startOf('day').diff(this.focusDate.startOf('day'), 'days').days;
+				if (this.rangeOffset) {
+					this.$refs.view.$refs.grid.disableAutoScroll();
+					this.$emit('update:range', this.range);
+					this.$refs.slider.slidePages(this.rangeOffset).then(this.updatePage);
+				}
 			}
 		}
 	},

public/js/components/Calendar/Mode/List.js

@@ -47,10 +47,15 @@ export default {
 	},
 	watch: {
 		currentDate() {
-			this.rangeOffset = this.currentDate.startOf('day').diff(this.focusDate.startOf('day'), 'days').days;
-			if (this.rangeOffset) {
+			if (this.currentDate.locale != this.focusDate.locale) {
+				this.focusDate = this.currentDate;
 				this.$emit('update:range', this.range);
-				this.$refs.slider.slidePages(this.rangeOffset).then(this.updatePage);
+			} else {
+				this.rangeOffset = this.currentDate.startOf('day').diff(this.focusDate.startOf('day'), 'days').days;
+				if (this.rangeOffset) {
+					this.$emit('update:range', this.range);
+					this.$refs.slider.slidePages(this.rangeOffset).then(this.updatePage);
+				}
 			}
 		}
 	},

public/js/components/Cis/Cms/Content_types/General.js

@@ -57,65 +57,70 @@ export default {
 				p.style.setProperty('white-space', 'normal');
 				p.style.setProperty('max-width', '400px');
 			})
+		},
+		prepareContent() {
+			// replaces the tablesorter with the tabulator
+			let tables = Array.from(document.getElementsByClassName("tablesorter"));
+
+			tables.forEach((table, index) =>  {
+				this.sanitizeLegacyTables(table)
+
+				new Tabulator(table, {
+					index: index,
+					layout: "fitDataFill",
+
+					columnDefaults: {
+						formatter: "html",
+						resizable: true,
+						minWidth: "100px"
+					}
+				})
+			})
+
+			document.querySelectorAll("#cms [data-confirm]").forEach((el) => {
+				el.addEventListener("click", (evt) => {
+					evt.preventDefault();
+					BsConfirm.popup(el.dataset.confirm)
+					.then(() => {
+						Axios.get(el.href)
+						.then((res) => {
+							// TODO(chris): check for success then show message and/or reload
+							location = location;
+						})
+						.catch((err) => console.error("ERROR:", err));
+					})
+					.catch(() => {});
+				});
+			});
+			document.querySelectorAll("#cms [data-href]").forEach((el) => {
+				el.href = el.dataset.href.replace(
+					/^ROOT\//,
+					FHC_JS_DATA_STORAGE_OBJECT.app_root
+				);
+			});
+
+			document.querySelectorAll("[href]").forEach((element) => {
+				let orignal_href = element.getAttribute("href");
+				let new_href = replaceRelativeLegacyLink(orignal_href);
+				element.href = new_href;
+			});
+
+			document.querySelectorAll("[style*=background-color]").forEach((element) => {
+				if (element.style.backgroundColor == "rgb(255, 255, 255)"){
+					element.style.backgroundColor = "var(--fhc-background)";
+				}
+				if(element.querySelector("*[style*=background-color]")){
+					element.style.backgroundColor = "var(--fhc-tertiary)";
+				}
+			});
 		}
 	},
-    mounted(){
-		// replaces the tablesorter with the tabulator
-		let tables = Array.from(document.getElementsByClassName("tablesorter"));
-
-		tables.forEach((table, index) =>  {
-			this.sanitizeLegacyTables(table)
-			
-			new Tabulator(table, {
-				index: index,
-				layout: "fitDataFill",
-
-				columnDefaults: {
-					formatter: "html",
-					resizable: true,
-					minWidth: "100px"
-				}
-			})
-		})
-
-        document.querySelectorAll("#cms [data-confirm]").forEach((el) => {
-            el.addEventListener("click", (evt) => {
-              evt.preventDefault();
-              BsConfirm.popup(el.dataset.confirm)
-                .then(() => {
-                  Axios.get(el.href)
-                    .then((res) => {
-                    	// TODO(chris): check for success then show message and/or reload
-                    	location = location;
-                    })
-                    .catch((err) => console.error("ERROR:", err));
-                })
-                .catch(() => {});
-            });
-          });
-        document.querySelectorAll("#cms [data-href]").forEach((el) => {
-            el.href = el.dataset.href.replace(
-            	/^ROOT\//,
-            	FHC_JS_DATA_STORAGE_OBJECT.app_root
-            );
-        });
-			
-		document.querySelectorAll("[href]").forEach((element) => {
-			let orignal_href = element.getAttribute("href");
-			let new_href = replaceRelativeLegacyLink(orignal_href);
-			element.href = new_href;
-		});
-
-		document.querySelectorAll("[style*=background-color]").forEach((element) => {
-			if (element.style.backgroundColor == "rgb(255, 255, 255)"){
-				element.style.backgroundColor = "var(--fhc-background)";
-			}
-			if(element.querySelector("*[style*=background-color]")){
-				element.style.backgroundColor = "var(--fhc-tertiary)";
-			}
-		});
-
-    },
+	updated() {
+		this.prepareContent();
+	},
+	mounted(){
+		this.prepareContent();
+	},
     template: /*html*/ `
       <!-- div that contains the content -->
       <div v-if="content" class="container" style="max-width: 100%;"><div class="row"><div class="col">

public/js/components/Cis/Cms/Content_types/News_content.js

@@ -1,6 +1,6 @@
 import { replaceRelativeLegacyLink } from "../../../../helpers/LegacyLinkReplaceHelper.js"
 export default {
-	name: "GeneralComponent",
+	name: "NewsContentType",
 	props:{
 	  content:{
 		  type:String,

public/js/components/Cis/Cms/Content_types/Raum_contentmittitel.js

@@ -12,7 +12,7 @@ export default {
           required:true,
       },
 	  content_id:{
-		type:Number,
+		type: [Number, String],
 	  }
     },
 	methods: {
@@ -129,7 +129,7 @@ export default {
     template: /*html*/ `
       <!-- div that contains the content -->
 <!--       TODO: test with more img content from cms-->
-      <div v-if="imgContent"><img v-bind="imgContent"></img></div>
+      <div v-if="imgContent"><img v-bind="imgContent"/></div>
       <div v-html="content" v-else-if="content" ></div>
       <p v-else>Content was not found</p>
       `,

public/js/components/Cis/Mylv/LvMenu.js

@@ -43,6 +43,13 @@ export default {
 				return menuItem.c4_link ?? null;
 			}
 		},
+		getMenuName(menuItem) {
+			if(menuItem.phrase) {
+				return this.$p.t(menuItem.phrase)
+			} else {
+				return menuItem.name
+			}
+		}
 	},
 	template:/*html*/`
 	<div v-if="!menu">{{$p.t('lehre','lehrveranstaltungsUnavailable')}}</div>
@@ -54,7 +61,7 @@ export default {
 					:disabled="c4_disabled(menuItem)" :data-bs-toggle="menuItem.c4_moodle_links?.length?'dropdown':null"
 					class="menu-entry p-2 w-100 text-wrap border border-1 rounded-3 d-flex flex-column align-items-center justify-content-center text-center text-decoration-none link h-100">
 						<img :src="menuItem.c4_icon" :alt="menuItem.name" />
-						<p class="w-100 mt-2 mb-0">{{menuItem.name}}</p>
+						<p class="w-100 mt-2 mb-0">{{ getMenuName(menuItem) }}</p>
 						<a v-for="([text,link],index) in menuItem.c4_linkList" target="_blank" :href="link" class="my-1 w-100 submenu text-decoration-none" :index="index">{{text}}</a>
 					</a>
 					<ul v-if="menuItem.c4_moodle_links?.length" class="dropdown-menu p-0" :aria-labelledby="menuItem.name">

public/js/components/Cis/Mylv/Semester/Studiengang/Lv.js

@@ -19,6 +19,7 @@ export default {
 	props: {
 		lehrveranstaltung_id: Number,
 		bezeichnung: String,
+		bezeichnung_eng: String,
 		module: String,
 		farbe: String,
 		lvinfo: Boolean,

public/js/components/Cis/Mylv/Student.js

@@ -75,21 +75,26 @@ export default {
 			this.$refs.studiensemester.selectedIndex++;
 			this.$refs.studiensemester.dispatchEvent(new Event('change', { bubbles: true }));
 		},
-		setHash(val) {
-			// TODO: make this a router param to enable history
-			location.hash = val;
+		updateRouter(val) {
+			this.$router.push(`/Cis/MyLv/${val}`);
 		}
 	},
 	created() {
 		axios.get(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/components/Cis/Mylv/Studiensemester').then(res => {
 			this.studiensemester = res.data.retval || [];
-			const hash = location.hash.substring(1);
-			if (hash && this.studiensemester.filter(s => s.studiensemester_kurzbz == hash).length)
-				this.currentSemester = hash;
+			const routerStudiensemester = this.$route.params.studiensemester;
+			if (routerStudiensemester && this.studiensemester.filter(s => s.studiensemester_kurzbz == routerStudiensemester).length)
+				this.currentSemester = routerStudiensemester;
 			else
 				this.currentSemester = this.nearestSem;
 		});
 	},
+	beforeRouteUpdate(to, from, next){
+		if (to.params.studiensemester && this.studiensemester.filter(s => s.studiensemester_kurzbz == to.params.studiensemester).length && to.params.studiensemester != this.currentSemester)
+			this.currentSemester = to.params.studiensemester;
+		next();
+
+	},
 	template: `
 
 	<h2>{{$p.t('lehre/myLV')}}</h2>
@@ -104,7 +109,7 @@ export default {
 					<button :aria-label="$p.t('lehre','previousStudSemester')" v-tooltip.top="{showDelay:1000, value:$p.t('lehre','previousStudSemester')}" class="btn btn-outline-secondary" type="button" :disabled="currentIsFirst" @click="prevSem">
 						<i class="fa fa-caret-left" aria-hidden="true"></i>
 					</button>
-					<select ref="studiensemester" v-model="currentSemester" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setHash($event.target.value)">
+					<select ref="studiensemester" v-model="currentSemester" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="updateRouter($event.target.value)">
 						<option v-for="semester in studiensemester" :key="semester.studiensemester_kurzbz">{{semester.studiensemester_kurzbz}}</option>
 					</select>
 					<button class="btn btn-outline-secondary" :aria-label="$p.t('lehre','nextStudSemester')" v-tooltip.top="{showDelay:1000, value:$p.t('lehre','nextStudSemester')}" type="button" :disabled="currentIsLast" @click="nextSem">

public/js/components/Cis/Profil/MitarbeiterProfil.js

@@ -11,6 +11,7 @@ import RoleInformation from "./ProfilComponents/RoleInformation.js";
 import ProfilInformation from "./ProfilComponents/ProfilInformation.js";
 
 import ApiProfilUpdate from '../../../api/factory/profilUpdate.js';
+import { dateFilter } from '../../../tabulator/filters/Dates.js';
 
 export default {
 	components: {
@@ -40,7 +41,7 @@ export default {
 				persistence: {
 					columns: false
 				},
-				height: 300,
+				minHeight: 300,
 				layout: "fitColumns",
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
@@ -74,18 +75,24 @@ export default {
 					{
 						title: Vue.computed(() => this.preloadedPhrasen.gueltigVonPhrase),
 						field: "Gültig_von",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 					{
 						title: Vue.computed(() => this.preloadedPhrasen.gueltigBisPhrase),
 						field: "Gültig_bis",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 					{
 						title: Vue.computed(() => this.preloadedPhrasen.wochenstundenPhrase),
@@ -102,7 +109,7 @@ export default {
 				persistence: {
 					columns: false
 				},
-				height: 300,
+				minHeight: 300,
 				layout: "fitColumns",
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
@@ -138,9 +145,12 @@ export default {
 					{
 						title: Vue.computed(() => this.preloadedPhrasen.ausgabedatumPhrase),
 						field: "Ausgegeben_am",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 				],
 			}
@@ -167,11 +177,11 @@ export default {
 				this.$api
 					.call(ApiProfilUpdate.selectProfilRequest())
 					.then((request) => {
-						if (!request.error && request) {
+						if (!request.error && request.data) {
 							this.data.profilUpdates = request.data;
 							this.data.profilUpdates.sort(this.sortProfilUpdates);
 						} else {
-							console.error("Error when fetching profile updates: " + res.data);
+							console.error("Error when fetching profile updates: " + request);
 						}
 					})
 					.catch((err) => {
@@ -211,6 +221,15 @@ export default {
 		setTableColumnTitles() { // reevaluates computed phrasen
 			if(this.$refs.betriebsmittelTable) this.$refs.betriebsmittelTable.tabulator.setColumns(this.betriebsmittel_table_options.columns)
 			if(this.$refs.funktionenTable) this.$refs.funktionenTable.tabulator.setColumns(this.funktionen_table_options.columns)
+		},
+		datetimeFormatterParams: function() {
+			const params = {
+				inputFormat:"yyyy-MM-dd",
+				outputFormat:"dd.MM.yyyy",
+				invalidPlaceholder:"(invalid date)",
+				timezone:FHC_JS_DATA_STORAGE_OBJECT.timezone
+			};
+			return params;
 		}
 	},
 

public/js/components/Cis/Profil/MitarbeiterViewProfil.js

@@ -5,6 +5,8 @@ import RoleInformation from "./ProfilComponents/RoleInformation.js";
 import ProfilEmails from "./ProfilComponents/ProfilEmails.js";
 import ProfilInformation from "./ProfilComponents/ProfilInformation.js";
 
+import { dateFilter } from '../../../tabulator/filters/Dates.js';
+
 export default {
 	components: {
 		CoreFilterCmpt,
@@ -24,7 +26,7 @@ export default {
 				persistence: {
 					columns: false
 				},
-				height: 300,
+				minHeight: 300,
 				layout: "fitColumns",
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
@@ -60,18 +62,24 @@ export default {
 					{
 						title: Vue.computed(() => this.$p.t('global/gueltigVon')),
 						field: "Gültig_von",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 					{
 						title: Vue.computed(() => this.$p.t('global/gueltigBis')),
 						field: "Gültig_bis",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 					{
 						title: Vue.computed(() => this.$p.t('profil/wochenstunden')),
@@ -91,6 +99,15 @@ export default {
 		funktionenTableBuilt: function () {
 			this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
 		},
+		datetimeFormatterParams: function() {
+			const params = {
+				inputFormat:"yyyy-MM-dd",
+				outputFormat:"dd.MM.yyyy",
+				invalidPlaceholder:"(invalid date)",
+				timezone:FHC_JS_DATA_STORAGE_OBJECT.timezone
+			};
+			return params;
+		}
 	},
 	watch: {
 		'data.funktionen'(newVal) {

public/js/components/Cis/Profil/ProfilComponents/FetchProfilUpdates.js

@@ -88,6 +88,18 @@ export default {
 				if (isMitarbeiter) {
 					content["isMitarbeiter"] = isMitarbeiter;
 				}
+
+				const filesFromDatabase =
+					await this.$api
+						.call(ApiProfilUpdate.getProfilRequestFiles(
+							updateRequest.profil_update_id
+						))
+						.then((res) => {
+							return res.data;
+						});
+
+				files = filesFromDatabase;
+				content["files"] = files;
 			}
 
 			//? adds the status information if the profil update request was rejected or accepted

public/js/components/Cis/Profil/ProfilComponents/RoleInformation.js

@@ -10,21 +10,34 @@ export default {
 			type: String,
 		}
 	},
-	inject: [
-		'studiengang_kz', // inject info that should not be displayed
-	],
+	inject: {
+		// inject info that should not be displayed
+		'studiengang_kz': {
+			from: 'studiengang_kz',
+			default: false
+		},
+	},
 	computed: {
 		getLinkGruppeListe() {
+			if(this.studiengang_kz === false) {
+				return '';
+			}
 			return this.data.gruppe?.value && this.data.verband?.value && this.data.semester?.value ? FHC_JS_DATA_STORAGE_OBJECT.app_root 
 				+ 'cis/private/stud_in_grp.php?kz='+this.studiengang_kz+'&sem=' + this.data.semester.value
 				+ '&verband=' + this.data.verband.value + '&grp=' + this.data.gruppe.value : ''
 		},
 		getLinkVerbandListe() {
+			if(this.studiengang_kz === false) {
+				return '';
+			}
 			return this.data.verband?.value && this.data.semester?.value ? FHC_JS_DATA_STORAGE_OBJECT.app_root 
 				+ 'cis/private/stud_in_grp.php?kz='+this.studiengang_kz+'&sem=' + this.data.semester.value
 				+ '&verband=' + this.data.verband.value : ''
 		},
 		getLinkSemesterListe() {
+			if(this.studiengang_kz === false) {
+				return '';
+			}
 			return this.data.semester?.value ? FHC_JS_DATA_STORAGE_OBJECT.app_root 
 				+ 'cis/private/stud_in_grp.php?kz='+this.studiengang_kz+'&sem=' + this.data.semester.value : ''
 		}

public/js/components/Cis/Profil/ProfilModal/EditProfilComponents/EditAdresse.js

@@ -1,8 +1,11 @@
+import Dms from "../../../../Form/Upload/Dms.js";
+
 import ApiProfil from '../../../../../api/factory/profil.js';
 
 export default {
   components: {
     AutoComplete: primevue.autocomplete,
+	Dms: Dms
   },
 
   props: {
@@ -11,9 +14,13 @@ export default {
       type: Boolean,
       default: false,
     },
+    files: {
+      type: Array,
+      default: []
+    },
   },
 
-  inject: ["getZustelladressenCount"],
+  inject: ["getZustelladressenCount", "updateFileID"],
 
   data() {
     return {
@@ -23,6 +30,8 @@ export default {
       nationenList: [],
       originalValue: null,
       zustellAdressenCount: null,
+	  dmsData: [],
+	  fileschanged: false
     };
   },
 
@@ -83,6 +92,11 @@ export default {
       //? sets the value of a property to null when an empty string is entered to keep the isChanged function valid
       if (bind === "zustelladresse") {
         this.data[bind] = event.target.checked;
+	  } else if(bind === 'files') {
+		  if(this.dmsData.length > 0 && this.dmsData[0].type !== 'application/x.fhc-dms+json') {
+		    this.fileschanged = true;
+		  }
+		  this.updateFileID(this.dmsData);
       } else {
         this.data[bind] = event.target.value === "" ? null : event.target.value;
       }
@@ -91,6 +105,11 @@ export default {
       // update the zustellAdressen count
       this.zustellAdressenCount = this.getZustelladressenCount();
     },
+
+	deleteDmsData: function() {
+		this.dmsData = [];
+		this.updateValue(null, 'files');
+	}
   },
 
   computed: {
@@ -111,12 +130,14 @@ export default {
         !this.data.strasse ||
         !this.data.plz ||
         !this.data.ort ||
-        !this.data.typ
+        !this.data.typ ||
+        this.dmsData.length === 0
       ) {
         return false;
       }
 
-      return this.originalValue !== JSON.stringify(this.data);
+      const datachanged = this.originalValue !== JSON.stringify(this.data);
+      return datachanged || this.fileschanged;
     },
   },
 
@@ -133,6 +154,12 @@ export default {
     this.zustellAdressenCount = this.getZustelladressenCount();
   },
 
+  mounted() {
+    if (this.files) {
+      this.dmsData = this.files;
+    }
+  },
+
   template: /*html*/ `
 <div class="gy-3 row justify-content-center align-items-center">
   <!-- warning message for too many zustellungs Adressen -->
@@ -212,9 +239,28 @@ export default {
     </div>
   </div>
 
-
-  
-
+	<div class="row g-2">
+		<div class="col">
+			<div class="form-underline-titel">{{$p.t('profilUpdate','meldebestaetigung')}}*</div>
+			<dms
+				ref="update"
+				id="files"
+				name="files"
+				:multiple="false"
+				v-model="dmsData"
+				@update:model-value="updateValue($event,'files')"
+			></dms>
+		</div>
+		<div class="col-auto">
+			<div>&nbsp;</div>
+			<button
+					@click="deleteDmsData"
+					class="btn btn-danger"
+					:aria-label="$p.t('profilUpdate','deleteAttachment')"
+					:title="$p.t('profilUpdate','deleteAttachment')"
+			><i style="color:white" class="fa fa-trash" aria-hidden="true"></i></button>
+		</div>
+	</div>
 
 </div>
     `,

public/js/components/Cis/Profil/ProfilModal/EditProfilComponents/ImageUpload.js

@@ -16,7 +16,7 @@ export default {
 	mixins: [BsModal],
 	props: {
 		titel: {
-			type: Object,
+			type: String,
 		},
 		files: {
 			type: Array,
@@ -57,7 +57,7 @@ export default {
 	},
 	template: /*html*/`
 
-	<bs-modal v-show="!loading" ref="modalContainer" v-bind="$props" body-class="" dialog-class="modal-lg" class="bootstrap-alert" :backdrop="false">
+	<bs-modal ref="modalContainer" v-bind="$props" body-class="" dialog-class="modal-lg" class="bootstrap-alert" :backdrop="false">
 		<template #title>
 			<p style="opacity:0.8" class="ms-2" v-if="!updateID">{{$p.t('profilUpdate','profilBildUpdateMessage',[titel])}}</p>
 		</template>

public/js/components/Cis/Profil/ProfilModal/EditProfilComponents/Status.js

@@ -112,14 +112,17 @@ export default {
     <div class="form-underline-titel">{{topic}}</div>
     <span  class="form-underline-content">{{data.value}} </span>
     </div>
-    <div v-if="files?.length" class="ms-2">
-    
-    <a target="_blank" :href="getDocumentLink(file.dms_id)" v-for="file in files">{{file.name}}</a>
-    </div>
     </template>
     <component v-else :is="getComponentView" :data="data"></component>
     
     </div>
     </div>
+
+	<div v-if="files?.length" class="card mt-4">
+		<div class="card-header">{{$p.t('profilUpdate','nachweisdokumente')}}</div>
+		<div class="card-body">
+			<a target="_blank" :href="getDocumentLink(file.dms_id)" v-for="file in files">{{file.name}}</a>
+		</div>
+	</div>
     `,
 };

public/js/components/Cis/Profil/StudentProfil.js

@@ -11,6 +11,7 @@ import FetchProfilUpdates from "./ProfilComponents/FetchProfilUpdates.js";
 import EditProfil from "./ProfilModal/EditProfil.js";
 
 import ApiProfilUpdate from '../../../api/factory/profilUpdate.js';
+import { dateFilter } from '../../../tabulator/filters/Dates.js';
 
 export default {
 	components: {
@@ -39,7 +40,7 @@ export default {
 				persistence: {
 					columns: false
 				},
-				height: 200,
+				minHeight: 200,
 				layout: "fitColumns",
 				columns: [{
 					title: Vue.computed(() => this.preloadedPhrasen.zutrittsGruppenPhrase),
@@ -51,7 +52,7 @@ export default {
 				persistence: {
 					columns: false
 				},
-				height: 300,
+				minHeight: 300,
 				layout: "fitColumns",
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
@@ -85,9 +86,12 @@ export default {
 					{
 						title: Vue.computed(() =>this.preloadedPhrasen.ausgabedatum) ,
 						field: "Ausgegeben_am",
-						headerFilter: true,
+						headerFilterFunc: 'dates',
+						headerFilter: dateFilter,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						formatter:"datetime",
+						formatterParams: this.datetimeFormatterParams()
 					},
 				],
 			},
@@ -133,11 +137,11 @@ export default {
 				this.$api
 					.call(ApiProfilUpdate.selectProfilRequest())
 					.then((request) => {
-						if (!request.error && res) {
+						if (!request.error && request.data) {
 							this.data.profilUpdates = request.data;
 							this.data.profilUpdates.sort(this.sortProfilUpdates);
 						} else {
-							console.error("Error when fetching profile updates: " + res.data);
+							console.error("Error when fetching profile updates: " + request);
 						}
 					})
 					.catch((err) => {
@@ -160,6 +164,15 @@ export default {
 				this.$refs.editModal.show();
 			});
 		},
+		datetimeFormatterParams: function() {
+			const params = {
+				inputFormat:"yyyy-MM-dd",
+				outputFormat:"dd.MM.yyyy",
+				invalidPlaceholder:"(invalid date)",
+				timezone:FHC_JS_DATA_STORAGE_OBJECT.timezone
+			};
+			return params;
+		}
 	},
 
 	computed: {

public/js/components/Cis/ProfilUpdate/AcceptDenyUpdate.js

@@ -188,16 +188,21 @@ export default {
 
       <span  class="form-underline-content" >{{data.requested_change.value}}</span>
     </div>
-    <div v-if="files?.length" class="ms-2">
-    
-    <a  v-for="file in files" target="_blank" :href="getDocumentLink(file.dms_id)" >{{file.name}}</a>
-    </div>
     </template>
 
 
     <component v-else :is="getComponentView" :withZustelladresse="getComponentView==='adresse'?true:false" :data="data.requested_change"></component>
+
     </div>
     </div>
+
+		<div  v-if="files?.length" class="card mt-3">
+			<div class="card-header">{{$p.t('profilUpdate','nachweisdokumente')}}</div>
+			<div class="card-body">
+				<a  v-for="file in files" target="_blank" :href="getDocumentLink(file.dms_id)" >{{file.name}}</a>
+			</div>
+		</div>
+
     </div>
     </div>
     

public/js/components/Cis/ProfilUpdate/ProfilUpdateView.js

@@ -31,10 +31,10 @@ export default {
     Loading,
     AcceptDenyUpdate,
   },
-  inject: ["profilUpdateTopic", "profilUpdateStates"],
+  inject: ["profilUpdateStates"],
   props: {
     id: {
-      type: Number,
+      type: String,
     },
   },
   data() {
@@ -44,51 +44,53 @@ export default {
       modalData: null,
       loading: false,
       filter: "Pending",
-      events: [],
       profil_update_id: Number(this.id),
 
   };
   },
-  computed:{
-    profilUpdateOptions: function(){
-      return {
-        ajaxURL:
-          FHC_JS_DATA_STORAGE_OBJECT.app_root +
-          FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-          `/Cis/ProfilUpdate/`,
-
-        ajaxURLGenerator: (url, config, params) => {
-          //? this function needs to be an array function in order to access the this properties of the Vue component
-
-          switch (this.filter) {
-            case this.profilUpdateStates["Pending"]:
-              return (
-                url +
-                `getProfilUpdateWithPermission/${this.profilUpdateStates["Pending"]}`
-              );
-            case this.profilUpdateStates["Accepted"]:
-              return (
-                url +
-                `getProfilUpdateWithPermission/${this.profilUpdateStates["Accepted"]}`
-              );
-            case this.profilUpdateStates["Rejected"]:
-              return (
-                url +
-                `getProfilUpdateWithPermission/${this.profilUpdateStates["Rejected"]}`
-              );
-            default:
-              return url + `getProfilUpdateWithPermission`;
-          }
-        },
+	computed: {
+		profilUpdateEvents: function () {
+			return [
+				{
+					"event": "dataProcessed",
+					"handler": this.handleDataProcessed
+				}
+			];
+		},
+		profilUpdateOptions: function () {
+			return {
+				ajaxURL: 'dummy',
+				ajaxRequestFunc: (url, config, params) => {
+					return this.$api.call(ApiProfilUpdate.getProfilUpdateWithPermission(params.filter));
+				},
+				ajaxParams: () => {
+					let filter = '';
+					switch (this.filter) {
+						case this.profilUpdateStates["Pending"]:
+							filter = this.profilUpdateStates["Pending"];
+							break;
+						case this.profilUpdateStates["Accepted"]:
+							filter = this.profilUpdateStates["Accepted"];
+							break;
+						case this.profilUpdateStates["Rejected"]:
+							filter = this.profilUpdateStates["Rejected"];
+							break;
+						default:
+							filter = '';
+					}
+					return {
+						"filter": filter
+					};
+				},
         ajaxResponse: (url, params, response) => {
           //url - the URL of the request
           //params - the parameters passed with the request
           //response - the JSON object returned in the body of the response.
           //? sorts the response data from the backend
-          if (response)
-            response.sort((ele1, ele2) => sortProfilUpdates(ele1, ele2, this));
+					if (response?.data)
+						response.data.sort((ele1, ele2) => sortProfilUpdates(ele1, ele2, this));
 
-          return response;
+					return response.data;
         },
         //? adds tooltip with the status message of a profil update request if its status is not pending
         columnDefaults: {
@@ -356,7 +358,19 @@ export default {
       this.$refs.UpdatesTable.tabulator.setData();
       //? store the selected view in the session storage of the browser
       sessionStorage.setItem("filter", event.target.value);
-    },
+		},
+		handleDataProcessed: function () {
+			if (this.profil_update_id) {
+				const arrayRowData = this.$refs.UpdatesTable.tabulator
+					.getData()
+					.filter((row) => {
+						return row.profil_update_id === this.profil_update_id;
+					});
+				if (arrayRowData.length) {
+					this.showAcceptDenyModal(arrayRowData[0]);
+				}
+			}
+		}
   },
   watch: {
     loading: function (newValue, oldValue) {
@@ -374,20 +388,7 @@ export default {
   },
 
   mounted() {
-    //? opens the AcceptDenyUpdate Modal if a preselected profil_update_id was passed to the component (used for email links)
-    if (this.profil_update_id) {
-      this.$refs.UpdatesTable.tabulator.on("dataProcessed", () => {
-        const arrayRowData = this.$refs.UpdatesTable.tabulator
-          .getData()
-          .filter((row) => {
-            return row.profil_update_id === this.profil_update_id;
-          });
-        if (arrayRowData.length) {
-          this.showAcceptDenyModal(arrayRowData[0]);
-        }
-      });
-    }
-
+		//? opens the AcceptDenyUpdate Modal if a preselected profil_update_id was passed to the component (used for email links)
     if (sessionStorage.getItem("filter")) {
       this.filter = sessionStorage.getItem("filter");
     }
@@ -409,7 +410,7 @@ export default {
     </div>
     <loading ref="loadingModalRef" :timeout="0"></loading>
     
-    <core-filter-cmpt v-if="profilUpdateStates && categoryLoaded" :title="$p.t('profilUpdate','profilUpdateRequests')"  ref="UpdatesTable" :tabulatorEvents="events" :tabulator-options="profilUpdateOptions" tableOnly :sideMenu="false" />
+    <core-filter-cmpt v-if="profilUpdateStates && categoryLoaded" :title="$p.t('profilUpdate','profilUpdateRequests')"  ref="UpdatesTable" :tabulatorEvents="profilUpdateEvents" :tabulator-options="profilUpdateOptions" tableOnly :sideMenu="false" />
 
     </div>`,
 };

public/js/components/Cis/Raumsuche/Raumsuche.js

@@ -1,6 +1,6 @@
 import {CoreFilterCmpt} from "../../../components/filter/Filter.js";
 import VueDatePicker from '../../vueDatepicker.js.php';
-
+import ApiOrt from '../../../api/factory/ort.js'
 export const Raumsuche =  {
 	name: "Raumsuche",
 	props: {
@@ -13,6 +13,8 @@ export const Raumsuche =  {
 	},
 	data() {
 		return {
+			phrasenPromise: null,
+			phrasenResolved: false,
 			tabulatorUuid: Vue.ref(0),
 			tableBuiltResolve: null,
 			tableBuiltPromise: null,
@@ -54,8 +56,8 @@ export const Raumsuche =  {
 				columns: [
 					{title: Vue.computed(() => this.$p.t('rauminfo/raum_kurzbz')), field: 'ort_kurzbz', widthGrow: 1},
 					{title: Vue.computed(() => this.$p.t('global/bezeichnung')), field: 'bezeichnung', widthGrow: 2},
-					{title: Vue.computed(() => this.$p.t('global/nummer')), field: 'nummer', widthGrow: 1},
-					{title: Vue.computed(() => this.$p.t('global/personen')), field: 'personen', widthGrow: 1},
+					{title: Vue.computed(() => this.$p.t('rauminfo/raumnummer')), field: 'nummer', widthGrow: 1},
+					{title: Vue.computed(() => this.$p.t('rauminfo/personcap')), field: 'personen', widthGrow: 1},
 					{title: Vue.computed(() => this.$p.t('rauminfo/rauminfo')),
 						field: 'linkInfo', formatter: this.linkFormatter, widthGrow: 1},
 					{title: Vue.computed(() => this.$p.t('rauminfo/roomReservations')), 
@@ -68,17 +70,6 @@ export const Raumsuche =  {
 				handler: async () => {
 					this.tableBuiltResolve()
 				}
-			},
-			{
-				event: "cellClick",
-				handler: async (e, cell) => {
-
-					if((cell.column.field === 'linkInfo' || cell.column.field === 'linkRes') && cell.value){
-						window.open(cell.value, '_blank');
-						e.stopPropagation();
-					}
-					
-				}
 			}
 			]};
 	},
@@ -132,7 +123,8 @@ export const Raumsuche =  {
 			this.$refs.raumsucheTable.tabulator.setData(d);
 		},
 		loadRoomTypes() {
-			this.$fhcApi.factory.ort.getRoomTypes().then(res => {
+			this.$api.call(ApiOrt.getRoomTypes())
+				.then(res => {
 				res?.data?.forEach(type => {
 					type.beschreibung = type.beschreibung.replace('&', '&')
 				})
@@ -141,7 +133,7 @@ export const Raumsuche =  {
 			})
 		},
 		loadRooms() {
-			this.$fhcApi.factory.ort.getRooms(this.datum.toISOString(), this.getTimeString(this.von), this.getTimeString(this.bis), this.selectedType?.raumtyp_kurzbz ?? '', this.anzahl)
+			this.$api.call(ApiOrt.getRooms(this.datum.toISOString(), this.getTimeString(this.von), this.getTimeString(this.bis), this.selectedType?.raumtyp_kurzbz ?? '', this.anzahl))
 				.then(res => {
 					if(res?.data?.retval) this.setupData(res.data.retval)
 			})
@@ -167,6 +159,7 @@ export const Raumsuche =  {
 			return `${hours}:${minutes}`;
 		},
 		async setupMounted() {
+			
 			this.tableBuiltPromise = new Promise(this.tableResolve)
 			await this.tableBuiltPromise
 			
@@ -182,7 +175,7 @@ export const Raumsuche =  {
 			if(this.$refs.raumsucheTable) {
 				this.$refs.raumsucheTable.$refs.table.style.setProperty('height', h+'px')
 			}
-
+			
 		}
 	},
 	computed: {
@@ -191,7 +184,8 @@ export const Raumsuche =  {
 		}
 	},
 	created() {
-		
+		this.phrasenPromise = this.$p.loadCategory(['rauminfo', 'global'])
+		this.phrasenPromise.then(()=> {this.phrasenResolved = true})
 	},
 	mounted() {
 		this.setupMounted()
@@ -239,7 +233,7 @@ export const Raumsuche =  {
 			</VueDatePicker>
 		</div>
 		
-		<div class="col-lg-auto">
+		<div class="col-12 col-lg-3">
 			<select ref="raumtyp" id="raumtypSelect" v-model="selectedType" class="form-select" 
 			:aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setRoute($event.target.value)">
 				<option :key="defaultType" selected :value="defaultType">{{defaultType.beschreibung}}</option>
@@ -248,16 +242,21 @@ export const Raumsuche =  {
 		</div>
 		
 
-		<div class="col-4 col-lg-2">
-			<InputNumber v-model="anzahl" :prefix="$p.t('rauminfo/anzahlPersonen') + ': '" inputId="anzahlInput" :min="1" :max="100" />
+		<div class="col-12 col-lg-3">
+			<InputNumber v-model="anzahl" 
+			:prefix="$p.t('rauminfo/minCapacity') + ': '" 
+			inputId="anzahlInput" :min="1" :max="1000" 
+			:style="{'width': '100%'}"
+			/>
 		</div>
-		<div class="col-8 col-lg-2 d-flex justify-content-center align-items-center">
+		<div class="col-12 col-lg-2">
 			<button class="btn btn-primary border-0" @click="search">{{ $p.t('rauminfo/roomSearch') }} <i class="fa fa-magnifying-glass"></i></button>
 		</div>
 	</div>
 	
 
      <core-filter-cmpt 
+     	v-if="phrasenResolved"
 		@uuidDefined="handleUuidDefined"
 		:title="''"  
 		ref="raumsucheTable" 

public/js/components/Cis/Renderer/Lehreinheit/calendarEvent.js

@@ -23,14 +23,6 @@ export default {
 				this.$p.t('person/ort'),
 				this.event.ort_kurzbz
 			].join(": "));
-
-			this.event.lektor = [
-				this.event.lektor[0],
-				this.event.lektor[0],
-				this.event.lektor[0],
-				this.event.lektor[0],
-				this.event.lektor[0],
-			];
 			
 			if (Array.isArray(this.event.lektor) && this.event.lektor.length > 0) {
 				if (this.event.lektor.length > 3) {

public/js/components/Dashboard/Item.js

@@ -156,7 +156,7 @@ export default {
 			<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
 		</div>
 	</div>
-	<div v-else-if="!hidden || editMode" :id="widgetID" class="dashboard-item card overflow-hidden h-100 position-relative" :class="{'draggedItem':dragstate, 'dashboard-item-overlay':resizeOverlay, [arguments?.className]:arguments && arguments.className}">
+	<div v-else-if="!hidden || editMode" :id="widgetID" class="dashboard-item card overflow-hidden h-100 position-relative" :class="{'hiddenWidget':hidden, 'draggedItem':dragstate, 'dashboard-item-overlay':resizeOverlay, [arguments?.className]:arguments && arguments.className}">
 	<div v-show="!dragstate" class="h-100 card border-0">
 		<div v-if="widget" class="card-header d-flex ps-0 pe-2 align-items-center">
 			<Transition>

public/js/components/DashboardWidget/News.js

@@ -106,7 +106,7 @@ export default {
 		setPrev() {
 			const thisIndex = this.allNewsList.findIndex(n=>n.news_id == this.selected.news_id)
 			const prevIndex = thisIndex ? thisIndex - 1 : this.allNewsList.length - 1
-			
+
 			this.setSelected(this.allNewsList[prevIndex])
 			this.updateNewsContentClasses();
 		},
@@ -118,14 +118,14 @@ export default {
 			return classString
 		},
 		async setSelected(news) {
-			let clickedElement = document.getElementById('card-'+news.news_id);
-			let clickedElementIndex = this.allNewsList.indexOf(news);
-			let oldElementIndex = this.allNewsList.indexOf(this.selected);
+			const clickedElement = document.getElementById('card-'+news.news_id);
+			const clickedElementIndex = this.allNewsList.indexOf(news);
+			const oldElementIndex = this.allNewsList.indexOf(this.selected);
 			
 			//if the clicked element is already active, do nothing
 			if(clickedElementIndex === oldElementIndex) return;
 			//add prev/next class to the clicked element
-			if(clickedElementIndex > oldElementIndex){
+			if(clickedElementIndex > oldElementIndex) {
 				clickedElement.classList.add('carousel-item-next');
 			}else{
 				clickedElement.classList.add('carousel-item-prev');

public/js/components/DashboardWidget/Url.js

@@ -159,7 +159,7 @@ export default {
 		// this.$emit('setConfig', true); -> use this to enable widget config mode if needed
 	},
 	template: /*html*/ `
-    <div class="widgets-url w-100 h-100 overflow-scroll" style="padding: 1rem 1rem;">
+    <div class="widgets-url w-100 h-100 overflow-auto" style="padding: 1rem 1rem;">
         <div class="d-flex flex-column justify-content-between">
         	<button class="btn btn-outline-secondary btn-sm w-100 mt-2 card" @click="openCreateModal" type="button">{{$p.t('bookmark','newLink')}}</button>
 

public/js/components/Drop/Grid.js

@@ -274,8 +274,23 @@ export default {
 		dragging(event){
 			if(this.mode == MODE_MOVE){
 				this.toggleDraggedItemOverlay(true);
-				this.clonedWidget.style.top = `${this.clientY-20}px`;
-				this.clonedWidget.style.left = `${this.clientX-15}px`;
+				
+				const containerRect = this.$refs.container.getBoundingClientRect();
+				const clonedWidgetRect = this.clonedWidget.getBoundingClientRect();
+				
+				let desiredTop = this.clientY - 20;
+				let desiredLeft = this.clientX - 15;
+				
+				const minTop = 0;
+				const maxTop = containerRect.height - clonedWidgetRect.height;
+				const minLeft = 0;
+				const maxLeft = containerRect.width - clonedWidgetRect.width;
+				
+				const constrainedTop = Math.max(minTop, Math.min(maxTop, desiredTop));
+				const constrainedLeft = Math.max(minLeft, Math.min(maxLeft, desiredLeft));
+				
+				this.clonedWidget.style.top = `${constrainedTop}px`;
+				this.clonedWidget.style.left = `${constrainedLeft}px`;
 			}
 		},
 		createNewGrid(items) {
@@ -413,11 +428,14 @@ export default {
 			setTimeout(() => {
 				this.draggedNode = evt.target.closest(".drop-grid-item");
 				//clones the widget for the drag Image
+				
 				let clone = evt.target.closest(".drop-grid-item")?.cloneNode(true);
 
 				clone.style.zIndex = 5;
 				clone.classList.add("widgetClone");
 				this.$refs.container.appendChild(clone);
+				const hiddenWidget = clone.querySelector("[style='display: none;']");
+				hiddenWidget.style.removeProperty("display");
 				this.clonedWidget = clone;
 			}, 0);
 
@@ -434,12 +452,9 @@ export default {
 		},
 		dragOver(evt) {
 			if ((this.y + 1) > this.rows && (this.mode == MODE_MOVE || this.mode == MODE_RESIZE)) {
-				this.positionUpdates = this.positionUpdates?.filter(item => {
-					return item.widgetid == this.draggedItem.data.widgetid;
-				})
-				this.dragEnd();
 				this.dragCancel();
-			} 
+				
+			}
 			if (!this.active)
 				return this.dragCancel();
 			this.checkPinnedWidgetAnimation();
@@ -454,17 +469,17 @@ export default {
 						let x = this.x + this.draggedOffset[0];
 						let y = this.y + this.draggedOffset[1];
 						if (x < 0) {
-							this.draggedOffset[0] -= x;
+							this.draggedOffset[0] += x;
 							x = 0;
 						} else if (x + this.draggedItem.w > this.cols) {
 							this.draggedOffset[0] += this.cols - this.draggedItem.w - x;
 							x = this.cols - this.draggedItem.w;
 						}
 						if (y < 0) {
-							this.draggedOffset[1] -= y;
+							this.draggedOffset[1] += y;
 							y = 0;
 						}
-						this.positionUpdates = this.dragGrid.move(this.draggedItem, x, y);
+						this.positionUpdates= this.dragGrid.move(this.draggedItem, x, y);
 						break;
 					}
 					case MODE_RESIZE: {
@@ -481,6 +496,7 @@ export default {
 			}
 		},
 		dragCancel() {
+			this.removeWidgetClones();
 			this.additionalRowComputed = false;
 			this.toggleDraggedItemOverlay(false);
 			this.mode = MODE_IDLE;
@@ -492,8 +508,12 @@ export default {
 			
 		},
 		dragEnd() {
-			if (this.mode == MODE_IDLE)
+			this.removeWidgetClones();
+			this.toggleDraggedItemOverlay(false);
+			
+			if (this.mode == MODE_IDLE){
 				return;
+			}
 			// clean up unused classes
 			let draggedItemNode = document.getElementById(this.draggedItem.data.widgetid);
 			draggedItemNode.classList.remove("border-danger");
@@ -501,19 +521,19 @@ export default {
 				ele.classList.remove("denied-dragging-animation");
 			})
 			
-			let widgetClones = document.getElementsByClassName("widgetClone");
-			for (let i=0; i <widgetClones.length; i++){ 
-				this.$refs.container.removeChild(widgetClones[i]);
-			}
-			
-			if (!this.active || this.x < 0 || this.y < 0 || this.x >= this.cols)
-				return this.dragCancel();
+			//if (!this.active || this.x < 0 || this.y < 0 || this.x >= this.cols)
+				//return this.dragCancel();
+
 			this.mode = MODE_IDLE;
 			let updated = [];
 			this.convertGridResultToUpdate(this.positionUpdates, updated);
 			updated = this._updateFixedPositions(updated);
 			if (updated.length)
 				this.$emit('rearrangeItems', updated.filter(v => v));
+
+			this.draggedItem = null;
+			this.draggedNode = null;
+			this.$emit('draggedItem', null);
 		},
 		_updateFixedPositions(updated) {
 			updated.forEach((item, index) => {
@@ -597,6 +617,12 @@ export default {
 				draggedItemNode.classList.remove("border-danger");
 			}
 		},
+		removeWidgetClones(){
+			let widgetClones = Array.from(document.getElementsByClassName("widgetClone"));
+			for (let i = 0; i < widgetClones.length; i++) {
+				this.$refs.container.removeChild(widgetClones[i]);
+			}
+		},
 		mouseDown(){
 			this.mode = MODE_MOUSE_DOWN;
 		},
@@ -612,7 +638,7 @@ export default {
 		@touchmove="dragOver"
 		@touchend="dragCancel"
 		@dragover.prevent="dragOver"
-		@drop="dragEnd"
+		@drop="dragEnd($event)"
 		@mousemove="updateCursorOnMouseMove"
 		@mouseleave="mouseLeave">
 		<TransitionGroup tag="div">
@@ -626,7 +652,7 @@ export default {
 				@mouse-up="mouseUp"
 				@start-resize="startResize"
 				@dragging="dragging"
-				@end-drag="dragCancel"
+				@end-drag="dragEnd"
 				@touch-end="dragEnd();mouseUp();"
 				@touch-start="updateCursorOnMouseMove($event); mouseDown();"
 				class="position-absolute"

public/js/components/Form/Input.js

@@ -3,6 +3,7 @@ import FhcFragment from "../Fragment.js";
 let _uuid = {};
 
 export default {
+	name: "FormInput",
 	inheritAttrs: false,
 	components: {
 		FhcFragment
@@ -220,7 +221,7 @@ export default {
 			if (this.tag == 'VueDatePicker' && !this._.components.VueDatePicker) {
 				this._.components.VueDatePicker = Vue.defineAsyncComponent(() => import("../vueDatepicker.js.php"));
 			} else if (this.tag == 'PvAutocomplete' && !this._.components.PvAutocomplete) {
-				this._.components.PvAutocomplete = Vue.defineAsyncComponent(() => import(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + "/public/js/components/primevue/autocomplete/autocomplete.esm.min.js"));
+				this._.components.PvAutocomplete = primevue.autocomplete;
 			} else if (this.tag == 'UploadImage' && !this._.components.UploadImage) {
 				this._.components.UploadImage = Vue.defineAsyncComponent(() => import("./Upload/Image.js"));
 			} else if (this.tag == 'UploadDms' && !this._.components.UploadDms) {

public/js/components/Form/Validation.js

@@ -23,7 +23,8 @@ export default {
 			if (!Array.isArray(feedback))
 				feedback = [feedback];
 			const ts = Date.now();
-			this.feedback[valid ? 'success' : 'danger'] = feedback.map(msg => [msg, ts]);
+			this.feedback[valid ? 'success' : 'danger']
+				.push(...feedback.map(msg => [msg, ts]));
 		}
 	},
 	mounted() {

public/js/components/LVVerwaltung/Details/Form.js

@@ -38,33 +38,6 @@ export default {
 	},
 	template: `
 	<div>
-		<div class="row align-items-start mb-3">
-			<form-input
-				v-if="showLVID"
-				:label="$p.t('lehre', 'lehrveranstaltung_id')"
-				type="text"
-				container-class="col-3"
-				v-model="data.lehrveranstaltung_id"
-				name="lehrveranstaltung_id"
-			 />
-			<form-input
-				v-if="showGewichtung"
-				:label="$p.t('lehre', 'gewicht')"
-				type="text"
-				container-class="col-3"
-				v-model="data.gewicht"
-				name="gewicht"
-			/>
-			<form-input
-				:label="$p.t('lehre', 'detailanmerkung')"
-				type="textarea"
-				container-class="col-3"
-				v-model="formattedAnmerkung"
-				name="anmerkung"
-				id="anmerkung"
-				rows="4"
-			/>
-		</div>
 		<div class="row mb-3">
 			<form-input
 				:label="$p.t('lehre', 'lehrfach')"
@@ -96,55 +69,15 @@ export default {
 				{{ lehrform.bez_kurz }} {{ lehrform.bez }}
 				</option>
 			</form-input>
-		</div>
-	
-		<div class="row mb-3">
+			
 			<form-input
-				:label="$p.t('global', 'sprache')"
-				type="select"
+				:label="$p.t('lehre', 'detailanmerkung')"
+				type="textarea"
 				container-class="col-3"
-				v-model="data.sprache"
-				name="sprache"
-			>
-				<option
-				v-for="sprache in dropdowns.sprachen_array"
-				:key="sprache.sprache"
-				:value="sprache.sprache"
-				>
-				{{ sprache.sprache }}
-				</option>
-			</form-input>
-			<form-input
-				:label="$p.t('lehre', 'unr')"
-				type="text"
-				container-class="col-3"
-				v-model="data.unr"
-				name="unr"
-			/>
-		</div>
-	
-		<div class="row mb-3">
-			<form-input
-				:label="$p.t('lehre', 'studiensemester')"
-				type="select"
-				container-class="col-3"
-				v-model="data.studiensemester_kurzbz"
-				name="studiensemester_kurzbz"
-			>
-				<option
-				v-for="semester in dropdowns.studiensemester_array"
-				:key="semester.studiensemester_kurzbz"
-				:value="semester.studiensemester_kurzbz"
-				>
-				{{ semester.studiensemester_kurzbz }}
-				</option>
-			</form-input>
-			<form-input
-				:label="$p.t('lehre', 'lehre')"
-				type="checkbox"
-				container-class="col-3"
-				v-model="data.lehre"
-				name="lehre"
+				v-model="formattedAnmerkung"
+				name="anmerkung"
+				id="anmerkung"
+				rows="10"
 			/>
 		</div>
 	
@@ -179,30 +112,109 @@ export default {
 				{{ raumtyp.raumtyp_kurzbz }} {{ raumtyp.beschreibung }}
 				</option>
 			</form-input>
+			
+			
+		</div>
+	
+	
+		<div class="row mb-3">
+			<form-input
+				:label="$p.t('global', 'sprache')"
+				type="select"
+				container-class="col-3"
+				v-model="data.sprache"
+				name="sprache"
+			>
+				<option
+				v-for="sprache in dropdowns.sprachen_array"
+				:key="sprache.sprache"
+				:value="sprache.sprache"
+				>
+				{{ sprache.sprache }}
+				</option>
+			</form-input>
+			
+			<form-input
+				:label="$p.t('lehre', 'studiensemester')"
+				type="select"
+				container-class="col-3"
+				v-model="data.studiensemester_kurzbz"
+				name="studiensemester_kurzbz"
+			>
+				<option
+				v-for="semester in dropdowns.studiensemester_array"
+				:key="semester.studiensemester_kurzbz"
+				:value="semester.studiensemester_kurzbz"
+				>
+				{{ semester.studiensemester_kurzbz }}
+				</option>
+			</form-input>
+			
+			
+			
 		</div>
 	
 		<div class="row mb-3">
 			<form-input
 				:label="$p.t('lehre', 'startkw')"
 				type="number"
-				container-class="col-2"
+				min="0"
+				container-class="col-1"
 				v-model="data.start_kw"
 				name="start_kw"
 			/>
 			<form-input
 				:label="$p.t('lehre', 'stundenblockung')"
 				type="number"
-				container-class="col-2"
+				min="0"
+				container-class="col-1"
 				v-model="data.stundenblockung"
 				name="stundenblockung"
 			/>
 			<form-input
 				:label="$p.t('lehre', 'wochenrhythmus')"
 				type="number"
-				container-class="col-2"
+				min="0"
+				container-class="col-1"
 				v-model="data.wochenrythmus"
 				name="wochenrythmus"
 			/>
+			
+			 <div class="col-3 d-flex align-items-end">
+				<form-input
+					:label="$p.t('lehre', 'lehre')"
+					type="checkbox"
+					v-model="data.lehre"
+					name="lehre"
+				/>
+			</div>
+		
+		</div>
+		
+		<div class="row mb-3">
+			<form-input
+				v-if="showLVID"
+				:label="$p.t('lehre', 'lehrveranstaltung_id')"
+				type="text"
+				container-class="col-2"
+				v-model="data.lehrveranstaltung_id"
+				name="lehrveranstaltung_id"
+			 />
+			<form-input
+				:label="$p.t('lehre', 'unr')"
+				type="text"
+				container-class="col-1"
+				v-model="data.unr"
+				name="unr"
+			/>
+			<form-input
+				v-if="showGewichtung"
+				:label="$p.t('lehre', 'gewicht')"
+				type="text"
+				container-class="col-1"
+				v-model="data.gewicht"
+				name="gewicht"
+			/>
 		</div>
 	</div>
 `

public/js/components/LVVerwaltung/Details/Gruppen.js

@@ -50,7 +50,7 @@ export default{
 							let button = document.createElement('button');
 							container.className = "d-flex gap-1";
 
-							button.className = 'btn btn-outline-secondary btn-action';
+							button.className = 'btn btn-outline-secondary';
 							button.innerHTML = '<i class="fa fa-xmark"></i>';
 							button.title = this.$p.t('ui', 'loeschen');
 							button.addEventListener('click', (event) => {
@@ -63,7 +63,7 @@ export default{
 							{
 								button = document.createElement('button');
 								container.className = "d-flex gap-2";
-								button.className = 'btn btn-outline-secondary btn-action';
+								button.className = 'btn btn-outline-secondary';
 								button.innerHTML = '<i class="fa fa-calendar-xmark"></i>';
 								button.title = this.$p.t('lehre', 'auslvplanentfernen');
 								button.disabled = !cell.getData().verplant;

public/js/components/LVVerwaltung/LVVerwaltung.js

@@ -32,13 +32,7 @@ export default {
 		studiensemester_kurzbz: { type: String, required: false, default: null },
 		emp: { type: String, required: false, default: null }
 	},
-	computed: {
-		selectedStudiensemester() {
-			return this.studiensemester_kurzbz != null
-				? this.studiensemester_kurzbz
-				: this.defaultSemester;
-		}
-	},
+
 	provide() {
 		return {
 			currentSemester: Vue.computed(() => this.selectedStudiensemester),
@@ -70,12 +64,16 @@ export default {
 		emp() {
 			this.updateFilter();
 		},
+		studiensemester_kurzbz(newVal) {
+			this.selectedStudiensemester = newVal ?? this.defaultSemester;
+		}
 	},
 	data() {
 		return {
 			selected: [],
 			studiengang: "",
 			filter: {},
+			selectedStudiensemester: this.studiensemester_kurzbz ?? this.defaultSemester,
 			endpoint: ApiStudiengangTree,
 			dropdowns: {
 				studiensemester_array: [],
@@ -88,10 +86,12 @@ export default {
 			},
 			selectedStudiengang: '',
 			searchbaroptions: {
+				origin: 'lvverwaltung',
 				cssclass: "position-relative",
 				calcheightonly: true,
 				types: [
-					"mitarbeiter"
+					"mitarbeiter",
+					"mitarbeiter_ohne_zuordnung"
 				],
 				actions: {
 					employee: {

public/js/components/LVVerwaltung/Lektor/Daten.js

@@ -121,9 +121,9 @@ export default{
 			}
 			this.$refs.form.call(ApiLektor.update(updatedData))
 				.then(result => {
-					let error = result.data?.error;
-					if (error)
-						this.$fhcAlert.alertWarning(error)
+					let warning = result.data?.retval?.warning;
+					if (warning)
+						this.$fhcAlert.alertWarning(warning)
 					this.original = {...this.data};
 
 					if (this.changed.mitarbeiter_uid)
@@ -192,12 +192,13 @@ export default{
 						container-class="col-3"
 						dropdown
 						@complete="searchLektor"
+						name="lektorautocomplete"
 					></form-input>
 					
 					<form-input
 						:label="$p.t('lehre', 'anmerkung')"
 						type="text"
-						container-class="col-3"
+						container-class="col-6"
 						v-model="data.anmerkung"
 						name="anmerkung"
 						>
@@ -207,7 +208,9 @@ export default{
 				<div class="row mb-3">
 					<form-input
 						:label="$p.t('lehre', 'las')"
-						type="text"
+						type="number"
+						min="0"
+						step="0.01"
 						container-class="col-3"
 						:disabled="data.vertrag?.vertragsstatus_kurzbz === 'akzeptiert'"
 						v-model="data.semesterstunden"
@@ -217,7 +220,9 @@ export default{
 					
 					<form-input
 						:label="$p.t('lehre', 'planstunden')"
-						type="text"
+						type="number"
+						min="0"
+						step="0.01"
 						container-class="col-3"
 						v-model="data.planstunden"
 						name="planstunden"
@@ -225,13 +230,15 @@ export default{
 					</form-input>
 
 				</div>
-				<div class="row mb-3">
+				<div class="row mb-3 d-flex align-items-end">
 					
 					<form-input
 						:label="data.default_stundensatz !== null 
 							? $p.t('lehre', 'stundensatz') + ' (' + $p.t('lehre', 'default') + ': ' + data.default_stundensatz + ')'
 							: $p.t('lehre', 'stundensatz')"
-						type="text"
+						type="number"
+						min="0"
+						step="0.01"
 						container-class="col-3"
 						v-model="data.stundensatz"
 						:disabled="data.vertrag?.vertragsstatus_kurzbz === 'akzeptiert'"

public/js/components/LVVerwaltung/Lektor/Table.js

@@ -85,7 +85,7 @@ export default{
 							button.className = 'btn btn-outline-secondary btn-action';
 							button.innerHTML = '<i class="fa fa-calendar-xmark"></i>';
 							button.disabled = !cell.getData().verplant;
-							button.title = this.$p.t('ui', 'auslvplanentfernen');
+							button.title = this.$p.t('lehre', 'auslvplanentfernen');
 							button.addEventListener('click', (event) => {
 								event.stopPropagation();
 								this.deleteLVPlan(cell.getData().mitarbeiter_uid, cell.getData().lehreinheit_id)
@@ -199,7 +199,7 @@ export default{
 			table-only
 			:side-menu="false"
 			reload
-			:new-btn-label="$p.t('lehre', 'addlektor')"
+			:new-btn-label="$p.t('lehre', 'addLektor')"
 			new-btn-show
 			@click:new="showAutocomplete = !showAutocomplete"
 			>

public/js/components/LVVerwaltung/Lektor/Vertrag.js

@@ -88,8 +88,14 @@ export default{
 				.catch(this.$fhcAlert.handleSystemError);
 		},
 
-		cancelVertrag()
+		async cancelVertrag()
 		{
+
+			if (await this.$fhcAlert.confirm({
+				message: this.$p.t('lehre', 'vertragConfirm'),
+				acceptLabel: this.$p.t('ui', 'ja').charAt(0).toUpperCase() + this.$p.t('ui', 'ja').slice(1),
+				acceptClass: 'btn btn-danger'}) === false)
+				return;
 			let needUpdate = {
 				vertrag_id: this.data.vertrag.vertrag_id,
 				mitarbeiter_uid: this.mitarbeiter_uid,
@@ -103,7 +109,6 @@ export default{
 				.catch(this.$fhcAlert.handleSystemError);
 		},
 	},
-	// language=HTML
 	template: `
 		<core-form ref="form">
 			<fieldset class="overflow-hidden" v-if="showVertragsdetails">
@@ -126,6 +131,7 @@ export default{
 								type="button" 
 								class="btn btn-outline-secondary w-100"
 								@click="cancelVertrag"
+								:title="$p.t('lehre', 'cancelvertrag')"
 							>
 								<i class="fa-solid fa-ban"></i>
 							</button>

public/js/components/LVVerwaltung/Setup/Table.js

@@ -56,7 +56,13 @@ export default {
 				}
 			},
 			deep: true,
-
+		},
+		currentSemester: {
+			handler(newVal)
+			{
+				this.lv_info_default.studiensemester_kurzbz = newVal
+				this.lv_info = false;
+			}
 		}
 	},
 	data() {
@@ -137,6 +143,8 @@ export default {
 				selectableRows: true,
 				rowContextMenu: (component, e) => {
 
+					if (e.getData()?.lehreinheit_id === undefined)
+						return;
 					return [
 						{
 							label: "LV-Teil kopieren",
@@ -159,7 +167,7 @@ export default {
 									label: "Nur mit Gruppen",
 									action: (e, row) =>
 									{
-										this.copyLehreinheit(row, "halb");
+										this.copyLehreinheit(row, "gruppen");
 									},
 								},
 								{
@@ -233,6 +241,17 @@ export default {
 							const renderTags = () => {
 								container.innerHTML = '';
 								parsedTags = parsedTags.filter(item => item !== null);
+
+								parsedTags.sort((a, b) => {
+									let adone = a.done ? 1 : 0;
+									let bbone = b.done ? 1 : 0;
+
+									if (adone !== bbone)
+									{
+										return adone - bbone;
+									}
+									return b.id - a.id;
+								});
 								const tagsToShow = rowData._tagExpanded ? parsedTags : parsedTags.slice(0, maxVisibleTags);
 
 								tagsToShow.forEach(tag => {
@@ -445,7 +464,7 @@ export default {
 							if (!tagExists)
 							{
 								addedTag.id = tag.id;
-								tags.push({ ...addedTag });
+								tags.unshift({ ...addedTag });
 								targetRow.update({ tags: JSON.stringify(tags) });
 								targetRow.reformat();
 							}
@@ -659,19 +678,19 @@ export default {
 			<slot name="filterzuruecksetzen"></slot>
 		</template>
 	</core-filter-cmpt>
-		<bs-modal ref="lehreinheitModal" dialogClass="modal-lg">
-			<template #title>
-				<p class="fw-bold mt-3">{{$p.t('lehre', 'newlehreinheit')}}</p>
-			</template>
+	<bs-modal ref="lehreinheitModal" dialogClass="modal-xxl">
+		<template #title>
+			<p class="fw-bold mt-3">{{$p.t('lehre', 'newlehreinheit')}}</p>
+		</template>
 			
-			<template v-if="lv_info">
-				<details-form :data="lv_info"/>
-			</template>
+		<template v-if="lv_info">
+			<details-form :data="lv_info"/>
+		</template>
 			
-			<template #footer>
-				<button type="button" class="btn btn-primary" @click="addNewLehreinheit">{{$p.t('ui', 'speichern')}}</button>
-			</template>
-		</bs-modal>
+		<template #footer>
+			<button type="button" class="btn btn-primary" @click="addNewLehreinheit">{{$p.t('ui', 'speichern')}}</button>
+		</template>
+	</bs-modal>
 
 `
 };

public/js/components/LVVerwaltung/Setup/Tabs.js

@@ -50,7 +50,6 @@ export default {
 					:modelValue="lv[0]"
 					:config="configLVTabs"
 					:default="$route.params.tab"
-					style="flex: 1 1 0%; height: 0%"
 					@changed="reload"
 				/>
 			</div>

public/js/components/LVVerwaltung/Tabs/Details.js

@@ -111,23 +111,14 @@ export default {
 			<button type="submit" class="btn btn-primary position-absolute top-0 end-0" :disabled="!changedLength">{{$p.t('ui', 'speichern')}}</button>
 		</div>
 		<fieldset class="overflow-hidden">
-			<legend>{{this.$p.t('lehre', 'lehreinheit')}}</legend>
+			<div class="core-header d-flex flex-column w-100 overflow-auto pb-3 gap-0">
+				<legend>{{ this.$p.t('lehre', 'lehreinheit') }}</legend>
+				<small v-if="data" v-html="data.lehreinheit_id" class="text-muted"></small>
+			</div>
 			<template v-if="data">
 				<details-form :data="data"/>
 			</template>
 		</fieldset>	
 	</core-form>
-	<fieldset class="overflow-hidden">
-		<div class="row">
-			<div class="col-6">
-				<legend>{{this.$p.t('lehre', 'gruppen')}}</legend>
-				<gruppen-table ref="gruppen_table" :lehreinheit_id="modelValue.lehreinheit_id"></gruppen-table>
-			</div>
-			<div class="col-6">
-				<legend>{{this.$p.t('lehre', 'assignedPersons')}}</legend>
-				<gruppen-direkt-table ref="gruppen_direkt_table" :lehreinheit_id="modelValue.lehreinheit_id"></gruppen-direkt-table>
-			</div>
-		</div>
-		
-	</fieldset>`
+	`
 };

public/js/components/LVVerwaltung/Tabs/Gruppen.js

@@ -0,0 +1,39 @@
+import GruppenTable from '../Details/Gruppen.js';
+import GruppenDirektTable from '../Details/Direktinskription.js';
+
+export default {
+	name: "LVTabGruppen",
+	components: {
+		GruppenTable,
+		GruppenDirektTable,
+	},
+	props: {
+		modelValue: Object,
+		config: {
+			type: Object,
+			default: {}
+		},
+	},
+	inject: {
+		dropdowns: {
+			from: 'dropdowns'
+		}
+	},
+
+	template: `
+
+		<fieldset class="overflow-hidden">
+			<div class="row">
+				<div class="col-6">
+					<legend>{{this.$p.t('lehre', 'gruppen')}}</legend>
+					<gruppen-table ref="gruppen_table" :lehreinheit_id="modelValue.lehreinheit_id"></gruppen-table>
+				</div>
+				<div class="col-6">
+					<legend>{{this.$p.t('lehre', 'assignedPersons')}}</legend>
+					<gruppen-direkt-table ref="gruppen_direkt_table" :lehreinheit_id="modelValue.lehreinheit_id"></gruppen-direkt-table>
+				</div>
+			</div>
+			
+		</fieldset>
+	`
+};

public/js/components/Notiz/Notiz.js

@@ -295,7 +295,7 @@ export default {
 				showType_id: false,
 				showId: false,
 				showLastupdate: false
-			},
+			}
 		}
 	},
 	methods: {
@@ -464,7 +464,6 @@ export default {
 				});
 		},
 		initTinyMCE() {
-
 			const vm = this;
 			tinymce.init({
 				target: this.$refs.editor.$refs.input, //Important: not selector: to enable multiple import of component
@@ -502,15 +501,15 @@ export default {
 				const columnToShow = "show" + column.charAt(0).toUpperCase() + column.slice(1);
 				this.showVariables[columnToShow] = true;
 			});
-		},
+		}
 	},
 	created() {
 		this.initializeShowVariables();
 		this.getUid();
 	},
 	async mounted() {
-		if(this.showTinyMce){
-			this.initTinyMCE();
+		if (this.showTinyMce) {
+			await this.initTinyMCE();
 		}
 	},
 	watch: {
@@ -548,16 +547,17 @@ export default {
 			this.reload();
 		}
 	},
-	beforeDestroy() {
-		if(this.showTinyMce) {
-			this.editor.destroy();
+	beforeUnmount() {
+		if (this.editor && tinymce.get(this.editor.id)) {
+			tinymce.get(this.editor.id).remove();
+			this.editor = null;
 		}
 	},
 	template: `
 	<div class="core-notiz">
 	
 		<div v-if="notizLayout=='classicFas'">
-		
+
 			<core-filter-cmpt
 				ref="table"
 				:tabulator-options="tabulatorOptions"

public/js/components/Stv/Studentenverwaltung/Details/Details.js

@@ -318,16 +318,6 @@ export default {
 					</form-input>
 				</div>
 				<div class="row mb-3">
-					<form-input
-						v-if="!config.hiddenFields.includes('svnr')"
-						container-class="col-4 stv-details-details-svnr"
-						:label="$p.t('person', 'svnr')"
-						type="text"
-						v-model="data.svnr"
-						name="svnr"
-						maxlength="16"
- 						>
-					</form-input>
 					<form-input
 						v-if="!config.hiddenFields.includes('ersatzkennzeichen')"
 						container-class="col-4 stv-details-details-ersatzkennzeichen"

public/js/components/Stv/Studentenverwaltung/Details/Notizen.js

@@ -17,21 +17,23 @@ export default {
 	},
 	template: `
 	<div class="stv-details-notizen h-100 pb-3">
-<!--	mit factory als endpoint	-->
-		<core-notiz
-			class="overflow-hidden"
-			:endpoint="endpoint"
-			ref="formc"
-			notiz-layout="popupModal"
-			type-id="person_id"
-			:id="modelValue.person_id"
-			show-document
-			show-tiny-mce
-			:visible-columns="['titel','text','verfasser','bearbeiter','dokumente']"
-			>
-		</core-notiz>
-		
 	
+
+<!--	Test Version classicFas for enter with one click vs popupModal-->
+	<core-notiz
+		class="overflow-hidden"
+		:endpoint="endpoint"
+		ref="formc"
+		notiz-layout="popupModal"
+		type-id="person_id"
+		:id="modelValue.person_id"
+		show-document
+		show-tiny-mce
+		:visibleColumns="['titel','text','verfasser','bearbeiter','dokumente']"
+		@reload="$emit('update:suffix')"
+		>
+</core-notiz>
+
 <!--		
 ---------------------------------------------------------------------------------------------
 -------------------- DESCRIPTION FOR PARAMETER PROPS ----------------------------------------

public/js/components/Stv/Studentenverwaltung/Details/Status/Dropdown.js

@@ -146,14 +146,25 @@ export default {
 			this.addStudent({status_kurzbz: 'student', statusgrund_id});
 		},
 		addStudent(data) {
-			Promise
-				.allSettled(
-					this.prestudentIds.map(prestudent_id => this.$api.call(
-						ApiStvStatus.addStudent(prestudent_id, data),
-						{ errorHeader: prestudent_id }
-					))
-				)
-				.then(res => this.showFeedback(res, data.status_kurzbz));
+			this.$api.call(this.prestudentIds.map(prestudent_id => [
+				prestudent_id,
+				ApiStvStatus.addStudent(prestudent_id, data),
+				{ errorHeader: prestudent_id }
+			]))
+			.then(result => {
+				const messagesSuccessful = result.filter(res => res.status == 'fulfilled');
+				if (messagesSuccessful.length) {
+					this.$fhcAlert.alertDefault(
+						'info',
+						'Feedback',
+						messagesSuccessful.length + " erfolgreiche Statusänderung(en) durchgeführt", // TODO(chris): translate
+						false,
+						true
+					);
+				}
+				this.$emit('reloadTable');
+				this.$reloadList();
+			});
 		},
 		changeStatusToAbbrecher(statusgrund_id) {
 			this
@@ -247,31 +258,15 @@ export default {
 		},
 		changeStatus(data) {
 			data.currentSemester = this.currentSemester;
-			Promise
-				.allSettled(
-					this.prestudentIds.map(prestudent_id => this.$api.call(
-						ApiStvStatus.changeStatus(prestudent_id, data),
-						{ errorHeader: prestudent_id }
-					))
-				)
-				.then(res => this.showFeedback(res, data.status_kurzbz));
-		},
-		showFeedback(results, status_kurzbz) {
-			const countSuccess = results.filter(result => result.status == "fulfilled").length;
-			const countError = results.length - countSuccess;
-			
-			//Feedback Success als infoalert
-			this.$fhcAlert.alertInfo(this.$p.t('ui', 'successNewStatus', {
-				countSuccess,
-				status: status_kurzbz,
-				countError
-			}));
-
-			if(results.length == 1 && countSuccess > 0){
+			this.$api.call(this.prestudentIds.map(prestudent_id => [
+				prestudent_id,
+				ApiStvStatus.changeStatus(prestudent_id, data)
+			]))
+			.then(() => {
 				this.$emit('reloadTable');
-			}
-			this.$reloadList();
-		}
+				this.$reloadList();
+			});
+		},
 	},
 	created() {
 		this.$api
@@ -359,4 +354,4 @@ export default {
 			</ul>
 		</div>
 	</div>`
-};
+};

public/js/components/Stv/Studentenverwaltung/List.js

@@ -50,7 +50,6 @@ export default {
 					{title:"Wahlname", field:"wahlname", visible:false, headerFilter: true},
 					{title:"Vornamen", field:"vornamen", visible:false, headerFilter: true},
 					{title:"TitelPost", field:"titelpost", headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
-					{title:"SVNR", field:"svnr", headerFilter: true},
 					{title:"Ersatzkennzeichen", field:"ersatzkennzeichen", headerFilter: true},
 					{title:"Geburtsdatum", field:"gebdatum", formatter:dateFormatter, 
 						headerFilter: true, headerFilterFunc: function(headerValue, rowValue, rowData, filterParams) {

public/js/components/Stv/Studentenverwaltung/List/New.js

@@ -228,7 +228,7 @@ export default {
 	},
 	template: `
 	<fhc-form ref="form" class="stv-list-new" @submit.prevent="send">
-		<bs-modal ref="modal" dialog-class="modal-lg modal-scrollable" @hidden-bs-modal="reset">
+		<bs-modal ref="modal" dialog-class="modal-lg modal-dialog-scrollable" @hidden-bs-modal="reset">
 			<template #title>
 				{{ personOnly ? $p.t('person', 'personAnlegen') : $p.t('lehre', 'interessentAnlegen') }}
 			</template>

public/js/components/Stv/Studentenverwaltung/Verband.js

@@ -1,15 +1,9 @@
-import {CoreRESTClient} from '../../../RESTClient.js';
-
-
-import PvTree from "../../../../../index.ci.php/public/js/components/primevue/tree/tree.esm.min.js";
-import PvTreetable from "../../../../../index.ci.php/public/js/components/primevue/treetable/treetable.esm.min.js";
-import PvColumn from "../../../../../index.ci.php/public/js/components/primevue/column/column.esm.min.js";
+import ApiStvVerband from '../../../api/factory/stv/verband.js';
 
 export default {
 	components: {
-		PvTree,
-		PvTreetable,
-		PvColumn
+		PvTreetable: primevue.treetable,
+		PvColumn: primevue.column
 	},
 	emits: [
 		'selectVerband'
@@ -31,14 +25,15 @@ export default {
 			selectedKey: [],
 			expandedKeys: {},
 			filters: {}, // TODO(chris): filter only 1st level?
-			favnodes: [],
 			favorites: {on: false, list: []}
 		}
 	},
 	computed: {
 		filteredNodes() {
-			// TODO(chris): what to display actually?
-			return this.favorites.on ? this.favnodes : this.nodes;
+			if (this.favorites.on)
+				return this.nodes.filter(node => this.favorites.list.includes(node.key));
+			
+			return this.nodes;
 		}
 	},
 	watch: {
@@ -118,69 +113,49 @@ export default {
 			return cp;
 		},
 		async filterFav() {
-			if (!this.favorites.on && !this.favnodes.length && this.favorites.list.length) {
-				this.loading = true;
-				this.favnodes = await this.loadNodes(this.favorites.list);
-			}
 			this.favorites.on = !this.favorites.on;
 			this.$api
 				.call(this.endpoint.favorites.set(
 					JSON.stringify(this.favorites)
-				));
-			this.loading = false;
-		},
-		async loadNodes(links) {
-			let sortedInParents = links.reduce((o, link) => {
-				link = link + '';
-				let parent,
-					parts = link.split('/');
-				if (parts.length == 1) {
-					parent = '_';
-				} else {
-					parts.pop();
-					parent = parts.join('/');
-				}
-				if (!o[parent])
-					o[parent] = [link];
-				else
-					o[parent].push(link);
-				return o;
-			}, {});
-			
-			let promises = [];
-			for (let parent in sortedInParents)
-				promises.push(
-					this.$api
-						.call(this.endpoint.get(parent == '_' ? '' : parent))
-						.then(res => res.data)
-						.then(res => res.filter(node => sortedInParents[parent].includes(node.link + '')))
-				);
-			
-			// NOTE(chris): merge the resulting arrays and transform them to an associative one
-			let result = [].concat.apply([], await Promise.all(promises)).reduce((o, node) => {
-				o[node.link + ''] = this.mapResultToTreeData({...node, leaf: true, children: undefined});
-				return o;
-			}, {});
-
-			return links.map(link => result[link]);
+				))
+				.then(result => {
+					if (result.meta?.removed) {
+						this.favorites.list = this.favorites.list
+							.filter(fav => !result.meta.removed.includes(fav));
+						const items = result.meta.removed.map(
+							rem => this.nodes.find(
+								node => node.data.link == rem
+							).label
+						).join(',\n');
+						this.$fhcAlert.alertWarning(this.$p.t('stv/warn_removed_favs', { items }));
+					}
+				});
 		},
 		async markFav(key) {
 			let index = this.favorites.list.indexOf(key.data.link + '');
 
 			if (index != -1) {
-				if (this.favnodes.length)
-					this.favnodes = this.favnodes.filter(node => node.data.link != key.data.link);
 				this.favorites.list.splice(index, 1);
 			} else {
-				if (this.favnodes.length || this.favorites.on)
-					this.favnodes.push((await this.loadNodes([key.data.link])).pop());
 				this.favorites.list.push(key.data.link + '');
 			}
 
 			this.$api
 				.call(this.endpoint.favorites.set(
 					JSON.stringify(this.favorites)
-				));
+				))
+				.then(result => {
+					if (result.meta?.removed) {
+						this.favorites.list = this.favorites.list
+							.filter(fav => !result.meta.removed.includes(fav));
+						const items = "\n" + result.meta.removed.map(
+							rem => this.nodes.find(
+								node => node.data.link == rem
+							).label
+						).join(",\n");
+						this.$fhcAlert.alertWarning(this.$p.t('stv/warn_removed_favs', { items }));
+					}
+				});
 		},
 		unsetFavFocus(e) {
 			if (e.target.dataset?.linkFavAdd !== undefined) {
@@ -215,6 +190,24 @@ export default {
 			if (!currentNode)
 				return;
 
+			const currentSelectedKey = Object.keys(this.selectedKey).find(Boolean);
+			if (currentSelectedKey) {
+				if (currentSelectedKey == currentKey)
+					return;
+				/**
+				 * Do not select a new entry if the current is a child of the new one.
+				 * This happens if a child entry of a new stg is selected and the router
+				 * tries to select the stg root entry (because subtrees do not have
+				 * routes yet)
+				 */
+				const isChild = this.findNodeByKey(
+					currentSelectedKey,
+					currentNode.children
+				);
+				if (isChild)
+					return;
+			}
+
 			for (let i = 1; i < parts.length; i++)
 			{
 				this.expandedKeys[currentNode.key] = true;
@@ -238,7 +231,10 @@ export default {
 		this.$api
 			.call(this.endpoint.get())
 			.then(result => {
-				this.nodes = result.data.map(this.mapResultToTreeData);
+				this.nodes = result.data.map(el => {
+					el.root = true;
+					return this.mapResultToTreeData(el);
+				});
 				this.setPreselection();
 				this.loading = false;
 			})
@@ -248,21 +244,12 @@ export default {
 			.call(this.endpoint.favorites.get())
 			.then(result => {
 				if (result.data) {
-					let f = JSON.parse(result.data);
-					if (f.on) {
-						this.loading = true;
-						this.favorites = f;
-						this.loadNodes(this.favorites.list).then(res => {
-							this.favnodes = res;
-							this.loading = false;
-						});
-					} else
-						this.favorites = f;
+					this.favorites = JSON.parse(result.data);
 				}
 			})
 			.catch(this.$fhcAlert.handleSystemError);
 	},
-	template: `
+	template: /* html */`
 	<div class="overflow-auto" tabindex="-1">
 		<pv-treetable
 			ref="tree"
@@ -278,39 +265,68 @@ export default {
 			@focusin="setFavFocus"
 			@focusout="unsetFavFocus"
 			:filters="filters"
+		>
+			<pv-column
+				field="name"
+				expander
+				class="text-break"
 			>
-			<pv-column field="name" expander>
 				<template #header>
 					<div class="text-right">
 						<div class="p-input-icon-left">
 							<i class="pi pi-search"></i>
-							<input type="text" v-model="filters['global']" class="form-control ps-5" placeholder="Search" />
+							<input
+								type="text"
+								v-model="filters['global']"
+								class="form-control ps-5"
+								placeholder="Search"
+							>
 						</div>
 					</div>
 				</template>
-				<template #body="{node}">
-					<span :data-tree-item-key="node.key" :title="node.data.studiengang_kz">
+				<template #body="{ node }">
+					<span
+						:data-tree-item-key="node.key"
+						:title="node.data.studiengang_kz"
+					>
 						{{node.data.name}}
 					</span>
 				</template>
 			</pv-column>
-			<pv-column field="fav" headerStyle="flex: 0 0 auto" style="flex: 0 0 auto">
+			<pv-column
+				field="fav"
+				class="flex-shrink-0 flex-grow-0"
+				header-class="flex-shrink-0 flex-grow-0"
+			>
 				<template #header>
-					<a href="#" @click.prevent="filterFav"><i :class="favorites.on ? 'fa-solid' : 'fa-regular'" class="fa-star"></i></a>
-				</template>
-				<template #body="{node, column}">
 					<a
+						v-if="favorites.on || favorites.list.length"
+						href="#"
+						@click.prevent="filterFav"
+					>
+						<i
+							:class="favorites.on ? 'fa-solid' : 'fa-regular'"
+							class="fa-star"
+						></i>
+					</a>
+				</template>
+				<template #body="{ node }">
+					<a
+						v-if="node.data.root"
 						href="#"
-						@click.prevent="markFav(node)"
-						@keydown.enter.stop.prevent="markFav(node)"
 						tabindex="-1"
 						data-link-fav-add
-						>
-						<i :class="favorites.list.includes(node.data.link + '') ? 'fa-solid' : 'fa-regular'" class="fa-star"></i>
+						@click.prevent="markFav(node)"
+						@keydown.enter.stop.prevent="markFav(node)"
+					>
+						<i
+							:class="favorites.list.includes(node.data.link + '') ? 'fa-solid' : 'fa-regular'"
+							class="fa-star"
+						></i>
 					</a>
 				</template>
 			</pv-column>
 			<pv-column field="studiengang_kz" class="d-none"></pv-column>
 		</pv-treetable>
 	</div>`
-};
+};

public/js/components/Tabs.js

@@ -40,7 +40,7 @@ export default {
 		currentTab() {
 			if (this.tabs[this.current])
 				return this.tabs[this.current];
-			
+
 			return { component: 'div' };
 		},
 		value: {
@@ -67,9 +67,9 @@ export default {
 		}
 	},
 	methods: {
-		handleTabClick: function(index) {
+		handleTabClick: function (e) {
 			let keys = Object.keys(this.tabs);
-			this.change(keys[index]);
+			this.change(keys[e.index]);
 		},
 		change(key) {
 			this.$emit("change", key)
@@ -97,13 +97,20 @@ export default {
 				if (!item.component)
 					return console.error('Component missing for ' + key);
 
+				//making it reactive for showing headerSuffix
+				const value = Vue.reactive({
+					suffix: '',
+					showSuffix: item.showSuffix || false
+				});
+
 				tabs[key] = {
 					component: Vue.markRaw(Vue.defineAsyncComponent(() => import(item.component))),
 					title: Vue.computed(() => item.title || key),
 					config: item.config,
 					key,
-					value: {}
-				}
+					value,
+					suffixhelper: item.suffixhelper ?? null
+				};
 			}
 
 			if (Array.isArray(config))
@@ -118,36 +125,67 @@ export default {
 					this.current = Object.keys(tabs)[0];
 			}
 			this.tabs = tabs;
+		},
+		updateSuffix() {
+			this.getTabSuffix(this.currentTab);
+		},
+		async getTabSuffix(tab) {
+			if (!tab.value.showSuffix) {
+				return;
+			}
+
+			if (tab.suffixhelper !== null) {
+				const suffixhelper = await import(tab.suffixhelper);
+				const suffix = await suffixhelper.getSuffix(this.$api, this.modelValue);
+				tab.value.suffix = suffix;
+			} else {
+				tab.value.suffix = '';
+			}
+		},
+		getTabSuffixes() {
+			Object.entries(this.tabs).forEach(([key, item]) => this.getTabSuffix(item));
 		}
 	},
 	created() {
 		this.initConfig(this.config);
 	},
+	mounted() {
+		this.getTabSuffixes();
+	},
+	updated() {
+		this.getTabSuffixes();
+	},
 	template: `
 	<template v-if="useprimevue">
 
-	<tabview 
-		:scrollable="true" 
-		:lazy="true"
-		:activeIndex="calcActiveIndex"
-		@tab-click="handleTabClick"
-	>
-		<tabpanel 
-			v-for="tab in tabs" 
-			:key="tab.key" 
-			:header="tab.title"
+		<tabview 
+			:scrollable="true"
+			:lazy="true"
+			:activeIndex="calcActiveIndex"
+			@tab-click="handleTabClick"
 		>
-			<keep-alive>
-				<component :is="tab.component" v-model="value" :config="tab.config"></component>
-			</keep-alive>
-		</tabpanel>
-	</tabview>
+			<tabpanel
+				v-for="tab in tabs"
+				:key="tab.key"
+				:header="tab.title + ((tab.value.showSuffix && tab.value.suffix !== '') ? ' ' + tab.value.suffix : '')"
+			>
+				<keep-alive>
+					<component
+						:is="tab.component"
+						v-model="value"
+						:config="tab.config"
+						@update:suffix="updateSuffix($event)"
+						></component>
+				</keep-alive>
+			</tabpanel>
+		</tabview>
 
 	</template>
 	<template v-else="">
 
 	<div class="fhc-tabs d-flex" :class="vertical ? 'align-items-stretch gap-3' : (border ? 'flex-column' : 'flex-column gap-3')" v-if="Object.keys(tabs).length">
 		<div class="nav" :class="vertical ? 'nav-pills flex-column' : 'nav-tabs'">
+
 			<div
 				v-for="tab in tabs"
 				:key="tab.key"
@@ -157,15 +195,22 @@ export default {
 				:aria-current="tab.key == current ? 'page' : ''"
 				v-accessibility:tab.[vertical]
 				>
-				{{tab.title}}
+				{{tab.title}} <span v-if="tab.value.showSuffix && tab.value.suffix"> {{ tab.value.suffix }}</span>
 			</div>
 		</div>
 		<div :style="vertical ? '' : 'flex: 1 1 0%; height: 0%'" class="overflow-auto flex-grow-1" :class="vertical || !border ? '' : 'p-3 border-bottom border-start border-end'">
 			<keep-alive>
-				<component ref="current" :is="currentTab.component" v-model="value" :config="currentTab.config"></component>
+				<component
+					ref="current"
+					:is="currentTab.component"
+					v-model="value"
+					:config="currentTab.config"
+					@update:suffix="updateSuffix($event)"
+					></component>
 			</keep-alive>
 		</div>
 	</div>
 
 	</template>`
 };
+

public/js/components/Tag/Tag.js

@@ -86,6 +86,7 @@ export default {
 			this.tagData.updateamum = this.formatDateTime(item.updateamum)
 			this.tagData.bearbeiter = item.bearbeiter;
 			this.tagData.verfasser = item.verfasser;
+			this.tagData.readonly = item.readonly;
 
 			if (item && item.notiz_id)
 			{
@@ -154,7 +155,8 @@ export default {
 
 			let postData = {
 				id: this.selectedTagId,
-				done: !this.tagData.done
+				done: !this.tagData.done,
+				notiz: this.tagData.notiz,
 			}
 			this.$api.call(this.endpoint.doneTag(postData))
 			this.$emit("updated", this.tagData);
@@ -182,7 +184,8 @@ export default {
 				verfasser: "",
 				updateamum: "",
 				bearbeiter: "",
-				response: ""
+				response: "",
+				readonly: false
 			};
 			this.selectedTagId = null;
 			this.mode = "create";
@@ -230,6 +233,7 @@ export default {
 						v-model="tagData.notiz"
 						type="textarea"
 						field="notiz"
+						:readonly="tagData.readonly"
 						placeholder="Notiz..."
 					></form-input>
 					<div class="modificationdate">
@@ -243,7 +247,7 @@ export default {
 					</div>
 				</div>
 			</template>
-			<template #footer>
+			<template #footer v-if="!tagData.readonly">
 				<div class="d-flex justify-content-between w-100">
 					<div>
 						<button 

public/js/components/filter/Filter.js

@@ -95,7 +95,6 @@ export const CoreFilterCmpt = {
 			dataset: null,
 			datasetMetadata: null,
 			selectedFields: null,
-			notSelectedFields: null,
 			filterFields: null,
 
 			availableFilters: null,
@@ -107,6 +106,8 @@ export const CoreFilterCmpt = {
 			fetchCmptApiFunctionParams: null,
 			fetchCmptDataFetched: null,
 
+			fetchResult: null,
+
 			tabulator: null,
 			tableBuilt: false,
 			tabulatorHasSelector: false,
@@ -122,6 +123,11 @@ export const CoreFilterCmpt = {
 		};
 	},
 	computed: {
+		notSelectedFields() {
+			if (!this.fields || !this.selectedFields)
+				return null;
+			return this.fields.filter(x => this.selectedFields.indexOf(x) === -1)
+		},
 		filteredData() {
 			if (!this.dataset)
 				return [];
@@ -219,6 +225,32 @@ export const CoreFilterCmpt = {
 				await this.$p.loadCategory('ui');
 				placeholder = this.$p.t('ui/keineDatenVorhanden');
 			}
+
+			if (!this.tableOnly) {
+				// prefetch data to get fields & selectedFields for filteredColumns & filteredData
+				await new Promise(resolve => {
+					const filterId = window.location.hash ? window.location.hash.slice(1) : null;
+
+					const resolvePromiseFunc = data => {
+						this.setRenderData(data);
+						resolve();
+					};
+					// get the filter data
+					if (filterId === null)
+						this.startFetchCmpt(
+							wsParams => this.$api.call(ApiFilter.getFilter(wsParams)),
+							null,
+							resolvePromiseFunc
+						);
+					else
+						this.startFetchCmpt(
+							wsParams => this.$api.call(ApiFilter.getFilterById(wsParams)),
+							{ filterId },
+							resolvePromiseFunc
+						);
+				});
+			}
+
 			// Define a default tabulator options in case it was not provided
 			let tabulatorOptions = {...{
 					layout: "fitDataStretchFrozen",
@@ -240,6 +272,11 @@ export const CoreFilterCmpt = {
 			if (!this.tableOnly) {
 				tabulatorOptions.data = this.filteredData;
 				tabulatorOptions.columns = this.filteredColumns;
+			} else {
+				tabulatorOptions.columns.forEach(col => {
+					if (col.visible === undefined)
+						col.visible = true;
+				});
 			}
 
 			if (tabulatorOptions.selectable || (tabulatorOptions.columns && tabulatorOptions.columns.filter(el => el.formatter == 'rowSelection').length))
@@ -359,18 +396,14 @@ export const CoreFilterCmpt = {
 					this.render
 				);
 		},
-		/**
-		 *
-		 */
-		render(response) {
-			let data = response;
+		setRenderData(data) {
+			this.fetchResult = data;
 			this.filterName = data.filterName;
 			this.dataset = data.dataset;
 			this.datasetMetadata = data.datasetMetadata;
 
 			this.fields = data.fields;
 			this.selectedFields = data.selectedFields;
-			this.notSelectedFields = this.fields.filter(x => this.selectedFields.indexOf(x) === -1);
 			this.filterFields = [];
 
 			for (let i = 0; i < data.datasetMetadata.length; i++)
@@ -387,6 +420,14 @@ export const CoreFilterCmpt = {
 					}
 				}
 			}
+		},
+		/**
+		 *
+		 */
+		render(response) {
+			let data = response;
+
+			this.setRenderData(data);
 
 			// If the side menu is active
 			if (this.sideMenu === true)
@@ -627,11 +668,10 @@ export const CoreFilterCmpt = {
 		this.$emit('uuidDefined', this.uuid)
 	},
 	mounted() {
-
 		this.initTabulator().then(() => {
 			if (!this.tableOnly) {
 				this.selectedFilter = window.location.hash ? window.location.hash.slice(1) : null;
-				this.getFilter(); // get the filter data
+				this.render(this.fetchResult);
 			}
 		});
 
@@ -666,7 +706,7 @@ export const CoreFilterCmpt = {
 					</button>
 					<span v-if="$slots.actions && tabulatorHasSelector && useSelectionSpan">
 						<span v-if="countOnly">{{ selectedData.length }} ausgewählt</span>
-						<span v-else> Mit {{ selectedData.length }} ausgewählten:</span>
+						<span v-else id="selected-info-text"> Mit {{ selectedData.length }} ausgewählten:</span>
 					</span>
 					<slot name="actions" v-bind="{selected: tabulatorHasSelector ? selectedData : []}"></slot>
 					<slot name="search"></slot>