Merge branch 'master' into feature-71405/Ferienzeiten

public/css/Studentenverwaltung.css

@@ -197,10 +197,6 @@ html.fs_huge {
 	margin-bottom: -1px;
 }
 
-.tiny-90 div.tox.tox-tinymce {
-	height: 90% !important;
-}
-
 /* slim begin */
 .stv .form-label {
 	margin-bottom: .15rem;

public/css/components/dashboard/news.css

@@ -193,3 +193,6 @@
 	word-break: break-word;
 }
 
+.news-list-item p {
+	word-break: break-word;
+}

public/js/api/factory/dashboard/board.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright (C) 2026 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export default {
+	list() {
+		return {
+			method: 'get',
+			url: 'api/frontend/v1/dashboard/board/list'
+		};
+	},
+	add(params) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/board/create',
+			params
+		};
+	},
+	update(params) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/board/update',
+			params
+		};
+	},
+	delete(dashboard_id) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/board/delete',
+			params: { dashboard_id }
+		};
+	}
+}

public/js/api/factory/dashboard/preset.js

@@ -0,0 +1,47 @@
+/**
+ * Copyright (C) 2026 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export default {
+	list(dashboard_kurzbz) {
+		return {
+			method: 'get',
+			url: 'api/frontend/v1/dashboard/preset/list/'
+				+ encodeURIComponent(dashboard_kurzbz)
+		};
+	},
+	getBatch(params) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/preset/getBatch',
+			params
+		};
+	},
+	addWidget(params) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/preset/addWidget',
+			params
+		};
+	},
+	removeWidget(params) {
+		return {
+			method: 'post',
+			url: 'api/frontend/v1/dashboard/preset/removeWidget',
+			params
+		};
+	}
+};

public/js/api/factory/dashboard/user.js

@@ -0,0 +1,45 @@
+/**
+ * Copyright (C) 2026 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export default {
+	get(dashboard) {
+		return {
+			method: 'get',
+			url: '/api/frontend/v1/dashboard/user/get/' + dashboard
+		};
+	},
+	addWidget(dashboard, widget) {
+		return {
+			method: 'post',
+			url: '/api/frontend/v1/dashboard/user/addWidget',
+			params: {
+				dashboard,
+				widget
+			}
+		};
+	},
+	removeWidget(dashboard, widget) {
+		return {
+			method: 'post',
+			url: '/api/frontend/v1/dashboard/user/removeWidget',
+			params: {
+				dashboard,
+				widget
+			}
+		};
+	}
+};

public/js/api/factory/dashboard/widget.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright (C) 2026 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export default {
+	get(widget) {
+		return {
+			method: 'get',
+			url: '/api/frontend/v1/dashboard/widget/get/' + widget
+		};
+	},
+	list(dashboard) {
+		return {
+			method: 'get',
+			url: '/api/frontend/v1/dashboard/widget/list/' + dashboard
+		};
+	},
+	listAllowed(dashboard) {
+		return {
+			method: 'get',
+			url: '/api/frontend/v1/dashboard/widget/listAllowed/' + dashboard
+		};
+	},
+	setAllowed(dashboard_id, widget_id, allowed) {
+		return {
+			method: 'post',
+			url: '/api/frontend/v1/dashboard/widget/setAllowed',
+			params: {
+				dashboard_id, widget_id, allowed
+			}
+		};
+	}
+};

public/js/api/factory/messages/messages.js

@@ -17,13 +17,16 @@
 
 export default {
 	getMessages(params) {
+		let url = 'api/frontend/v1/messages/messages/getMessages'
+				+ '/' + params.id
+				+ '/' + params.type;
+			if(params.size && params.page) {
+				url += '/' + params.size
+				+ '/' + params.page;
+			}
 		return {
 			method: 'get',
-			url: 'api/frontend/v1/messages/messages/getMessages/'
-				+ params.id + '/'
-				+ params.type + '/'
-				+ params.size + '/'
-				+ params.page
+			url: url
 		};
 	},
 	getVorlagen(){

public/js/api/factory/stv/konto.js

@@ -38,6 +38,10 @@ export default {
 		};
 	},
 	insert(params) {
+		if(params.betrag)
+		{
+			params.betrag = params.betrag.replace(',', '.');
+		}
 		return {
 			method: 'post',
 			url: 'api/frontend/v1/stv/konto/insert',
@@ -52,6 +56,10 @@ export default {
 		};
 	},
 	edit(params) {
+		if(params.betrag)
+		{
+			params.betrag = params.betrag.replace(',', '.');
+		}
 		return {
 			method: 'post',
 			url: 'api/frontend/v1/stv/konto/update',
@@ -65,10 +73,14 @@ export default {
 			params: { buchungsnr }
 		};
 	},
-	getBuchungstypen() {
+	getBuchungstypen(studiensemester_kurzbz) {
+		let url = 'api/frontend/v1/stv/konto/getBuchungstypen'
+		if (!!studiensemester_kurzbz)
+			url = url + '/' + encodeURIComponent(studiensemester_kurzbz);
+
 		return {
 			method: 'get',
-			url: 'api/frontend/v1/stv/konto/getBuchungstypen'
+			url: url
 		};
-	}
+	},
 };

public/js/apps/Dashboard/Admin.js

@@ -1,16 +1,67 @@
-import {CoreNavigationCmpt} from '../../components/navigation/Navigation.js';
+import { CoreNavigationCmpt } from '../../components/navigation/Navigation.js';
 import DashboardAdmin from '../../components/Dashboard/Admin.js';
+
 import PluginsPhrasen from '../../plugins/Phrasen.js';
 
+import ApiRenderers from '../../api/factory/renderers.js';
+
 const app = Vue.createApp({
-  name: 'AdminApp',
-  data: () => ({
-      appSideMenuEntries: {}
-    }),
-  components: {
-    CoreNavigationCmpt,
-    DashboardAdmin
-  }
+	name: 'DashboardAdminApp',
+	data: () => ({
+		appSideMenuEntries: {},
+		renderers: null
+	}),
+	components: {
+		CoreNavigationCmpt,
+		DashboardAdmin
+	},
+	provide() {
+		return {
+			// TODO(chris): move those two into the components that need it
+			renderers: Vue.computed(() => this.renderers),
+			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone
+		};
+	},
+	created() {
+		this.$api
+			.call(ApiRenderers.loadRenderers())
+			.then(res => {
+				for (let rendertype of Object.keys(res.data)) {
+					let modalTitle = null;
+					let modalContent = null;
+					let calendarEvent = null;
+					if (res.data[rendertype].modalTitle)
+						modalTitle = Vue.markRaw(Vue.defineAsyncComponent(() => import(res.data[rendertype].modalTitle)));
+					if (res.data[rendertype].modalContent) 	
+						modalContent = Vue.markRaw(Vue.defineAsyncComponent(() => import(res.data[rendertype].modalContent)));
+					if (res.data[rendertype].calendarEvent) 	
+						calendarEvent = Vue.markRaw(Vue.defineAsyncComponent(() => import(res.data[rendertype].calendarEvent)));
+
+					if (res.data[rendertype].calendarEventStyles) {
+						var head = document.head;
+						if (!head.querySelector(`link[href="${res.data[rendertype].calendarEventStyles}"]`)) {
+							var link = document.createElement("link");
+							link.type = "text/css";
+							link.rel = "stylesheet";
+							link.href = res.data[rendertype].calendarEventStyles;
+							head.appendChild(link);
+						}
+					}
+
+					if (this.renderers === null) {
+						this.renderers = {};
+					}
+					if (!this.renderers[rendertype]) {
+						this.renderers[rendertype] = {}
+					}
+					this.renderers[rendertype].modalTitle = modalTitle;
+					this.renderers[rendertype].modalContent = modalContent;
+					this.renderers[rendertype].calendarEvent = calendarEvent;
+				}
+			})
+			.catch(this.$fhcAlert.handleSystemErrors);
+	}
 });
 app.use(PluginsPhrasen);
+app.directive('tooltip', primevue.tooltip);
 app.mount('#main');

public/js/apps/Dashboard/Preview.js

@@ -0,0 +1,17 @@
+import {CoreNavigationCmpt} from '../../components/navigation/Navigation.js';
+import CoreDashboard from '../../components/Dashboard/Dashboard.js';
+import PluginsPhrasen from '../../plugins/Phrasen.js';
+
+const app = Vue.createApp({
+  name: 'DashboardPreviewApp',
+  data: () => ({
+      appSideMenuEntries: {}
+    }),
+  components: {
+    CoreNavigationCmpt,
+    CoreDashboard
+  }
+});
+app.use(PluginsPhrasen);
+app.directive('tooltip', primevue.tooltip);
+app.mount('#main');

public/js/components/Bootstrap/Confirm.js

@@ -17,7 +17,7 @@ export default {
 		</template>
 		<template v-slot:footer>
 			<button type="button" class="btn btn-primary" @click="result=true;this.hide()">OK</button>
-			<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+			<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{this.$p.t('ui', 'cancel')}}</button>
 		</template>
 	</bs-modal>`
 }

public/js/components/Cis/Abgabetool/AbgabetoolAssistenz.js

@@ -180,7 +180,7 @@ export const AbgabetoolAssistenz = {
 					// 	frozen: true,
 					// 	width: 40
 					// },
-					{title: Vue.computed(() => this.$capitalize(this.$p.t('abgabetool/c4details'))), field: 'details', headerFilter: false, headerSort: false, formatter: this.formAction, tooltip:false, minWidth: 150, cssClass: 'sticky-col'},
+					{title: Vue.computed(() => this.$capitalize(this.$p.t('abgabetool/c4details'))), field: 'details', headerFilter: false, headerSort: false, formatter: this.formAction, tooltip:false, minWidth: 100, cssClass: 'sticky-col'},
 					{title: Vue.computed(() => this.$capitalize(this.$p.t('abgabetool/c4personenkennzeichen'))), headerFilter: true, field: 'pkz', formatter: this.pkzTextFormatter, widthGrow: 1, tooltip: false},
 					{title: Vue.computed(() => this.$capitalize(this.$p.t('abgabetool/c4vorname'))), field: 'student_vorname', headerFilter: true, formatter: this.centeredTextFormatter,widthGrow: 1},
 					{title: Vue.computed(() => this.$capitalize(this.$p.t('abgabetool/c4nachname'))), field: 'student_nachname', headerFilter: true, formatter: this.centeredTextFormatter, widthGrow: 1},
@@ -226,7 +226,7 @@ export const AbgabetoolAssistenz = {
 						field: 'qgate2Status', formatter: this.centeredTextFormatter, widthGrow: 1, width: 220, tooltip: false},
 				],
 				persistence: false,
-				persistenceID: "abgabetool_2026_02_26"
+				persistenceID: "abgabetool_2026_03_16"
 			},
 			abgabeTableEventHandlers: [
 			{
@@ -645,7 +645,7 @@ export const AbgabetoolAssistenz = {
 			actionButtons.className = "d-flex gap-3"; // you can keep Bootstrap gap if loaded
 			actionButtons.style.display = "flex";
 			actionButtons.style.alignItems = "stretch"; // buttons stretch to full height
-			actionButtons.style.justifyContent = "center";
+			actionButtons.style.justifyContent = "start";
 			actionButtons.style.height = "100%"; // full grid cell height
 
 			const val = cell.getValue();
@@ -675,8 +675,20 @@ export const AbgabetoolAssistenz = {
 				createButton('fa fa-timeline', 'abgabetool/c4termineTimeLine', () => this.openTimeline(val))
 			);
 
+			if(val.latestTerminWithUpload) {
+				actionButtons.append(
+					createButton('fa fa-download', 'abgabetool/c4downloadLatestAbgabe', () => this.downloadAbgabe(val.latestTerminWithUpload.paabgabe_id, val.student_uid, val.projektarbeit_id))
+				)
+			}
+
 			return actionButtons;
 		},
+		downloadAbgabe(paabgabe_id, student_uid, projektarbeit_id) {
+			const url = `/api/frontend/v1/Abgabe/getStudentProjektarbeitAbgabeFile?paabgabe_id=${paabgabe_id}&student_uid=${student_uid}&projektarbeit_id=${projektarbeit_id}`;
+
+			window.open(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + url)
+			// this.$api.call(ApiAbgabe.getStudentProjektarbeitAbgabeFile(termin.paabgabe_id, this.projektarbeit.student_uid))
+		},
 
 		undoSelection(cell) {
 			// checks if cells row is selected and unselects -> imitates columns which dont trigger row selection
@@ -780,6 +792,8 @@ export const AbgabetoolAssistenz = {
 					// TODO: mehrsprachig englisch
 					projekt.note_bez = opt.bezeichnung
 				}
+
+				const latestTerminWithUpload = this.findLatestTerminWithUpload(projekt)
 				
 				return {
 					...projekt,
@@ -787,6 +801,7 @@ export const AbgabetoolAssistenz = {
 					details: {
 						student_uid: projekt.student_uid,
 						projektarbeit_id: projekt.projektarbeit_id,
+						latestTerminWithUpload: latestTerminWithUpload ?? null
 					},
 					pkz: this.buildPKZ(projekt),
 					beurteilung: projekt.beurteilungLink ?? null,
@@ -800,6 +815,15 @@ export const AbgabetoolAssistenz = {
 				}
 			})
 		},
+		findLatestTerminWithUpload(projekt) {
+			const withAbgabedatumSorted = projekt?.abgabetermine?.filter(t => t.abgabedatum != null)?.sort((a,b) => a < b)
+
+			if(withAbgabedatumSorted.length) {
+				return withAbgabedatumSorted[0]
+			}
+
+			return null
+		},
 		createInfoString(data) {
 			let str = '';
 
@@ -1413,9 +1437,12 @@ export const AbgabetoolAssistenz = {
 		
 		<div id="abgabetable" style="max-height:40vw;">
 			<div class="row">
-				<div class="col-auto">
+				<div class="col-auto me-auto">
 					<h2 tabindex="1">{{$p.t('abgabetool/abgabetoolTitle')}}</h2>
 				</div>
+				<div class="col-auto">
+					<label class="col-form-label">{{$capitalize($p.t('lehre/studiengang'))}}:</label>
+				</div>
 				<div class="col-3">
 					<Dropdown
 						:placeholder="$capitalize($p.t('lehre/studiengang'))" 
@@ -1430,6 +1457,9 @@ export const AbgabetoolAssistenz = {
 						</template>
 					</Dropdown>
 				</div>
+				<div class="col-auto">
+					<label class="col-form-label">{{$capitalize($p.t('lehre/note'))}}:</label>
+				</div>
 				<div class="col-3">
 					<Dropdown
 						:placeholder="$p.t('lehre/note')" 

public/js/components/Cis/Abgabetool/AbgabetoolMitarbeiter.js

@@ -667,8 +667,10 @@ export const AbgabetoolMitarbeiter = {
 		setDetailComponent(details){
 			this.loading=true
 
-			const pa = this.projektarbeiten?.retval?.find(projekarbeit => projekarbeit.projektarbeit_id == details.projektarbeit_id)
+			const projektarbeiten = this.projektarbeiten?.retval ?? this.projektarbeiten
 
+			const pa = projektarbeiten.find(projekarbeit => projekarbeit.projektarbeit_id == details.projektarbeit_id)
+			
 			let paIsBenotet = false
 			if(pa.note !== undefined && pa.note !== null) {
 				// check if the note is not defined as a non final projektarbeit note

public/js/components/Dashboard/Admin.js

@@ -3,15 +3,20 @@ import DashboardAdminEdit from "./Admin/Edit.js";
 import DashboardAdminWidgets from "./Admin/Widgets.js";
 import DashboardAdminPresets from "./Admin/Presets.js";
 
+import ApiDashboardBoard from "../../api/factory/dashboard/board.js";
+import ApiDashboardWidget from "../../api/factory/dashboard/widget.js";
+
 export default {
+	name: 'DashboardAdmin',
 	components: {
 		DashboardAdminEdit,
 		DashboardAdminWidgets,
-		DashboardAdminPresets
+		DashboardAdminPresets,
 	},
 	provide() {
 		return {
-			adminMode: true
+			adminMode: true,
+			widgetsSetup: Vue.computed(() => this.dashboards[this.current] ? this.dashboards[this.current].widgetSetup : null)
 		};
 	},
 	data() {
@@ -22,9 +27,6 @@ export default {
 		};
 	},
 	computed: {
-		apiurl() {
-			return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/dashboard';
-		},
 		dashboard() {
 			return this.dashboards.find(el => el.dashboard_id == this.current);
 		}
@@ -35,33 +37,50 @@ export default {
 			BsPrompt.popup('New Dashboard name').then(
 				name => {
 					_name = name;
-					return axios.post(this.apiurl + '/Dashboard/create', {
+					const params = {
 						dashboard_kurzbz: name
-					})
-				}
-			).then(res => {
-				let newDashboard = {
-					dashboard_id: res.data.retval,
-					dashboard_kurzbz: _name,
-					beschreibung: ''
-				};
-				this.dashboards.push(newDashboard);
-				this.current = newDashboard.dashboard_id;
-			}).catch(err => err !== undefined ? console.error('ERROR:', err) : 0);
+					};
+					return this.$api
+						.call(ApiDashboardBoard.add(params))
+						.then(response =>{
+							this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSave'));
+
+							let newDashboard = {
+								dashboard_id: response.data,
+								dashboard_kurzbz: _name,
+								beschreibung: ''
+							};
+							this.dashboards.push(newDashboard);
+							this.current = newDashboard.dashboard_id;
+						})
+						.catch(this.$fhcAlert.handleSystemError);
+					});
 		},
 		dashboardUpdate(dashboard) {
-			// TODO(chris): Loading or message
-			axios.post(this.apiurl + '/Dashboard/update', dashboard).then(() => {
-				let old = this.dashboards.find(el => el.dashboard_id == dashboard.dashboard_id);
-				old.dashboard_kurzbz = dashboard.dashboard_kurzbz;
-				old.beschreibung = dashboard.beschreibung;
-			}).catch(err => console.error('ERROR:', err));
+			return this.$api
+				.call(ApiDashboardBoard.update(dashboard))
+				.then(response =>{
+
+					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSave'));
+
+					let old = this.dashboards.find(el => el.dashboard_id == dashboard.dashboard_id);
+					old.dashboard_kurzbz = dashboard.dashboard_kurzbz;
+					old.beschreibung = dashboard.beschreibung;
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		},
 		dashboardDelete(dashboard_id) {
-			axios.post(this.apiurl + '/Dashboard/delete', {dashboard_id}).then(() => {
-				this.current = -1;
-				this.dashboards = this.dashboards.filter(el => el.dashboard_id != dashboard_id);
-			}).catch(err => console.error('ERROR:', err));
+			return this.$api
+				.call(ApiDashboardBoard.delete(dashboard_id))
+				.then(response => {
+					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successDelete'));
+
+				})
+				.catch(this.$fhcAlert.handleSystemError)
+				.finally(() => {
+					this.current = -1;
+					this.dashboards = this.dashboards.filter(el => el.dashboard_id != dashboard_id);
+				});
 		},
 		assignWidgets(widgets) {
 			this.widgets = widgets;
@@ -72,22 +91,35 @@ export default {
 		}
 	},
 	created() {
-		axios.get(this.apiurl + '/Dashboard').then(res => {
-			this.dashboards = res.data.retval;
-		}).catch(err => console.error('ERROR:', err));
+		this.$api
+			.call(ApiDashboardBoard.list())
+			.then(result => {
+				this.dashboards = result.data.retval;
+				for (const dashboard of this.dashboards) {
+					this.$api
+						.call(ApiDashboardWidget.list(dashboard.dashboard_id))
+						.then(res => {
+							dashboard.widgetSetup = res.data;
+						})
+						.catch(this.$fhcAlert.handleSystemError);
+				}
+			})
+			.catch(this.$fhcAlert.handleSystemError);
 	},
 	template: `<div class="dashboard-admin">
+
 		<div class="input-group">
-			<label for="dashbaord-select" class="input-group-text">Dashboard:</label>
-			<select id="dashbaord-select" class="form-select" v-model="current">
+			<label for="dashboard-select" class="input-group-text">Dashboard:</label>
+			<select id="dashboard-select" class="form-select" v-model="current">
 				<option v-for="dashboard in dashboards" :key="dashboard.dashboard_id" :value="dashboard.dashboard_id">{{dashboard.dashboard_kurzbz}}</option>
 			</select>
 			<button class="btn btn-outline-secondary" type="button" @click="dashboardAdd"><i class="fa-solid fa-plus"></i></button>
 		</div>
+
 		<div v-if="dashboard">
 			<ul class="nav nav-tabs mt-3" role="tablist">
 				<li class="nav-item" role="presentation">
-					<button class="nav-link" id="edit-tab" data-bs-toggle="tab" data-bs-target="#edit" type="button" role="tab" aria-controls="edit" aria-selected="false">Edit</button>
+					<button class="nav-link" id="edit-tab" data-bs-toggle="tab" data-bs-target="#edit" type="button" role="tab" aria-controls="edit" aria-selected="false">{{this.$p.t('ui', 'bearbeiten')}}</button>
 				</li>
 				<li class="nav-item" role="presentation">
 					<button class="nav-link active" id="widgets-tab" data-bs-toggle="tab" data-bs-target="#widgets" type="button" role="tab" aria-controls="widgets" aria-selected="true">Widgets</button>
@@ -101,7 +133,7 @@ export default {
 					<dashboard-admin-edit v-bind="dashboard" :key="dashboard.dashboard_id" @change="dashboardUpdate($event)" @delete="dashboardDelete($event)"></dashboard-admin-edit>
 				</div>
 				<div class="tab-pane fade show active" id="widgets" role="tabpanel" aria-labelledby="widgets-tab">
-					<dashboard-admin-widgets :key="dashboard.dashboard_id" :dashboard_id="dashboard.dashboard_id" :widgets="widgets" @change="test" @assign-widgets="assignWidgets"></dashboard-admin-widgets>
+					<dashboard-admin-widgets :key="dashboard.dashboard_id" :dashboard_id="dashboard.dashboard_id" :widgets="widgets" @assign-widgets="assignWidgets"></dashboard-admin-widgets>
 				</div>
 				<div class="tab-pane fade" id="presets" role="tabpanel" aria-labelledby="presets-tab">
 					<dashboard-admin-presets :dashboard="dashboard.dashboard_kurzbz" :widgets="widgets"></dashboard-admin-presets>

public/js/components/Dashboard/Admin/Edit.js

@@ -18,7 +18,8 @@ export default {
 	},
 	methods: {
 		sendDelete() {
-			BsConfirm.popup('Sure?').then(() => this.$emit('delete', this.dashboard_id)).catch();
+			BsConfirm.popup(this.$p.t('ui', 'confirm_delete') + " " + this.$p.t('ui', 'deleteInfo'))
+				.then(() => this.$emit('delete', this.dashboard_id)).catch();
 		}
 	},
 	template: `<div class="dashboard-admin-edit px-3">
@@ -31,8 +32,8 @@ export default {
 			<textarea id="dashboard-admin-edit-beschreibung" class="form-control" v-model="desc"></textarea>
 		</div>
 		<div>
-			<button class="btn btn-danger" @click="sendDelete">Delete</button>
-			<button class="btn btn-primary" @click="$emit('change', {dashboard_id,dashboard_kurzbz:kurzbz,beschreibung:desc})">Update</button>
+			<button class="btn btn-danger" @click="sendDelete">{{this.$p.t('ui', 'loeschen')}}</button>
+			<button class="btn btn-primary" @click="$emit('change', {dashboard_id,dashboard_kurzbz:kurzbz,beschreibung:desc})">{{this.$p.t('ui', 'btnAktualisieren')}}</button>
 		</div>
 	</div>`
 }

public/js/components/Dashboard/Admin/Presets.js

@@ -1,6 +1,7 @@
 import DashboardSection from "../Section.js";
 import DashboardWidgetPicker from "../Widget/Picker.js";
 import ObjectUtils from "../../../helpers/ObjectUtils.js";
+import ApiDashboardPreset from "../../../api/factory/dashboard/preset.js";
 
 export default {
 	components: {
@@ -17,9 +18,6 @@ export default {
 		tmpLoading: ''
 	}),
 	computed: {
-		apiurl() {
-			return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/dashboard';
-		},
 		pickerWidgets() {
 			return this.widgets.filter(widget => widget.allowed);
 		}
@@ -28,6 +26,7 @@ export default {
 		widgetAdd(section_name, widget) {
 			this.$refs.widgetpicker.getWidget().then(widget_id => {
 				widget.widget = widget_id;
+				widget.id = 'loading_' + String((new Date()).valueOf());
 				delete widget.custom;
 				widget.preset = 1;
 				let loading = {...widget};
@@ -36,130 +35,153 @@ export default {
 					if (section.name == section_name)
 						section.widgets.push(loading);
 				});
-				
-				axios.post(this.apiurl + '/Config/addWidgetsToPreset', {
-					db: this.dashboard,
+
+				const params = {
+					dashboard: this.dashboard,
 					funktion_kurzbz: section_name,
-					widgets: [widget]
-				}).then(result => {
-					let newId = Object.keys(result.data.retval.data[section_name].widgets).pop();
-					widget.id = newId;
-					widget.custom = 1;
-					this.sections.forEach(section => {
-						if (section.name == section_name) {
-							section.widgets.splice(section.widgets.indexOf(loading),1);
-							section.widgets.push(widget);
-						}
-					});
-				}).catch(error => {
-					console.error('ERROR: ', error);
-					alert('ERROR: ' + error.response.data.retval);
-				});
-			}).catch(() => {});
+					widget
+				};
+
+				return this.$api
+					.call(ApiDashboardPreset.addWidget(params))
+					.then(result => {
+						let newId = result.data;
+						widget.id = newId;
+						widget.custom = 1;
+						this.sections.forEach(section => {
+							if (section.name == section_name) {
+								section.widgets.splice(section.widgets.indexOf(loading),1);
+								section.widgets.push(widget);
+							}
+						});
+						this.funktionen.forEach(funktion => {
+							if(funktion.funktion_kurzbz === section_name && funktion.has_preset < 1) {
+								funktion.has_preset = 1;
+							}
+						});
+					})
+					.catch(this.$fhcAlert.handleSystemError);
+			})
+			.catch(() => {});
 		},
 		widgetUpdate(section_name, payload) {
 			payload = payload[section_name];
 			for (var k in payload) {
-				for (var i in this.sections) {
-					if (this.sections[i].name == section_name) {
-						for (var wid in this.sections[i].widgets) {
-							if (this.sections[i].widgets[wid].id == k) {
-								payload[k] = ObjectUtils.mergeDeep(this.sections[i].widgets[wid], payload[k]);
-								// NOTE(chris): remove internal props
-								for (var prop in {_x:1,_y:1,_w:1,_h:1,index:1,id:1})
-									if (payload[k][prop])
-										delete payload[k][prop];
-								break;
-							}
-						}
+				const section = this.sections.find(section => section.name == section_name);
+				for (var wid in section.widgets) {
+					if (section.widgets[wid].id == k) {
+						payload[k] = ObjectUtils.mergeDeep(section.widgets[wid], payload[k]);
+						// NOTE(chris): remove internal props
+						for (var prop of ['_x', '_y', '_w', '_h', 'index', 'id'])
+							if (payload[k][prop])
+								delete payload[k][prop];
 						break;
 					}
 				}
 				payload[k].widgetid = k;
 				delete payload[k].custom;
 			}
-			axios.post(this.apiurl + '/Config/addWidgetsToPreset', {
-				db: this.dashboard,
-				funktion_kurzbz: section_name,
-				widgets: payload
-			}).then(() => {
-				this.sections.forEach(section => {
-					if (section.name == section_name) {
-						section.widgets.forEach((widget, i) => {
-							if (payload[widget.id]) {
-								payload[widget.id].id = widget.id;
-								payload[widget.id].index = widget.index;
-								section.widgets[i] = payload[widget.id];
-								section.widgets[i].custom = 1;
-							}
-						});
-					}
-				});
-			}).catch(error => {
-				// TODO(chris): revert placement on failure
-				console.error('ERROR: ', error);
-				alert('ERROR: ' + error.response.data.retval);
-			});
+			this.$api
+				.call(Object.entries(payload).map(([key, widget]) => [
+					key,
+					ApiDashboardPreset.addWidget({
+						dashboard: this.dashboard,
+						funktion_kurzbz: section_name,
+						widget
+					})
+				]))
+				.then(result => {
+					this.sections.forEach(section => {
+						if (section.name == section_name) {
+							section.widgets.forEach((widget, i) => {
+								if (payload[widget.id]) {
+									payload[widget.id].id = widget.id;
+									payload[widget.id].index = widget.index;
+									section.widgets[i] = payload[widget.id];
+									section.widgets[i].custom = 1;
+								}
+							});
+						}
+					});
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		},
 		widgetRemove(section_name, id) {
-			axios.post(this.apiurl + '/Config/removeWidgetFromPreset', {
+			const params = {
 				db: this.dashboard,
 				funktion_kurzbz: section_name,
 				widgetid: id
-			}).then(() => {
-				this.sections.forEach(section => {
-					if (section.name == section_name)
-						section.widgets = section.widgets.filter(widget => widget.id != id);
-				});
-			}).catch(error => {
-				console.error('ERROR: ', error);
-				alert('ERROR: ' + error.response.data.retval);
-			});
+			};
+			return this.$api
+				.call(ApiDashboardPreset.removeWidget(params))
+				.then(result => {
+					this.sections.forEach(section => {
+						if (section.name == section_name)
+							section.widgets = section.widgets.filter(widget => widget.id != id);
+					});
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		},
 		loadSections(evt) {
 			let funktionen = Array.from(evt.target.querySelectorAll("option:checked"),e=>e.value);
 			this.sections = [];
 			this.tmpLoading = funktionen.join('###');
-			axios.get(this.apiurl + '/Config/presetBatch', {params: {
+
+			const params = {
 				db: this.dashboard,
 				funktionen
-			}}).then(res => {
-				if (this.tmpLoading !== funktionen.join('###'))
-					return; // NOTE(chris): prevent race condition
-				for (var section in res.data.retval) {
-					let widgets = [];
-					for (var wid in res.data.retval[section]) {
-						res.data.retval[section][wid].id = wid;
-						res.data.retval[section][wid].custom = 1;
-						widgets.push(res.data.retval[section][wid]);
+			};
+
+			return this.$api
+				.call(ApiDashboardPreset.getBatch(params))
+				.then(result => {
+					if (this.tmpLoading !== funktionen.join('###'))
+						return; // NOTE(chris): prevent race condition
+					for (var section in result.data) {
+						let widgets = [];
+						for (var wid in result.data[section]) {
+							result.data[section][wid].id = wid;
+							result.data[section][wid].custom = 1;
+							widgets.push(result.data[section][wid]);
+						}
+						this.sections.push({
+							name: section,
+							widgets
+						});
 					}
-					this.sections.push({
-						name: section,
-						widgets
-					});
-				}
-			}).catch(err => console.error('ERROR:', err));
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+
+		},
+		loadFunktionen() {
+			this.$api
+				.call(ApiDashboardPreset.list(this.dashboard))
+				.then(result => {
+					this.funktionen = result.data;
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		}
 	},
 	created() {
-		axios.get(this.apiurl + '/Config/funktionen').then(res => {
-			this.funktionen = {general: 'GENERAL'};
-			res.data.retval.forEach(funktion => {
-				this.funktionen[funktion.funktion_kurzbz] = funktion.beschreibung;
-			});
-		}).catch(err => console.error('ERROR:', err));
+		this.loadFunktionen();
 	},
 	watch: {
 		dashboard() {
 			// TODO(chris): this should be done without a watcher
 			this.loadSections({target:this.$refs.funktionenList});
+			this.loadFunktionen();
 		}
 	},
 	template: `<div class="dashboard-admin-presets">
 		<div class="row">
 			<div class="col-3">
 				<select ref="funktionenList" style="height:30em" class="form-control" multiple @input="loadSections">
-					<option v-for="name,id in funktionen" :key="id" :value="id">{{ name }}</option>
+					<option
+						v-for="funktion in funktionen"
+						:key="funktion.funktion_kurzbz"
+						:value="funktion.funktion_kurzbz"
+						:class="(funktion.has_preset > 0) ? 'fw-bold' : ''"
+					>{{ funktion.beschreibung }}</option>
 				</select>
 			</div>
 			<div class="col-9">

public/js/components/Dashboard/Admin/Widgets.js

@@ -1,3 +1,5 @@
+import ApiDashboardWidget from "../../../api/factory/dashboard/widget.js";
+
 export default {
 	emits: [
 		"change",
@@ -7,34 +9,25 @@ export default {
 		dashboard_id: Number,
 		widgets: Array
 	},
-	computed: {
-		apiurl() {
-			return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/dashboard';
-		}
-	},
 	methods: {
 		sendChange(widget_id) {
 			let allow = !this.widgets.find(el => el.widget_id == widget_id).allowed;
-			axios.post(this.apiurl + '/Widget/setAllowed', {
-				dashboard_id: this.dashboard_id,
-				widget_id,
-				action: allow ? 'add' : 'delete'
-			}).catch(err => console.error('ERROR: ' + err));
+
+			this.$api
+				.call(ApiDashboardWidget.setAllowed(this.dashboard_id, widget_id, allow))
+				.catch(this.$fhcAlert.handleSystemError);
 		}
 	},
 	created() {
-		axios.get(this.apiurl + '/Widget/getAll', {
-			params:{
-				dashboard_id: this.dashboard_id
-			}
-		}).then(
-			result => {
-				this.$emit('assignWidgets', result.data.retval.map(el => ({
+		this.$api
+			.call(ApiDashboardWidget.list(this.dashboard_id))
+			.then(result => {
+				this.$emit('assignWidgets', result.data.map(el => ({
 					...el,
-					...{setup:JSON.parse(el.setup),arguments:JSON.parse(el.arguments),allowed:!!el.allowed}
+					allowed: !!el.allowed
 				})));
-			}
-		).catch(err => console.error('ERROR:', err));
+			})
+			.catch(this.$fhcAlert.handleSystemError);
 	},
 	template: `
 	<div class="dashboard-admin-widgets">

public/js/components/Dashboard/Dashboard.js

@@ -2,7 +2,8 @@ import DashboardSection from "./Section.js";
 import DashboardWidgetPicker from "./Widget/Picker.js";
 import ObjectUtils from "../../helpers/ObjectUtils.js";
 
-import ApiDashboard from '../../api/factory/cis/dashboard.js';
+import ApiDashboardWidget from '../../api/factory/dashboard/widget.js';
+import ApiDashboardUser from '../../api/factory/dashboard/user.js';
 
 export default {
 	name: 'Dashboard',
@@ -20,181 +21,147 @@ export default {
 			type: Object,
 			required: true,
 			validator(value) {
-				return value && value.name && value.uid && value.timezone
+				return value && value.name && value.timezone
 			}
 		}
 	},
 	data() {
 		return {
-			sections: [],
-			widgets: null,
-			editMode: false,
-			viewDataInternal: this.viewData
+			widgets: [],
+			originalWidgets: {},
+			widgetsSetup: null,
+			editMode: false
 		}
 	},
 	provide() {
 		return {
 			editMode: Vue.computed(()=>this.editMode),
-			widgetsSetup: Vue.computed(() => this.widgets),
+			widgetsSetup: Vue.computed(() => this.widgetsSetup),
 			timezone: Vue.computed(() => this.viewData.timezone)
 		}
 	},
-	computed: {
-		apiurl() {
-			return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/dashboard';
-		}
-	},
 	methods: {
 		widgetAdd(section_name, widget) {
-			if (this.widgets === null) {
-				axios.get(this.apiurl + '/Widget/getWidgetsForDashboard', {params:{
-					db: this.dashboard
-				}}).then(res => {
-					res.data.retval.forEach(widget => {
-						widget.arguments = JSON.parse(widget.arguments);
-						widget.setup = JSON.parse(widget.setup);
-					});
-					this.widgets = res.data.retval;
-				}).catch(err => console.error('ERROR:', err));
-			}
-			this.$refs.widgetpicker.getWidget().then(widget_id => {
-				widget.widget = widget_id;
-				widget.id = 'loading_' + String((new Date()).valueOf());
-				let loading = {...widget};
-				loading.loading = true;
-				this.sections.forEach(section => {
-					if (section.name == section_name)
-						section.widgets.push(loading);
-				});
-				
-				axios.post(this.apiurl + '/Config/addWidgetsToUserOverride', {
-					db: this.dashboard,
-					funktion_kurzbz: section_name,
-					widgets: [widget]
-				}).then(result => {
-					let newId = Object.keys(result.data.retval.data[section_name].widgets).pop();
-					widget.id = newId;
-					this.sections.forEach(section => {
-						if (section.name == section_name) {
-							section.widgets.splice(section.widgets.indexOf(loading),1);
-							section.widgets.push(widget);
-						}
-					});
-				}).catch(error => {
-					console.error('ERROR: ', error);
-					alert('ERROR: ' + error.response.data.retval);
-				});
-			}).catch(() => {});
+			// TODO(chris): remove section_name? (change order of params => get rid of it)
+			this.$refs.widgetpicker
+				.getWidget()
+				.then(widget_id => {
+					widget.widget = widget_id;
+					widget.id = 'loading_' + String((new Date()).valueOf());
+					let loading = { ...widget };
+					loading.loading = true;
+					this.widgets.push(loading);
+					
+					this.$api
+						.call(ApiDashboardUser.addWidget(this.dashboard, widget))
+						.then(result => {
+							widget.id = result.data;
+							this.widgets.splice(this.widgets.indexOf(loading), 1);
+							this.widgets.push(widget);
+							this.originalWidgets[widget.id] = structuredClone(ObjectUtils.deepToRaw(widget));
+						})
+						.catch(this.$fhcAlert.handleSystemError);
+				})
+				.catch(() => {});
 		},
 		widgetUpdate(section_name, payload) {
 			payload = payload[section_name];
 			for (var k in payload) {
-				for (var i in this.sections) {
-					if (this.sections[i].name == section_name) {
-						for (var wid in this.sections[i].widgets) {
-							if (this.sections[i].widgets[wid].id == k) {
-								payload[k] = ObjectUtils.mergeDeep(this.sections[i].widgets[wid], payload[k]);
-								// NOTE(chris): remove internal props
-								for (var prop in {_x:1,_y:1,_w:1,_h:1,index:1,id:1,preset:1})
-									if (payload[k][prop])
-										delete payload[k][prop];
-								break;
-							}
-						}
+				for (var wid in this.widgets) {
+					if (this.widgets[wid].id == k) {
+						payload[k] = ObjectUtils.mergeDeep(this.widgets[wid], payload[k]);
+						// NOTE(chris): remove internal props
+						for (var prop of ['_x','_y','_w','_h','index','id','preset'])
+							if (payload[k][prop])
+								delete payload[k][prop];
 						break;
 					}
 				}
 				payload[k].widgetid = k;
 			}
-			axios.post(this.apiurl + '/Config/addWidgetsToUserOverride', {
-				db: this.dashboard,
-				funktion_kurzbz: section_name,
-				widgets: payload
-			}).then(() => {
-				this.sections.forEach(section => {
-					if (section.name == section_name) {
-						section.widgets.forEach((widget, i) => {
-							if (payload[widget.id]) {
-								payload[widget.id].id = widget.id;
-								payload[widget.id].index = widget.index;
-								section.widgets[i] = payload[widget.id];
+			this.$api
+				.call(Object.entries(payload).map(([key, widget]) => [
+					key,
+					ApiDashboardUser.addWidget(this.dashboard, widget)
+				]))
+				.then(result => {
+					const failed = result
+						.filter(o => o.status == 'rejected')
+						.map(o => o.reason.config.errorHeader);
+
+					this.widgets.forEach((widget, i) => {
+						if (failed.includes(widget.id)) {
+							this.widgets[i] = structuredClone(ObjectUtils.deepToRaw(this.originalWidgets[widget.id]));
+							/** NOTE(chris): if you wanna hide or unhide a
+							 * preset and it fails: switch around the hidden
+							 * value to revert it properly (checkboxes can't
+							 * really handle it otherwise)
+							 */
+							if (payload[widget.id].hidden !== undefined) {
+								this.widgets[i].hidden = payload[widget.id].hidden;
+								this.$nextTick(() => {
+									this.widgets[i] = structuredClone(ObjectUtils.deepToRaw(this.originalWidgets[widget.id]));
+								});
 							}
-						});
-					}
-				});
-			}).catch(error => {
-				// TODO(chris): revert placement on failure
-				console.error('ERROR: ', error);
-				alert('ERROR: ' + error.response.data.retval);
-			});
+						} else if (payload[widget.id]) {
+							payload[widget.id].id = widget.id;
+							payload[widget.id].index = widget.index;
+							this.widgets[i] = payload[widget.id];
+							this.originalWidgets[widget.id] = structuredClone(ObjectUtils.deepToRaw(this.widgets[i]));
+						}
+					});
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		},
 		widgetRemove(section_name, id) {
-			axios.post(this.apiurl + '/Config/removeWidgetFromUserOverride', {
-				db: this.dashboard,
-				funktion_kurzbz: section_name,
-				widgetid: id
-			}).then(() => {
-				this.sections.forEach(section => {
-					if (section.name == section_name)
-						section.widgets = section.widgets.filter(widget => widget.id != id);
-				});
-			}).catch(error => {
-				console.error('ERROR: ', error);
-				alert('ERROR: ' + error.response.data.retval);
-			});
+			this.$api
+				.call(ApiDashboardUser.removeWidget(this.dashboard, id))
+				.then(() => {
+					this.widgets = this.widgets.filter(widget => widget.id != id);
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		}
 	},
 	created() {
 		this.$p.loadCategory('dashboard');
-		axios.get(this.apiurl + '/Widget/getWidgetsForDashboard', {
-			params: {
-				db: this.dashboard
-			}
-		}).then(res => {
-			this.widgets = res.data.retval;
-		}).catch(err => console.error('ERROR:', err));
 
-		axios.get(this.apiurl + '/Config', {params:{
-			db: this.dashboard
-		}}).then(res => {
-			for (var name in res.data.retval) {
-				let widgets = [];
-				let remove = [];
-				for (var wid in res.data.retval[name].widgets) {
-					res.data.retval[name].widgets[wid].id = wid;
-					if (res.data.retval[name].widgets[wid].custom || res.data.retval[name].widgets[wid].preset)
-						widgets.push(res.data.retval[name].widgets[wid]);
-					else
+		this.$api
+			.call(ApiDashboardWidget.listAllowed(this.dashboard))
+			.then(res => {
+				this.widgetsSetup = res.data;
+			})
+			.catch(this.$fhcAlert.handleSystemError);
+
+		this.$api
+			.call(ApiDashboardUser.get(this.dashboard))
+			.then(res => {
+				const widgets = [];
+				const remove = [];
+
+				for (var wid in res.data.general.widgets) {
+					let widget = res.data.general.widgets[wid];
+					widget.id = wid;
+					if (widget.custom || widget.preset) {
+						widgets.push(widget);
+						this.originalWidgets[wid] = structuredClone(widget);
+					} else {
 						remove.push(wid);
+					}
 				}
-				this.sections.push({
-					name: name,
-					widgets: widgets
-				});
-				remove.forEach(wid => this.widgetRemove(name, wid));
-			}
-			this.sections = this.sections.sort((section1, section2) => {
-				if(section1.name == 'custom')
-					return 1;
-				if (section2.name == 'custom')
-					return -1;
-				return section2.widgets.length - section1.widgets.length;
-			});
-		}).catch(err => console.error('ERROR:', err));
-	},
-	async beforeMount() {
-		if (!this.viewData.name || !this.viewData.uid) {
-			const res = await this.$api.call(ApiDashboard.getViewData());
-			this.viewDataInternal = res.data
-		}	
+
+				remove.forEach(wid => this.widgetRemove('general', wid));
+
+				this.widgets = widgets;
+			})
+			.catch(this.$fhcAlert.handleSystemError);
 	},
 	template: `
 	<div class="core-dashboard">
-		<h3 v-show="viewDataInternal?.name">
-			{{ $p.t('global/personalGreeting', [ viewDataInternal?.name ]) }}
+		<h3>
+			{{ $p.t('global/personalGreeting', [ viewData?.name ]) }}
 			<button style="margin-left: 8px;" class="btn" @click="editMode = !editMode" aria-label="edit dashboard" v-tooltip="{showDelay:1000,value:'edit dashboard'}"><i class="fa-solid fa-gear" aria-hidden="true"></i></button>
 		</h3>
-		<dashboard-section v-for="(section, index) in sections" :key="section.name" :seperator="index" :name="section.name" :widgets="section.widgets" @widgetAdd="widgetAdd" @widgetUpdate="widgetUpdate" @widgetRemove="widgetRemove"></dashboard-section>
-		<dashboard-widget-picker ref="widgetpicker" :widgets="widgets"></dashboard-widget-picker>
+		<dashboard-section :seperator="0" name="general" :widgets="widgets" @widgetAdd="widgetAdd" @widgetUpdate="widgetUpdate" @widgetRemove="widgetRemove"></dashboard-section>
+		<dashboard-widget-picker ref="widgetpicker" :widgets="widgetsSetup"></dashboard-widget-picker>
 	</div>`
 }

public/js/components/Dashboard/Item.js

@@ -1,5 +1,5 @@
 import BsModal from "../Bootstrap/Modal.js";
-import CachedWidgetLoader from "../../composables/Dashboard/CachedWidgetLoader.js";
+import { useCachedWidgetLoader } from "../../composables/Dashboard/CachedWidgetLoader.js";
 import HeightTransition from "../Tranistion/HeightTransition.js";
 
 export default {
@@ -70,6 +70,14 @@ export default {
 		ready() {
 			return this.component && this.arguments !== null;
 		},
+		visible: {
+			get() {
+				return !this.hidden;
+			},
+			set(value) {
+				this.$emit('remove', this.hidden);
+			}
+		}
 	},
 	methods: {
 		unpin(){
@@ -142,8 +150,14 @@ export default {
 			this.isLoading = false;
 		},
 	},
+	setup() {
+		const { actions } = useCachedWidgetLoader();
+		return {
+			loadWidget: actions.load
+		};
+	},
 	async created() {
-		this.widget = await CachedWidgetLoader.loadWidget(this.id);
+		this.widget = await this.loadWidget(this.id);
 		let component = (await import(this.widget.setup.file)).default;
 		this.$options.components["widget" + this.widget.widget_id] = component;
 		this.component = "widget" + this.widget.widget_id;
@@ -185,7 +199,7 @@ export default {
 			</a>
 			<Transition>
 				<div v-if="!custom && editMode" class="col-auto px-1 form-switch">
-					<input class="form-check-input ms-0" type="checkbox" role="switch" aria-label="toggle widget" id="flexSwitchCheckChecked" :checked="!hidden" @input="$emit('remove', hidden)">
+					<input class="form-check-input ms-0" type="checkbox" role="switch" aria-label="toggle widget" id="flexSwitchCheckChecked" v-model="visible" :value="true">
 				</div>
 			</Transition>
 		</div>

public/js/components/Dashboard/Section.js

@@ -1,7 +1,7 @@
 import BsConfirm from "../Bootstrap/Confirm.js";
 import DropGrid from '../Drop/Grid.js'
 import DashboardItem from "./Item.js";
-import CachedWidgetLoader from "../../composables/Dashboard/CachedWidgetLoader.js";
+import { useCachedWidgetLoader } from "../../composables/Dashboard/CachedWidgetLoader.js";
 import WidgetIcon from "./Widget/WidgetIcon.js"
 
 export default {
@@ -125,23 +125,23 @@ export default {
 		},
 		checkResizeLimit(item, w, h) {
 			// NOTE(chris): widgets needs to be loaded for this to work
-			let widget = CachedWidgetLoader.getWidget(item.widget);
+			let widget = this.widgetState[item.widget];
 			if (widget) {
-				let minmaxW = widget.setup.width;
+				let minmaxW = { ...widget.setup.width };
 				if (minmaxW.max)
 					minmaxW.min = minmaxW.min || 1;
 				else
-					minmaxW = {min:minmaxW,max:minmaxW};
+					minmaxW = { min: minmaxW, max: minmaxW };
 				if (w < minmaxW.min)
 					w = minmaxW.min; 
 				if (w > minmaxW.max)
 					w = minmaxW.max;
 
-				let minmaxH = widget.setup.height;
+				let minmaxH = { ...widget.setup.height };
 				if (minmaxH.max)
 					minmaxH.min = minmaxH.min || 1;
 				else
-					minmaxH = {min:minmaxH,max:minmaxH};
+					minmaxH = { min: minmaxH, max: minmaxH };
 				if (h < minmaxH.min)
 					h = minmaxH.min;
 				if (h > minmaxH.max)
@@ -151,7 +151,7 @@ export default {
 		},
 		removeWidget(item, revert) {
 			if (item.custom) {
-				BsConfirm.popup('Are you sure you want to delete this widget?').then(() => this.$emit('widgetRemove', this.name, item.id));
+				BsConfirm.popup(this.$p.t('dashboard', 'alert_deleteWidget')).then(() => this.$emit('widgetRemove', this.name, item.id));
 			} else {
 				let update = {};
 				update[item.id] = { hidden: !revert };
@@ -199,6 +199,13 @@ export default {
 			this.$emit('widgetUpdate', this.name, payload);
 		}
 	},
+	setup() {
+		const { state: widgetState } = useCachedWidgetLoader();
+
+		return {
+			widgetState
+		};
+	},
 	mounted() {
 		let self = this;
 		let cont = self.$refs.container;

public/js/components/Form/Input.js

@@ -170,6 +170,7 @@ export default {
 				return this.$attrs.modelValue;
 			},
 			set(v) {
+				this.clearValidationForThisName()
 				if (!this.$attrs.hasOwnProperty('modelValue'))
 					this.modelValueDummy = v;
 				this.$emit('update:modelValue', v);
@@ -242,9 +243,9 @@ export default {
 	template: `
 	<component :is="!hasContainer ? 'FhcFragment' : 'div'" class="position-relative" :class="autoContainerClass">
 		<label v-if="label && lcType != 'radio' && lcType != 'checkbox'" :class="!noAutoClass && 'form-label'" :for="idCmp">{{label}}</label>
-		<input v-if="tag == 'input'" :type="lcType" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="clearValidationForThisName(); $emit('input', $event)">
-		<textarea v-else-if="tag == 'textarea'" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="clearValidationForThisName(); $emit('input', $event)"></textarea>
-		<select v-else-if="tag == 'select'" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="clearValidationForThisName(); $emit('input', $event)">
+		<input v-if="tag == 'input'" :type="lcType" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="$emit('input', $event)">
+		<textarea v-else-if="tag == 'textarea'" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="$emit('input', $event)"></textarea>
+		<select v-else-if="tag == 'select'" ref="input" v-model="modelValueCmp" v-bind="$attrs" :id="idCmp" :name="name" :class="validationClass" :modelValue="undefined" @input="$emit('input', $event)">
 			<slot></slot>
 		</select>
 		<component

public/js/components/Messages/Details/NewMessage/Modal.js

@@ -63,7 +63,7 @@ export default {
 			const vm = this;
 			tinymce.init({
 				target: this.$refs.editor.$refs.input, //Important: not selector: to enable multiple import of component
-				//height: 800,
+				min_height: 300,
 				//plugins: ['lists'],
 				toolbar: 'styleselect | bold italic underline | alignleft aligncenter alignright alignjustify | link',
 				plugins: 'link',
@@ -133,6 +133,7 @@ export default {
 			return this.$api
 				.call(ApiMessages.getDataVorlage(vorlage_kurzbz))
 				.then(response => {
+					this.editor.setContent(response.data.text);
 					this.formData.body = response.data.text;
 					this.formData.subject = response.data.subject;
 				}).catch(this.$fhcAlert.handleSystemError);
@@ -203,24 +204,6 @@ export default {
 		},
 	},
 	watch: {
-		'formData.body': {
-			handler(newVal) {
-				const tinymcsVal = this.editor.getContent();
-
-				if (newVal && tinymcsVal != newVal) {
-					//Inhalt des Editors aktualisieren
-					this.editor.setContent(newVal);
-				}
-			}
-		},
-		'formData.vorlage_kurzbz': {
-			handler(newVal){
-				if (newVal && newVal != null) {
-					this.formData.subject = newVal;
-					return this.getDataVorlage(newVal);
-				}
-			}
-		},
 		messageId: {
 			immediate: true,
 			handler: async function (newMessageId) {
@@ -231,6 +214,7 @@ export default {
 					this.replyData = result.data;
 
 					if (this.replyData.length > 0) {
+						this.editor.setContent(this.replyData[0].replyBody);
 						this.formData.subject = this.replyData[0].replySubject;
 						this.formData.body = this.replyData[0].replyBody;
 						this.formData.relationmessage_id = newMessageId;
@@ -290,19 +274,6 @@ export default {
 
 			})
 			.catch(this.$fhcAlert.handleSystemError);
-
-		//case of reply
-		if(this.messageId) {
-			this.$api
-				.call(ApiMessages.getReplyData(this.messageId))
-				.then(result => {
-					this.replyData = result.data;
-					this.formData.subject = this.replyData[0].replySubject;
-					this.formData.body = this.replyData[0].replyBody;
-					this.formData.relationmessage_id = this.messageId;
-				})
-				.catch(this.$fhcAlert.handleSystemError);
-		}
 	},
 	async mounted() {
 		this.initTinyMCE();
@@ -342,7 +313,7 @@ export default {
 
 				<div class="row">
 					<div class="col-sm-8">
-						<form-form class="row g-3 mt-2 h-100" ref="formMessage">
+						<form-form class="row g-3 mt-2 align-content-start" ref="formMessage">
 
 							<div class="row mb-3">
 
@@ -367,7 +338,7 @@ export default {
 							</div>
 
 							<!--Tiny MCE-->
-							<div class="row mb-3 h-100 tiny-90">
+							<div class="row mb-3 tiny-90">
 								<form-input
 									ref="editor"
 									:label="$p.t('global','nachricht')  + ' *'"

public/js/components/Messages/Details/NewMessage/NewDiv.js

@@ -62,9 +62,18 @@ export default {
 			const vm = this;
 			tinymce.init({
 				target: this.$refs.editor.$refs.input, //Important: not selector: to enable multiple import of component
-				//height: 800,
+				min_height: 300,
 				//plugins: ['lists'],
-				toolbar: 'styleselect | bold italic underline | alignleft aligncenter alignright alignjustify',
+				toolbar: 'styleselect | bold italic underline | alignleft aligncenter alignright alignjustify | link',
+				plugins: 'link',
+				link_context_toolbar: true,
+				automatic_uploads: true,
+				default_link_target: "_blank",
+				link_title: true,
+				target_list: [
+					{ title: 'New tab', value: '_blank' },
+					{ title: 'Same tab', value: '_self' }
+				],
 				style_formats: [
 					{title: 'Blocks', block: 'div'},
 					{title: 'Paragraph', block: 'p'},
@@ -98,7 +107,8 @@ export default {
 			return this.$api
 				.call(ApiMessages.sendMessage(this.typeId, data))
 				.then(response => {
-					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSent'));
+					if(this.openMode == "inSamePage")
+						this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSent'));
 					this.hideTemplate();
 					this.resetForm();
 					this.messageSent = true;
@@ -114,19 +124,17 @@ export default {
 			return this.$api
 				.call(ApiMessages.getDataVorlage(vorlage_kurzbz))
 				.then(response => {
+					this.editor.setContent(response.data.text);
 					this.formData.body = response.data.text;
 					this.formData.subject = response.data.subject;
 				}).catch(this.$fhcAlert.handleSystemError);
 		},
 		getPreviewText(){
-			console.log("subj" + this.formData.subject);
 			const data = new FormData();
 
 			data.append('data', JSON.stringify(this.formData.body));
 			data.append('ids', JSON.stringify(this.id));
 
-			console.log("subj" + this.formData.subject);
-
 			return this.$api
 				.call(ApiMessages.getPreviewText(
 					this.typeId, data))
@@ -195,6 +203,7 @@ export default {
 				.call(ApiMessages.getReplyData(messageId))
 				.then(result => {
 					this.replyData = result.data;
+					this.editor.setContent(this.replyData[0].replyBody);
 					this.formData.subject = this.replyData[0].replySubject;
 					this.formData.body = this.replyData[0].replyBody;
 					this.formData.relationmessage_id = messageId;
@@ -202,27 +211,6 @@ export default {
 				.catch(this.$fhcAlert.handleSystemError);
 		}
 	},
-	watch: {
-		'formData.body': {
-			handler(newVal) {
-				const tinymcsVal = this.editor.getContent();
-
-				if (newVal && tinymcsVal != newVal) {
-					//Inhalt des Editors aktualisieren
-					this.editor.setContent(newVal);
-				}
-			}
-		},
-		'formData.vorlage_kurzbz': {
-			handler(newVal){
-
-				if (newVal && newVal != null) {
-					this.formData.subject = newVal;
-					return this.getDataVorlage(newVal);
-				}
-			}
-		},
-	},
 	created(){
 		const missingparamsmsgs = [];
 		if(!this.typeId)
@@ -291,17 +279,8 @@ export default {
 			.catch(this.$fhcAlert.handleSystemError);
 
 		//case of reply
-		if(this.messageId != null) {
+		if(this.messageId) {
 			this.loadReplyData(this.messageId);
-/*			this.$api
-				.call(ApiMessages.getReplyData(this.messageId))
-				.then(result => {
-					this.replyData = result.data;
-					this.formData.subject = this.replyData[0].replySubject;
-					this.formData.body = this.replyData[0].replyBody;
-					this.formData.relationmessage_id = this.messageId;
-				})
-				.catch(this.$fhcAlert.handleSystemError);*/
 		}
 
 	},
@@ -499,10 +478,10 @@ export default {
 						
 						<div class="row">
 							<div class="col-6" style="border-right: 1px">
-								You can safely close this window.
+								You can safely close this window/tab.
 							</div>
 							<div class="col-6">
-								Sie können dieses Fenster schließen.
+								Fenster/Reiter kann geschlossen werden!
 							</div>
 						</div>
 				</div>

public/js/components/Messages/Details/TableMessages.js

@@ -30,6 +30,7 @@ export default {
 			personId: null,
 			layoutColumnsOnNewData:	false,
 			height: '400',
+			arePhrasesLoaded: false
 		}
 	},
 	methods: {
@@ -65,7 +66,14 @@ export default {
 		buildTreemap(messages) {
 			if (!messages || !messages.data || messages.data.length === 0)
 			{
-				return {data: [], last_page: 0};
+				if(this.tabulatorOptions.pagination)
+				{
+					return {data: [], last_page: 0};
+				}
+				else
+				{
+					return [];
+				}
 			}
 
 			const last_page = messages.meta.count;
@@ -106,7 +114,15 @@ export default {
 				// to avoid endless loop
 				if (iteration > messages.length) break;
 			}
-			return {data: messageNested, last_page: last_page};
+
+			if(this.tabulatorOptions.pagination)
+			{
+				return {data: messageNested, last_page: last_page};
+			}
+			else
+			{
+				return messageNested;
+			}
 		},
 		loadAjaxCall(url, config, params){
 			return this.$api.call(
@@ -180,7 +196,7 @@ export default {
 						],
 						formatter: (cell, formatterParams) => {
 							const key = formatterParams[cell.getValue()];
-							return this.$p.t('messages', key);
+							return this.$p?.t?.('messages', key) || key;
 						},
 					},
 					{
@@ -252,7 +268,7 @@ export default {
 						frozen: true
 					}
 				],
-				pagination: true,
+				pagination: false,
 				paginationMode: "remote",
 				paginationSize: 15,
 				paginationInitialPage: 1,
@@ -290,8 +306,6 @@ export default {
 				{
 					event: 'tableBuilt',
 					handler: async() => {
-						await this.$p.loadCategory(['global', 'person', 'stv', 'messages', 'ui', 'notiz']);
-
 						const setHeader = (field, text) => {
 							const col = this.$refs.table.tabulator.getColumn(field);
 							if (!col) return;
@@ -342,6 +356,12 @@ export default {
 				});*/
 	},
 	created(){
+		this.$p
+			.loadCategory(['global', 'person', 'stv', 'messages', 'ui', 'notiz'])
+			.then(() => {
+				this.arePhrasesLoaded = true;
+			});
+
 		if(this.typeId != 'person_id' && Array.isArray(this.id) && this.id.length === 1) {
 			const params = {
 				id: this.id,
@@ -366,6 +386,7 @@ export default {
 				<!--table-->
 				<div class="col-sm-6 pt-1">
 					<core-filter-cmpt
+						v-if="arePhrasesLoaded"
 						ref="table"
 						:tabulator-options="tabulatorOptions"
 						:tabulator-events="tabulatorEvents"
@@ -398,6 +419,7 @@ export default {
 				<div class="col-sm-12 pt-6">
 					<core-filter-cmpt
 						ref="table"
+						v-if="arePhrasesLoaded"
 						:tabulator-options="tabulatorOptions"
 						:tabulator-events="tabulatorEvents"
 						table-only

public/js/components/Messages/Messages.js

@@ -82,14 +82,16 @@ export default {
 				this.$refs.modalMsg.show();
 			}
 			else if (this.openMode == "inSamePage"){
-				console.log("in same Page");
 				this.isVisibleDiv = true;
-				if(messageId)
-					this.$refs.templateNewDivMessage.loadReplyData(messageId);
-				else
-					this.$refs.templateNewDivMessage.resetForm();
 
-				this.$refs.templateNewDivMessage.showTemplate();
+				this.$nextTick(() => {
+					if(messageId)
+						this.$refs.templateNewDivMessage.loadReplyData(messageId);
+					else
+						this.$refs.templateNewDivMessage.resetForm();
+
+					this.$refs.templateNewDivMessage.showTemplate();
+				});
 			}
 			else
 				console.log("no valid openMode");

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

@@ -74,6 +74,24 @@ export default {
 				],
 				'abschlussdokument_lehrgaenge.xml.php': [
 						'AbschlussdokumentLehrgaenge'
+				],
+				'microcredential.xml.php' : [
+					'microcredentialzertifikat_1',
+					'microcredentialzertifikat_2',
+					'microcredentialzertifikat_3',
+					'microcredentialzertifikat_4',
+					'microcredential_1',
+					'microcredential_2',
+					'microcredential_3',
+					'microcredential_4',
+					'microdegree_1',
+					'microdegree_2',
+					'microdegree_3',
+					'microdegree_4',
+					'microdegreeabschluss_1',
+					'microdegreeabschluss_2',
+					'microdegreeabschluss_3',
+					'microdegreeabschluss_4',
 				]
 			},
 			documentDropdownObject: {}

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

@@ -83,6 +83,8 @@ export default {
 				});
 		},
 		open() {
+
+			this.getBuchungstypen(this.currentSemester);
 			this.data = {
 				buchungstyp_kurzbz: '',
 				betrag: '-0.00',
@@ -105,7 +107,7 @@ export default {
 			const text = typ.standardtext || '';
 			const creditpoints = typ.credit_points || '';
 
-			if (!this.data.betrag || this.data.betrag == '-0.00')
+			if (!this.data.betrag || this.data.betrag == '-0.00' || this.data.betrag !== amount)
 				this.data.betrag = amount;
 
 			if (!this.data.buchungstext)
@@ -113,7 +115,18 @@ export default {
 
 			if (this.config.showCreditpoints && (this.data.credit_points == '0.00' || this.data.credit_points === null))
 				this.data.credit_points = creditpoints;
-		}
+		},
+		getBuchungstypen(studiensemester_kurzbz)
+		{
+			this.$api
+				.call(ApiKonto.getBuchungstypen(studiensemester_kurzbz))
+				.then(result => {
+					this.lists.buchungstypen = result.data;
+					if (this.data.buchungstyp_kurzbz)
+						this.checkDefaultBetrag(this.data.buchungstyp_kurzbz);
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+		},
 	},
 	template: `
 	<core-form ref="form" class="stv-details-konto-edit" @submit.prevent="save">
@@ -166,6 +179,7 @@ export default {
 				<form-input
 					type="select"
 					v-model="data.studiensemester_kurzbz"
+					@change="getBuchungstypen(data.studiensemester_kurzbz)"
 					name="studiensemester_kurzbz"
 					:label="$p.t('lehre/studiensemester')"
 					>

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

@@ -14,6 +14,9 @@ export default {
 	inject: {
 		defaultSemester: {
 			from: 'defaultSemester'
+		},
+		currentSemester: {
+			from: 'currentSemester'
 		}
 	},
 	computed: {
@@ -95,8 +98,9 @@ export default {
 			this.formData.themenbereich = null;
 			this.formData.projekttyp_kurzbz = null;
 			this.formData.firma = null;
-			this.formData.lehrveranstaltung_id = null;
-			this.formData.lehreinheit_id = null;
+			// dont reset these form fields for UX reasons
+			// this.formData.lehrveranstaltung_id = null;
+			// this.formData.lehreinheit_id = null;
 			this.formData.beginn = null;
 			this.formData.ende = null;
 			this.formData.freigegeben = true;
@@ -109,7 +113,7 @@ export default {
 		getFormData(newProjektarbeit, studiensemester_kurzbz, additional_lehrveranstaltung_id) {
 
 			this.additional_lehrveranstaltung_id = additional_lehrveranstaltung_id;
-			this.studiensemester = studiensemester_kurzbz || this.defaultSemester;
+			this.studiensemester = studiensemester_kurzbz || this.currentSemester;
 			this.newProjektarbeit = newProjektarbeit;
 
 			this.$api

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

@@ -121,7 +121,6 @@ export default {
 				height: 'auto',
 				minHeight: '100',
 				selectableRows: true,
-				selectableRows: 1,
 				index: 'betreuer_id',
 				persistence:{
 					columns: true, //persist column layout

public/js/components/Vertraege/List/Details.js

@@ -41,8 +41,8 @@ export default {
 				),
 				ajaxResponse: (url, params, response) => response.data,
 				columns: [
-					{title: "Typ", field: "type"},
-					{title: "Betrag", field: "betrag",
+					{title: "Typ", field: "type", headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
+					{title: "Betrag", field: "betrag", headerFilter: true,
 						formatter: function(cell) {
 							let value = cell.getValue();
 							if (value == null) {
@@ -51,14 +51,14 @@ export default {
 							return parseFloat(value).toFixed(2);
 						}
 					},
-					{title: "Bezeichnung", field: "bezeichnung"},
-					{title: "Studiensemester", field: "studiensemester_kurzbz"},
-					{title: "Pruefung_id", field: "pruefung_id", visible: false},
-					{title: "mitarbeiter_uid", field: "mitarbeiter_uid", visible: false},
-					{title: "projektarbeit_id", field: "projektarbeit_id", visible: false},
-					{title: "lehreinheit_id", field: "lehreinheit_id", visible: true},
-					{title: "betreuerart_kurzbz", field: "betreuerart_kurzbz", visible: false},
-					{title: "vertrag_id", field: "vertrag_id", visible: false}, //just for testing
+					{title: "Bezeichnung", field: "bezeichnung", headerFilter: true},
+					{title: "Studiensemester", field: "studiensemester_kurzbz", headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
+					{title: "Pruefung_id", field: "pruefung_id", visible: false, headerFilter: true},
+					{title: "mitarbeiter_uid", field: "mitarbeiter_uid", visible: false, headerFilter: true},
+					{title: "projektarbeit_id", field: "projektarbeit_id", visible: false, headerFilter: true},
+					{title: "lehreinheit_id", field: "lehreinheit_id", visible: true, headerFilter: true},
+					{title: "betreuerart_kurzbz", field: "betreuerart_kurzbz", visible: false, headerFilter: true},
+					{title: "vertrag_id", field: "vertrag_id", visible: false, headerFilter: true}, //just for testing
 					{
 						title: 'Aktionen', field: 'actions',
 						minWidth: 50,
@@ -110,10 +110,10 @@ export default {
 				],
 				layout: 'fitColumns',
 				layoutColumnsOnNewData: false,
-				height: '200',
+				height: '250',
 				selectableRowsRangeMode: 'click',
 				selectableRows: true,
-				persistenceID: 'core-contracts-details-2026021701'
+				persistenceID: 'core-contracts-details-2026050501'
 			},
 			tabulatorEvents: [
 				{
@@ -137,7 +137,7 @@ export default {
 
 						setHeader('type', this.$p.t('global', 'typ'));
 						setHeader('bezeichnung', this.$p.t('ui', 'bezeichnung'));
-						setHeader('lehreinheit_id', this.$p.t('ui', 'lehreinheit_id'));
+						setHeader('lehreinheit_id', this.$p.t('lehre', 'lehreinheit_id'));
 						setHeader('betrag', this.$p.t('ui', 'betrag'));
 						setHeader('studiensemester_kurzbz', this.$p.t('lehre', 'studiensemester'));
 						setHeader('mitarbeiter_uid', this.$p.t('ui', 'mitarbeiter_uid'));

public/js/components/Vertraege/List/Status.js

@@ -47,12 +47,13 @@ export default {
 					this.endpoint.getStatiOfContract(this.person_id, this.vertrag_id)
 				),
 				ajaxResponse: (url, params, response) => response.data,
-				persistenceID: 'core-contracts-status-2026021701',
+				persistenceID: 'core-contracts-status-2026050501',
 				columns: [
-					{title: "Status", field: "bezeichnung"},
+					{title: "Status", field: "bezeichnung", headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
 					{
 						title: "Datum",
 						field: "datum",
+						headerFilter: true,
 						formatter: function (cell) {
 							const dateStr = cell.getValue();
 							const date = new Date(dateStr); // Convert to Date object
@@ -66,14 +67,15 @@ export default {
 							});
 						}
 					},
-					{title: "vertrag_id", field: "vertrag_id", visible: false},
-					{title: "Vertragsstatus", field: "vertragsstatus_kurzbz", visible: false},
-					{title: "User", field: "mitarbeiter_uid", visible: false},
-					{title: "insertvon", field: "insertvon", visible: false},
+					{title: "vertrag_id", field: "vertrag_id", visible: false, headerFilter: true},
+					{title: "Vertragsstatus", field: "vertragsstatus_kurzbz", visible: false, headerFilter: true},
+					{title: "User", field: "mitarbeiter_uid", visible: false, headerFilter: true},
+					{title: "insertvon", field: "insertvon", visible: false, headerFilter: true},
 					{
 						title: "insertamum",
 						field: "insertamum",
 						visible: false,
+						headerFilter: true,
 						formatter: function (cell) {
 							const dateStr = cell.getValue();
 							const date = new Date(dateStr);
@@ -87,11 +89,12 @@ export default {
 							});
 						}
 					},
-					{title: "updatevon", field: "updatevon", visible: false},
+					{title: "updatevon", field: "updatevon", visible: false, headerFilter: true},
 					{
 						title: "updateamum",
 						field: "updateamum",
 						visible: false,
+						headerFilter: true,
 						formatter: function (cell) {
 							const dateStr = cell.getValue();
 							const date = new Date(dateStr);
@@ -148,7 +151,7 @@ export default {
 				],
 				layout: 'fitColumns',
 				layoutColumnsOnNewData: false,
-				height: '200',
+				height: '250',
 				selectableRowsRangeMode: 'click',
 				selectableRows: true,
 			},

public/js/components/Vertraege/List/Unassigned.js

@@ -30,10 +30,11 @@ export default {
 				),
 				ajaxResponse: (url, params, response) => response.data,
 				columns: [
-					{title: "Typ", field: "type", width: 100},
+					{title: "Typ", field: "type", width: 100, headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
 					{
 						title: "Betrag",
 						field: "betrag1",
+						headerFilter: true,
 						formatter: function(cell) {
 							let value = cell.getValue();
 							if (value == null) {
@@ -41,28 +42,29 @@ export default {
 							}
 							return parseFloat(value).toFixed(2);
 						}},
-					{title: "Bezeichnung", field: "bezeichnung", width: 150},
-					{title: "Studiensemester", field: "studiensemester_kurzbz",  width: 160},
-					{title: "mitarbeiter_uid", field: "mitarbeiter_uid", visible: false},
-					{title: "projektarbeit_id", field: "projektarbeit_id", visible: false},
-					{title: "lehreinheit_id", field: "lehreinheit_id", visible: true},
-					{title: "betreuerart_kurzbz", field: "betreuerart_kurzbz", visible: false},
-					{title: "Vertragsstunden", field: "vertragsstunden", visible: false},
-					{title: "vertrag_id", field: "vertrag_id", visible: false}, //just for testing
+					{title: "Bezeichnung", field: "bezeichnung", width: 150, headerFilter: true},
+					{title: "Studiensemester", field: "studiensemester_kurzbz",  width: 160, headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
+					{title: "mitarbeiter_uid", field: "mitarbeiter_uid", visible: false, headerFilter: true},
+					{title: "projektarbeit_id", field: "projektarbeit_id", visible: false, headerFilter: true},
+					{title: "lehreinheit_id", field: "lehreinheit_id", visible: true, headerFilter: true},
+					{title: "betreuerart_kurzbz", field: "betreuerart_kurzbz", visible: false, headerFilter: true},
+					{title: "Vertragsstunden", field: "vertragsstunden", visible: false, headerFilter: true},
+					{title: "vertrag_id", field: "vertrag_id", visible: false, headerFilter: true}, //just for testing
 					{
 						title: "VertragsstundenStudiensemester",
 						field: "vertragsstunden_studiensemester_kurzbz",
-						visible: false
+						visible: false,
+						headerFilter: true
 					},
 				],
 				layout: 'fitColumns',
 				layoutColumnsOnNewData: false,
-				height: 150,
+				height: 250,
 				selectableRowsRangeMode: 'click',
 				selectableRows: true,
 				selectableRowsRollingSelection: false, //only allow multiselect with STRG
 				index: "lehreinheit_id",
-				persistenceID: 'core-contracts-unassigned-2026021701'
+				persistenceID: 'core-contracts-unassigned-2026050501'
 			},
 			tabulatorEvents: [
 				{
@@ -100,7 +102,7 @@ export default {
 
 							setHeader('type', this.$p.t('global', 'typ'));
 							setHeader('bezeichnung', this.$p.t('ui', 'bezeichnung'));
-							setHeader('lehreinheit_id', this.$p.t('ui', 'lehreinheit_id'));
+							setHeader('lehreinheit_id', this.$p.t('lehre', 'lehreinheit_id'));
 							setHeader('betrag1', this.$p.t('ui', 'betrag'));
 							setHeader('studiensemester_kurzbz', this.$p.t('lehre', 'studiensemester'));
 							setHeader('mitarbeiter_uid', this.$p.t('ui', 'mitarbeiter_uid'));

public/js/components/Vertraege/Vertraege.js

@@ -20,9 +20,6 @@ export default {
 		ContractStati
 	},
 	inject: {
-/*		cisRoot: {
-			from: 'cisRoot'
-		},*/
 		hasSchreibrechte: {
 			from: 'hasSchreibrechte',
 			default: false
@@ -54,9 +51,9 @@ export default {
 				),
 				ajaxResponse: (url, params, response) => response.data,
 				columns: [
-					{title: "Bezeichnung", field: "bezeichnung", width: 300},
+					{title: "Bezeichnung", field: "bezeichnung", width: 300, headerFilter: true},
 					{
-						title: "Betrag", field: "betrag", width: 100,
+						title: "Betrag", field: "betrag", width: 100, headerFilter: true,
 						formatter: function (cell) {
 							let value = cell.getValue();
 
@@ -66,12 +63,13 @@ export default {
 							return parseFloat(value).toFixed(2);
 						}
 					},
-					{title: "Vertragstyp", field: "vertragstyp_bezeichnung", width: 125},
-					{title: "Status", field: "status", width: 100},
+					{title: "Vertragstyp", field: "vertragstyp_bezeichnung", width: 125, headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
+					{title: "Status", field: "status", width: 100, headerFilter: "list", headerFilterParams: {valuesLookup:true, listOnEmpty:true, autocomplete:true, sort:"asc"}},
 					{
 						title: "Vertragsdatum",
 						field: "vertragsdatum",
 						width: 128,
+						headerFilter: true,
 						formatter: function (cell) {
 							const dateStr = cell.getValue();
 							const date = new Date(dateStr);
@@ -82,11 +80,11 @@ export default {
 							});
 						}
 					},
-					{title: "VertragId", field: "vertrag_id", visible: false},
-					{title: "Vertragsstunden", field: "vertragsstunden", visible: false},
-					{title: "VertragsstundenStudiensemester", field: "vertragsstunden_studiensemester_kurzbz", visible: false},
-					{title: "Anmerkung", field: "anmerkung", visible: false},
-					{title: "isAbgerechnet", field: "isabgerechnet", visible: false},
+					{title: "VertragId", field: "vertrag_id", visible: false, headerFilter: true},
+					{title: "Vertragsstunden", field: "vertragsstunden", visible: false, headerFilter: true},
+					{title: "VertragsstundenStudiensemester", field: "vertragsstunden_studiensemester_kurzbz", visible: false, headerFilter: true},
+					{title: "Anmerkung", field: "anmerkung", visible: false, headerFilter: true},
+					{title: "isAbgerechnet", field: "isabgerechnet", visible: false, headerFilter: true},
 					{
 						title: 'Aktionen', field: 'actions',
 						minWidth: 150,
@@ -140,11 +138,13 @@ export default {
 					columns: true,
 					filter: false //to avoids js errors
 				},
-				persistenceID: 'core-contracts-2026021701',
+				persistenceID: 'core-contracts-2026050501',
 			};
 			return options;
 		},
 		tabulatorEvents() {
+			const vm = this;
+
 			const events = [
 				{
 					event: 'tableBuilt',
@@ -177,28 +177,11 @@ export default {
 						setHeader('actions', this.$p.t('global', 'aktionen'));
 					}
 				},
-/*				{
-					//is just enabled for ADDON Injection KU: MultiprintHonorarvertrag
-					//(maybe enable also for ADDON FH Burgenland: MultiAccept later)
-					event: 'rowClick',
-					handler: (e, row) => {
-						if (this.dataPrintHonorar != null && this.dataPrintHonorar.multiselect != null) {
-							const selectedContract = row.getData().vertrag_id;
-							const status = row.getData().status;
-							const bezeichnung =	row.getData().bezeichnung;
-
-							this.toggleRowClick(selectedContract, status, bezeichnung);
-						}
-					}
-				},*/
 				{
 					event: 'rowClick',
-					handler: (e, row) => {
-						if (!this.dataPrintHonorar?.multiselect) return;
-
+					handler: function (e, row) {
 						const { vertrag_id, status, bezeichnung, vertragstyp_bezeichnung } = row.getData();
-
-						this.toggleRowClick(e, vertrag_id, status, bezeichnung, vertragstyp_bezeichnung);
+						vm.toggleRowClick(e, vertrag_id, status, bezeichnung, vertragstyp_bezeichnung);
 					}
 				},
 				{
@@ -242,8 +225,6 @@ export default {
 		person_id() {
 			this.$refs.table.reloadTable();
 			this.arraySelectedContracts = [];
-/*			if(this.dataPrintHonorar?.multiselect)
-				this.dataPrintHonorar.multiselect = [];*/
 		},
 	},
 	methods: {
@@ -270,7 +251,6 @@ export default {
 				)
 				.then(result => {
 					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successDelete'));
-					//window.scrollTo(0, 0);
 					this.reload();
 					this.contractSelected.vertrag_id = null;
 				})
@@ -518,19 +498,9 @@ export default {
 					'content/pdfExport.php?xml=' + this.dataPrintHonorar.xml + '&xsl=' + this.dataPrintHonorar.xsl + '&mitarbeiter_uid=' + this.mitarbeiter_uid + vertragString + '&output=pdf&uid=' + this.mitarbeiter_uid;
 			window.open(linkToPdf, '_blank');
 		},
-/*		toggleRowClick(contractId, status, bezeichnung) {
-			const index = this.arraySelectedContracts.findIndex(
-				([id]) => id === contractId
-			);
-			if (index !== -1) {
-				this.arraySelectedContracts.splice(index, 1);
-			} else {
-				this.arraySelectedContracts.push([contractId, status, bezeichnung]);
-			}
-		},*/
 		toggleRowClick(event, vertrag_id, status, bezeichnung, vertragstyp_bezeichnung) {
-			if (!this.dataPrintHonorar?.multiselect) return;
 
+			const isMulti = this.dataPrintHonorar?.multiselect === true;
 			const isCtrl = event.ctrlKey || event.metaKey;
 
 			const entry = {
@@ -540,28 +510,29 @@ export default {
 				vertragstyp_bezeichnung
 			};
 
-			// Single click
-			if (!isCtrl) {
+			// allow MultiSelect just in case event multiActionPrintHonorarvertrag
+			const allowMultiClick = isMulti && isCtrl;
+
+			if (!allowMultiClick) {
 				this.arraySelectedContracts = [entry];
+
+				//just mark last selected row as selected
+				this.$refs.table.tabulator.deselectRow();
+				this.$refs.table.tabulator.selectRow(vertrag_id);
 				return;
 			}
 
-			// CTRL / CMD → toggle
 			const index = this.arraySelectedContracts.findIndex(
 				e => e.vertrag_id === vertrag_id
 			);
 
 			if (index === -1) {
 				this.arraySelectedContracts.push(entry);
-				//this.arraySelectedContracts.push([entry.vertrag_id, entry.status, entry.bezeichnung, entry.vertragstyp_bezeichnung]);
 			} else {
 				this.arraySelectedContracts.splice(index, 1);
 			}
-		},
-/*		clearSelection(){
-			this.arraySelectedContracts = [];
-			this.$refs.table.tabulator.deselectRow();
-		}*/
+
+		}
 	},
 	created() {
 		Promise.all([
@@ -587,88 +558,6 @@ export default {
 		});
 		this.getFormattedDate();
 	},
-	/*
-	TODO(Manu) delete after check
-
-		<div class="row mb-3">
-			<form-input
-				type="DatePicker"
-				:label="$p.t('vertrag/datum_vertrag')"
-				name="vertragsdatum"
-				v-model="formData.vertragsdatum"
-				auto-apply
-				:enable-time-picker="false"
-				format="dd.MM.yyyy"
-				preview-format="dd.MM.yyyy"
-				:teleport="true"
-				>
-			</form-input>
-		</div>
-
-		<div class="row mb-3">
-			<form-input
-				type="text"
-				:label="$p.t('ui/bezeichnung')"
-				name="bezeichnung"
-				v-model="formData.bezeichnung"
-				>
-			</form-input>
-		</div>
-		<div class="row mb-3">
-			<form-input
-				type="select"
-				:label="$p.t('global/typ')"
-				v-model="formData.vertragstyp_kurzbz"
-				name="vertragstyp_kurzbz"
-				>
-				<option :value="null">-- {{$p.t('fehlermonitoring', 'keineAuswahl')}} --</option>
-				<option
-					v-for="entry in listContractTypes"
-					:key="entry.vertragstyp_kurzbz"
-					:value="entry.vertragstyp_kurzbz"
-					>
-					{{entry.bezeichnung}}
-				</option>
-			</form-input>
-		</div>
-		<div class="row mb-3">
-			<form-input
-				:label="$p.t('ui/betrag')"
-				name="betrag"
-				v-model="formData.betrag"
-				>
-			</form-input>
-		</div>
-		<div class="row mb-3" v-if="!statusNew">
-			<form-input
-				type="text"
-				:label="$p.t('ui/stunden') + ' (' + $p.t('vertrag/vertrag_urfassung')+ ')'"
-				name="vertragsstunden"
-				v-model="formData.vertragsstunden"
-				disabled
-				>
-			</form-input>
-		</div>
-		<div class="row mb-3" v-if="!statusNew">
-			<form-input
-				type="text"
-				:label="$p.t('lehre/studiensemester') + ' (' + $p.t('vertrag/vertrag_urfassung')+ ')'"
-				name="vertragsstunden_studiensemester_kurzbz"
-				v-model="formData.vertragsstunden_studiensemester_kurzbz"
-				disabled
-				>
-			</form-input>
-		</div>
-		<div class="row mb-3">
-			<form-input
-				type="textarea"
-				:label="$p.t('global/anmerkung')"
-				name="anmerkung"
-				v-model="formData.anmerkung"
-				>
-			</form-input>
-		</div>
-	 */
 	template: `
 	<div class="core-contracts h-100 d-flex flex-column">
 

public/js/components/Vertraege/Vertragsverwaltung.js

@@ -71,7 +71,6 @@ export default {
 							:mitarbeiter_uid="this.mitarbeiter_uid"
 							typeHeader="mitarbeiter"
 							:domain="config.domain"
-							fotoEditable
 							@redirectToLeitung="handleSelection"
 						>
 							<template #uid>{{tile_MaUid}}</template>

public/js/components/filter/Filter.js

@@ -280,7 +280,7 @@ export const CoreFilterCmpt = {
 				});
 			}
 
-			if (tabulatorOptions.selectable || (tabulatorOptions.columns && tabulatorOptions.columns.filter(el => el.formatter == 'rowSelection').length))
+			if (tabulatorOptions.selectable || tabulatorOptions.selectableRows || (tabulatorOptions.columns && tabulatorOptions.columns.filter(el => el.formatter == 'rowSelection').length))
 				this.tabulatorHasSelector = true;
 
 			if (this.idField) {
@@ -358,7 +358,7 @@ export const CoreFilterCmpt = {
 			}
 		},
 		_updateTabulator() {
-			this.tabulatorHasSelector = this.tabulatorOptions.selectable || this.filteredColumns.filter(el => el.formatter == 'rowSelection').length;
+			this.tabulatorHasSelector = this.tabulatorOptions.selectable || this.tabulatorOptions.selectableRows || this.filteredColumns.filter(el => el.formatter == 'rowSelection').length;
 			this.tabulator.setColumns(this.filteredColumns);
 			this.tabulator.setData(this.filteredData);
 			this._setHeaderFilter()

public/js/composables/Dashboard/CachedWidgetLoader.js

@@ -1,29 +1,36 @@
-let __widgets = {};
-let __widgetsStarted = {};
-let __path = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/dashboard/Widget';
+import ApiWidget from "../../api/factory/dashboard/widget.js";
 
-export default {
-	getWidget(id) {
-		return __widgets[id];
-	},
-	loadWidget(id) {
-		if (__widgets[id])
-			return Promise.resolve(__widgets[id]);
-		if (__widgetsStarted[id])
-			return __widgetsStarted[id];
-		if (!__path)
-			return Promise.reject('Widget could not be loaded because there is no path yet!');
+const promises = Vue.ref([]);
+const stateRef = Vue.ref([]);
+const state = Vue.readonly(stateRef);
 
-		__widgetsStarted[id] = new Promise((resolve, reject) => {
-			axios.get(__path, {params:{id}}).then(res => {
-				__widgets[id] = res.data.retval;
-				__widgetsStarted[id] = undefined;
-				resolve(__widgets[id]);
-			}).catch(error => reject(error.response.data.retval.error));
-		});
-		return __widgetsStarted[id];
-	},
-	setPath(path) {
-		__path = path;
+export function useCachedWidgetLoader() {
+	const $api = Vue.inject('$api');
+	const $fhcAlert = Vue.inject('$fhcAlert');
+
+	function load(id) {
+		if (state.value[id])
+			return Promise.resolve(state.value[id]);
+
+		if (!promises.value[id])
+			promises.value[id] = new Promise((resolve, reject) => {
+				$api
+					.call(ApiWidget.get(id))
+					.then(res => {
+						stateRef.value[id] = res.data;
+						promises.value[id] = undefined;
+						resolve(state.value[id]);
+					})
+					.catch($fhcAlert.handleSystemError);
+			});
+
+		return promises.value[id];
 	}
+
+	return {
+		state,
+		actions: {
+			load
+		}
+	};
 }

public/js/helpers/ObjectUtils.js

@@ -1,31 +1,72 @@
-export default {
-	/**
-	* Performs a deep merge of objects and returns new object. Does not modify
-	* objects (immutable) and merges arrays via concatenation.
-	*
-	* @param {...object} objects - Objects to merge
-	* @returns {object} New object with merged key/values
-	*/
-	mergeDeep(...objects) {
-		const isObject = obj => obj && typeof obj === 'object';
-		
-		return objects.reduce((prev, obj) => {
-			Object.keys(obj).forEach(key => {
-				const pVal = prev[key];
-				const oVal = obj[key];
-				
-				if (Array.isArray(pVal) && Array.isArray(oVal)) {
-					prev[key] = pVal.concat(...oVal);
-				}
-				else if (isObject(pVal) && isObject(oVal)) {
-					prev[key] = this.mergeDeep(pVal, oVal);
-				}
-				else {
-					prev[key] = oVal;
-				}
-			});
+/**
+ * Performs a deep merge of objects and returns new object. Does not modify
+ * objects (immutable) and merges arrays via concatenation.
+ *
+ * @param {...object} objects - Objects to merge
+ * @returns {object} New object with merged key/values
+ */
+function mergeDeep(...objects) {
+	const isObject = obj => obj && typeof obj === 'object';
+	
+	return objects.reduce((prev, obj) => {
+		Object.keys(obj).forEach(key => {
+			const pVal = prev[key];
+			const oVal = obj[key];
 			
-			return prev;
-		}, {});
-	}
+			if (Array.isArray(pVal) && Array.isArray(oVal)) {
+				prev[key] = pVal.concat(...oVal);
+			}
+			else if (isObject(pVal) && isObject(oVal)) {
+				prev[key] = this.mergeDeep(pVal, oVal);
+			}
+			else {
+				prev[key] = oVal;
+			}
+		});
+		
+		return prev;
+	}, {});
+}
+
+/**
+ * Extends VUEs toRaw() function to nested Proxies
+ * @see https://www.reddit.com/r/javascript/comments/10gzynk/deep_cloning_objects_in_javascript_the_modern_way/
+ *
+ * @param object		sourceObj - Object to transform
+ * @returns object
+ */
+function deepToRaw(sourceObj) {
+	const objectIterator = input => {
+		if (Array.isArray(input))
+			return input.map(objectIterator);
+		if (Vue.isRef(input) || Vue.isReactive(input) || Vue.isProxy(input))
+			return objectIterator(Vue.toRaw(input));
+		if (input && typeof input === 'object') {
+			/** use custom handling of 'Date' objects to avoid data loss if treating it like any other object.
+			 * reminder:
+			 * typeof (new Date())        ==> 'object'
+			 * Object.keys(new Date())    ==> []
+			 */
+			if (input instanceof Date)
+				return input;
+
+			return Object.keys(input).reduce((acc, key) => {
+				acc[key] = objectIterator(input[key]);
+				return acc;
+			}, {});
+		}
+
+		return input;
+	};
+	
+	return objectIterator(sourceObj);
+}
+
+export {
+	mergeDeep,
+	deepToRaw
+}
+export default {
+	mergeDeep,
+	deepToRaw
 }

public/js/plugins/Api.js

@@ -430,16 +430,16 @@ export default {
 
 		fhcApiAxios.interceptors.response.use(
 			response => {
-				if (response.config?.errorHandling == 'off'
-					|| response.config?.errorHandling === false
-					|| response.config?.errorHandling == 'fail')
+				const errorConfig = get_error_handler(response.config);
+
+				if (!errorConfig.success)
 					return clean_return_value(response);
 
-				// NOTE(chris): loop through errors
-				if (response.data.errors)
-					response.data.errors = response.data.errors.filter(
-						err => (response.config[err.type + 'ErrorHandler'] || app.config.globalProperties.$api._defaultErrorHandlers[err.type])(err, response.config)
-					);
+				const errors = popHandleableErrors(errorConfig, response.data.errors);
+
+				for (var type in errors) {
+					errorConfig.handler[type](errors[type]);
+				}
 
 				return clean_return_value(response);
 			},