always displaying timeslot on calendar event in list view

To make headings stand out more clearly from the buttons

application/config/searchcis.php

@@ -22,8 +22,9 @@ unset($config['student']['searchfields']['email']);
 unset($config['student']['searchfields']['tel']);
 $config['student']['resultfields'] = [
 	"s.student_uid AS uid",
-	"s.matrikelnr",
+	"s.matrikelnr AS personenkennzeichen",
 	"p.person_id",
+	"p.matr_nr AS matrikelnummer",
 	"(p.vorname || ' ' || p.nachname) AS name",
 	"ARRAY[s.student_uid || '@' || '" . DOMAIN . "'] AS email",
 	"CASE

application/controllers/Cis/Auth.php

@@ -40,7 +40,7 @@ class Auth extends FHC_Controller
 
 		if ($this->form_validation->run())
 		{
-			redirect($this->authlib->getLandingPage('/CisVue/Dashboard'));
+			redirect($this->authlib->getLandingPage('/Cis4'));
 		}
 		else
 		{

application/controllers/CisVue/Dashboard.php

@@ -1,43 +0,0 @@
-<?php
-
-if (! defined('BASEPATH')) exit('No direct script access allowed');
-
-/**
- *
- */
-class Dashboard extends Auth_Controller
-{
-	/**
-	 * Constructor
-	 */
-	public function __construct()
-	{
-		parent::__construct(
-			array(
-				'index' => 'dashboard/benutzer:r'
-			)
-		);
-	}
-
-	// -----------------------------------------------------------------------------------------------------------------
-	// Public methods
-
-	/**
-	 * @return void
-	 */
-	public function index()
-	{
-
-		$this->load->model('person/Person_model','PersonModel');
-		$personData = getData($this->PersonModel->getByUid(getAuthUID()))[0];
-
-		$viewData = array(
-			'uid' => getAuthUID(),
-			'name' => $personData->vorname,
-			'person_id' => $personData->person_id
-		);
-		
-		$this->load->view('CisRouterView/CisRouterView.php', ['viewData' => $viewData]);
-
-	}
-}

application/controllers/api/frontend/v1/Bookmark.php

@@ -18,6 +18,8 @@
 
 if (! defined('BASEPATH')) exit('No direct script access allowed');
 
+use \DateTime as DateTime;
+
 class Bookmark extends FHCAPI_Controller
 {
 
@@ -28,111 +30,162 @@ class Bookmark extends FHCAPI_Controller
 	{
 		parent::__construct([
 			'getBookmarks' => self::PERM_LOGGED,
-            'delete' => self::PERM_LOGGED,
-            'insert' => self::PERM_LOGGED,
+			'delete' => self::PERM_LOGGED,
+			'insert' => self::PERM_LOGGED,
 			'update' => self::PERM_LOGGED,
-        ]);
+			'changeOrder' => self::PERM_LOGGED
+		]);
 
 		$this->load->model('dashboard/Bookmark_model', 'BookmarkModel');
 
 		$this->uid = getAuthUID();
 		$this->pid = getAuthPersonID();
-
 	}
 
 	//------------------------------------------------------------------------------------------------------------------
 	// Public methods
 
 	
-    /**
-	 * gets the bookmarks associated to a user 
+	/**
+	 * gets the bookmarks associated to a user
 	 * @access public
 	 * @return void
 	 */
 	public function getBookmarks()
 	{
-        $this->BookmarkModel->addOrder("bookmark_id");
+		$this->BookmarkModel->addOrder("sort");
 		$bookmarks = $this->BookmarkModel->loadWhere(["uid"=>$this->uid]);
 
-        $bookmarks = $this->getDataOrTerminateWithError($bookmarks);
+		$bookmarks = $this->getDataOrTerminateWithError($bookmarks);
 
-        $this->terminateWithSuccess($bookmarks);
-    }
-
-    /**
-	 * deletes bookmark from associated user 
-	 * @access public
-	 * @return void
-	 */
-    public function delete($bookmark_id)
-	{
-        $bookmark = $this->BookmarkModel->load($bookmark_id);
-
-        $bookmark = current($this->getDataOrTerminateWithError($bookmark));
-
-        // only delete bookmark if the user is the owner of the bookmark
-        if($bookmark->uid == $this->uid || $this->permissionlib->isBerechtigt('admin')){
-
-            $delete_result = $this->BookmarkModel->delete($bookmark_id);
-
-            $delete_result = $this->getDataOrTerminateWithError($delete_result);
-
-            $this->terminateWithSuccess($delete_result);
-        }else{
-            $this->_outputAuthError(['delete' => ['admin:rw']]);
-        }
-    }
-
-    /**
-	 * inserts new bookmark into the bookmark table 
-	 * @access public
-	 * @return void
-	 */
-    public function insert()
-	{
-        // form validation
-        $this->load->library('form_validation');
-        $this->form_validation->set_rules('url', 'URL', 'required|valid_url|max_length[511]');
-        $this->form_validation->set_rules('title', 'Title', 'required|max_length[255]');
-        if($this->form_validation->run() == FALSE) $this->terminateWithValidationErrors($this->form_validation->error_array());
-
-        $url = $this->input->post('url',true);
-        $title = $this->input->post('title',true);
-        $tag = $this->input->post('tag', true);
-
-        $insert_into_result = $this->BookmarkModel->insert(['uid'=>$this->uid, 'url'=>$url, 'title'=>$title,'tag'=>$tag, 'insertvon'=>$this->uid, 'updateamum'=>NULL, 'updatevon'=>NULL]);
-
-        $insert_into_result = $this->getDataOrTerminateWithError($insert_into_result);
-
-        $this->terminateWithSuccess($insert_into_result);
-
-    }
+		$this->terminateWithSuccess($bookmarks);
+	}
 
 	/**
-	 * updates bookmark in the bookmark table 
+	 * deletes bookmark from associated user
 	 * @access public
 	 * @return void
 	 */
-    public function update($bookmark_id)
+	public function delete($bookmark_id)
 	{
-        // form validation
-        $this->load->library('form_validation');
-        $this->form_validation->set_rules('url', 'URL', 'required|valid_url|max_length[511]');
-        $this->form_validation->set_rules('title', 'Title', 'required|max_length[255]');
-        if($this->form_validation->run() == FALSE) $this->terminateWithValidationErrors($this->form_validation->error_array());
+		$bookmark = $this->BookmarkModel->load($bookmark_id);
 
-        $url = $this->input->post('url',true);
-        $title = $this->input->post('title',true);
+		$bookmark = current($this->getDataOrTerminateWithError($bookmark));
+
+		// only delete bookmark if the user is the owner of the bookmark
+		if ($bookmark->uid == $this->uid || $this->permissionlib->isBerechtigt('admin')) {
+			$delete_result = $this->BookmarkModel->delete($bookmark_id);
+
+			$delete_result = $this->getDataOrTerminateWithError($delete_result);
+
+			$this->terminateWithSuccess($delete_result);
+		} else {
+			$this->_outputAuthError(['delete' => ['admin:rw']]);
+		}
+	}
+
+	/**
+	 * inserts new bookmark into the bookmark table
+	 * @access public
+	 * @return void
+	 */
+	public function insert()
+	{
+		// form validation
+		$this->load->library('form_validation');
+		$this->form_validation->set_rules('url', 'URL', 'required|valid_url|max_length[511]');
+		$this->form_validation->set_rules('title', 'Title', 'required|max_length[255]');
+		if (!$this->form_validation->run())
+			$this->terminateWithValidationErrors($this->form_validation->error_array());
+
+		$url = $this->input->post('url', true);
+		$title = $this->input->post('title', true);
+		$tag = $this->input->post('tag', true);
+		if (is_array($tag)) {
+			$tag = json_encode($tag); // convert PHP array to JSON string
+		}
+		$sort = $this->input->post('sort', true);
+
+		$insert_into_result = $this->BookmarkModel->insert([
+			'uid' => $this->uid,
+			'url' => $url,
+			'title' => $title,
+			'tag' => $tag,
+			'insertvon' => $this->uid,
+			'updateamum' => null,
+			'updatevon' => null,
+			'sort' => $sort
+		]);
+
+		$insert_into_result = $this->getDataOrTerminateWithError($insert_into_result);
+
+		$this->terminateWithSuccess($insert_into_result);
+	}
+
+	/**
+	 * updates bookmark in the bookmark table
+	 * @access public
+	 * @return void
+	 */
+	public function update($bookmark_id)
+	{
+		// form validation
+		$this->load->library('form_validation');
+		$this->form_validation->set_rules('url', 'URL', 'required|valid_url|max_length[511]');
+		$this->form_validation->set_rules('title', 'Title', 'required|max_length[255]');
+		if (!$this->form_validation->run())
+			$this->terminateWithValidationErrors($this->form_validation->error_array());
+
+		$url = $this->input->post('url', true);
+		$title = $this->input->post('title', true);
+		$tag = $this->input->post('tag', true);
+		if (is_array($tag)) {
+			$tag = json_encode($tag);
+		}
 
 		$now = new DateTime();
 		$now = $now->format('Y-m-d H:i:s');
 
-        $update_result = $this->BookmarkModel->update($bookmark_id,['url'=>$url, 'title'=>$title,'updateamum'=>$now]);
+		$update_result = $this->BookmarkModel->update($bookmark_id, [
+			'url' => $url,
+			'title' => $title,
+			'tag' => $tag,
+			'updateamum' => $now
+		]);
 
-        $update_result = $this->getDataOrTerminateWithError($update_result);
+		$update_result = $this->getDataOrTerminateWithError($update_result);
 
-        $this->terminateWithSuccess($update_result);
+		$this->terminateWithSuccess($update_result);
+	}
 
-    }
+	/**
+	 * changes sort of two bookmarks in the bookmark table
+	 * @access public
+	 * @return void
+	 */
+	public function changeOrder($bookmark_id1, $bookmark_id2)
+	{
+		$update_result = [];
+
+		$result1 = $this->BookmarkModel->load($bookmark_id1);
+		$data1 = $this->getDataOrTerminateWithError($result1);
+		$sort1 = current($data1)->sort;
+
+		$result2 = $this->BookmarkModel->load(["bookmark_id"=>$bookmark_id2]);
+		$data2 = $this->getDataOrTerminateWithError($result2);
+		$sort2 = current($data2)->sort;
+
+		$update_result1 = $this->BookmarkModel->update($bookmark_id1, [
+			'sort' => $sort2
+		]);
+		$update_result[] = $this->getDataOrTerminateWithError($update_result1);
+
+		$update_result2 = $this->BookmarkModel->update($bookmark_id2, [
+			'sort' => $sort1
+		]);
+		$update_result[] = $this->getDataOrTerminateWithError($update_result2);
+
+		$this->terminateWithSuccess($update_result);
+	}
 }
 

application/controllers/api/frontend/v1/CisMenu.php

@@ -16,12 +16,13 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-if (! defined('BASEPATH')) exit('No direct script access allowed');
+if (!defined('BASEPATH'))
+	exit('No direct script access allowed');
 
 
 class CisMenu extends FHCAPI_Controller
 {
-	
+
 	/**
 	 * Object initialization
 	 */
@@ -31,28 +32,95 @@ class CisMenu extends FHCAPI_Controller
 			'getMenu' => self::PERM_LOGGED,
 		]);
 
-		
+
 
 	}
 
 	//------------------------------------------------------------------------------------------------------------------
 	// Public methods
 
-    /**
+	/**
 	 * fetches the menu for CIS from the database based on the userLanguage
 	 */
-    public function getMenu()
+	public function getMenu()
 	{
 		$this->load->model('content/Content_model', 'ContentModel');
 		$this->load->config('cis');
-		$cis4_content_id =$this->config->item('cis_menu_root_content_id');
-		$result = $this->ContentModel->getMenu($cis4_content_id, getAuthUID(),getUserLanguage());
+		$cis4_content_id = $this->config->item('cis_menu_root_content_id');
+		$result = $this->ContentModel->getMenu($cis4_content_id, getAuthUID(), getUserLanguage());
 		$result = $this->getDataOrTerminateWithError($result);
 		$menu = $result->childs ?? [];
-		$this->terminateWithSuccess($menu);
-    }
 
-	
-	
+		$menu = $this->generateUrlsForMenuItems($menu);
+		$this->terminateWithSuccess($menu);
+	}
+
+	private function generateUrlsForMenuItems($menuItems)
+	{
+		return array_map(
+			function ($menuItem) {
+				return $this->generateUrlForMenuItem($menuItem);
+			},
+			$menuItems
+		);
+	}
+
+	private function generateUrlForMenuItem($menuItem)
+	{
+		$menuItem->url = $this->menuItemUrlHelper($menuItem);
+		unset($menuItem->content);
+
+		if ($menuItem->childs && count($menuItem->childs)) {
+			$menuItem->childs = $this->generateUrlsForMenuItems($menuItem->childs);
+		}
+
+		return $menuItem;
+	}
+
+	private function menuItemUrlHelper($menuItem)
+	{
+		if ($menuItem->template_kurzbz !== 'redirect') {
+			return site_url("/CisVue/Cms/content/" . $menuItem->content_id);
+		}
+
+		if (!$menuItem->content || !mb_strlen($menuItem->content)) {
+			return '';
+		}
+
+		$doc = new DOMDocument();
+		$doc->loadXML($menuItem->content);
+		$urlElem = $doc->getElementsByTagName('url')->item(0);
+
+		if (!$urlElem) {
+			return '';
+		}
+
+		$url = $urlElem->textContent;
+
+		if (strpos($url, '../cms/news.php') !== false) {
+			$newsRegex = '/^\.\.\/cms\/news\.php/';
+			$url = preg_replace($newsRegex, site_url("/CisVue/Cms/news"), $url);
+		}
+
+		if (strpos($url, '../cms/content.php?') !== false) {
+			$contentRegex = '/^\.\.\/cms\/content\.php\?content_id=([0-9]+)/';
+			$matches = [];
+			preg_match($contentRegex, $url, $matches);
+			$url = site_url('/CisVue/Cms/content/' . $matches[1]);
+		}
+
+		if (strpos($url, '../index.ci.php') !== false) {
+			$indexRegex = '/^\.\.\/index\.ci\.php/';
+			$url = preg_replace($indexRegex, site_url(), $url);
+		}
+
+		if (strpos($url, '../') !== false) {
+			$relativeRegex = '/^\.\.\//';
+			$url = preg_replace($relativeRegex, base_url(), $url);
+		}
+
+		return $url;
+	}
+
 }
 

application/controllers/api/frontend/v1/Lehre.php

@@ -38,7 +38,8 @@ class Lehre extends FHCAPI_Controller
 		parent::__construct([
 			'lvStudentenMail' => self::PERM_LOGGED,
 			'LV' => self::PERM_LOGGED,
-			'Pruefungen' => self::PERM_LOGGED
+			'Pruefungen' => self::PERM_LOGGED,
+			'semesterAverageGrade' => self::PERM_LOGGED,
 		]);
 		
 	}
@@ -100,5 +101,49 @@ class Lehre extends FHCAPI_Controller
 
 		$this->terminateWithSuccess($result);
 	}
+
+	/**
+	 * calculates and returns the grade average and weighted average for a specific semester
+	 * @param string $studiensemester_kurzbz
+	 * @return void
+	 */
+
+	public function semesterAverageGrade($studiensemester_kurzbz)
+	{
+		$this->load->model('education/Lehrveranstaltung_model', 'LehrveranstaltungModel');
+		$semesterLvs = $this->LehrveranstaltungModel->getLvsByStudentWithGrades(getAuthUID(), $studiensemester_kurzbz, getUserLanguage());
+
+		if (isError($semesterLvs))
+			return $this->outputJsonError(getError($semesterLvs));
+
+		$semesterLvsData = getData($semesterLvs);
+
+		$doGradesExist = false;
+		$sum = 0;
+		$count = 0;
+		$sumWeighted = 0;
+		$sumEcts = 0;
+
+		foreach ($semesterLvsData as $lv) {
+			if (!$lv->znote || $lv->znote < 1 || $lv->znote > 5)
+				continue;
+
+			$doGradesExist = true;
+
+			$sum += $lv->znote;
+			$count++;
+			$sumWeighted += $lv->znote * floatval($lv->ects);
+			$sumEcts += floatval($lv->ects);
+		}
+
+		$averageGrade = null;
+		$weightedAverageGrade = null;
+		if ($doGradesExist) {
+			$averageGrade = $sum/$count;
+			$weightedAverageGrade = $sumWeighted/$sumEcts;
+		}
+
+		$this->terminateWithSuccess(['average_grade' => $averageGrade, 'weighted_average_grade' => $weightedAverageGrade]);
+	}
 }
 

application/controllers/api/frontend/v1/LvPlan.php

@@ -48,6 +48,7 @@ class LvPlan extends FHCAPI_Controller
 			'getStudiengaenge' => self::PERM_LOGGED,
 			'getLehrverband' => self::PERM_LOGGED,
 			'permissionOtherLvPlan' => self::PERM_LOGGED,
+			'compactibleEventTypes' => self::PERM_LOGGED,
 		]);
 
 		$this->load->library('LogLib');
@@ -98,7 +99,7 @@ class LvPlan extends FHCAPI_Controller
 		$end_date = $this->input->post('end_date', true);
 		$uid = $this->input->post('uid', true);
 
-		// disallow accessing other user's lv plan if missing permission
+		// disallow accessing other user's events if missing permission
 		if ($uid && $uid !== getAuthUID() && !$this->permissionlib->isBerechtigt('basis/other_lv_plan')) {
 			$this->terminateWithError("Missing permission to view other users' timetables!");
 		}
@@ -108,7 +109,7 @@ class LvPlan extends FHCAPI_Controller
 		$lvplanEvents = $this->getDataOrTerminateWithError($result);
 
 		// fetching moodle events
-		$moodleEvents = $uid ? [] : $this->fetchMoodleEvents($start_date, $end_date);
+		$moodleEvents = $this->fetchMoodleEvents($start_date, $end_date, $uid);
 
 		// fetching ferien events
 		$ferienEvents = $this->fetchFerienEvents($start_date, $end_date, $uid);
@@ -287,6 +288,11 @@ class LvPlan extends FHCAPI_Controller
 		$end_date = $this->input->post('end_date', true);
 		$uid = $this->input->post('uid', true);
 
+		// disallow accessing other user's reservierungen if missing permission
+		if ($uid && $uid !== getAuthUID() && !$this->permissionlib->isBerechtigt('basis/other_lv_plan')) {
+			$this->terminateWithError("Missing permission to view other users' timetables!");
+		}
+
 		// get data
 		$this->load->library('StundenplanLib');
 
@@ -393,6 +399,16 @@ class LvPlan extends FHCAPI_Controller
 		$this->terminateWithSuccess($this->permissionlib->isBerechtigt('basis/other_lv_plan'));
 	}
 
+	/**
+	 * get event types which can be compacted in lv plan display
+	 *
+	 * @return void
+	 */
+	public function compactibleEventTypes()
+	{
+		$this->terminateWithSuccess(["lehreinheit", "reservierung", "ferien", "moodle"]);
+	}
+
 	/**
 	 * fetch moodle events
 	 *
@@ -400,7 +416,7 @@ class LvPlan extends FHCAPI_Controller
 	 * @param string		$end_date
 	 * @return array
 	 */
-	private function fetchMoodleEvents($start_date, $end_date)
+	private function fetchMoodleEvents($start_date, $end_date, $uid = null)
 	{
 		$this->load->config('calendar');
 
@@ -423,7 +439,7 @@ class LvPlan extends FHCAPI_Controller
 			[
 				'start_date' => $start->format('c'),
 				'end_date' => $end->format('c'),
-				'username' => getAuthUID()
+				'username' => $uid ?? getAuthUID()
 			]
 		);
 

application/controllers/api/frontend/v1/Studium.php

@@ -62,21 +62,36 @@ class Studium extends FHCAPI_Controller
 
 		if($this->getDataOrTerminateWithError($this->StudentModel->isStudent(getAuthUID()))){
 			$studentLehrverband =$this->StudentlehrverbandModel->loadWhere(["student_uid" => getAuthUID(), "studiensemester_kurzbz" => $aktuelles_studiensemester->studiensemester_kurzbz]);
-			$studentLehrverband = current($this->getDataOrTerminateWithError($studentLehrverband));
-			
-			$student_studiensemester = $studentLehrverband->studiensemester_kurzbz;
-			$student_studiengang = $studentLehrverband->studiengang_kz;
-			$student_semester = $studentLehrverband->semester;
+
+			//TODO(Manu) check if use Fallback or just comment out all paramschecks?
+			//add Fallback: if no LehrverbandData of actual semester, get Data of previous one
+			if(!hasData($studentLehrverband))
+			{
+				$result= $this->StudiensemesterModel->getPreviousFrom($aktuelles_studiensemester->studiensemester_kurzbz);
+
+				$data = $this->getDataOrTerminateWithError($result);
+				$vorheriges_studiensemester = current($data)->studiensemester_kurzbz;
+				$studentLehrverband =$this->StudentlehrverbandModel->loadWhere(["student_uid" => getAuthUID(), "studiensemester_kurzbz" => $vorheriges_studiensemester]);
+			}
+			$studentLehrverband = current(getData($studentLehrverband));
+
 			$student_studienplan = $this->getStudienPlanFromPrestudentStatus(getAuthPersonId())->studienplan_id;
 			
-			if(!isset($parameter_studiensemester))
-			$parameter_studiensemester = $student_studiensemester;
-			if(!isset($parameter_studiengang))
-			$parameter_studiengang = $student_studiengang;
-			if(!isset($parameter_semester))
-			$parameter_semester = $student_semester;
+			if(!isset($parameter_studiensemester)) {
+				$student_studiensemester = $studentLehrverband->studiensemester_kurzbz;
+				$parameter_studiensemester = $student_studiensemester;
+			}
+			if(!isset($parameter_studiengang)) {
+				$student_studiengang = $studentLehrverband->studiengang_kz;
+				$parameter_studiengang = $student_studiengang;
+			}
+			if(!isset($parameter_semester)) {
+				$student_semester = $studentLehrverband->semester;
+				$parameter_semester = $student_semester;
+			}
 			if(!isset($parameter_studienplan))
-			$parameter_studienplan = $student_studienplan;
+				$parameter_studienplan = $student_studienplan;
+
 		}  
 
 		if(isset($parameter_studiensemester)){
@@ -96,8 +111,7 @@ class Studium extends FHCAPI_Controller
 
 		// fetch studiensemester
 		$allStudienSemester = $this->getDataOrTerminateWithError($this->StudiensemesterModel->load());
-		
-		
+
 		if(isset($parameter_studiensemester) && !empty(array_filter($allStudienSemester, function($studiensemester) use($parameter_studiensemester){
 			return $studiensemester->studiensemester_kurzbz == $parameter_studiensemester->studiensemester_kurzbz;
 		}))){
@@ -216,6 +230,8 @@ class Studium extends FHCAPI_Controller
 		$studienplaene = array_map(function($studienplan){
 			$orgform = current($this->getDataOrTerminateWithError($this->OrgformModel->loadWhere(["orgform_kurzbz" => $studienplan->orgform_kurzbz])));
 			$studienplan->orgform_bezeichnung = $orgform->bezeichnung;
+			// bezeichnung_mehrsprachig
+			$studienplan->orgform_bezeichnung_english = $orgform->bezeichnung_mehrsprachig[1];
 			return $studienplan;
 		},$studienplaene);
 		return $studienplaene;

application/controllers/api/frontend/v1/dashboard/Board.php

@@ -40,11 +40,32 @@ class Board extends FHCAPI_Controller
 
 	public function list()
 	{
+		$this->DashboardModel->addSelect('dashboard_id');
+		$this->DashboardModel->addSelect('dashboard_kurzbz');
+		$this->DashboardModel->addSelect('tbl_dashboard.beschreibung');
+		$this->DashboardModel->addSelect("(
+			SELECT json_agg(w.*) 
+			FROM dashboard.tbl_widget w 
+			JOIN dashboard.tbl_dashboard_widget dw 
+			USING(widget_id) 
+			WHERE dw.dashboard_id=tbl_dashboard.dashboard_id
+		) AS \"widgetSetup\"");
+
 		$result = $this->DashboardModel->load();
 
 		$data = $this->getDataOrTerminateWithError($result);
 
-		$this->terminateWithSuccess($result);
+		$data = array_map(function ($dashboard) {
+			$tmpSetups = json_decode($dashboard->widgetSetup);
+			$tmpSetups = array_map(function ($widget) {
+				$widget->setup->file = absoluteJsImportUrl($widget->setup->file);
+				return $widget;
+			}, $tmpSetups);
+			$dashboard->widgetSetup = $tmpSetups;
+			return $dashboard;
+		}, $data);
+
+		$this->terminateWithSuccess($data);
 	}
 
 	public function create()
@@ -82,7 +103,7 @@ class Board extends FHCAPI_Controller
 
 		$data = $this->getDataOrTerminateWithError($result);
 
-		$this->terminateWithSuccess($result);
+		$this->terminateWithSuccess($data);
 	}
 
 	public function delete()
@@ -116,6 +137,6 @@ class Board extends FHCAPI_Controller
 
 		$data = $this->getDataOrTerminateWithError($result);
 
-		$this->terminateWithSuccess($result);
+		$this->terminateWithSuccess($data);
 	}
 }

application/controllers/api/frontend/v1/dashboard/Preset.php

@@ -120,10 +120,7 @@ class Preset extends FHCAPI_Controller
 			$conf = $this->dashboardlib->getPreset($db, $funktion);
 			if ($conf) {
 				$preset = json_decode($conf->preset, true);
-				if (!isset($preset[$funktion]) || !isset($preset[$funktion]['widgets']))
-					$result[$funktion] = [];
-				else
-					$result[$funktion] = $preset[$funktion]['widgets'];
+				$result[$funktion] = $preset;
 			} else {
 				$result[$funktion] = [];
 			}
@@ -154,7 +151,7 @@ class Preset extends FHCAPI_Controller
 
 		$preset_decoded = json_decode($preset->preset, true);
 		
-		$this->dashboardlib->addWidgetsToWidgets($preset_decoded, $dashboard_kurzbz, $funktion_kurzbz, [$widget]);
+		$preset_decoded[$widget['widgetid']] = $widget;
 
 		$preset->preset = json_encode($preset_decoded);
 
@@ -186,8 +183,10 @@ class Preset extends FHCAPI_Controller
 
 		$preset_decoded = json_decode($preset->preset, true);
 
-		if (!$this->dashboardlib->removeWidgetFromWidgets($preset_decoded, $funktion_kurzbz, $widgetid))
+		if (!isset($preset_decoded[$widgetid]))
 			show_404();
+		
+		unset($preset_decoded[$widgetid]);
 
 		$preset->preset = json_encode($preset_decoded);
 

application/controllers/api/frontend/v1/dashboard/User.php

@@ -48,25 +48,9 @@ class User extends FHCAPI_Controller
 		
 		$uid = $this->authlib->getAuthObj()->username;
 
-		/*$mergedconfig = $this->dashboardlib->getMergedConfig($dashboard->dashboard_id, $uid);
+		$mergedconfig = $this->dashboardlib->getMergedUserConfig($dashboard->dashboard_id, $uid);
 
-		$this->terminateWithSuccess([
-			'general' => call_user_func_array(
-				'array_merge_recursive',
-				$mergedconfig
-			)
-		]);*/
-		$defaultconfig = $this->dashboardlib->getDefaultConfig($dashboard->dashboard_id);
-		$userconfig = $this->dashboardlib->getUserConfig($dashboard->dashboard_id, $uid);
-
-		$defaultconfig_squashed = $defaultconfig ? call_user_func_array('array_replace_recursive', $defaultconfig) : [];
-		$userconfig_squashed = $userconfig ? call_user_func_array('array_replace_recursive', $userconfig) : [];
-
-		$mergedconfig = array_replace_recursive($defaultconfig_squashed, $userconfig_squashed);
-
-		$this->terminateWithSuccess([
-			DashboardLib::SECTION_IF_FUNKTION_KURZBZ_IS_NULL => $mergedconfig
-		]);
+		$this->terminateWithSuccess($mergedconfig);
 	}
 
 	public function addWidget()
@@ -86,26 +70,15 @@ class User extends FHCAPI_Controller
 		if (!isset($widget['widgetid']))
 			$widget['widgetid'] = $this->dashboardlib->generateWidgetId($dashboard_kurzbz);
 
+		if (isset($widget['source']))
+			unset($widget['source']);
+
 		$override = $this->dashboardlib->getOverrideOrCreateEmptyOverride($dashboard_kurzbz, $uid);
-		
+
 		$override_decoded = json_decode($override->override, true);
 
-		if (!isset($override_decoded['general']) || !is_array($override_decoded['general']))
-			$override_decoded['general'] = [];
+		$override_decoded[$widget['widgetid']] = $widget;
 
-		 if (!isset($override_decoded['general']['widgets']))
-				$override_decoded['general']['widgets'] = [];
-
-		$override_decoded['general']['widgets'][$widget['widgetid']] = $widget;
-
-		// NOTE(chris): remove doubles in other funktionen
-		foreach ($override_decoded as $funktion => $array) {
-			if ($funktion == 'general')
-				continue;
-			if (isset($array['widgets']) && isset($array['widgets'][$widget['widgetid']]))
-				unset($override_decoded[$funktion]['widgets'][$widget['widgetid']]);
-		}
-		
 		$override->override = json_encode($override_decoded);
 				
 		$result = $this->dashboardlib->insertOrUpdateOverride($override);
@@ -135,18 +108,10 @@ class User extends FHCAPI_Controller
 		
 		$override_decoded = json_decode($override->override, true);
 
-		foreach (array_keys($override_decoded) as $k) {
-			if (!isset($override_decoded[$k]["widgets"])) {
-				unset($override_decoded[$k]);
-				continue;
-			}
-			if (isset($override_decoded[$k]["widgets"][$widget_id])) {
-				unset($override_decoded[$k]["widgets"][$widget_id]);
-			}
-			if (!$override_decoded[$k]["widgets"]) {
-				unset($override_decoded[$k]);
-			}
-		}
+		if (!isset($override_decoded[$widget_id]))
+			show_404();
+		
+		unset($override_decoded[$widget_id]);
 
 		$override->override = json_encode($override_decoded);
 				

application/controllers/api/frontend/v1/stv/Dokumente.php

@@ -78,52 +78,32 @@ class Dokumente extends FHCAPI_Controller
 			$this->terminateWithError($this->p->t('ui', 'errorMissingValue', ['value' => 'Studiengang_kz']), self::ERROR_TYPE_GENERAL);
 
 		$resultPreDoc = $this->_getPrestudentDokumente($prestudent_id);
-
-		$arrayAccepted = [];
 		$person_id = $this->_getPersonId($prestudent_id);
 
-		$docNames = array_map(function ($item) {
-			return $item->dokument_kurzbz;
-		}, $resultPreDoc);
+		$mergedArray = [];
 
-		foreach($docNames as $doc)
+		foreach ($resultPreDoc as $pre)
 		{
-			$result = $this->AkteModel->getAktenFAS($person_id, $doc, $studiengang_kz, $prestudent_id, true);
+			$result = $this->AkteModel->getAktenFAS($person_id, $pre->dokument_kurzbz, $studiengang_kz, $prestudent_id, true);
 
 			if (isError($result))
-			{
 				return $this->terminateWithError($result, self::ERROR_TYPE_GENERAL);
-			}
+
 			if (hasData($result))
 			{
-				$data = getData($result);
-				foreach ($data as $value)
+				foreach (getData($result) as $doc)
 				{
-					array_push($arrayAccepted, $value);
+					$merged = clone $doc;
+					$merged->docdatum = $pre->docdatum;
+					$merged->insertvonma = $pre->insertvonma;
+					$merged->bezeichnung = $pre->bezeichnung;
+					$mergedArray[] = $merged;
 				}
 			}
-		}
-
-		//Mapping with document_kurzbz
-		$preDocMap = [];
-		foreach ($resultPreDoc as $pre) {
-			$preDocMap[$pre->dokument_kurzbz] = $pre;
-		}
-
-		$mergedArray = [];
-		foreach ($arrayAccepted as $doc) {
-			$merged = clone $doc;
-
-			if (isset($preDocMap[$doc->dokument_kurzbz])) {
-				$merged->docdatum = $preDocMap[$doc->dokument_kurzbz]->docdatum;
-				$merged->insertvonma = $preDocMap[$doc->dokument_kurzbz]->insertvonma;
-				$merged->bezeichnung = $preDocMap[$doc->dokument_kurzbz]->bezeichnung;
-			} else {
-				$merged->akzeptiertdatum = null;
-				$merged->akzeptiertvon = null;
+			else
+			{
+				$mergedArray[] = $pre;
 			}
-
-			$mergedArray[] = $merged;
 		}
 
 		$this->terminateWithSuccess($mergedArray);

application/controllers/api/frontend/v1/stv/Konto.php

@@ -48,7 +48,8 @@ class Konto extends FHCAPI_Controller
 
 		// Load language phrases
 		$this->loadPhrases([
-			'konto'
+			'konto',
+			'lehre'
 		]);
 	}
 
@@ -112,7 +113,7 @@ class Konto extends FHCAPI_Controller
 	 *
 	 * @return void
 	 */
-	public function getBuchungstypen()
+	public function getBuchungstypen($studiensemester_kurzbz = null)
 	{
 		$this->load->model('crm/Buchungstyp_model', 'BuchungstypModel');
 
@@ -122,6 +123,7 @@ class Konto extends FHCAPI_Controller
 
 		$data = $this->getDataOrTerminateWithError($result);
 
+		$this->_getOEHBeitrag($data, $studiensemester_kurzbz);
 		$this->terminateWithSuccess($data);
 	}
 
@@ -494,4 +496,43 @@ class Konto extends FHCAPI_Controller
 
 		$this->terminateWithSuccess();
 	}
+
+	private function _getOEHBeitrag(&$data, $studiensemester_kurzbz = null)
+	{
+		if (is_null($studiensemester_kurzbz))
+		{
+			$this->load->library('VariableLib', ['uid' => getAuthUID()]);
+			$studiensemester_akt = $this->variablelib->getVar('semester_aktuell');
+		}
+		else
+		{
+			$this->load->model('organisation/Studiensemester_model', 'StudiensemesterModel');
+			if ($this->StudiensemesterModel->isValidStudiensemester($studiensemester_kurzbz))
+				$studiensemester_akt = $studiensemester_kurzbz;
+			else
+				$this->terminateWithError($this->p->t('lehre', 'error_noStudiensemester'));
+		}
+
+		$this->load->model('codex/Oehbeitrag_model', 'OehbeitragModel');
+		$oehBeitrag = $this->OehbeitragModel->getByStudiensemester($studiensemester_akt);
+
+		$oehStandardbetrag = null;
+		if (hasData($oehBeitrag))
+		{
+			$oeh = getData($oehBeitrag)[0];
+			$summe = ($oeh->studierendenbeitrag + $oeh->versicherung) * -1;
+			$oehStandardbetrag = number_format((float)$summe, 2, '.', '');
+		}
+
+		if ($oehStandardbetrag !== null)
+		{
+			$data = array_map(function ($buchungstyp) use ($oehStandardbetrag) {
+				if (isset($buchungstyp->buchungstyp_kurzbz) && (strtolower($buchungstyp->buchungstyp_kurzbz) === 'oeh'))
+				{
+					$buchungstyp->standardbetrag = $oehStandardbetrag;
+				}
+				return $buchungstyp;
+			}, $data);
+		}
+	}
 }

application/core/Notiz_Controller.php

@@ -417,6 +417,7 @@ abstract class Notiz_Controller extends FHCAPI_Controller
 		$notiz_id = $this->input->post('notiz_id');
 
 		$this->NotizModel->addSelect('campus.tbl_dms_version.*');
+		$this->NotizModel->addSelect($this->NotizModel->escape(base_url('content/notizdokdownload.php?id=')) . ' || public.tbl_notiz_dokument.dms_id AS preview');
 
 		$this->NotizModel->addJoin('public.tbl_notiz_dokument', 'ON (public.tbl_notiz_dokument.notiz_id = public.tbl_notiz.notiz_id)');
 		$this->NotizModel->addJoin('campus.tbl_dms_version', 'ON (public.tbl_notiz_dokument.dms_id = campus.tbl_dms_version.dms_id)');

application/development/config.php

@@ -1,517 +0,0 @@
-<?php
-if (! defined('BASEPATH')) exit('No direct script access allowed');
-
-/*
-|--------------------------------------------------------------------------
-| Base Site URL
-|--------------------------------------------------------------------------
-|
-| URL to your CodeIgniter root. Typically this will be your base URL,
-| WITH a trailing slash:
-|
-|	http://example.com/
-|
-| If this is not set then CodeIgniter will try guess the protocol, domain
-| and path to your installation. However, you should always configure this
-| explicitly and never rely on auto-guessing, especially in production
-| environments.
-|
-*/
-$config['base_url'] = 'https://c3p0.dev.technikum-wien.at/ma1434/core/FHC-Core/';
-
-/*
-|--------------------------------------------------------------------------
-| Index File
-|--------------------------------------------------------------------------
-|
-| Typically this will be your index.php file, unless you've renamed it to
-| something else. If you are using mod_rewrite to remove the page set this
-| variable so that it is blank.
-|
-*/
-$config['index_page'] = 'index.ci.php';
-
-/*
-|--------------------------------------------------------------------------
-| URI PROTOCOL
-|--------------------------------------------------------------------------
-|
-| This item determines which server global should be used to retrieve the
-| URI string.  The default setting of 'REQUEST_URI' works for most servers.
-| If your links do not seem to work, try one of the other delicious flavors:
-|
-| 'REQUEST_URI'    Uses $_SERVER['REQUEST_URI']
-| 'QUERY_STRING'   Uses $_SERVER['QUERY_STRING']
-| 'PATH_INFO'      Uses $_SERVER['PATH_INFO']
-|
-| WARNING: If you set this to 'PATH_INFO', URIs will always be URL-decoded!
-*/
-$config['uri_protocol']	= 'REQUEST_URI';
-
-/*
-|--------------------------------------------------------------------------
-| URL suffix
-|--------------------------------------------------------------------------
-|
-| This option allows you to add a suffix to all URLs generated by CodeIgniter.
-| For more information please see the user guide:
-|
-| http://codeigniter.com/user_guide/general/urls.html
-*/
-$config['url_suffix'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| Default Language
-|--------------------------------------------------------------------------
-|
-| This determines which set of language files should be used. Make sure
-| there is an available translation if you intend to use something other
-| than english.
-|
-*/
-$config['language']	= '';
-
-/*
-|--------------------------------------------------------------------------
-| Default Character Set
-|--------------------------------------------------------------------------
-|
-| This determines which character set is used by default in various methods
-| that require a character set to be provided.
-|
-| See http://php.net/htmlspecialchars for a list of supported charsets.
-|
-*/
-$config['charset'] = 'UTF-8';
-
-/*
-|--------------------------------------------------------------------------
-| Enable/Disable System Hooks
-|--------------------------------------------------------------------------
-|
-| If you would like to use the 'hooks' feature you must enable it by
-| setting this variable to TRUE (boolean).  See the user guide for details.
-|
-*/
-$config['enable_hooks'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Class Extension Prefix
-|--------------------------------------------------------------------------
-|
-| This item allows you to set the filename/classname prefix when extending
-| native libraries.  For more information please see the user guide:
-|
-| http://codeigniter.com/user_guide/general/core_classes.html
-| http://codeigniter.com/user_guide/general/creating_libraries.html
-|
-*/
-$config['subclass_prefix'] = 'FHC_';
-
-/*
-|--------------------------------------------------------------------------
-| Composer auto-loading
-|--------------------------------------------------------------------------
-|
-| Enabling this setting will tell CodeIgniter to look for a Composer
-| package auto-loader script in application/vendor/autoload.php.
-|
-|	$config['composer_autoload'] = TRUE;
-|
-| Or if you have your vendor/ directory located somewhere else, you
-| can opt to set a specific path as well:
-|
-|	$config['composer_autoload'] = '/path/to/vendor/autoload.php';
-|
-| For more information about Composer, please visit http://getcomposer.org/
-|
-| Note: This will NOT disable or override the CodeIgniter-specific
-|	autoloading (application/config/autoload.php)
-*/
-$config['composer_autoload'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Allowed URL Characters
-|--------------------------------------------------------------------------
-|
-| This lets you specify which characters are permitted within your URLs.
-| When someone tries to submit a URL with disallowed characters they will
-| get a warning message.
-|
-| As a security measure you are STRONGLY encouraged to restrict URLs to
-| as few characters as possible.  By default only these are allowed: a-z 0-9~%.:_-
-|
-| Leave blank to allow all characters -- but only if you are insane.
-|
-| The configured value is actually a regular expression character group
-| and it will be executed as: ! preg_match('/^[<permitted_uri_chars>]+$/i
-|
-| DO NOT CHANGE THIS UNLESS YOU FULLY UNDERSTAND THE REPERCUSSIONS!!
-|
-*/
-$config['permitted_uri_chars'] = 'a-z 0-9~%.:_\-';
-
-/*
-|--------------------------------------------------------------------------
-| Enable Query Strings
-|--------------------------------------------------------------------------
-|
-| By default CodeIgniter uses search-engine friendly segment based URLs:
-| example.com/who/what/where/
-|
-| By default CodeIgniter enables access to the $_GET array.  If for some
-| reason you would like to disable it, set 'allow_get_array' to FALSE.
-|
-| You can optionally enable standard query string based URLs:
-| example.com?who=me&what=something&where=here
-|
-| Options are: TRUE or FALSE (boolean)
-|
-| The other items let you set the query string 'words' that will
-| invoke your controllers and its functions:
-| example.com/index.php?c=controller&m=function
-|
-| Please note that some of the helpers won't work as expected when
-| this feature is enabled, since CodeIgniter is designed primarily to
-| use segment based URLs.
-|
-*/
-$config['allow_get_array'] = TRUE;
-$config['enable_query_strings'] = FALSE;
-$config['controller_trigger'] = 'c';
-$config['function_trigger'] = 'm';
-$config['directory_trigger'] = 'd';
-
-/*
-|--------------------------------------------------------------------------
-| Error Logging Threshold
-|--------------------------------------------------------------------------
-|
-| You can enable error logging by setting a threshold over zero. The
-| threshold determines what gets logged. Threshold options are:
-|
-|	0 = Disables logging, Error logging TURNED OFF
-|	1 = Error Messages (including PHP errors)
-|	2 = Debug Messages
-|	3 = Informational Messages
-|	4 = All Messages
-|
-| You can also pass an array with threshold levels to show individual error types
-|
-| 	array(2) = Debug Messages, without Error Messages
-|
-| For a live site you'll usually only enable Errors (1) to be logged otherwise
-| your log files will fill up very fast.
-|
-*/
-$config['log_threshold'] = 1;
-
-/*
-|--------------------------------------------------------------------------
-| Error Logging Directory Path
-|--------------------------------------------------------------------------
-|
-| Leave this BLANK unless you would like to set something other than the default
-| application/logs/ directory. Use a full server path with trailing slash.
-|
-*/
-$config['log_path'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| Log File Extension
-|--------------------------------------------------------------------------
-|
-| The default filename extension for log files. The default 'php' allows for
-| protecting the log files via basic scripting, when they are to be stored
-| under a publicly accessible directory.
-|
-| Note: Leaving it blank will default to 'php'.
-|
-*/
-$config['log_file_extension'] = 'log';
-
-/*
-|--------------------------------------------------------------------------
-| Log File Permissions
-|--------------------------------------------------------------------------
-|
-| The file system permissions to be applied on newly created log files.
-|
-| IMPORTANT: This MUST be an integer (no quotes) and you MUST use octal
-|            integer notation (i.e. 0700, 0644, etc.)
-*/
-$config['log_file_permissions'] = 0644;
-
-/*
-|--------------------------------------------------------------------------
-| Date Format for Logs
-|--------------------------------------------------------------------------
-|
-| Each item that is logged has an associated date. You can use PHP date
-| codes to set your own date formatting
-|
-*/
-$config['log_date_format'] = 'Y-m-d H:i:s';
-
-/*
-|--------------------------------------------------------------------------
-| Error Views Directory Path
-|--------------------------------------------------------------------------
-|
-| Leave this BLANK unless you would like to set something other than the default
-| application/views/errors/ directory.  Use a full server path with trailing slash.
-|
-*/
-$config['error_views_path'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| Cache Directory Path
-|--------------------------------------------------------------------------
-|
-| Leave this BLANK unless you would like to set something other than the default
-| application/cache/ directory.  Use a full server path with trailing slash.
-|
-*/
-$config['cache_path'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| Cache Include Query String
-|--------------------------------------------------------------------------
-|
-| Whether to take the URL query string into consideration when generating
-| output cache files. Valid options are:
-|
-|	FALSE      = Disabled
-|	TRUE       = Enabled, take all query parameters into account.
-|	             Please be aware that this may result in numerous cache
-|	             files generated for the same page over and over again.
-|	array('q') = Enabled, but only take into account the specified list
-|	             of query parameters.
-|
-*/
-$config['cache_query_string'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Encryption Key
-|--------------------------------------------------------------------------
-|
-| If you use the Encryption class, you must set an encryption key.
-| See the user guide for more info.
-|
-| http://codeigniter.com/user_guide/libraries/encryption.html
-|
-*/
-$config['encryption_key'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| Session Variables
-|--------------------------------------------------------------------------
-|
-| 'sess_driver'
-|
-|	The storage driver to use: files, database, redis, memcached
-|
-| 'sess_cookie_name'
-|
-|	The session cookie name, must contain only [0-9a-z_-] characters
-|
-| 'sess_expiration'
-|
-|	The number of SECONDS you want the session to last.
-|	Setting to 0 (zero) means expire when the browser is closed.
-|
-| 'sess_save_path'
-|
-|	The location to save sessions to, driver dependent.
-|
-|	For the 'files' driver, it's a path to a writable directory.
-|	WARNING: Only absolute paths are supported!
-|
-|	For the 'database' driver, it's a table name.
-|	Please read up the manual for the format with other session drivers.
-|
-|	IMPORTANT: You are REQUIRED to set a valid save path!
-|
-| 'sess_match_ip'
-|
-|	Whether to match the user's IP address when reading the session data.
-|
-| 'sess_time_to_update'
-|
-|	How many seconds between CI regenerating the session ID.
-|	NOTE: Keep it as it is to prevent security issues (https://en.wikipedia.org/wiki/Session_fixation)
-|
-| 'sess_regenerate_destroy'
-|
-|	Whether to destroy session data associated with the old session ID
-|	when auto-regenerating the session ID. When set to FALSE, the data
-|	will be later deleted by the garbage collector.
-|
-| Other session cookie settings are shared with the rest of the application,
-| except for 'cookie_prefix' and 'cookie_httponly', which are ignored here.
-|
-*/
-$config['sess_driver'] = 'files';
-$config['sess_cookie_name'] = 'sess_ci_session';
-$config['sess_expiration'] = 1800; // Session expires every 30 minutes
-$config['sess_save_path'] = NULL;
-$config['sess_match_ip'] = FALSE;
-$config['sess_time_to_update'] = 300;
-$config['sess_regenerate_destroy'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Cookie Related Variables
-|--------------------------------------------------------------------------
-|
-| 'cookie_prefix'   = Set a cookie name prefix if you need to avoid collisions
-| 'cookie_domain'   = Set to .your-domain.com for site-wide cookies
-| 'cookie_path'     = Typically will be a forward slash
-| 'cookie_secure'   = Cookie will only be set if a secure HTTPS connection exists.
-| 'cookie_httponly' = Cookie will only be accessible via HTTP(S) (no javascript)
-|
-| Note: These settings (with the exception of 'cookie_prefix' and
-|       'cookie_httponly') will also affect sessions.
-|
-*/
-$config['cookie_prefix']	= '';
-$config['cookie_domain']	= '';
-$config['cookie_path']		= '/';
-$config['cookie_secure']	= FALSE;
-$config['cookie_httponly'] 	= FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Standardize newlines
-|--------------------------------------------------------------------------
-|
-| Determines whether to standardize newline characters in input data,
-| meaning to replace \r\n, \r, \n occurrences with the PHP_EOL value.
-|
-| This is particularly useful for portability between UNIX-based OSes,
-| (usually \n) and Windows (\r\n).
-|
-*/
-$config['standardize_newlines'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Global XSS Filtering
-|--------------------------------------------------------------------------
-|
-| Determines whether the XSS filter is always active when GET, POST or
-| COOKIE data is encountered
-|
-| WARNING: This feature is DEPRECATED and currently available only
-|          for backwards compatibility purposes!
-|
-*/
-$config['global_xss_filtering'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Cross Site Request Forgery
-|--------------------------------------------------------------------------
-| Enables a CSRF cookie token to be set. When set to TRUE, token will be
-| checked on a submitted form. If you are accepting user data, it is strongly
-| recommended CSRF protection be enabled.
-|
-| 'csrf_token_name' = The token name
-| 'csrf_cookie_name' = The cookie name
-| 'csrf_expire' = The number in seconds the token should expire.
-| 'csrf_regenerate' = Regenerate token on every submission
-| 'csrf_exclude_uris' = Array of URIs which ignore CSRF checks
-*/
-$config['csrf_protection'] = FALSE;
-$config['csrf_token_name'] = 'csrf_test_name';
-$config['csrf_cookie_name'] = 'csrf_cookie_name';
-$config['csrf_expire'] = 7200;
-$config['csrf_regenerate'] = TRUE;
-$config['csrf_exclude_uris'] = array();
-
-/*
-|--------------------------------------------------------------------------
-| Output Compression
-|--------------------------------------------------------------------------
-|
-| Enables Gzip output compression for faster page loads.  When enabled,
-| the output class will test whether your server supports Gzip.
-| Even if it does, however, not all browsers support compression
-| so enable only if you are reasonably sure your visitors can handle it.
-|
-| Only used if zlib.output_compression is turned off in your php.ini.
-| Please do not use it together with httpd-level output compression.
-|
-| VERY IMPORTANT:  If you are getting a blank page when compression is enabled it
-| means you are prematurely outputting something to your browser. It could
-| even be a line of whitespace at the end of one of your scripts.  For
-| compression to work, nothing can be sent before the output buffer is called
-| by the output class.  Do not 'echo' any values with compression enabled.
-|
-*/
-$config['compress_output'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Master Time Reference
-|--------------------------------------------------------------------------
-|
-| Options are 'local' or any PHP supported timezone. This preference tells
-| the system whether to use your server's local time as the master 'now'
-| reference, or convert it to the configured one timezone. See the 'date
-| helper' page of the user guide for information regarding date handling.
-|
-*/
-$config['time_reference'] = 'local';
-
-/*
-|--------------------------------------------------------------------------
-| Rewrite PHP Short Tags
-|--------------------------------------------------------------------------
-|
-| If your PHP installation does not have short tag support enabled CI
-| can rewrite the tags on-the-fly, enabling you to utilize that syntax
-| in your view files.  Options are TRUE or FALSE (boolean)
-|
-| Note: You need to have eval() enabled for this to work.
-|
-*/
-$config['rewrite_short_tags'] = FALSE;
-
-/*
-|--------------------------------------------------------------------------
-| Reverse Proxy IPs
-|--------------------------------------------------------------------------
-|
-| If your server is behind a reverse proxy, you must whitelist the proxy
-| IP addresses from which CodeIgniter should trust headers such as
-| HTTP_X_FORWARDED_FOR and HTTP_CLIENT_IP in order to properly identify
-| the visitor's IP address.
-|
-| You can use both an array or a comma-separated list of proxy addresses,
-| as well as specifying whole subnets. Here are a few examples:
-|
-| Comma-separated:	'10.0.1.200,192.168.5.0/24'
-| Array:		array('10.0.1.200', '192.168.5.0/24')
-*/
-$config['proxy_ips'] = '';
-
-/*
-|--------------------------------------------------------------------------
-| FHComplete Build Version
-|--------------------------------------------------------------------------
-|
-| Version Number of the Current Build
-| This is used to invalidate Cache for JS and CSS Files
-| 
-| Example: 2019102901
-*/
-$config['fhcomplete_build_version'] = '2019102903';

application/development/database.php

@@ -1,122 +0,0 @@
-<?php
-if (! defined('BASEPATH')) exit('No direct script access allowed');
-defined('DB_HOST') OR require_once './config/system.config.inc.php'; // For CLI-Migrations
-
-/*
-| -------------------------------------------------------------------
-| DATABASE CONNECTIVITY SETTINGS
-| -------------------------------------------------------------------
-| This file will contain the settings needed to access your database.
-|
-| For complete instructions please consult the 'Database Connection'
-| page of the User Guide.
-|
-| -------------------------------------------------------------------
-| EXPLANATION OF VARIABLES
-| -------------------------------------------------------------------
-|
-|	['dsn']      The full DSN string describe a connection to the database.
-|	['hostname'] The hostname of your database server.
-|	['username'] The username used to connect to the database
-|	['password'] The password used to connect to the database
-|	['database'] The name of the database you want to connect to
-|	['dbdriver'] The database driver. e.g.: mysqli.
-|			Currently supported:
-|				 cubrid, ibase, mssql, mysql, mysqli, oci8,
-|				 odbc, pdo, postgre, sqlite, sqlite3, sqlsrv
-|	['dbprefix'] You can add an optional prefix, which will be added
-|				 to the table name when using the  Query Builder class
-|	['pconnect'] TRUE/FALSE - Whether to use a persistent connection
-|	['db_debug'] TRUE/FALSE - Whether database errors should be displayed.
-|	['cache_on'] TRUE/FALSE - Enables/disables query caching
-|	['cachedir'] The path to the folder where cache files should be stored
-|	['char_set'] The character set used in communicating with the database
-|	['dbcollat'] The character collation used in communicating with the database
-|				 NOTE: For MySQL and MySQLi databases, this setting is only used
-| 				 as a backup if your server is running PHP < 5.2.3 or MySQL < 5.0.7
-|				 (and in table creation queries made with DB Forge).
-| 				 There is an incompatibility in PHP with mysql_real_escape_string() which
-| 				 can make your site vulnerable to SQL injection if you are using a
-| 				 multi-byte character set and are running versions lower than these.
-| 				 Sites using Latin-1 or UTF-8 database character set and collation are unaffected.
-|	['swap_pre'] A default table prefix that should be swapped with the dbprefix
-|	['encrypt']  Whether or not to use an encrypted connection.
-|
-|			'mysql' (deprecated), 'sqlsrv' and 'pdo/sqlsrv' drivers accept TRUE/FALSE
-|			'mysqli' and 'pdo/mysql' drivers accept an array with the following options:
-|
-|				'ssl_key'    - Path to the private key file
-|				'ssl_cert'   - Path to the public key certificate file
-|				'ssl_ca'     - Path to the certificate authority file
-|				'ssl_capath' - Path to a directory containing trusted CA certificats in PEM format
-|				'ssl_cipher' - List of *allowed* ciphers to be used for the encryption, separated by colons (':')
-|				'ssl_verify' - TRUE/FALSE; Whether verify the server certificate or not ('mysqli' only)
-|
-|	['compress'] Whether or not to use client compression (MySQL only)
-|	['stricton'] TRUE/FALSE - forces 'Strict Mode' connections
-|							- good for ensuring strict SQL while developing
-|	['ssl_options']	Used to set various SSL options that can be used when making SSL connections.
-|	['failover'] array - A array with 0 or more data for connections if the main should fail.
-|	['save_queries'] TRUE/FALSE - Whether to "save" all executed queries.
-| 				NOTE: Disabling this will also effectively disable both
-| 				$this->db->last_query() and profiling of DB queries.
-| 				When you run a query, with this setting set to TRUE (default),
-| 				CodeIgniter will store the SQL statement for debugging purposes.
-| 				However, this may cause high memory usage, especially if you run
-| 				a lot of SQL queries ... disable this to avoid that problem.
-|
-| The $active_group variable lets you choose which connection group to
-| make active.  By default there is only one group (the 'default' group).
-|
-| The $query_builder variables lets you determine whether or not to load
-| the query builder class.
-*/
-$active_group = 'default';
-$query_builder = TRUE;
-
-$db['default'] = array(
-	'dsn'	=> '',
-	'hostname' => DB_HOST,
-	'username' => DB_USER,
-	'password' => DB_PASSWORD,
-	'port' 	   => DB_PORT,
-	'database' => DB_NAME,
-	'dbdriver' => 'postgre',
-	'dbprefix' => '',
-	'pconnect' => DB_CONNECT_PERSISTENT,
-	'db_debug' => (ENVIRONMENT !== 'production'),
-	'cache_on' => FALSE,
-	'cachedir' => '',
-	'char_set' => 'utf8',
-	'dbcollat' => 'utf8_general_ci',
-	'swap_pre' => '',
-	'encrypt' => FALSE,
-	'compress' => FALSE,
-	'stricton' => FALSE,
-	'failover' => array(),
-	'save_queries' => TRUE
-);
-
-$db['system'] = array(
-	'dsn'	=> '',
-	'hostname' => DB_HOST,
-	'username' => 'fhcomplete',
-	'password' => 'Fhcomplet3Onc4p1',
-	'database' => DB_NAME,
-	'port'     => DB_PORT,
-	'dbschema' => 'public',
-	'dbdriver' => 'postgre',
-	'dbprefix' => '',
-	'pconnect' => DB_CONNECT_PERSISTENT,
-	'db_debug' => (ENVIRONMENT !== 'production'),
-	'cache_on' => FALSE,
-	'cachedir' => '',
-	'char_set' => 'utf8',
-	'dbcollat' => 'utf8_general_ci',
-	'swap_pre' => '',
-	'encrypt' => FALSE,
-	'compress' => FALSE,
-	'stricton' => FALSE,
-	'failover' => array(),
-	'save_queries' => TRUE
-);

application/libraries/AntragLib.php

@@ -128,7 +128,7 @@ class AntragLib
 			return $this->_ci->StudierendenantragstatusModel->resumeAntraegeForAbmeldungStgl($antrag_id);
 		}
 		// NOTE(chris): get last status that is not pause
-		$this->_ci->StudierendenantragstatusModel->addOrder('insertamum');
+		$this->_ci->StudierendenantragstatusModel->addOrder('insertamum', 'DESC');
 		$this->_ci->StudierendenantragstatusModel->addLimit(1);
 		$result = $this->_ci->StudierendenantragstatusModel->loadWhere([
 			'studierendenantrag_id' => $antrag_id,

application/libraries/StundenplanLib.php

@@ -360,7 +360,10 @@ class StundenplanLib
 				if (isError($ort_content_object)) {
 					return error(getData($ort_content_object));
 				}
-				$ort_content_object = getData($ort_content_object)[0];
+				$ort_content_object_data = getData($ort_content_object);
+				$ort_content_object = (is_array($ort_content_object_data) && count($ort_content_object_data) > 0)
+					? $ort_content_object_data[0]
+					: null;
 				if($ort_content_object) {
 					$item->ort_content_id = $ort_content_object->content_id;
 				}

application/libraries/dashboard/DashboardLib.php

@@ -37,7 +37,9 @@ class DashboardLib
 	
 	public function getDashboardByKurzbz($dashboard_kurzbz)
 	{
-		$result = $this->_ci->DashboardModel->getDashboardByKurzbz($dashboard_kurzbz);
+		$result = $this->_ci->DashboardModel->loadWhere([
+			'dashboard_kurzbz' => $dashboard_kurzbz
+		]);
 
 		if (hasData($result))
 		{
@@ -47,17 +49,21 @@ class DashboardLib
 		return null;
 	}
 	
-	public function getMergedConfig($dashboard_id, $uid)
+	public function getMergedUserConfig($dashboard_id, $uid)
 	{
-		$defaultconfig = $this->getDefaultConfig($dashboard_id);
-		$userconfig = $this->getUserConfig($dashboard_id, $uid);
+		$defaultconfig = $this->getUserBaseConfig($dashboard_id);
+		$userconfig = $this->getUserOverrideConfig($dashboard_id, $uid);
 		
-		$mergedconfig = array_replace_recursive($defaultconfig, $userconfig);
+		$sourceconfig = array_map(function ($value) {
+			return ['source' => $value['source']];
+		}, $defaultconfig);
+		
+		$mergedconfig = array_replace_recursive($defaultconfig, $userconfig, $sourceconfig);
 		
 		return $mergedconfig;
 	}
 	
-	public function getDefaultConfig($dashboard_id)
+	protected function getUserBaseConfig($dashboard_id)
 	{
 		$funktion_kurzbzs = [];
 		$rights = $this->_ci->permissionlib->getAccessRights();
@@ -87,7 +93,11 @@ class DashboardLib
 				$preset = json_decode($presetobj->preset, true);
 				if (null !== $preset)
 				{
-					$defaultconfig = array_replace_recursive($defaultconfig, $preset);
+					$preset = array_map(function ($value) use ($presetobj) {
+						$value['source'] = $presetobj->funktion_kurzbz ?: self::SECTION_IF_FUNKTION_KURZBZ_IS_NULL;
+						return $value;
+					}, $preset);
+					$defaultconfig = array_merge_recursive($defaultconfig, $preset);
 				}
 			}
 		}
@@ -95,7 +105,7 @@ class DashboardLib
 		return $defaultconfig;
 	}
 	
-	public function getUserConfig($dashboard_id, $uid)
+	protected function getUserOverrideConfig($dashboard_id, $uid)
 	{
 		$res_userconfig = $this->_ci->DashboardOverrideModel->getOverride($dashboard_id, $uid);
 		
@@ -124,7 +134,7 @@ class DashboardLib
 		$emptyoverride = new stdClass();
 		$emptyoverride->dashboard_id = $dashboard->dashboard_id;
 		$emptyoverride->uid = $uid;
-		$emptyoverride->override = '{"' . self::USEROVERRIDE_SECTION . '": {"widgets":{}}, "custom": { "widgets" : {}}}';
+		$emptyoverride->override = '[]';
 		
 		return $emptyoverride;
 	}
@@ -143,8 +153,7 @@ class DashboardLib
 		$emptypreset = new stdClass();
 		$emptypreset->dashboard_id = $dashboard->dashboard_id;
 		$emptypreset->funktion_kurzbz = $funktion_kurzbz;
-		$section = ($funktion_kurzbz !== null) ? $funktion_kurzbz : self::SECTION_IF_FUNKTION_KURZBZ_IS_NULL;
-		$emptypreset->preset = '{"' . $section . '": { "widgets" : {}},"custom": { "widgets" : {}}}';
+		$emptypreset->preset = '[]';
 		
 		return $emptypreset;
 	}
@@ -209,44 +218,4 @@ class DashboardLib
 		
 		return $result;
 	}
-
-	public function addWidgetsToWidgets(&$widgets, $dashboard_kurzbz, $section, $addwigets)
-	{
-		foreach ($addwigets as $widget)
-		{
-			if(!isset($widget['widgetid']))
-			{
-				$widget['widgetid'] = $this->generateWidgetId($dashboard_kurzbz);
-			}
-			$this->addWidgetToWidgets($widgets, $section, $widget, $widget['widgetid']);
-		}
-	}
-	
-	public function addWidgetToWidgets(&$widgets, $section, $widget, $widgetid)
-	{
-		$section = ($section !== null) ? $section : self::SECTION_IF_FUNKTION_KURZBZ_IS_NULL;
-		if (!isset($widgets[$section]) || !isset($widgets[$section]["widgets"]) || !is_array($widgets[$section]))
-		{
-			$widgets[$section] = array();
-			$widgets[$section]["widgets"] = array();
-		}
-		
-		$widgets[$section]["widgets"][$widgetid] = $widget;
-	}
-	
-	public function removeWidgetFromWidgets(&$widgets, $section, $widgetid)
-	{
-		$section = ($section !== null) ? $section : self::SECTION_IF_FUNKTION_KURZBZ_IS_NULL;
-		if (isset($widgets[$section]) && isset($widgets[$section]["widgets"][$widgetid]))
-		{
-			unset($widgets[$section]["widgets"][$widgetid]);
-			if(empty($widgets[$section]["widgets"]) && $section !== self::USEROVERRIDE_SECTION) {
-				unset($widgets[$section]);
-			}
-			return true;
-		}
-		else {
-			return false;
-		}
-	}
 }

application/libraries/vertragsbestandteil/AbstractBestandteil.php

@@ -40,7 +40,9 @@ abstract class AbstractBestandteil implements IValidation
 		
 		if( is_bool($new_value) && ($old_value !== $new_value) ) {
 			$this->modifiedcolumns[$columnname] = $columnname;
-		} else if($old_value != $new_value) {		
+		} else if(is_null($old_value) xor is_null($new_value)) {
+			$this->modifiedcolumns[$columnname] = $columnname;
+		} else if($old_value != $new_value) {
 			$this->modifiedcolumns[$columnname] = $columnname;
 		}
 	}

application/libraries/vertragsbestandteil/VertragsbestandteilLohnguide.php

@@ -137,19 +137,25 @@ EOTXT;
 		return parent::__toString() . $txt;
 	}
 
-	/* public function validate()
+	public function validate()
 	{
-		if( !(filter_var($this->tage, FILTER_VALIDATE_INT, 
-				array(
-					'options' => array(
-						'min_range' => 1,
-						'max_range' => 50
-					)
-				)
-			)) ) {
-			$this->validationerrors[] = 'Urlaubsanspruch muss eine Tagesanzahl im Bereich 1 bis 50 sein.';
+		$value = $this->vordienstzeit;
+
+		if ($value === null || $value === '') {
+			$result = null;   // allow null value 
+		} else {
+			$result = filter_var($value, FILTER_VALIDATE_INT, [
+				'options' => [
+					'min_range' => 0,
+					'max_range' => 100
+				]
+			]);
+
+			if ($result === false) {				
+				$this->validationerrors[] = 'Vordienstjahre muss eine ganze Zahl (0 bis 100) enthalten oder leer sein.';
+			}
 		}
 		
 		return parent::validate();
-	} */
+	} 
 }

application/models/content/Content_model.php

@@ -234,9 +234,9 @@ class Content_model extends DB_Model
 							FROM
 								campus.tbl_content c1
 							LEFT JOIN
-								campus.tbl_contentsprache s1 ON c1.content_id=s1.content_id AND s1.sprache=?
+								campus.tbl_contentsprache s1 ON c1.content_id=s1.content_id AND s1.sprache=? AND sichtbar=true
 							WHERE
-								sichtbar=true
+								c1.aktiv = true
 						) s2
 						LEFT JOIN
 							campus.tbl_contentsprache s3 USING(content_id, sprache)
@@ -277,7 +277,7 @@ class Content_model extends DB_Model
 			JOIN 
 				campus.tbl_contentsprache s USING(contentsprache_id)
 			LEFT JOIN 
-				campus.tbl_contentchild k ON(m.content_id=k.content_id)
+				campus.tbl_contentchild k ON(m.content_id=k.content_id) and c.aktiv = true
 			WHERE EXISTS (
 				SELECT 1 
 				FROM campus.tbl_contentgruppe 

application/models/dashboard/Bookmark_model.php

@@ -11,8 +11,4 @@ class Bookmark_model extends DB_Model
 		$this->dbTable = 'dashboard.tbl_bookmark';
 		$this->pk = 'bookmark_id';
 	}
-
-
-	
-
 }

application/models/dashboard/Dashboard_model.php

@@ -11,15 +11,4 @@ class Dashboard_model extends DB_Model
 		$this->dbTable = 'dashboard.tbl_dashboard';
 		$this->pk = 'dashboard_id';
 	}
-
-
-	/**
-	 * Get Dashboard by kurzbz.
-	 * @param string dashboard_kurzbz
-	 * @return array
-	 */
-	public function getDashboardByKurzbz($dashboard_kurzbz)
-	{
-		return $this->loadWhere(array('dashboard_kurzbz' => $dashboard_kurzbz));
-	}
 }

application/models/education/Paabgabe_model.php

@@ -79,10 +79,10 @@ class Paabgabe_model extends DB_Model
 				 JOIN public.tbl_benutzer ON (public.tbl_benutzer.uid = student_uid)
 				 JOIN public.tbl_person USING (person_id)
 		
-		WHERE (campus.tbl_paabgabe.insertamum >= NOW() - INTERVAL ?
-		   OR campus.tbl_paabgabe.updateamum >= NOW() - INTERVAL ?)
-		   AND campus.tbl_paabgabe.paabgabetyp_kurzbz IN ?";
-
+		WHERE (campus.tbl_paabgabe.insertamum::date = CURRENT_DATE - INTERVAL ?
+			OR campus.tbl_paabgabe.updateamum::date = CURRENT_DATE - INTERVAL ?)
+			AND campus.tbl_paabgabe.paabgabetyp_kurzbz IN ?";
+		
 		return $this->execQuery($query, [$interval, $interval, $relevantTypes]);
 	}
 
@@ -108,7 +108,7 @@ class Paabgabe_model extends DB_Model
 						 JOIN public.tbl_person ON (public.tbl_benutzer.person_id = public.tbl_person.person_id)
 				
 				WHERE campus.tbl_paabgabe.abgabedatum IS NOT NULL 
-				AND campus.tbl_paabgabe.abgabedatum >= NOW() - INTERVAL ?";
+				AND campus.tbl_paabgabe.abgabedatum = CURRENT_DATE - INTERVAL ?";
 		
 		if($relevantTypes !== null) {
 			$query .= " AND campus.tbl_paabgabe.paabgabetyp_kurzbz IN ?";

application/models/organisation/Studiengang_model.php

@@ -594,7 +594,10 @@ class Studiengang_model extends DB_Model
 		$this->addSelect('p.prestudent_id');
 		$this->addSelect('pers.vorname');
 		$this->addSelect('pers.nachname');
-		$this->addSelect("CONCAT(UPPER(pers.nachname), ' ', pers.vorname, ' (', " . $this->dbTable . ".bezeichnung, ')') AS name");
+		$this->addSelect("CONCAT(UPPER(pers.nachname), ' ', pers.vorname, ' (', "
+			. $this->dbTable . ".bezeichnung, ', ', "
+			. "UPPER(" . $this->dbTable . ".typ), "
+			. "UPPER(" . $this->dbTable . ".kurzbz),')') AS name");
 
 		$this->addJoin('public.tbl_prestudent p', 'studiengang_kz');
 		$this->addJoin(

application/views/CisRouterView/CisRouterView.php

@@ -23,12 +23,14 @@ $includesArray = array(
 		'public/css/components/FormUnderline.css',
 		'public/css/components/abgabetool/abgabe.css',
 		'public/css/Cis4/Cms.css',
-		'public/css/Cis4/Studium.css',
+		'public/css/Cis4/Studium.css'
 	),
 	'customJSs' => array(
 		'vendor/npm-asset/primevue/accordion/accordion.min.js',
 		'vendor/npm-asset/primevue/accordiontab/accordiontab.min.js',
 		'vendor/npm-asset/primevue/checkbox/checkbox.min.js',
+		'vendor/npm-asset/primevue/chips/chips.min.js',
+		'vendor/npm-asset/primevue/multiselect/multiselect.min.js',
 		'vendor/npm-asset/primevue/inputnumber/inputnumber.min.js',
 		'vendor/npm-asset/primevue/speeddial/speeddial.min.js',
 		'vendor/npm-asset/primevue/textarea/textarea.min.js',
@@ -39,7 +41,7 @@ $includesArray = array(
 		'vendor/moment/luxonjs/luxon.min.js'
 	),
 	'customJSModules' => array(
-		'public/js/apps/Dashboard/Fhc.js',
+		'public/js/apps/Cis/Cis.js',
 	),
 
 );

application/views/templates/CISVUE-Footer.php

@@ -6,7 +6,7 @@ $includesArray = array(
 	'fontawesome6' => true,
 	'axios027' => true,
 	'customJSModules' => array_merge([
-		'public/js/apps/Cis.js'
+		'public/js/apps/Cis/Menu.js'
 	], $customJSModules ?? []),
 	'customCSSs' => array_merge([
 		'public/css/Cis4/Cis.css'

application/views/templates/CISVUE-Header.php

@@ -8,7 +8,7 @@ $includesArray = array(
 	'axios027' => true,
 	'primevue3' => true,
 	'customJSModules' => array_merge([
-		'public/js/apps/Cis.js'
+		'public/js/apps/Cis/Menu.js'
 	], $customJSModules ?? []),
 	'customCSSs' => array_merge([
 		'public/css/Cis4/Cis.css',

cis/private/info/service_uebersicht.php

@@ -46,12 +46,13 @@ echo '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 	<link rel="stylesheet" href="../../../skin/tablesort.css" type="text/css"/>
 	<link rel="stylesheet" href="../../../skin/style.css.php" type="text/css">
 	<link rel="stylesheet" type="text/css" href="../../../skin/jquery-ui-1.9.2.custom.min.css">
-	<script type="text/javascript" src="../../../vendor/jquery/jquery1/jquery-1.12.4.min.js"></script>
-	<script type="text/javascript" src="../../../vendor/christianbach/tablesorter/jquery.tablesorter.min.js"></script>
 	<script type="text/javascript" src="../../../vendor/components/jqueryui/jquery-ui.min.js"></script>
 	<script type="text/javascript" src="../../../include/js/jquery.ui.datepicker.translation.js"></script>
 	<script type="text/javascript" src="../../../vendor/jquery/sizzle/sizzle.js"></script>';
 
+	include('../../../include/meta/jquery.php');
+	include('../../../include/meta/jquery-tablesorter.php');
+
 const MOODLE_ADDON_KURZBZ = 'moodle';
 
 // Load Addons to get Moodle_Path
@@ -71,7 +72,7 @@ echo '
 			    $("#myTable").tablesorter(
 				{
 					sortList: [[0,0],[1,0]],
-					widgets: [\'zebra\']
+					widgets: [\'zebra\',\'filter\']
 				});
 			}
 		);
@@ -151,8 +152,9 @@ foreach($service->result as $row)
 		$person = new person();
 		$person->getPersonFromBenutzer($row->operativ_uid);
 		$operativ = $person->nachname.' '.$person->vorname;
+		$oeBez = new organisationseinheit($row->oe_kurzbz);
 		echo '<tr>';
-		echo '<td>',$row->oe_kurzbz,'</td>';
+		echo '<td>',$oeBez->bezeichnung,'</td>';
 		echo '<td><b>'.$row->bezeichnung.'</b></td>';
 		echo '<td>',$row->beschreibung,'</td>';
 		echo '<td><nobr><a href="../profile/index.php?uid='.$row->design_uid.'">',$design,'</a></nobr></td>';

cis/testtool/menu.php

@@ -293,7 +293,7 @@ else if (isset($_SESSION['pruefling_id']))
 			}
 			$lastsemester = $row->semester;
 
-			echo '<table border="0" cellspacing="0" cellpadding="0" id="Gebiet" style="display: visible; border-collapse: separate; border-spacing: 0 3px;">';
+			echo '<table border="0" cellspacing="0" cellpadding="0" id="Gebiet" style="display: visible; border-collapse: separate; border-spacing: 0 3px; margin-top: 5px;">';
 			echo '<tr><td class="HeaderTesttool">'. ($row->semester == '1' ? $p->t('testtool/basisgebiete') : $p->t('testtool/quereinstiegsgebiete')).'</td></tr>';
 		}
 

composer.json

@@ -70,6 +70,18 @@
 				}
 			}
 		},
+		{
+			"type": "package",
+			"package": {
+				"name": "drag-drop-touch-js/dragdroptouch",
+				"version": "2.0.3",
+				"source": {
+					"url": "https://github.com/drag-drop-touch-js/dragdroptouch.git",
+					"type": "git",
+					"reference": "master"
+				}
+			}
+		},
 		{
 			"type": "package",
 			"package": {
@@ -452,6 +464,8 @@
 
 		"easyrdf/easyrdf": "0.9.*",
 
+		"drag-drop-touch-js/dragdroptouch": "*",
+
 		"fgelinas/timepicker": "0.3.3",
 		"fortawesome/font-awesome4": "4.7.*",
 		"fortawesome/font-awesome6": "6.1.*",
@@ -519,5 +533,9 @@
 		"phpmetrics/phpmetrics": "2.*",
 		"sebastian/phpcpd": "3.*",
 		"phpunit/phpunit": "^6"
+	},
+	"scripts": {
+		"post-install-cmd": "@symlink_vendor_to_public",
+		"symlink_vendor_to_public": "ln -sfn ../vendor ./public/"
 	}
 }

composer.lock

@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "f4f0af4586f46f97d8b6092c1ac0fb3a",
+    "content-hash": "869cbc35bd1ba90ab90934fcb41b0f51",
     "packages": [
         {
             "name": "afarkas/html5shiv",
@@ -804,6 +804,16 @@
             "abandoned": true,
             "time": "2018-03-09T06:07:41+00:00"
         },
+        {
+            "name": "drag-drop-touch-js/dragdroptouch",
+            "version": "2.0.3",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/drag-drop-touch-js/dragdroptouch.git",
+                "reference": "master"
+            },
+            "type": "library"
+        },
         {
             "name": "easyrdf/easyrdf",
             "version": "0.9.1",

content/mitarbeiter/mitarbeiterfunktionoverlay.xul.php

@@ -342,6 +342,8 @@ echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';
 		<vbox>
 			<checkbox id="mitarbeiter-entwicklungsteam-detail-checkbox-neu" checked="true" hidden="true" />
 			<textbox id="mitarbeiter-entwicklungsteam-detail-textbox-studiengang" hidden="true" />
+			<textbox id="mitarbeiter-entwicklungsteam-detail-entwicklungsteam_id" hidden="true" />
+
 			<groupbox id="mitarbeiter-entwicklungsteam-detail-groupbox" flex="1">
 				<caption label="Details" />
 				<grid id="mitarbeiter-entwicklungsteam-detail-grid" style="margin:4px;" flex="1">

content/mitarbeiter/mitarbeiteroverlay.js.php

@@ -1708,6 +1708,7 @@ function MitarbeiterEntwicklungsteamSelect()
 	document.getElementById('mitarbeiter-entwicklungsteam-detail-textbox-studiengang').value=studiengang_kz;
 	document.getElementById('mitarbeiter-entwicklungsteam-detail-datum-beginn').value=beginn;
 	document.getElementById('mitarbeiter-entwicklungsteam-detail-datum-ende').value=ende;
+	document.getElementById('mitarbeiter-entwicklungsteam-detail-entwicklungsteam_id').value=entwicklungsteam_id;
 	MitarbeiterEntwicklungsteamDetailDisableFields(false);
 }
 
@@ -1725,6 +1726,7 @@ function MitarbeiterEntwicklungsteamSpeichern()
 	studiengang_kz_old = document.getElementById('mitarbeiter-entwicklungsteam-detail-textbox-studiengang').value;
 	beginn = document.getElementById('mitarbeiter-entwicklungsteam-detail-datum-beginn').value;
 	ende = document.getElementById('mitarbeiter-entwicklungsteam-detail-datum-ende').value;
+	entwicklungsteam_id = document.getElementById('mitarbeiter-entwicklungsteam-detail-entwicklungsteam_id').value;
 
 	if(studiengang_kz=='')
 	{

content/student/studentoverlay.js.php

@@ -3555,6 +3555,14 @@ function StudentZeugnisDokumentArchivieren()
 		case 'microcredential_2':
 		case 'microcredential_3':
 		case 'microcredential_4':
+		case 'microdegree_1':
+		case 'microdegree_2':
+		case 'microdegree_3':
+		case 'microdegree_4':
+		case 'microdegreeabschluss_1':
+		case 'microdegreeabschluss_2':
+		case 'microdegreeabschluss_3':
+		case 'microdegreeabschluss_4':
 			xml = 'microcredential.xml.php';
 			break;
 			

include/entwicklungsteam.class.php

@@ -364,9 +364,10 @@ class entwicklungsteam extends basis_db
 		$bismeldung_jahr = $datetime->format('Y');
 
 		//laden des Datensatzes
-			$qry = "SELECT *
+			$qry = "SELECT tbl_entwicklungsteam.*, tbl_besqual.*, tbl_studiengang.studiengang_kz, tbl_studiengang.melderelevant
 					FROM bis.tbl_entwicklungsteam
 					JOIN bis.tbl_besqual USING(besqualcode)
+					JOIN public.tbl_studiengang USING(studiengang_kz)
 					WHERE mitarbeiter_uid=".$this->db_add_param($mitarbeiter_uid)."
 					AND (beginn is NULL OR beginn <= make_date(". $this->db_add_param($bismeldung_jahr). "::INTEGER, 12, 31))
 					AND (ende is NULL OR ende >= make_date(". $this->db_add_param($bismeldung_jahr). "::INTEGER, 1, 1))";
@@ -394,6 +395,7 @@ class entwicklungsteam extends basis_db
 				$obj->insertvon = $row->insertvon;
 				$obj->ext_id = $row->ext_id;
 				$obj->besqual = $row->besqualbez;
+				$obj->melderelevant = $this->db_parse_bool($row->melderelevant);
 
 				$this->result[] = $obj;
 			}

include/konto.class.php

@@ -25,6 +25,7 @@
  */
 require_once(dirname(__FILE__).'/basis_db.class.php');
 require_once(dirname(__FILE__).'/'.EXT_FKT_PATH.'/generateZahlungsreferenz.inc.php');
+require_once(dirname(__FILE__).'/variable.class.php');
 
 class konto extends basis_db
 {
@@ -432,6 +433,8 @@ class konto extends basis_db
 
 		$qry.=" ORDER BY beschreibung";
 
+		$oehBeitrag = $this->_getOEHBeitrag();
+
 		if($this->db_query($qry))
 		{
 			while($row = $this->db_fetch_object())
@@ -440,7 +443,15 @@ class konto extends basis_db
 
 				$typ->buchungstyp_kurzbz = $row->buchungstyp_kurzbz;
 				$typ->beschreibung = $row->beschreibung;
-				$typ->standardbetrag = $row->standardbetrag;
+				if (strtolower($typ->buchungstyp_kurzbz) === 'oeh' && $oehBeitrag)
+				{
+					$typ->standardbetrag = $oehBeitrag;
+				}
+				else
+				{
+					$typ->standardbetrag = $row->standardbetrag;
+				}
+
 				$typ->standardtext = $row->standardtext;
 				$typ->credit_points = $row->credit_points;
 				$typ->aktiv = $this->db_parse_bool($row->aktiv);
@@ -990,6 +1001,43 @@ class konto extends basis_db
 			return false;
 		}
 	}
+
+	private function _getOEHBeitrag()
+	{
+		if(!is_user_logged_in())
+		{
+			return false;
+		}
+
+		$variablen_obj = new variable();
+		$variablen_obj->loadVariables(get_uid());
+
+		$qry = "WITH semstart AS (
+					SELECT start FROM public.tbl_studiensemester
+					WHERE studiensemester_kurzbz = '". $this->db_escape($variablen_obj->variable->semester_aktuell) . "'
+				)
+				SELECT * FROM bis.tbl_oehbeitrag oehb
+				JOIN public.tbl_studiensemester semvon ON oehb.von_studiensemester_kurzbz = semvon.studiensemester_kurzbz
+				LEFT JOIN public.tbl_studiensemester sembis ON oehb.bis_studiensemester_kurzbz = sembis.studiensemester_kurzbz
+				JOIN semstart ON semstart.start::date >= semvon.start::date AND (sembis.studiensemester_kurzbz IS NULL OR semstart.start::date <= sembis.start::date)
+				ORDER BY semvon.start
+				LIMIT 1";
+
+		if ($this->db_query($qry))
+		{
+			if($row = $this->db_fetch_object())
+			{
+				$summe = ($row->studierendenbeitrag + $row->versicherung) * -1;
+				return number_format((float)$summe, 2, '.', '');
+			}
+			return false;
+		}
+		else
+		{
+			$this->errormsg = 'Fehler bei der Abfrage aufgetreten';
+			return false;
+		}
+	}
 }
 
 ?>

include/lehreinheitmitarbeiter.class.php

@@ -584,8 +584,9 @@ class lehreinheitmitarbeiter extends basis_db
 
 		$qry = '
 			WITH semester_sws_tbl AS (
-				SELECT DISTINCT lehreinheit_id, studiensemester_kurzbz, lema.semesterstunden,
-					stg.studiengang_kz, stg.melde_studiengang_kz, stg.lgartcode
+				SELECT
+					DISTINCT lehreinheit_id, studiensemester_kurzbz, lema.semesterstunden,
+					stg.studiengang_kz, stg.melde_studiengang_kz, stg.lgartcode, stg.melderelevant
 				FROM lehre.tbl_lehreinheitmitarbeiter lema
 					JOIN lehre.tbl_lehreinheit USING (lehreinheit_id)
 					JOIN lehre.tbl_lehrveranstaltung lv USING (lehrveranstaltung_id)
@@ -598,6 +599,7 @@ class lehreinheitmitarbeiter extends basis_db
 					AND ss.studiensemester_kurzbz IN ('.$this->implode4SQL($studiensemester_kurzbz_arr).')
 				-- nur lehre, die bisgemeldet wird
 					AND lema.bismelden
+					AND stg.melderelevant
 				-- keine lehreinheiten ohne semesterstunden
 					AND lema.semesterstunden != 0
 			)

public/css/Cis4/Cis.css

@@ -147,6 +147,8 @@ html {
 	--fhc-cis-menu-lvl-5-color-hover: var(--fhc-text);
 	--fhc-cis-grade-positive: var(--fhc-success);
 	--fhc-cis-grade-negative: var(--fhc-danger);
+
+  --fhc-offcanvas-zindex: 1045;
 }
 
 #themeSwitch i{
@@ -375,7 +377,7 @@ html {
 /* searchbar */
 #nav-search {
   background-color: var(--fhc-primary);
-  z-index: 1;
+ 	z-index: calc(var(--fhc-offcanvas-zindex) + 1) !important;
 }
 #nav-search.me-3 {
   margin: 0 !important;
@@ -386,12 +388,6 @@ html {
 #nav-search > .input-group > * {
   border-radius: 0 !important;
 }
-#nav-search .searchbar_results {
-  top: 100% !important;
-  left: 0;
-  right: 0 !important;
-  width: 100% !important;
-}
 
 /* frame */
 .in-frame {
@@ -413,10 +409,18 @@ html {
 	color: var(--fhc-link) !important;
 }
 
+#nav-main {
+   	z-index: var(--fhc-offcanvas-zindex);
+}
+
 #nav-main-sticky {
 	max-height: calc(100vh - var(--fhc-cis-header-height));
 }
 
+#nav-user-menu {
+   	z-index: calc(var(--fhc-offcanvas-zindex) + 1);
+}
+
 #nav-user-menu img {
   object-fit: cover;
   height: calc( 3 * var(--fhc-cis-header-py));
@@ -457,7 +461,14 @@ html {
     /* overflow: visible !important; */
   }
   #cis-header {
-    z-index: 10;
+	z-index: 10;
+  }
+  #cis-header-bar {
+	position: fixed;
+	top: 0;
+	height: var(--fhc-cis-header-height);
+	width: 100%;
+    background-color: var(--fhc-primary);
   }
   #cis-header nav {
     position: initial;
@@ -473,12 +484,7 @@ html {
     display: none;
   }
   #nav-logo {
-    position: fixed;
-    top: 0;
-    left: 0;
-    height: var(--fhc-cis-header-height);
     width: var(--fhc-cis-menu-width);
-    background-color: var(--fhc-primary);
     padding: var(--fhc-cis-header-py) var(--fhc-cis-header-px);
     z-index: 2;
   }
@@ -493,37 +499,27 @@ html {
   	top: var(--fhc-cis-header-height);
 	display: flex;
 	flex-direction: column;
-  }
-  #nav-main-sticky > :not(#nav-main-toggle) {
-	overflow: auto;
+	height: 100%;
   }
   #nav-main-toggle {
-    width: 0;
     z-index: 1;
   }
-  #nav-main-toggle .btn,
-  #nav-main-toggle .fa-arrow-circle-left {
+  #nav-main-toggle:hover {
+	background-color: var(--fhc-secondary-highlight);
+  }
+  #nav-main-toggle .div,
+  #nav-main-toggle .fa-chevron-left {
     transition: all 0.5s ease-in-out;
   }
   #nav-main-toggle .collapsed.btn {
     background-color: transparent !important;
   }
-  #nav-main-toggle .collapsed .fa-arrow-circle-left {
+  #nav-main-toggle .collapsed .fa-chevron-left {
     transform: scaleX(-1);
     color: var(--fhc-black-40);
   }
   #nav-search {
-    position: fixed;
-    top: 0;
-    left: var(--fhc-cis-menu-width);
-    height: var(--fhc-cis-header-height);
-    right: calc(var(--fhc-cis-header-height) + 2 * var(--fhc-cis-header-px) - 2 * var(--fhc-cis-header-py));
-    width: auto !important;
-  }
-  #nav-user {
-	position: fixed;
-	top: 0;
-	right: 0;
+	position: relative;
   }
   #nav-user-btn {
     border-width: 0;
@@ -558,7 +554,7 @@ html {
 
   #nav-main-menu {
     height: 100%;
-    background-color: var(--fhc-cis-menu-bg);
+    background-color: var(--fhc-primary);
   }
   #nav-main-menu > div {
     width: var(--fhc-cis-menu-width);
@@ -600,9 +596,6 @@ html {
   }
   #nav-user{
 	position: relative;
-  }
-  #nav-user-btn {
-
   }
   #nav-user-btn img {
     object-fit: cover;

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.css

@@ -2,7 +2,7 @@
 @import './dashboard/news.css';
 @import './dashboard/LvPlan.css';
 
-:root{
+:root {
 	--fhc-dashboard-danger: var(--fhc-danger, #842029);
 	--fhc-dashboard-grid-size: 4;
 	--fhc-dashboard-link: var(--fhc-link, #0a57ca);
@@ -17,22 +17,16 @@
 	--fhc-dashboard-section-info-color-hover: var(--fhc-primary-highlight, #005585);
 }
 
-@media(max-width: 577px) {
-	:root {
-		--fhc-dashboard-grid-size: 1;
-	}
-}
-
-.core-dashboard a{
+.core-dashboard a {
 	color: var(--fhc-dashboard-link);
 }
 
-@media (max-width: 576px){
+@media (max-width: 576px) {
 	.widget-icon {
 		max-height: 250px;
 		object-fit: cover;
 	}
-	.widget-icon-container{
+	.widget-icon-container {
 		max-width: 250px;
 		margin-left: auto;
 		margin-right: auto;
@@ -46,27 +40,36 @@
 	background-repeat: no-repeat;
 	background-position: center;
 	background-size: cover;
-	cursor:pointer;
+	cursor: pointer;
 }
 
-.dashboard-section > .newGridRow{
-	position:absolute;
-	width:20px;
-	height:20px;
-	padding:0;
-	bottom:0;
-	left:50%;
-	transform:translate(-50%, 50%);
+.dashboard-section.edit-active {
+	/**
+	 * replaces margin for extra row
+	 * 10% equals 0.1 of 100%
+	 * 1rem equals the padding of pb-3 that is overwritten here
+	 */
+	padding-bottom: calc(10% / var(--fhc-dashboard-grid-size) + 1rem) !important;
+}
+
+.dashboard-section > .newGridRow {
+	position: absolute;
+	width: 20px;
+	height: 20px;
+	padding: 0;
+	bottom: 0;
+	left: 50%;
+	transform: translate(-50%, 50%);
 	background-color: var(--fhc-dashboard-gridrow-background);
 }
 
 .newGridRow:hover {
-	color:white;
+	color: white;
 	background-color: var(--fhc-dashboard-gridrow-background-highlight);
 }
 
 .empty-tile-hover:hover {
-		background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-500 -500 1448 1512"><path fill="rgb(211, 211, 211)" d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM200 344V280H136c-13.3 0-24-10.7-24-24s10.7-24 24-24h64V168c0-13.3 10.7-24 24-24s24 10.7 24 24v64h64c13.3 0 24 10.7 24 24s-10.7 24-24 24H248v64c0 13.3-10.7 24-24 24s-24-10.7-24-24z"/></svg>');
+	background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-500 -500 1448 1512"><path fill="rgb(211, 211, 211)" d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zM200 344V280H136c-13.3 0-24-10.7-24-24s10.7-24 24-24h64V168c0-13.3 10.7-24 24-24s24 10.7 24 24v64h64c13.3 0 24 10.7 24 24s-10.7 24-24 24H248v64c0 13.3-10.7 24-24 24s-24-10.7-24-24z"/></svg>');
 }
 
 .alert-danger .form-check-input:checked {
@@ -74,16 +77,6 @@
 	background-color: var(--fhc-dashboard-danger);
 }
 
-:root {
-	--fhc-dashboard-grid-size: 4;
-}
-
-@media(max-width: 1400px) {
-	:root {
-		--fhc-dashboard-grid-size: 4;
-	}
-}
-
 @media(max-width: 1200px) {
 	:root {
 		--fhc-dashboard-grid-size: 3;
@@ -105,6 +98,7 @@
 @media(max-width: 577px) {
 	:root {
 		--fhc-dashboard-grid-size: 1;
+		--fhc-dg-item-py: .75rem;
 	}
 }
 
@@ -132,50 +126,64 @@
 	cursor: move !important;
 }
 
-.draggedItem {
+.drop-grid-item-resize > .dashboard-item,
+.drop-grid-item-move > .dashboard-item {
 	height: 100%;
 	width: 100%;
 	background-color: var(--fhc-dashboard-draggeditem-background);
 	position: relative;
 }
 
-.dashboard-item-overlay{
+.drop-grid-item-resize > .dashboard-item > *,
+.drop-grid-item-move > .dashboard-item > * {
+	display: none;
+}
+
+.drop-grid-item-sizechanged > .dashboard-item,
+.drop-grid-item-move > .dashboard-item {
 	background-color: var(--fhc-dashboard-item-overlay-background);
 }
 
-.dashboard-item-overlay::before{
-	position:absolute;
-	content:"";
-	top:0.25rem;
-	left:0.25rem;
-	right:0.25rem;
-	bottom:0.25rem;
-	border:4px dashed var(--fhc-dashboard-item-overly-border-color);
-	opacity: 0.5;
+.drop-grid-item-sizechanged > .dashboard-item::before,
+.drop-grid-item-move > .dashboard-item::before {
+	position: absolute;
+	content: "";
+	top: .25rem;
+	left: .25rem;
+	right: .25rem;
+	bottom: .25rem;
+	border: 4px dashed var(--fhc-dashboard-item-overly-border-color);
+	opacity: .5;
 }
 
-#deleteBookmark i{
+.drop-grid-item-oversized > .dashboard-item {
+	/* Bootstrap: border-danger */
+	--bs-border-opacity: 1;
+	border-color: rgba(var(--bs-danger-rgb), var(--bs-border-opacity)) !important;
+}
+
+#deleteBookmark i {
 	color: var(--fhc-dashboard-danger);
 }
 
-.pin:hover{
+.pin:hover {
 	cursor: pointer;
 }
 
-.pin[pinned]:hover{
+.pin[pinned]:hover {
 	color: var(--fhc-dashboard-pin-pinned-hover-color);
 }
 
-.section-info{
+.section-info {
 	color: var(--fhc-dashboard-section-info-color);
-	cursor:pointer;
+	cursor: pointer;
 }
 
 .section-info:hover {
 	color: var(--fhc-dashboard-section-info-color-hover);
 }
 
-.denied-dragging-animation {
+.drop-grid-item-blocker [pinned='true'] {
 	animation: wiggle 0.5s linear;
 	color: var(--fhc-dashboard-denied-dragging-animation-color) !important;
 }
@@ -204,13 +212,13 @@
 
 }
 
-.hiddenWidget{
+.hidden-widget {
 	background: var(--fhc-disabled-background);
 	opacity: 40%;
 }
 
-.hiddenWidget .card,
-.hiddenWidget .card-body,
-.hiddenWidget .card-body *{
+.hidden-widget .card,
+.hidden-widget .card-body,
+.hidden-widget .card-body * {
 	background: inherit !important;
 }

public/js/api/factory/cis/studium.js

@@ -0,0 +1,26 @@
+/**
+ * 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 {
+	getAllStudienSemester(studiensemester, studiengang, semester, studienplan) {
+		return {
+			method: 'get',
+			url: 'api/frontend/v1/Studium/getStudienAllSemester/',
+			params: {studiensemester, studiengang, semester, studienplan}
+		};
+	},
+}

public/js/api/factory/lehre.js

@@ -35,5 +35,11 @@ export default {
 			method: 'get',
 			url: `/api/frontend/v1/Lehre/Pruefungen/${lehrveranstaltung_id}`
 		};
+	},
+	getSemesterAverageGrade(semester) {
+		return {
+			method: 'get',
+			url: `/api/frontend/v1/Lehre/semesterAverageGrade/${semester}`
+		}
 	}
 };

public/js/api/factory/lvPlan.js

@@ -129,5 +129,11 @@ export default {
 			method: 'get',
 			url: '/api/frontend/v1/lvPlan/permissionOtherLvPlan',
 		}
-	}
+	},
+	getCompactibleEventTypes(){
+		return {
+			method: 'get',
+			url: '/api/frontend/v1/lvPlan/compactibleEventTypes',
+		}
+	},
 };

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/api/factory/widget/bookmark.js

@@ -17,6 +17,7 @@
 
 export default {
 	getBookmarks() {
+
 		return {
 			method: 'get',
 			url: '/api/frontend/v1/Bookmark/getBookmarks'
@@ -28,18 +29,24 @@ export default {
 			url: `/api/frontend/v1/Bookmark/delete/${bookmark_id}`
 		};
 	},
-	update({ bookmark_id, url, title, tag=null }) {
+	update({ bookmark_id, url, title, tag }) {
 		return {
 			method: 'post',
 			url: `/api/frontend/v1/Bookmark/update/${bookmark_id}`,
-			params: { url, title }
+			params: { url, title, tag }
 		};
 	},
-	insert({ url, title, tag }) {
+	insert({ url, title, tag, sort }) {
 		return {
 			method: 'post',
 			url: `/api/frontend/v1/Bookmark/insert`,
-			params: { url, title, tag }
+			params: { url, title, tag, sort }
 		}; 
+	},
+	changeOrder(bookmark_id1, bookmark_id2) {
+		return {
+			method: 'post',
+			url: `/api/frontend/v1/Bookmark/changeOrder/${bookmark_id1}/${bookmark_id2}`,
+		};
 	}
 };

public/js/apps/Cis.js

@@ -1,211 +0,0 @@
-import FhcSearchbar from "../components/searchbar/searchbar.js";
-import CisMenu from "../components/Cis/Menu.js";
-import PluginsPhrasen from "../plugins/Phrasen.js";
-import Theme from "../plugins/Theme.js";
-
-import ApiSearchbar from "../api/factory/searchbar.js";
-import ApiLvPlan from "../api/factory/lvPlan.js";
-
-const app = Vue.createApp({
-	name: "CisApp",
-	components: {
-		FhcSearchbar,
-		CisMenu,
-	},
-	data: function () {
-		return {
-			searchbaroptions: {
-				origin: "cis",
-				cssclass: "",
-				calcheightonly: true,
-				types: {
-					employee: Vue.computed(() =>
-						this.$p.t("search/type_employee"),
-					),
-					student: Vue.computed(() =>
-						this.$p.t("search/type_student"),
-					),
-					room: Vue.computed(() => this.$p.t("search/type_room")),
-					organisationunit: Vue.computed(() =>
-						this.$p.t("search/type_organisationunit"),
-					),
-					cms: Vue.computed(() => this.$p.t("search/type_cms")),
-					dms: Vue.computed(() => this.$p.t("search/type_dms")),
-				},
-				actions: {
-					employee: {
-						defaultaction: {
-							type: "link",
-							action: function (data) {
-								return (
-									FHC_JS_DATA_STORAGE_OBJECT.app_root +
-									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-									"/Cis/Profil/View/" +
-									data.uid
-								);
-							},
-						},
-						childactions: [],
-					},
-					student: {
-						defaultaction: {
-							type: "link",
-							action: function (data) {
-								return (
-									FHC_JS_DATA_STORAGE_OBJECT.app_root +
-									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-									"/Cis/Profil/View/" +
-									data.uid
-								);
-							},
-						},
-						childactions: [],
-					},
-					room: {
-						defaultaction: {
-							type: "link",
-							renderif: function (data) {
-								if (data.content_id === null) {
-									return false;
-								}
-								return true;
-							},
-							action: function (data) {
-								const link =
-									FHC_JS_DATA_STORAGE_OBJECT.app_root +
-									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-									"/CisVue/Cms/content/" +
-									data.content_id;
-								return link;
-							},
-						},
-						childactions: [
-							{
-								label: "LV-Plan",
-								icon: "fas fa-bookmark",
-								type: "link",
-								action: function (data) {
-									const link =
-										FHC_JS_DATA_STORAGE_OBJECT.app_root +
-										FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-										"/CisVue/Cms/getRoomInformation/" +
-										data.ort_kurzbz;
-									return link;
-								},
-							},
-							{
-								label: "Rauminformation",
-								icon: "fas fa-info-circle",
-								type: "link",
-								renderif: function (data) {
-									if (data.content_id === null) {
-										return false;
-									}
-									return true;
-								},
-								action: function (data) {
-									const link =
-										FHC_JS_DATA_STORAGE_OBJECT.app_root +
-										FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-										"/CisVue/Cms/content/" +
-										data.content_id;
-									return link;
-								},
-							},
-						],
-					},
-					organisationunit: {
-						defaultaction: {
-							type: "link",
-							renderif: function (data) {
-								if (data.mailgroup) {
-									return true;
-								}
-								return false;
-							},
-							action: function (data) {
-								const link = "mailto:" + data.mailgroup;
-								return link;
-							},
-						},
-						childactions: [],
-					},
-					cms: {
-						defaultaction: {
-							type: "link",
-							action: function (data) {
-								const link =
-									FHC_JS_DATA_STORAGE_OBJECT.app_root +
-									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-									"/CisVue/Cms/content/" +
-									data.content_id;
-								return link;
-							},
-						},
-						childactions: [],
-					},
-					dms: {
-						defaultaction: {
-							type: "link",
-							action: function (data) {
-								const link =
-									FHC_JS_DATA_STORAGE_OBJECT.app_root +
-									"cms/dms.php?id=" +
-									data.dms_id;
-								return link;
-							},
-						},
-						childactions: [],
-					},
-				},
-			},
-		};
-	},
-	methods: {
-		searchfunction: function (searchsettings) {
-			return this.$api.call(ApiSearchbar.searchCis(searchsettings));
-		},
-	},
-	async mounted() {
-		const openOtherLvPlanAction = {
-			label: Vue.computed(() => this.$p.t("lehre/stundenplan")),
-			icon: "fas fa-calendar-days",
-			type: "link",
-			action: function (data) {
-				const uid = JSON.parse(data.data).uid;
-				const link =
-					FHC_JS_DATA_STORAGE_OBJECT.app_root +
-					FHC_JS_DATA_STORAGE_OBJECT.ci_router +
-					"/Cis/OtherLvPlan/" +
-					uid;
-				return link;
-			},
-		};
-		let checkPermissionOtherLvPlanResult = await this.$api.call(
-			ApiLvPlan.checkPermissionOtherLvPlan(),
-		);
-		if (
-			checkPermissionOtherLvPlanResult.meta.status === "success" &&
-			checkPermissionOtherLvPlanResult.data
-		) {
-			this.searchbaroptions.actions.employee.childactions.push(
-				openOtherLvPlanAction,
-			);
-			this.searchbaroptions.actions.student.childactions.push(
-				openOtherLvPlanAction,
-			);
-		}
-	},
-});
-
-FhcApps.makeExtendable(app);
-
-app.use(primevue.config.default, {
-	zIndex: {
-		overlay: 9000,
-		tooltip: 8000,
-	},
-});
-app.use(PluginsPhrasen);
-app.use(Theme);
-app.mount("#cis-header");

public/js/apps/Cis/Cis.js

@@ -11,7 +11,7 @@ import Raumsuche from "../../components/Cis/Raumsuche/Raumsuche.js";
 import CmsNews from "../../components/Cis/Cms/News.js";
 import CmsContent from "../../components/Cis/Cms/Content.js";
 import Info from "../../components/Cis/Mylv/Semester/Studiengang/Lv/Info.js";
-import RoomInformation, {DEFAULT_MODE_RAUMINFO} from "../../components/Cis/Mylv/RoomInformation.js";
+import RoomInformation, {DEFAULT_MODE_RAUMINFO_DESKTOP, DEFAULT_MODE_RAUMINFO_MOBILE} from "../../components/Cis/Mylv/RoomInformation.js";
 import AbgabetoolStudent from "../../components/Cis/Abgabetool/AbgabetoolStudent.js";
 import AbgabetoolMitarbeiter from "../../components/Cis/Abgabetool/AbgabetoolMitarbeiter.js";
 import AbgabetoolAssistenz from "../../components/Cis/Abgabetool/AbgabetoolAssistenz.js";
@@ -20,11 +20,11 @@ import Studium from "../../components/Cis/Studium/Studium.js";
 import StgOrgLvPlan from "../../components/Cis/LvPlan/StgOrg.js";
 import OtherLvPlan from "../../components/Cis/LvPlan/OtherLvPlan.js";
 
-import ApiRenderers from '../../api/factory/renderers.js';
 import ApiRouteInfo from '../../api/factory/routeinfo.js';
 import {capitalize} from "../../helpers/StringHelpers.js";
 
 const ciPath = FHC_JS_DATA_STORAGE_OBJECT.app_root.replace(/(https:|)(^|\/\/)(.*?\/)/g, '') + FHC_JS_DATA_STORAGE_OBJECT.ci_router;
+const isMobile = window.matchMedia("(max-width: 767px)").matches;
 
 const router = VueRouter.createRouter({
 	history: VueRouter.createWebHistory(`/${ciPath}`),
@@ -87,7 +87,7 @@ const router = VueRouter.createRouter({
 					name: "RoomInformation",
 					params: { // in this case always populate other params since they are not optional
 						ort_kurzbz: to.params.ort_kurzbz,
-						mode: DEFAULT_MODE_RAUMINFO,
+						mode: isMobile ? DEFAULT_MODE_RAUMINFO_MOBILE : DEFAULT_MODE_RAUMINFO_DESKTOP,
 						focus_date: new Date().toISOString().split("T")[0]
 					},
 				};
@@ -104,7 +104,7 @@ const router = VueRouter.createRouter({
 				const mode = route.params.mode &&
 				validModes.includes(route.params.mode.charAt(0).toUpperCase() + route.params.mode.slice(1).toLowerCase())
 					? route.params.mode.charAt(0).toUpperCase() + route.params.mode.slice(1).toLowerCase()
-					: DEFAULT_MODE_RAUMINFO;
+					: (isMobile ? DEFAULT_MODE_RAUMINFO_MOBILE : DEFAULT_MODE_RAUMINFO_DESKTOP);
 
 				// default to today date if not provided
 				const d = new Date(route.params.focus_date)
@@ -249,24 +249,15 @@ const router = VueRouter.createRouter({
 })
 
 const app = Vue.createApp({
-	name: 'FhcApp',
+	name: 'CisApp',
 	data: () => ({
 		appSideMenuEntries: {},
-		renderers: null,
+		windowWidth: 0,
 	}),
-	components: {},
-	computed: {
-		isMobile() {
-			const smallScreen = window.matchMedia("(max-width: 767px)").matches;
-			const touchCapable = ("ontouchstart" in window) || navigator.maxTouchPoints > 0;
-			return smallScreen;// && touchCapable;
-		}	
-	},
 	provide() {
 		return { // provide injectable & watchable language property
 			language: Vue.computed(() => this.$p.user_language),
-			renderers: Vue.computed(() => this.renderers),
-			isMobile: this.isMobile
+			isMobile: Vue.computed(() => this.windowWidth < 767),
 		}	
 	},
 	methods: {
@@ -302,53 +293,21 @@ const app = Vue.createApp({
 				this.$router.push(route);
 				
 			}
-		}
+		},
+		handleWindowResize() {
+			this.windowWidth = window.innerWidth;
+		},
 	},
-	async created(){
-		await this.$api
-			.call(ApiRenderers.loadRenderers())
-			.then(res => res.data)
-			.then(data => {
-				for (let rendertype of Object.keys(data)) {
-					let modalTitle = null;
-					let modalContent = null;
-					let calendarEvent = null;
-					if (data[rendertype].modalTitle)
-						modalTitle = Vue.markRaw(Vue.defineAsyncComponent(() => import(data[rendertype].modalTitle)));
-					if (data[rendertype].modalContent) 	
-						modalContent = Vue.markRaw(Vue.defineAsyncComponent(() => import(data[rendertype].modalContent)));
-					if (data[rendertype].calendarEvent) 	
-						calendarEvent = Vue.markRaw(Vue.defineAsyncComponent(() => import(data[rendertype].calendarEvent)));
-
-					if (data[rendertype].calendarEventStyles){
-						var head = document.head;
-						if(!head.querySelector(`link[href="${data[rendertype].calendarEventStyles}"]`)){
-							var link = document.createElement("link");
-							link.type = "text/css";
-							link.rel = "stylesheet";
-							link.href = 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;
-				}
-			});
+	created() {
+		this.windowWidth = window.innerWidth;
 	},
-	mounted() {
+	async mounted() {
 		document.addEventListener('click', this.handleClick);
-		
+		window.addEventListener("resize", this.handleWindowResize);
 	},
 	beforeUnmount() {
 		document.removeEventListener('click', this.handleClick);
+		window.removeEventListener("resize", this.handleWindowResize);
 	},
 });
 
@@ -374,4 +333,4 @@ app.mount('#fhccontent');
 
 router.afterEach((to, from, failure) => {
 	app.config.globalProperties.$api.call(ApiRouteInfo.info('cis4', to.fullPath));
-});
+});

public/js/apps/Cis/Menu.js

@@ -0,0 +1,204 @@
+import FhcSearchbar from "../../components/searchbar/searchbar.js";
+import CisMenu from "../../components/Cis/Menu.js";
+import PluginsPhrasen from '../../plugins/Phrasen.js';
+import Theme from "../../plugins/Theme.js";
+import ApiSearchbar from '../../api/factory/searchbar.js';
+import ApiLvPlan from "../../api/factory/lvPlan.js";
+
+const app = Vue.createApp({
+    name: 'CisMenuApp',
+    components: {
+        FhcSearchbar,
+        CisMenu
+    },
+    data: function() {
+        return {
+            searchbaroptions: {
+				origin: "cis",
+				cssclass: "",
+				calcheightonly: true,
+				types: {
+					employee: Vue.computed(() => this.$p.t("search/type_employee")),
+					student: Vue.computed(() => this.$p.t("search/type_student")),
+					room: Vue.computed(() => this.$p.t("search/type_room")),
+					organisationunit: Vue.computed(() => this.$p.t("search/type_organisationunit")),
+					cms: Vue.computed(() => this.$p.t("search/type_cms")),
+					dms: Vue.computed(() => this.$p.t("search/type_dms"))
+				},
+                actions: {
+                    employee: {
+                        defaultaction: {
+                            type: "link",
+                            action: function(data) {
+									return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router+
+										"/Cis/Profil/View/"+data.uid;
+							}
+						},
+                        childactions: []
+					},
+					student: {
+						defaultaction: {
+							type: "link",
+							action: function (data) {
+								return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+									"/Cis/Profil/View/" + data.uid;
+
+							}
+						},
+						childactions: []
+					},
+                    room: {
+                        defaultaction: {
+                            type: "link",
+							renderif: function(data) {
+								if(data.content_id === null){
+									return false;
+								}
+								return true;
+							},
+                            action: function(data) { 
+								const link= FHC_JS_DATA_STORAGE_OBJECT.app_root +
+									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+									'/CisVue/Cms/content/' + data.content_id;
+								return link;
+                            }
+                        },
+                        childactions: [
+                            {
+                                label: "LV-Plan",
+                                icon: "fas fa-bookmark",
+                                type: "link",
+                                action: function(data) {
+									const link = FHC_JS_DATA_STORAGE_OBJECT.app_root +
+										FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+										'/CisVue/Cms/getRoomInformation/' + data.ort_kurzbz;
+									return link;
+                                }
+                            },
+                            {
+                                label: "Rauminformation",
+                                icon: "fas fa-info-circle",
+                                type: "link",
+                                renderif: function(data) {
+									if(data.content_id === null){
+										return false;
+									}
+									return true;
+                                },
+                                action: function(data) {
+									const link= FHC_JS_DATA_STORAGE_OBJECT.app_root +
+										FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+										'/CisVue/Cms/content/' + data.content_id;
+									return link;
+                                }
+                            },
+                        ]
+                    },
+                    organisationunit: {
+                        defaultaction: {
+                            type: "link",
+							renderif: function(data) {
+								if(data.mailgroup) {
+									return true;
+								}
+								return false;
+							},
+                            action: function(data) {
+                                const link = 'mailto:' + data.mailgroup;
+								return link;
+                            }
+                        },
+                        childactions: []
+                    },
+					cms: {
+						defaultaction: {
+							type: "link",
+							action: function (data) {
+								const link = FHC_JS_DATA_STORAGE_OBJECT.app_root +
+									FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+									'/CisVue/Cms/content/' + data.content_id;
+								return link;
+							}
+						},
+						childactions: []
+					},
+					dms: {
+						defaultaction: {
+							type: "link",
+							action: function (data) {
+								const link = FHC_JS_DATA_STORAGE_OBJECT.app_root +
+									'cms/dms.php?id=' + data.dms_id;
+								return link;
+							}
+						},
+						childactions: []
+					}
+                }
+            },
+			windowWidth: 0,
+        };
+    },
+	provide() {
+		return {
+			isNarrow: Vue.computed(() => this.windowWidth < 992),
+			isMobile: Vue.computed(() => this.windowWidth < 767),
+		}
+	},
+    methods: {
+        searchfunction: function(searchsettings) {
+        	return this.$api.call(ApiSearchbar.searchCis(searchsettings));
+        },
+		handleWindowResize() {
+			this.windowWidth = window.innerWidth;
+		},
+    },
+	created() {
+		this.windowWidth = window.innerWidth;
+	},
+	async mounted() {
+		const openOtherLvPlanAction = {
+			label: Vue.computed(() => this.$p.t("lehre/stundenplan")),
+			icon: "fas fa-calendar-days",
+			type: "link",
+			action: function (data) {
+				const uid = JSON.parse(data.data).uid;
+				const link =
+					FHC_JS_DATA_STORAGE_OBJECT.app_root +
+					FHC_JS_DATA_STORAGE_OBJECT.ci_router +
+					"/Cis/OtherLvPlan/" +
+					uid;
+				return link;
+			},
+		};
+		let checkPermissionOtherLvPlanResult = await this.$api.call(
+			ApiLvPlan.checkPermissionOtherLvPlan(),
+		);
+		if (
+			checkPermissionOtherLvPlanResult.meta.status === "success" &&
+			checkPermissionOtherLvPlanResult.data
+		) {
+			this.searchbaroptions.actions.employee.childactions.push(
+				openOtherLvPlanAction,
+			);
+			this.searchbaroptions.actions.student.childactions.push(
+				openOtherLvPlanAction,
+			);
+		}
+		window.addEventListener("resize", this.handleWindowResize);
+	},
+	beforeUnmount() {
+		window.removeEventListener("resize", this.handleWindowResize);
+	},
+});
+
+FhcApps.makeExtendable(app);
+
+app.use(primevue.config.default, {
+	zIndex: {
+		overlay: 9000,
+		tooltip: 8000
+	}
+})
+app.use(PluginsPhrasen);
+app.use(Theme);
+app.mount('#cis-header');

public/js/apps/Dashboard/Admin.js

@@ -3,13 +3,10 @@ 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: 'DashboardAdminApp',
 	data: () => ({
-		appSideMenuEntries: {},
-		renderers: null
+		appSideMenuEntries: {}
 	}),
 	components: {
 		CoreNavigationCmpt,
@@ -17,51 +14,16 @@ const app = Vue.createApp({
 	},
 	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(primevue.config.default, {
+	zIndex: {
+		overlay: 9000,
+		tooltip: 8000
+	}
+})
 app.use(PluginsPhrasen);
 app.directive('tooltip', primevue.tooltip);
 app.mount('#main');

public/js/apps/DashboardAdmin_DEPR.js

@@ -1,16 +0,0 @@
-import {CoreNavigationCmpt} from '../components/navigation/Navigation.js';
-import DashboardAdmin from '../components/Dashboard/Admin.js';
-import Phrases from "../plugin/Phrasen.js"
-
-Vue.createApp({
-  name: 'DashboardAdminApp',
-  data: () => ({
-      appSideMenuEntries: {}
-    }),
-  components: {
-    CoreNavigationCmpt,
-    DashboardAdmin
-  },
-  mounted() {
-  }
-}).use(Phrases).mount('#main');

public/js/components/Calendar/Base/DragAndDrop.js

@@ -20,7 +20,8 @@ export default {
 	},
 	inject: {
 		mode: "mode",
-		dropableEvents: "dropableEvents"
+		dropableEvents: "dropableEvents",
+		timezone: "timezone"
 	},
 	props: {
 		events: Array,

public/js/components/Calendar/Base/Grid/Line.js

@@ -1,5 +1,5 @@
-import LineEvent from './Line/Event.js';
-import LineBackground from './Line/Background.js';
+import LineEvent from "./Line/Event.js";
+import LineBackground from "./Line/Background.js";
 
 /**
  * TODO(chris):
@@ -10,54 +10,117 @@ export default {
 	name: "GridLine",
 	components: {
 		LineEvent,
-		LineBackground
-	},
-	inject: {
-		axisRow: "axisRow"
+		LineBackground,
 	},
+	inject: ["axisRow", "shouldCompactEvents", "compactibleEventTypes"],
 	props: {
 		date: {
 			type: luxon.DateTime,
-			required: true
+			required: true,
 		},
 		start: {
 			type: luxon.DateTime,
-			required: true
+			required: true,
 		},
 		end: {
 			type: luxon.DateTime,
-			required: true
+			required: true,
 		},
 		events: {
 			type: Array,
-			default: []
+			default: [],
 		},
 		backgrounds: {
 			type: Array,
-			default: []
-		}
+			default: [],
+		},
 	},
 	computed: {
-		eventsWithRowInfo() {
-			const events = [];
-			this.events.forEach(event => {
-				const rows = [1, -1];
+		formattedEvents() {
+			let formattedEvents = this.events.map((event) => {
+				event.rows = [1, -1];
 				if (event.startsHere) {
-					rows[0] = 't_' + event.start.diff(this.date).toMillis();
+					event.rows[0] =
+						"t_" + event.start.diff(this.date).toMillis();
 				}
 				if (event.endsHere) {
-					rows[1] = 't_' + event.end.diff(this.date).toMillis();
+					event.rows[1] = "t_" + event.end.diff(this.date).toMillis();
 				}
 
-				events.push({
-					...event,
-					rows
-				});
+				return event;
 			});
-			return events;
-		}
+
+			if (this.shouldCompactEvents && this.compactibleEventTypes?.length) {
+				formattedEvents =
+					this.compactEvents(formattedEvents, this.compactibleEventTypes);
+			}
+
+			return formattedEvents;
+		},
 	},
-	template: /* html */`
+	methods: {
+		compactEvents(events, compactibleEventTypes) {
+			let formattedEvents = events
+				.filter(
+					(event) =>
+						!compactibleEventTypes.includes(event.type),
+				)
+				.map((event) => {
+					event.display = "default";
+					return event;
+				});
+			let eventsToBeCompacted = events.filter((event) =>
+				compactibleEventTypes.includes(event.type),
+			);
+			let compactedEvents = [];
+
+			eventsToBeCompacted.forEach((event) => {
+				let existingCompactedEvent = compactedEvents.find(
+					(compactedEvent) =>
+						event.rows[0] === compactedEvent.rows[0] &&
+						event.rows[1] === compactedEvent.rows[1],
+				);
+
+				if (!existingCompactedEvent) {
+					compactedEvents.push({
+						events: [
+							{
+								farbe: event.orig.farbe,
+							},
+						],
+						rows: event.rows,
+					});
+				} else {
+					existingCompactedEvent.events.push({
+						farbe: event.orig.farbe,
+					});
+				}
+			});
+
+			compactedEvents.forEach((compactedEvent) => {
+				if (compactedEvent.events.length < 4) {
+					formattedEvents.push({
+						display: "compacted",
+						...compactedEvent,
+					});
+				} else {
+					formattedEvents.push({
+						display: "compacted",
+						events: compactedEvent.events.slice(0, 3),
+						rows: compactedEvent.rows,
+					});
+					formattedEvents.push({
+						display: "compactedExtra",
+						events: compactedEvent.events.slice(3),
+						rows: compactedEvent.rows,
+					});
+				}
+			});
+
+			return formattedEvents;
+		},
+	},
+	template: /* html */ `
 	<div
 		class="fhc-calendar-base-grid-line"
 		style="position:relative;display:grid;grid-auto-flow:dense"
@@ -69,17 +132,38 @@ export default {
 			:end="end"
 			:background="bg"
 		></line-background>
-		<line-event
-			v-for="(event, i) in eventsWithRowInfo"
-			:key="i"
-			:style="'grid-' + axisRow + ': ' + event.rows.join('/')"
-			:event="event"
-		>
-			<template v-slot="slot">
-				<slot name="event" v-bind="slot" />
-			</template>
-		</line-event>
+		<template v-for="(event, i) in formattedEvents" :key="i">
+			<line-event
+				v-if="!event.display || event.display === 'default'"
+				:style="'grid-' + axisRow + ': ' + event.rows.join('/')"
+				:event="event"
+			>
+				<template v-slot="slot">
+					<slot name="event" v-bind="slot" />
+				</template>
+			</line-event>
+			<div
+				v-else-if="event.display === 'compacted'"
+				:style="'grid-' + axisRow + ': ' + event.rows.join('/')"
+				class="d-flex flex-row justify-content-center gap-1 align-items-center"
+			>
+				<span
+					v-for="(subEvent, subEventIndex) in event.events"
+					:key="subEventIndex"
+					:style="subEvent.farbe ? {'background-color': '#' + subEvent.farbe} : {}"
+					style="height:10px; width:10px;"
+					class="border border-dark rounded-circle"
+				></span>
+			</div>
+			<div
+				v-else-if="event.display === 'compactedExtra'"
+				:style="'grid-' + axisRow + ': ' + event.rows.join('/')"
+				class="w-100 d-flex flex-row justify-content-center"
+			>
+				{{"+" + event.events.length}}
+			</div>
+		</template>
 		<slot name="dropzone" />
 	</div>
-	`
-}
+	`,
+};

public/js/components/Calendar/LvPlan.js

@@ -3,24 +3,20 @@ import FhcCalendar from "./Base.js";
 import ApiLvPlan from '../../api/factory/lvPlan.js';
 
 import { useEventLoader } from '../../composables/EventLoader.js';
+import { useRenderers } from '../../composables/Renderers.js';
 
 import ModeDay from './Mode/Day.js';
 import ModeWeek from './Mode/Week.js';
 import ModeMonth from './Mode/Month.js';
+import ModeList from './Mode/List.js';
 
 export default {
 	name: "CalendarLvPlan",
 	components: {
 		FhcCalendar
 	},
-	inject: [
-		"renderers"
-	],
+	inject: ["isMobile"],
 	props: {
-		timezone: {
-			type: String,
-			required: true
-		},
 		date: {
 			type: [Date, String, Number, luxon.DateTime],
 			default: luxon.DateTime.local()
@@ -34,6 +30,16 @@ export default {
 			required: true
 		}
 	},
+	provide() {
+		return {
+			shouldCompactEvents: Vue.computed(
+				() => this.$props.mode === "Month" && this.isMobile,
+			),
+			compactibleEventTypes: Vue.computed(
+				() => this.compactibleEventTypes,
+			),
+		};
+	},
 	emits: [
 		"update:date",
 		"update:mode",
@@ -41,11 +47,7 @@ export default {
 	],
 	data() {
 		return {
-			modes: {
-				day: Vue.markRaw(ModeDay),
-				week: Vue.markRaw(ModeWeek),
-				month: Vue.markRaw(ModeMonth)
-			},
+			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone,
 			modeOptions: {
 				day: {
 					emptyMessage: Vue.computed(() => this.$p.t('lehre/noLvFound')),
@@ -53,9 +55,13 @@ export default {
 				},
 				week: {
 					collapseEmptyDays: false
-				}
+				},
+				list: {
+					length: 7,
+				},
 			},
-			teachingunits: null
+			teachingunits: null,
+			compactibleEventTypes: [],
 		};
 	},
 	computed: {
@@ -77,7 +83,20 @@ export default {
 					label: now.startOf('minute').toISOTime({ suppressSeconds: true, includeOffset: false })
 				}
 			];
-		}
+		},
+		modes() {
+			let modes = {
+				day: Vue.markRaw(ModeDay),
+				month: Vue.markRaw(ModeMonth),
+			};
+			if (this.isMobile) {
+				modes.list = Vue.markRaw(ModeList);
+			} else {
+				modes.week = Vue.markRaw(ModeWeek);
+			}
+
+			return modes;
+		},
 	},
 	methods: {
 		eventStyle(event) {
@@ -91,7 +110,21 @@ export default {
 		},
 		resetEventLoader() {
 			this.reset();
-		}
+		},
+		async getStunden() {
+			let stundenResponse = await this.$api.call(ApiLvPlan.getStunden());
+			this.teachingunits = stundenResponse.data.map((el) => ({
+				id: el.stunde,
+				start: el.beginn,
+				end: el.ende,
+			}));
+		},
+		async getCompactibleEventTypes() {
+			let compactibleEventTypesResponse = await this.$api.call(
+				ApiLvPlan.getCompactibleEventTypes(),
+			);
+			this.compactibleEventTypes = compactibleEventTypesResponse.data;
+		},
 	},
 	setup(props, context) {
 		const rangeInterval = Vue.ref(null);
@@ -102,23 +135,19 @@ export default {
 			context.emit('update:lv', newValue);
 		});
 
+		const { renderers } = useRenderers();
+
 		return {
 			rangeInterval,
 			events,
 			lv,
-			reset
+			reset,
+			renderers
 		};
 	},
-	created() {
-		this.$api
-			.call(ApiLvPlan.getStunden())
-			.then(res => {
-				return this.teachingunits = res.data.map(el => ({
-					id: el.stunde,
-					start: el.beginn,
-					end: el.ende
-				}));
-			});
+	async created() {
+		await this.getStunden();
+		await this.getCompactibleEventTypes();
 	},
 	template: /* html */`
 	<fhc-calendar
@@ -140,6 +169,13 @@ export default {
 	>
 		<template v-slot="{ event, mode }">
 			<div
+				v-if="!event"
+				class="h-100 d-flex justify-content-center align-items-center"
+			>
+				{{ $p.t('lehre/noLvFound') }}
+			</div>
+			<div
+				v-else
 				:class="'event-type-' + event.type + ' ' + mode + 'PageContainer'"
 				:type="mode == 'day' ? 'button' : undefined"
  				:style="eventStyle(event)"
@@ -158,6 +194,9 @@ export default {
 					v-else
 					:is="renderers[event.type]?.calendarEvent"
 					:event="event"
+					:timeSlotDisplayBehavior="
+						$props.mode.toLowerCase() === 'list' ? 'always' : 'default'
+					"
 				></component>
 			</div>
 		</template>

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

@@ -93,7 +93,7 @@ export default {
 	mounted() {
 		this.$emit('update:range', this.range);
 	},
-	template: `
+	template: /*html*/ `
 	<div
 		class="fhc-calendar-mode-list flex-grow-1 position-relative"
 		@cal-click-default.capture="handleClickDefaults"

public/js/components/Calendar/Widget.js

@@ -1,6 +1,7 @@
 import FhcCalendar from "./Base.js";
 
 import { useEventLoader } from '../../composables/EventLoader.js';
+import { useRenderers } from '../../composables/Renderers.js';
 
 import ModeList from '../Calendar/Mode/List.js';
 
@@ -9,22 +10,17 @@ export default {
 	components: {
 		FhcCalendar
 	},
-	inject: [
-		"renderers"
-	],
 	props: {
-		timezone: {
-			type: String,
-			required: true
-		},
 		getPromiseFunc: {
 			type: Function,
 			required: true
 		}
 	},
 	data() {
+		const timezone = FHC_JS_DATA_STORAGE_OBJECT.timezone;
 		return {
-			now: luxon.DateTime.now().setZone(this.timezone),
+			timezone,
+			now: luxon.DateTime.now().setZone(timezone),
 			modes: {
 				list: Vue.markRaw(ModeList)
 			},
@@ -59,10 +55,12 @@ export default {
 		const rangeInterval = Vue.ref(null);
 		
 		const { events } = useEventLoader(rangeInterval, props.getPromiseFunc);
+		const { renderers } = useRenderers();
 
 		return {
 			rangeInterval,
-			events
+			events,
+			renderers
 		};
 	},
 	template: /* html */`
@@ -99,6 +97,7 @@ export default {
 				<component
 					:is="renderers[event.type]?.calendarEvent"
 					:event="event"
+					:timeSlotDisplayBehavior="'always'"
 				></component>
 			</div>
 		</template>

public/js/components/Cis/Cms/News.js

@@ -2,115 +2,137 @@ import Pagination from "../../Pagination/Pagination.js";
 import StudiengangInformation from "./StudiengangInformation/StudiengangInformation.js";
 import BsConfirm from "../../Bootstrap/Confirm.js";
 
-import ApiCms from '../../../api/factory/cms.js';
+import ApiCms from "../../../api/factory/cms.js";
 
 export default {
 	name: "NewsComponent",
-  components: {
-    Pagination,
-	StudiengangInformation,
-  },
-  data() {
-    return {
-      content: null,
-      maxPageCount: 0,
-      page_size: 10,
-	  page:1,
-    };
-  },
-  watch:{
-	'$p.user_language.value':function(sprache){
-		this.fetchNews();
-	}
-  },
-  computed:{
-	sprache: function(){
-		return this.$p.user_language.value;
+	components: {
+		Pagination,
+		StudiengangInformation,
 	},
-  },
-  methods: {
-		fetchNews() {
-			return this.$api
-				.call(ApiCms.getNews(this.page, this.page_size, this.sprache))
-				.then(res => res.data)
-				.then(result => {
-					this.content = result;
+	inject: ["isMobile"],
+	data() {
+		return {
+			content: null,
+			maxPageCount: 0,
+			page_size: 10,
+			page: 1,
+		};
+	},
+	watch: {
+		"$p.user_language.value": function (sprache) {
+			this.fetchNews();
+		},
+	},
+	computed: {
+		sprache: function () {
+			return this.$p.user_language.value;
+		},
+	},
+	methods: {
+		async fetchNews() {
+			let newsResponse = await this.$api.call(
+				ApiCms.getNews(this.page, this.page_size, this.sprache),
+			);
+			this.content = newsResponse.data;
 
-					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));
+			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(() => {
-								});
-						});
-					});
-					document.querySelectorAll("#cms [data-href]").forEach((el) => {
-						el.href = el.dataset.href.replace(
-							/^ROOT\//,
-							FHC_JS_DATA_STORAGE_OBJECT.app_root
-						);
-					});
-					Vue.nextTick(()=>{
-						document.querySelectorAll(".card-header").forEach((el) => {
-							el.classList.add("fhc-primary");
-						});
-						document.querySelectorAll(".row").forEach((el) => {
-							el.classList.add("w-100");
-							el.classList.add("align-items-center");
-							
-						});
-						document.querySelectorAll(".row h2").forEach((el) => {
-							el.classList.add("mb-0");
-						});
+								.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,
+				);
+			});
 
-					})
+			await this.$nextTick();
+			this.formatExternalHtml();
+		},
+		async loadNewPageContent(data) {
+			let newsResponse = await this.$api.call(
+				ApiCms.getNews(data.page, data.rows),
+			);
+			this.content = newsResponse.data;
+
+			await this.$nextTick();
+
+			this.formatExternalHtml();
+		},
+		formatExternalHtml() {
+			document
+				.querySelectorAll(".news-list-item .card-header")
+				.forEach((el) => {
+					el.classList.add("fhc-primary");
+				});
+			document.querySelectorAll(".news-list-item .row").forEach((el) => {
+				el.classList.add("w-100");
+				el.classList.add("align-items-center");
+			});
+			document
+				.querySelectorAll(".news-list-item .row h2")
+				.forEach((el) => {
+					el.classList.add("mb-0");
 				});
 		},
-		loadNewPageContent(data) {
-			this.$api
-				.call(ApiCms.getNews(data.page, data.rows))
-				.then(res => res.data)
-				.then(result => {
-					this.content = result;
-					
-				});
-		}
-  },
-  created() {
-    this.fetchNews();
+		afterPageUpdated(event) {
+			this.page = event.page;
+			this.page_size = event.rows;
+			this.$refs.newsPageHeading.scrollIntoView({block: 'end'});
+			this.loadNewPageContent(event);
+		},
+	},
+	created() {
+		this.fetchNews();
 
 		this.$api
 			.call(ApiCms.getNewsRowCount())
-			.then(res => res.data)
-			.then(result => {
+			.then((res) => res.data)
+			.then((result) => {
 				this.maxPageCount = result;
 			});
-  },
-  template: /*html*/ `
-  	<h2 class="fhc-primary-color">News</h2>
-	<hr/>
-	<pagination v-show="content?true:false" :page_size="page_size"  @page="page=$event.page; loadNewPageContent($event)" :maxPageCount="maxPageCount">
-	</pagination>
-	<div class="container-fluid mt-4">
-		<div class="row">
-			<div class="col" v-html="content">
-			</div>
-			<div class="col-auto">
-				<div style="width:15rem">
-					<studiengang-information></studiengang-information>
+	},
+	template: /*html*/ `
+	<div :class="{'pb-3': isMobile}" class="overflow-x-hidden">
+  		<h2 ref="newsPageHeading" class="fhc-primary-color">News</h2>
+		<hr/>
+		<pagination
+			v-if="content?true:false"
+			:page="page"
+			:page_size="page_size"
+			@pageUpdated="afterPageUpdated($event)"
+			:maxPageCount="maxPageCount"
+		></pagination>
+		<div class="container-fluid mt-4">
+			<div class="row">
+				<div class="col" v-html="content">
+				</div>
+				<div class="col-auto">
+					<div style="width:15rem">
+						<studiengang-information></studiengang-information>
+					</div>
 				</div>
 			</div>
 		</div>
+		<pagination
+			v-if="content?true:false"
+			:page="page"
+			:page_size="page_size"
+			@pageUpdated="afterPageUpdated($event)"
+			:maxPageCount="maxPageCount"
+		></pagination>
 	</div>
-	<pagination v-show="content?true:false" :page_size="page_size"  @page="loadNewPageContent" :maxPageCount="maxPageCount">
-	</pagination>
     `,
 };

public/js/components/Cis/Cms/StudiengangInformation/StudiengangInformation.js

@@ -29,51 +29,51 @@ components:{
 },
 template:/*html*/`
 		<div id="fhc-studiengang-informationen">
-		<template v-if="studiengang?.bezeichnung && semester">
-			<div class="card card-body mb-3 border-0">
-				<div class="mb-1">
-					<h2 class="h4 mb-1 pb-0">{{$p.t('lehre','studiengang')}}:</h2>
-					<span class="mb-1">{{studiengang?.bezeichnung}}</span>
-				</div>
-				<div class="mb-1">
-					<h2 class="h4 mb-1 pb-0">Moodle:</h2>
-					<a class="fhc-link-color mb-1" target="_blank" :href="moodleLink">{{studiengang?.kurzbzlang}}</a>
-				</div>
-				<div :class="{'mb-1':studiengang?.zusatzinfo_html}">
-					<h2 class="h4 mb-1 pb-0">{{$p.t('lehre','studiensemester')}}: </h2>
-					<span class="mb-1">{{semester}}</span>
-				</div>
-				<div class="zusatzinfo" v-if="studiengang?.zusatzinfo_html" v-html="studiengang?.zusatzinfo_html"></div>
-			</div>
-		</template>
-		<template v-for="{title, collection} in collection_array">
-			<template v-if="Array.isArray(collection)  && collection.length !==0">
-				<h2 class="h5 text-truncate">{{title}}</h2>
-				<template v-if="displayWidget">
-					<div class="d-flex flex-wrap flex-row mb-3 gap-2">
-						<template v-for="person in collection">
-							<studiengang-person displayWidget v-bind="person"></studiengang-person>
-						</template>
+			<template v-if="studiengang?.bezeichnung && semester">
+				<div class="card card-body mb-3 border-0">
+					<div class="mb-1">
+						<h2 class="h4 mb-1 pb-0">{{$p.t('lehre','studiengang')}}:</h2>
+						<span class="mb-1">{{studiengang?.bezeichnung}}</span>
 					</div>
-				</template>
-				<template v-else>
-					<template v-for="person in collection">
-						<div class="mb-3">
-							<studiengang-person v-bind="person"></studiengang-person>
+					<div class="mb-1">
+						<h2 class="h4 mb-1 pb-0">Moodle:</h2>
+						<a class="fhc-link-color mb-1" target="_blank" :href="moodleLink">{{studiengang?.kurzbzlang}}</a>
+					</div>
+					<div :class="{'mb-1':studiengang?.zusatzinfo_html}">
+						<h2 class="h4 mb-1 pb-0">{{$p.t('lehre','studiensemester')}}: </h2>
+						<span class="mb-1">{{semester}}</span>
+					</div>
+					<div class="zusatzinfo" v-if="studiengang?.zusatzinfo_html" v-html="studiengang?.zusatzinfo_html"></div>
+				</div>
+			</template>
+			<template v-for="{title, collection} in collection_array">
+				<template v-if="Array.isArray(collection)  && collection.length !==0">
+					<h2 class="h5 text-truncate">{{title}}</h2>
+					<template v-if="displayWidget">
+						<div class="d-flex flex-wrap flex-row mb-3 gap-2">
+							<template v-for="person in collection">
+								<studiengang-person displayWidget v-bind="person"></studiengang-person>
+							</template>
 						</div>
 					</template>
+					<template v-else>
+						<template v-for="person in collection">
+							<div class="mb-3">
+								<studiengang-person v-bind="person"></studiengang-person>
+							</div>
+						</template>
+					</template>
 				</template>
 			</template>
-		</template>
-		<template v-if="hochschulvertr && Array.isArray(hochschulvertr) && hochschulvertr.length >0">
-			<studiengang-vertretung showBezeichnung :title="$p.t('studiengangInformation', 'Hochschulvertretung')" :vertretungsList="hochschulvertr"></studiengang-vertretung>
-		</template>
-		<template v-if="stdv && Array.isArray(stdv) && stdv.length >0">
-			<studiengang-vertretung :title="$p.t('studiengangInformation', 'Studienvertretung').concat(studiengang.kurzbzlang??'')" :vertretungsList="stdv"></studiengang-vertretung>
-		</template>
-		<template v-if="jahrgangsvertr && Array.isArray(jahrgangsvertr) && jahrgangsvertr.length >0">
-			<studiengang-vertretung :title="$p.t('studiengangInformation', 'Jahrgangsvertretung')" :vertretungsList="jahrgangsvertr"></studiengang-vertretung>
-		</template>
+			<template v-if="hochschulvertr && Array.isArray(hochschulvertr) && hochschulvertr.length >0">
+				<studiengang-vertretung showBezeichnung :title="$p.t('studiengangInformation', 'Hochschulvertretung')" :vertretungsList="hochschulvertr"></studiengang-vertretung>
+			</template>
+			<template v-if="stdv && Array.isArray(stdv) && stdv.length >0">
+				<studiengang-vertretung :title="$p.t('studiengangInformation', 'Studienvertretung').concat(studiengang?.kurzbzlang??'')" :vertretungsList="stdv"></studiengang-vertretung>
+			</template>
+			<template v-if="jahrgangsvertr && Array.isArray(jahrgangsvertr) && jahrgangsvertr.length >0">
+				<studiengang-vertretung :title="$p.t('studiengangInformation', 'Jahrgangsvertretung')" :vertretungsList="jahrgangsvertr"></studiengang-vertretung>
+			</template>
 		</div>
 	
 `,

public/js/components/Cis/Cms/StudiengangInformation/StudiengangPerson.js

@@ -27,7 +27,7 @@ export default {
 
 			<dl class="stgkontaktinfo">
 				<dt><i class="fa fa-phone me-2"></i></dt>
-				<dd class="mb-3"><a class="fhc-link-color" :href="phone.link">{{phone.number}}</a></dd>
+				<dd class="mb-3"><a class="fhc-link-color" :href="phone?.link">{{phone?.number}}</a></dd>
 
 				<dt><i class="fa fa-home me-2"></i></dt>
 				<dd class="mb-3">{{ort}}</dd>

public/js/components/Cis/LvPlan/Lehrveranstaltung.js

@@ -3,7 +3,8 @@ import FhcCalendar from "../../Calendar/LvPlan.js";
 import ApiLvPlan from '../../../api/factory/lvPlan.js';
 import ApiAuthinfo from '../../../api/factory/authinfo.js';
 
-export const DEFAULT_MODE_LVPLAN = 'Week'
+export const DEFAULT_MODE_LVPLAN_MOBILE = 'List';
+export const DEFAULT_MODE_LVPLAN_DESKTOP = 'Week';
 
 export default {
 	name: 'LvPlanLehrveranstaltung',
@@ -19,15 +20,21 @@ export default {
 			lv: null
 		};
 	},
+	inject: ["isMobile"],
 	computed:{
 		currentDay() {
 			if (!this.propsViewData?.focus_date || isNaN(new Date(this.propsViewData?.focus_date)))
-				return luxon.DateTime.now().setZone(this.viewData.timezone).toISODate();
+				return luxon.DateTime.now().setZone(FHC_JS_DATA_STORAGE_OBJECT.timezone).toISODate();
 			return this.propsViewData?.focus_date;
 		},
 		currentMode() {
-			if (!this.propsViewData?.mode || !['day', 'week', 'month'].includes(this.propsViewData?.mode.toLowerCase()))
-				return DEFAULT_MODE_LVPLAN;
+			let validModes = ['day', 'month'];
+			validModes.push(this.isMobile ? 'list' : 'week');
+
+			const defaultMode = this.isMobile ? DEFAULT_MODE_LVPLAN_MOBILE : DEFAULT_MODE_LVPLAN_DESKTOP;
+
+			if (!this.propsViewData?.mode || !validModes.includes(this.propsViewData?.mode.toLowerCase()))
+				return defaultMode;
 			return this.propsViewData?.mode;
 		},
 		currentLv() {
@@ -47,6 +54,17 @@ export default {
 			return this.lv.bezeichnung;
 		}
 	},
+	watch: {
+		async isMobile() {
+			await this.$nextTick();
+			this.handleChangeMode(
+				this.currentMode,
+				luxon.DateTime.fromISO(this.currentDay, {
+					zone: this.timezone,
+				}),
+			);
+		},
+	},
 	methods: {
 		handleChangeDate(day, newMode) {
 			return this.handleChangeMode(newMode, day);
@@ -95,7 +113,6 @@ export default {
 		<fhc-calendar
 			v-else-if="lv"
 			ref="calendar"
-			:timezone="viewData.timezone"
 			:get-promise-func="getPromiseFunc"
 			:date="currentDay"
 			:mode="currentMode"

public/js/components/Cis/LvPlan/LvPlan.js

@@ -3,7 +3,8 @@ import FhcCalendar from "../../Calendar/LvPlan.js";
 import ApiLvPlan from '../../../api/factory/lvPlan.js';
 import ApiAuthinfo from '../../../api/factory/authinfo.js';
 
-export const DEFAULT_MODE_LVPLAN = 'Week'
+export const DEFAULT_MODE_LVPLAN_MOBILE = 'List';
+export const DEFAULT_MODE_LVPLAN_DESKTOP = 'Week';
 
 export default {
 	name: 'LvPlan',
@@ -23,12 +24,14 @@ export default {
 			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone,
 		};
 	},
+	inject: ["isMobile"],
 	computed:{
 		currentDay() {
 			return this.propsViewData?.focus_date || luxon.DateTime.now().setZone(this.timezone).toISODate();
 		},
 		currentMode() {
-			return this.propsViewData?.mode || DEFAULT_MODE_LVPLAN;
+			const defaultMode = this.isMobile ? DEFAULT_MODE_LVPLAN_MOBILE : DEFAULT_MODE_LVPLAN_DESKTOP;
+			return this.propsViewData?.mode || defaultMode;
 		},
 		downloadLinks() {
 			if (!this.studiensemester_start || !this.studiensemester_ende || !this.uid)

public/js/components/Cis/LvPlan/MyLvPlan.js

@@ -3,7 +3,8 @@ import FhcCalendar from "../../Calendar/LvPlan.js";
 import ApiLvPlan from '../../../api/factory/lvPlan.js';
 import ApiAuthinfo from '../../../api/factory/authinfo.js';
 
-export const DEFAULT_MODE_LVPLAN = 'Week'
+export const DEFAULT_MODE_LVPLAN_DESKTOP = "Week";
+export const DEFAULT_MODE_LVPLAN_MOBILE = "List";
 
 export default {
 	name: 'LvPlanPersonal',
@@ -24,6 +25,7 @@ export default {
 			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone,
 		};
 	},
+	inject: ["isMobile"],
 	computed:{
 		currentDay() {
 			if (!this.propsViewData?.focus_date || isNaN(new Date(this.propsViewData?.focus_date)))
@@ -31,8 +33,18 @@ export default {
 			return this.propsViewData?.focus_date;
 		},
 		currentMode() {
-			if (!this.propsViewData?.mode || !['day', 'week', 'month'].includes(this.propsViewData?.mode.toLowerCase()))
-				return DEFAULT_MODE_LVPLAN;
+			let validModes = ["day", "month"];
+			validModes.push(this.isMobile ? "list" : "week");
+
+			const defaultMode = this.isMobile
+				? DEFAULT_MODE_LVPLAN_MOBILE
+				: DEFAULT_MODE_LVPLAN_DESKTOP;
+
+			if (
+				!this.propsViewData?.mode ||
+				!validModes.includes(this.propsViewData?.mode.toLowerCase())
+			)
+				return defaultMode;
 			return this.propsViewData?.mode;
 		},
 		downloadLinks() {
@@ -70,6 +82,17 @@ export default {
 			];
 		}
 	},
+	watch: {
+		async isMobile() {
+			await this.$nextTick();
+			this.handleChangeMode(
+				this.currentMode,
+				luxon.DateTime.fromISO(this.currentDay, {
+					zone: this.timezone,
+				}),
+			);
+		},
+	},
 	methods: {
 		handleChangeDate(day, newMode) {
 			return this.handleChangeMode(newMode, day);

public/js/components/Cis/LvPlan/OtherLvPlan.js

@@ -6,7 +6,8 @@ import ApiLvPlan from "../.././../api/factory/lvPlan.js";
 import ApiOtherLvPlan from "../.././../api/factory/otherLvPlan.js";
 import ApiAuthinfo from "../../../api/factory/authinfo.js";
 
-export const DEFAULT_MODE_LVPLAN = "Week";
+export const DEFAULT_MODE_LVPLAN_DESKTOP = "Week";
+export const DEFAULT_MODE_LVPLAN_MOBILE = "List";
 
 export default {
 	name: "OtherLvPlan",
@@ -37,6 +38,7 @@ export default {
 			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone,
 		};
 	},
+	inject: ["isMobile"],
 	computed: {
 		currentDay() {
 			if (
@@ -47,13 +49,18 @@ export default {
 			return this.propsViewData?.focus_date;
 		},
 		currentMode() {
+			let validModes = ["day", "month"];
+			validModes.push(this.isMobile ? "list" : "week");
+
+			const defaultMode = this.isMobile
+				? DEFAULT_MODE_LVPLAN_MOBILE
+				: DEFAULT_MODE_LVPLAN_DESKTOP;
+
 			if (
 				!this.propsViewData?.mode ||
-				!["day", "week", "month"].includes(
-					this.propsViewData?.mode.toLowerCase(),
-				)
+				!validModes.includes(this.propsViewData?.mode.toLowerCase())
 			)
-				return DEFAULT_MODE_LVPLAN;
+				return defaultMode;
 			return this.propsViewData?.mode;
 		},
 		downloadLinks() {
@@ -130,6 +137,15 @@ export default {
 				this.$router.go();
 			},
 		},
+		async isMobile() {
+			await this.$nextTick();
+			this.handleChangeMode(
+				this.currentMode,
+				luxon.DateTime.fromISO(this.currentDay, {
+					zone: this.timezone,
+				}),
+			);
+		},
 	},
 	methods: {
 		handleChangeDate(day, newMode) {

public/js/components/Cis/LvPlan/StgOrg.js

@@ -1,15 +1,16 @@
-import FormForm from '../../Form/Form.js';
-import FormInput from '../../Form/Input.js';
+import FormForm from "../../Form/Form.js";
+import FormInput from "../../Form/Input.js";
 import FhcCalendar from "../../Calendar/LvPlan.js";
 
 import ApiLvPlan from '../.././../api/factory/lvPlan.js';
 import ApiStgOrgLvPlan from '../.././../api/factory/stgOrgLvPlan.js';
 import ApiAuthinfo from '../../../api/factory/authinfo.js';
 
-export const DEFAULT_MODE_LVPLAN = 'Week';
+export const DEFAULT_MODE_LVPLAN_DESKTOP = "Week";
+export const DEFAULT_MODE_LVPLAN_MOBILE = "List";
 
 export default {
-	name: 'LvPlanStgOrg',
+	name: "LvPlanStgOrg",
 	components: {
 		FormForm,
 		FormInput,
@@ -28,24 +29,25 @@ export default {
 			isMitarbeiter: false,
 			isStudent: false,
 			currentStgBezeichnung: null,
-			formData:  {
+			formData: {
 				stgkz: null,
 				sem: null,
 				verband: null,
 				gruppe: null,
 			},
 			listStg: [],
-			listSem: [1,2,3,4,5,6,7,8,9,10],
+			listSem: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
 			listVerband: [],
 			listGroup: [],
 			rangeIntervalFirst: null,
 			timezone: FHC_JS_DATA_STORAGE_OBJECT.timezone,
 		};
 	},
+	inject: ["isMobile"],
 	computed: {
-		maxSemester(){
+		maxSemester() {
 			const currentStg = this.listStg.find(
-				item => item.studiengang_kz === this.formData.stgkz
+				(item) => item.studiengang_kz === this.formData.stgkz,
 			);
 			return currentStg?.max_semester;
 		},
@@ -55,19 +57,32 @@ export default {
 			return this.propsViewData?.focus_date;
 		},
 		currentMode() {
-			if (!this.propsViewData?.mode || !['day', 'week', 'month'].includes(this.propsViewData?.mode.toLowerCase()))
-				return DEFAULT_MODE_LVPLAN;
+			let validModes = ["day", "month"];
+			validModes.push(this.isMobile ? "list" : "week");
+
+			const defaultMode = this.isMobile
+				? DEFAULT_MODE_LVPLAN_MOBILE
+				: DEFAULT_MODE_LVPLAN_DESKTOP;
+
+			if (
+				!this.propsViewData?.mode ||
+				!validModes.includes(this.propsViewData?.mode.toLowerCase())
+			)
+				return defaultMode;
 			return this.propsViewData?.mode;
 		},
 		downloadLinks() {
-			if (!this.studiensemester_start || !this.studiensemester_ende || !this.uid)
+			if (
+				!this.studiensemester_start ||
+				!this.studiensemester_ende ||
+				!this.uid
+			)
 				return false;
 
 			let type = false;
-			type = this.isStudent ? 'student' : type;
-			type = this.isMitarbeiter ? 'lektor' : type;
-			if (false === type)
-			{
+			type = this.isStudent ? "student" : type;
+			type = this.isMitarbeiter ? "lektor" : type;
+			if (false === type) {
 				return;
 			}
 
@@ -79,35 +94,74 @@ export default {
 				.fromISO(this.studiensemester_ende, opts)
 				.toUnixInteger();
 
-			const download_link = FHC_JS_DATA_STORAGE_OBJECT.app_root
-				+ 'cis/private/lvplan/stpl_kalender.php'
-				+ '?type=' + type
-				+ '&pers_uid=' + this.uid
-				+ '&begin=' + start
-				+ '&ende=' + ende;
+			const download_link =
+				FHC_JS_DATA_STORAGE_OBJECT.app_root +
+				"cis/private/lvplan/stpl_kalender.php" +
+				"?type=" +
+				type +
+				"&pers_uid=" +
+				this.uid +
+				"&begin=" +
+				start +
+				"&ende=" +
+				ende;
 
 			return [
-				{ title: "excel", icon: 'fa-solid fa-file-excel', link: download_link + '&format=excel' },
-				{ title: "csv", icon: 'fa-solid fa-file-csv', link: download_link + '&format=csv' },
-				{ title: "ical1", icon: 'fa-regular fa-calendar', link: download_link + '&format=ical&version=1&target=ical' },
-				{ title: "ical2", icon: 'fa-regular fa-calendar', link: download_link + '&format=ical&version=2&target=ical' }
+				{
+					title: "excel",
+					icon: "fa-solid fa-file-excel",
+					link: download_link + "&format=excel",
+				},
+				{
+					title: "csv",
+					icon: "fa-solid fa-file-csv",
+					link: download_link + "&format=csv",
+				},
+				{
+					title: "ical1",
+					icon: "fa-regular fa-calendar",
+					link: download_link + "&format=ical&version=1&target=ical",
+				},
+				{
+					title: "ical2",
+					icon: "fa-regular fa-calendar",
+					link: download_link + "&format=ical&version=2&target=ical",
+				},
 			];
-		}
+		},
+	},
+	watch: {
+		async isMobile() {
+			await this.$nextTick();
+			this.handleChangeMode(
+				this.currentMode,
+				luxon.DateTime.fromISO(this.currentDay, {
+					zone: this.timezone,
+				}),
+			);
+		},
 	},
 	methods: {
-		loadLvPlan(){
-			if(!this.formData.stgkz){
-				this.$fhcAlert.alertError(this.$p.t('LvPlan', 'chooseStg'));
+		loadLvPlan() {
+			if (!this.formData.stgkz) {
+				this.$fhcAlert.alertError(this.$p.t("LvPlan", "chooseStg"));
 				return;
 			}
 
-			if(!this.formData.sem && (this.formData.verband || this.formData.gruppe)){
-				this.$fhcAlert.alertError(this.$p.t('LvPlan', 'error_SemMissing'));
+			if (
+				!this.formData.sem &&
+				(this.formData.verband || this.formData.gruppe)
+			) {
+				this.$fhcAlert.alertError(
+					this.$p.t("LvPlan", "error_SemMissing"),
+				);
 				return;
 			}
 
-			if(!this.formData.verband && this.formData.gruppe){
-				this.$fhcAlert.alertError(this.$p.t('LvPlan', 'error_VerbandMissing'));
+			if (!this.formData.verband && this.formData.gruppe) {
+				this.$fhcAlert.alertError(
+					this.$p.t("LvPlan", "error_VerbandMissing"),
+				);
 				return;
 			}
 
@@ -121,18 +175,17 @@ export default {
 			};
 
 			//ensure logic: no value after a null value in route
-			if(params.sem == null)
-			{
+			if (params.sem == null) {
 				params.verband = null;
 				params.gruppe = null;
 			}
-			if(params.verband == null) {
+			if (params.verband == null) {
 				params.gruppe = null;
 			}
 
 			//delete all null values to avoid null in router
 			Object.keys(params).forEach(
-				key => params[key] == null && delete params[key]
+				(key) => params[key] == null && delete params[key],
 			);
 
 			this.$router.push({
@@ -143,34 +196,44 @@ export default {
 			this.$refs['calendar']?.resetEventLoader();
 		},
 		loadListSem(){
-			this.listSem = [...Array(this.maxSemester).keys()].map(i => i + 1);
+			if(!this.listSem)
+				this.listSem = [...Array(this.maxSemester).keys()].map(i => i + 1);
 		},
-		loadListVerband(){
+		loadListVerband() {
 			this.$api
-				.call(ApiLvPlan.getLehrverband(this.formData.stgkz, this.formData.semester, this.formData.verband))
+				.call(ApiLvPlan.getLehrverband(this.formData.stgkz, this.formData.sem, this.formData.verband))
 				.then(result => {
 					const data = result.data;
-					const mappedData = data.map(item => item.verband);
-					this.listVerband = [...new Set(mappedData.filter(v =>
-						v !== null &&
-						v !== undefined &&
-						String(v).trim() !== ""
-					))]
-						.sort();
+					const mappedData = data.map((item) => item.verband);
+					this.listVerband = [
+						...new Set(
+							mappedData.filter(
+								(v) =>
+									v !== null &&
+									v !== undefined &&
+									String(v).trim() !== "",
+							),
+						),
+					].sort();
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-		loadListGroup(){
+		loadListGroup() {
 			this.$api
-				.call(ApiLvPlan.getGruppe(this.formData.stgkz, this.formData.semester, this.formData.verband))
+				.call(ApiLvPlan.getGruppe(this.formData.stgkz, this.formData.sem, this.formData.verband))
 				.then(result => {
 					const data = result.data;
-					const mappedData = data.map(item => item.gruppe);
-					this.listGroup =  [...new Set(mappedData.filter(v =>
-						v !== null &&
-						v !== undefined &&
-						String(v).trim() !== ""))]
-						.sort();
+					const mappedData = data.map((item) => item.gruppe);
+					this.listGroup = [
+						...new Set(
+							mappedData.filter(
+								(v) =>
+									v !== null &&
+									v !== undefined &&
+									String(v).trim() !== "",
+							),
+						),
+					].sort();
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
@@ -195,18 +258,30 @@ export default {
 		},
 		updateRange(rangeInterval) {
 			this.$api
-				.call(ApiLvPlan.studiensemesterDateInterval(
-					rangeInterval.end.startOf('week').toISODate()
-				))
-				.then(res => {
-					this.studiensemester_kurzbz = res.data.studiensemester_kurzbz;
+				.call(
+					ApiLvPlan.studiensemesterDateInterval(
+						rangeInterval.end.startOf("week").toISODate(),
+					),
+				)
+				.then((res) => {
+					this.studiensemester_kurzbz =
+						res.data.studiensemester_kurzbz;
 					this.studiensemester_start = res.data.start;
 					this.studiensemester_ende = res.data.ende;
 				});
 		},
 		getPromiseFunc(start, end) {
 			return [
-				this.$api.call(ApiLvPlan.eventsStgOrg(start, end, this.formData.stgkz, this.formData.sem, this.formData.verband, this.formData.gruppe))
+				this.$api.call(
+					ApiLvPlan.eventsStgOrg(
+						start,
+						end,
+						this.formData.stgkz,
+						this.formData.sem,
+						this.formData.verband,
+						this.formData.gruppe,
+					),
+				),
 			];
 		},
 		async fetchAuthInfo() {
@@ -233,6 +308,20 @@ export default {
 			this.formData.sem = this.propsViewData.sem ? this.propsViewData.sem: null;
 			this.formData.verband = this.propsViewData.verband ? this.propsViewData.verband: null;
 			this.formData.gruppe = this.propsViewData.gruppe ? this.propsViewData.gruppe: null;
+
+			//ensure loading dropdown arrays for version propsView
+			if(!this.listVerband.length && this.formData.sem)
+			{
+				this.loadListVerband();
+			}
+			if(!this.listGroup.length && this.formData.verband)
+			{
+				this.loadListGroup();
+			}
+		}
+
+		if (this.formData.stgkz) {
+			this.loadLvPlan();
 		}
 	},
 	template: `
@@ -336,6 +425,4 @@ export default {
 		</template>
 	</div>
 	`,
-
-
-};
+};

public/js/components/Cis/Menu.js

@@ -30,6 +30,7 @@ export default {
 			menuOpen:true,
         };
     },
+	inject: ["isNarrow", "isMobile"],
 	provide(){
 		return{
 			setActiveEntry: this.setActiveEntry,
@@ -58,7 +59,7 @@ export default {
 		},
 		site_url(){
 			return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router;
-		}
+		},
 	},
 	methods: {
 		fetchMenu() {
@@ -112,45 +113,101 @@ export default {
 		});
 	},
     template: /*html*/`
-	<button id="nav-main-btn" class="navbar-toggler rounded-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#nav-main" aria-controls="nav-main" aria-expanded="false" aria-label="Toggle navigation">
-        <span class="navbar-toggler-icon"></span>
-    </button>
-	<fhc-searchbar ref="searchbar" id="nav-search" class="fhc-searchbar w-100 py-1 py-lg-2" :searchoptions="searchbaroptions" :searchfunction="searchfunction"></fhc-searchbar>
-    <div id="nav-logo" class="d-none d-lg-block">
-		<div class="d-flex h-100 justify-content-between">
-			<a :href="rootUrl">
-				<img :src="logoUrl" alt="Corporate Identity Logo">
-			</a>
-			<theme-switch></theme-switch>
+	<div id="cis-header-bar" class="d-flex flex-row flex-grow-1">
+		<div id="nav-logo" class="d-none d-lg-block">
+			<div class="d-flex h-100 justify-content-between">
+				<a :href="rootUrl">
+					<img :src="logoUrl" alt="Corporate Identity Logo">
+				</a>
+			</div>
 		</div>
-    </div>
-	<div id="nav-user">
-		<button id="nav-user-btn" class="btn btn-link rounded-0" type="button" data-bs-toggle="collapse" data-bs-target="#nav-user-menu" aria-expanded="false" aria-controls="nav-user-menu">
-			<img :src="avatarUrl" :alt="$p.t('profilUpdate/profilBild')" class="bg-dark avatar rounded-circle border border-dark"/>
-		</button>
-		<ul ref="navUserDropdown"
-		@[\`shown.bs.collapse\`]="handleShowNavUser"
-		@[\`hide.bs.collapse\`]="handleHideNavUser"
-		id="nav-user-menu" class="top-100 end-0 collapse list-unstyled" aria-labelledby="nav-user-btn">
-			<li><a class="fhc-dark-bg btn rounded-0 d-block" :href="site_url + '/Cis/Profil'" id="menu-profil">Profil</a></li>
-			<li >
-				<cis-sprachen @languageChanged="fetchMenu"></cis-sprachen>
-			</li>
-			<li><hr class="dropdown-divider m-0 "></li>
-			<li ><a class="fhc-dark-bg btn rounded-0 d-block" :href="logoutUrl">Logout</a></li>
-		</ul>
-	</div>
-    <nav id="nav-main" class="offcanvas offcanvas-start" tabindex="-1" aria-labelledby="nav-main-btn" data-bs-backdrop="false">
-		<div id="nav-main-sticky">
-			<div id="nav-main-toggle" class="position-static d-none d-lg-block ">
-				<button :aria-label="menuCollapseAriaLabel"  type="button" @click="menuOpen = !menuOpen"  class="btn text-light rounded-0 p-1 d-flex align-items-center" data-bs-toggle="collapse" data-bs-target=".nav-menu-collapse" aria-expanded="true" aria-controls="nav-sprachen nav-main-menu">
-					<i aria-hidden="true" class="fa fa-arrow-circle-left fhc-text"></i>
+
+		<div
+			v-if="isNarrow"
+			:class="{'collapse multi-collapse collapse-horizontal show': isMobile}"
+			id="navbar-toggler-collapsible"
+		>
+			<div class="d-flex flex-row align-items-center h-100" style="width: 35px">
+				<button id="nav-main-btn" class="navbar-toggler rounded-0 px-2 border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#nav-main" aria-controls="nav-main" aria-expanded="false" aria-label="Toggle navigation">
+					<span class="navbar-toggler-icon"></span>
 				</button>
 			</div>
-			<div class="offcanvas-body p-0">
-				<div id="nav-main-menu" class="nav-menu-collapse collapse collapse-horizontal show">
-					<div>
-						<cis-menu-entry :highestMatchingUrlCount="highestMatchingUrlCount" :activeContent="activeEntry" v-for="entry in entries" :key="entry.content_id" :entry="entry" />
+		</div>
+
+		<fhc-searchbar
+			:searchoptions="searchbaroptions"
+			:searchfunction="searchfunction"
+			ref="searchbar"
+			id="nav-search"
+			class="fhc-searchbar flex-grow-1 py-1 py-lg-2"
+		>
+			<template #collapseToggler="{ isSearchShownInMobileView }">
+				<span
+					v-if="isMobile"
+					type="button"
+					data-bs-toggle="collapse"
+					data-bs-target=".multi-collapse"
+					aria-controls="searchbar-collapsible navbar-toggler-collapsible options-collapsible"
+					aria-expanded="false"
+			 		class="d-flex flex-row align-items-center pe-1"
+					style="color: white"
+				>
+					<i v-if="isSearchShownInMobileView" class="fa-solid fa-chevron-left ps-3"></i>
+					<i v-else class="fa-solid fa-magnifying-glass ps-2"></i>
+				</span>
+			</template>
+		</fhc-searchbar>
+		
+		<div
+			id="options-collapsible"
+			:class="{'collapse multi-collapse collapse-horizontal show': isMobile}"
+		>
+			<div :style="!isMobile ? '' : 'width: 105px'" class="d-flex flex-row ps-3 justify-content-end">
+				<span class="d-flex flex-row align-items-center">
+					<theme-switch></theme-switch>
+				</span>
+				<div id="nav-user">
+					<button id="nav-user-btn" class="btn btn-link rounded-0" type="button" data-bs-toggle="collapse" data-bs-target="#nav-user-menu" aria-expanded="false" aria-controls="nav-user-menu">
+						<img :src="avatarUrl" :alt="$p.t('profilUpdate/profilBild')" class="bg-dark avatar rounded-circle border border-dark"/>
+					</button>
+					<ul ref="navUserDropdown"
+					@[\`shown.bs.collapse\`]="handleShowNavUser"
+					@[\`hide.bs.collapse\`]="handleHideNavUser"
+					id="nav-user-menu" class="top-100 end-0 collapse list-unstyled" aria-labelledby="nav-user-btn">
+						<li><a class="fhc-dark-bg btn rounded-0 d-block" :href="site_url + '/Cis/Profil'" id="menu-profil">Profil</a></li>
+						<li >
+							<cis-sprachen @languageChanged="fetchMenu"></cis-sprachen>
+						</li>
+						<li><hr class="dropdown-divider m-0 "></li>
+						<li ><a class="fhc-dark-bg btn rounded-0 d-block" :href="logoutUrl">Logout</a></li>
+					</ul>
+				</div>
+			</div>
+		</div>
+	</div>
+
+    <nav id="nav-main" class="offcanvas offcanvas-start" tabindex="-1" aria-labelledby="nav-main-btn" data-bs-backdrop="false">
+		<div id="nav-main-sticky">
+			<div class="d-flex flex-row h-100">
+				<div class="offcanvas-body p-0">
+					<div id="nav-main-menu" class="nav-menu-collapse collapse collapse-horizontal show">
+						<div class="flex-grow-1">
+							<cis-menu-entry :highestMatchingUrlCount="highestMatchingUrlCount" :activeContent="activeEntry" v-for="entry in entries" :key="entry.content_id" :entry="entry" />
+						</div>
+					</div>
+				</div>
+				<div id="nav-main-toggle" class="d-none d-lg-block">
+					<div
+						@click="menuOpen = !menuOpen"
+						:aria-label="menuCollapseAriaLabel"
+						type="button"
+						class="h-100 d-flex align-items-center px-2"
+						data-bs-toggle="collapse"
+						data-bs-target=".nav-menu-collapse"
+						aria-expanded="true"
+						aria-controls="nav-sprachen nav-main-menu"
+					>
+						<i aria-hidden="true" class="fa-solid fa-chevron-left fhc-text"></i>
 					</div>
 				</div>
 			</div>

public/js/components/Cis/Menu/Entry.js

@@ -68,41 +68,8 @@ export default {
 				return false;
 			}
 		},
-        link() {
-            if (this.entry.template_kurzbz == 'redirect') {
-                if (!this.entry.content)
-                    return '';
-                let xmlDoc = (new DOMParser()).parseFromString(this.entry.content,"text/xml");
-                let url = xmlDoc.getElementsByTagName('url')[0];
-
-                if (!url)
-                    return '';
-                // TODO(chris): replace get params
-                url = url.childNodes[0].nodeValue + "";
-				if (url.includes("../cms/news.php")) {
-					let news_regex = new RegExp("^\.\./cms/news\.php");
-					url = url.replace(news_regex, FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/CisVue/Cms/news');
-				}
-				else if (url.includes("../cms/content.php?")) {
-					let content_regex = new RegExp("^\.\./cms/content.php\\?content_id=([0-9]+)");
-					let content_regex_result = content_regex.exec(url);
-					// content_regex_result[1] will be the first matched group
-					return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/CisVue/Cms/content/' + content_regex_result[1];
-				}
-				else if(url.includes("../index.ci.php")){
-					let index_regex = new RegExp("^\.\./index\.ci\.php");
-					url = url.replace(index_regex, FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router);
-				}
-				else if (url.includes("../")) {
-					let relative_regex = new RegExp("^\.\./");
-					url = url.replace(relative_regex, FHC_JS_DATA_STORAGE_OBJECT.app_root);
-				}
-				return url;
-            }
-            return FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/CisVue/Cms/content/' + this.entry.content_id;
-        },
 		hasFullLink() {
-			return this.link.startsWith(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router)
+			return this.entry.url.startsWith(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router)
 		},
         target() {
             if (this.entry.template_kurzbz == 'redirect') {
@@ -145,7 +112,7 @@ export default {
 			this.addUrlCount(count);
 		},
 		checkActiveUrl(url){
-			this.getUrlMatchPoints(url,this.link);
+			this.getUrlMatchPoints(url,this.entry.url);
 			
 			let url_hash_spaceSymbol_regex = new RegExp("%20","gi");
 			let url_hash_sharpSymbol_regex = new RegExp("^#");
@@ -155,7 +122,7 @@ export default {
 			// if the url hash contains the titel of the menu 
 			// or if the url equals the link of a menu 
 			// then set the menu active 
-			if (url_hash == this.entry.titel || url.href == this.link) {
+			if (url_hash == this.entry.titel || url.href == this.entry.url) {
 					this.setActiveEntry(this.entry.content_id);
 			}
 		},
@@ -204,7 +171,7 @@ export default {
         <template v-if="hasChilds">
 			<div class="btn-group w-100">
  				<a :target="target" 
- 					:href="(entry.menu_open && hasFullLink)?link:null"
+ 					:href="(entry.menu_open && hasFullLink) ? entry.url : null"
 					@click="toggleCollapse"
                     :class="{
                         'btn btn-default rounded-0 text-start': true,
@@ -227,7 +194,7 @@ export default {
             </ul>
         </template>
 		<a v-else
-            :href="link"
+            :href="entry.url"
             :target="target"
             :class="{
                 'btn btn-default rounded-0 w-100 text-start': true,

public/js/components/Cis/Mylv/LvUebersicht.js

@@ -100,7 +100,7 @@ export default  {
 			</template>
 			<template v-else>
 				<span v-if="event?.lehrfach_bez ">{{event?.lehrfach_bez + (event?.stg_kurzbzlang?' / ' + event?.stg_kurzbzlang:'')}}</span>
-				<span v-else>Lehrveranstaltungs Übersicht</span>
+				<span v-else>{{$p.t('lehre','lvUebersicht')}}</span>
 			</template>
 
         </template>

public/js/components/Cis/Mylv/RoomInformation.js

@@ -2,7 +2,8 @@ import FhcCalendar from "../../Calendar/LvPlan.js";
 
 import ApiLvPlan from '../../../api/factory/lvPlan.js';
 
-export const DEFAULT_MODE_RAUMINFO = 'Week'
+export const DEFAULT_MODE_RAUMINFO_MOBILE = 'List';
+export const DEFAULT_MODE_RAUMINFO_DESKTOP = 'Week';
 
 export default {
 	name: "RoomInformation",
@@ -13,12 +14,14 @@ export default {
 		viewData: Object, // NOTE(chris): this is inherited from router-view
 		propsViewData: Object
 	},
+	inject: ["isMobile"],
 	computed: {
 		currentDay() {
-			return this.propsViewData?.focus_date || luxon.DateTime.now().setZone(this.viewData.timezone).toISODate();
+			return this.propsViewData?.focus_date || luxon.DateTime.now().setZone(FHC_JS_DATA_STORAGE_OBJECT.timezone).toISODate();
 		},
 		currentMode() {
-			return this.propsViewData?.mode || DEFAULT_MODE_RAUMINFO;
+			const defaultMode = this.isMobile ? DEFAULT_MODE_RAUMINFO_MOBILE : DEFAULT_MODE_RAUMINFO_DESKTOP;
+			return this.propsViewData?.mode || defaultMode;
 		}
 	},
 	methods:{
@@ -51,7 +54,6 @@ export default {
 		<hr>
 		<fhc-calendar 
 			ref="calendar"
-			:timezone="viewData.timezone"
 			:get-promise-func="getPromiseFunc"
 			:date="currentDay"
 			:mode="currentMode"

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

@@ -36,8 +36,9 @@ export default {
 			return this.lvs.filter(lv => lv.studiengang_kz == studiengang.studiengang_kz && lv.semester == studiengang.semester);
 		}
 	},
-	template: `<div class="mylv-semester" v-if="ready">
-		<mylv-semester-studiengang v-for="studiengang in studiengaenge" :key="studiengang.studiengang_kz" v-bind="studiengang" :lvs="lvsForStudiengang(studiengang)"/>
+	template: `
+	<div class="mylv-semester" v-if="ready">
+		<mylv-semester-studiengang v-for="studiengang in studiengaenge" :key="studiengang.studiengang_kz" v-bind="studiengang" :lvs="lvsForStudiengang(studiengang)" :semesterInfo="$props.semester" />
 	</div>
 	<div class="mylv-semester text-center" v-else>
 		<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>

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

@@ -1,9 +1,11 @@
 import MylvSemesterStudiengangLv from "./Studiengang/Lv.js";
+import MylvSemesterStudiengangAverageGrade from "./Studiengang/AverageGrade.js";
 import Phrasen from "../../../../mixins/Phrasen.js";
 
 export default {
 	components: {
-		MylvSemesterStudiengangLv
+		MylvSemesterStudiengangLv,
+		MylvSemesterStudiengangAverageGrade
 	},
 	mixins: [
 		Phrasen
@@ -12,6 +14,7 @@ export default {
 		bezeichnung: String,
 		kuerzel: String,
 		semester: [String,Number],
+		semesterInfo: [String,Number],
 		lvs: Array,
 		sg_bezeichnung_eng: String
 	},
@@ -29,9 +32,10 @@ export default {
 	methods: {
 		note(lv) {
 			return lv.benotung ? lv.znote || lv.lvnote || null : null;
-		}
+		},
 	},
 	template: `<div class="card mb-3">
+
 		<div class="card-body">
 			<h4 class="card-title mb-3">{{$p.user_language.value === 'English' ? sg_bezeichnung_eng : bezeichnung}} - {{kuerzel}}
 				<small>{{semester}}.{{$p.t('lehre/semester')}}</small>
@@ -41,6 +45,7 @@ export default {
 					<mylv-semester-studiengang-lv v-bind="lv" class="text-center h-100"></mylv-semester-studiengang-lv>
 				</div>
 			</div>
+			<mylv-semester-studiengang-average-grade :semesterInfo="$props.semesterInfo" />
 		</div>
 	</div>`
 };

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

@@ -0,0 +1,86 @@
+import Phrasen from "../../../../../mixins/Phrasen.js";
+import ApiLehre from "../../../../../api/factory/lehre.js";
+
+export default {
+	mixins: [
+		Phrasen
+	],
+	props: {
+		semesterInfo: String,
+	},
+	data() {
+		return {
+			gradeAverage: null,
+			gradeWeightedAverage: null,
+		}
+	},
+	methods: {
+		async fetchAverageGrade() {
+			this.gradeAverage = null;
+			this.gradeWeightedAverage = null;
+			if (!this.$props.semesterInfo) return;
+
+			let gradeAverageResponse = await this.$api.call(
+				ApiLehre.getSemesterAverageGrade(this.$props.semesterInfo),
+			);
+			const gradeAverageResponseData = gradeAverageResponse.data;
+			this.gradeAverage =
+				gradeAverageResponseData.average_grade?.toFixed(2);
+			this.gradeWeightedAverage =
+				gradeAverageResponseData.weighted_average_grade?.toFixed(2);
+		},
+	},
+	watch: {
+		semesterInfo() {
+			this.fetchAverageGrade();
+		},
+	},
+	async created() {
+		await this.fetchAverageGrade();
+	},
+	template: /*html*/`
+	<div class="card mylv-semester-studiengang-grades">
+
+		<div class="card-header text-center">
+			<h6>{{$p.t('lehre/notenstatistik')}}</h6>
+		</div>
+
+		<div v-if="gradeAverage && gradeWeightedAverage">
+			<table class="card-body table w-auto mx-auto">
+			  <tbody>
+				<tr>
+				  <td class="text-end">
+					{{$p.t('lehre/headerAverage')}}
+				  </td>
+				  <td class="text-start">
+					{{ gradeAverage }}
+				  </td>
+				</tr>
+				<tr>
+				  <td class="text-end">
+					{{$p.t('lehre/headerWeightedAverage')}}
+				  </td>
+				  <td class="text-start">
+					{{ gradeWeightedAverage }}
+				  </td>
+				</tr>
+			  </tbody>
+			</table>
+		</div>
+		<div v-else class="card-body text-center">
+			<p>{{$p.t('lehre/info_noGradesYet')}}</p>
+		</div>
+
+		<div v-if="gradeAverage && gradeWeightedAverage" class="card-footer d-flex align-items-start text-muted small">
+		  <i class="fa fa-circle-info me-2 mt-1"></i>
+		  <div>
+			<strong>{{$p.t('ui', 'hinweis')}}</strong><br>
+			* {{$p.t('lehre/noticeAverage')}}
+			<br>
+			** {{$p.t('lehre/noticeWeightedAverage')}}
+		  </div>
+		</div>
+
+	</div>
+	`
+}

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

@@ -24,9 +24,9 @@ export default {
 		farbe: String,
 		lvinfo: Boolean,
 		benotung: Boolean,
-		lvnote: String,
+		lvnote: [String, Number],
 		lvnotebez: Array,
-		znote: String,
+		znote: [String, Number],
 		znotebez: Array,
 		studiengang_kuerzel: String,
 		semester: [String, Number],
@@ -37,6 +37,11 @@ export default {
 		positiv: Boolean,
 		note_index: String
 	},
+	provide() {
+		return {
+			studium_studiensemester: Vue.computed(() => this.studien_semester),
+		}
+	},
 	data: () => {
 		return {
 			pruefungenData: null,
@@ -73,11 +78,11 @@ export default {
 		},
 		grade() {
 			const languageIndex = this.$p.user_language.value === 'English' ? 1 : 0
+			// no more showing of grade LV, if grade Zeugnis is not existing yet
 			if(this.benotung && this.znotebez?.length) {
 				return this.znotebez[languageIndex]
-			} else if(this.benotung && this.lvnotebez?.length) {
-				return this.lvnotebez[languageIndex]
-			} else return null
+			}
+			else return null
 		},
 		LvHasPruefungenInformation(){
 			return this.pruefungenData && this.pruefungenData.length > 0;
@@ -119,7 +124,6 @@ export default {
 			}
 		},
 		openPruefungen() {
-			// early return if the pruefungenData is empty or not set
 			if (!this.LvHasPruefungenInformation) return;
 
 			LvPruefungen.popup({
@@ -205,21 +209,14 @@ export default {
 			</template>
 		</div>
 		<div v-if="!emptyMenu" class="card-footer">
-			<div class="row">
-				<!-- template for the LV if there are multiple pruefungen -->
-				<template v-if="LvHasPruefungenInformation">
-					<a href="#" class="col-auto text-start text-decoration-none" @click.prevent="openPruefungen">
-						<i class="fa fa-check text-success" v-if="positiv"></i>
-						<span class="ps-1" :style="'color:'+gradeColor">{{ grade || $p.t('lehre/noGrades') }}</span>
-					</a>
-				</template>
-				<!-- template for the LV with no pruefungen -->
-				<template v-else>
-					<span  class="col-auto text-start text-decoration-none" >
-						<i class="fa fa-check text-success" v-if="positiv"></i>
-						<span class="ps-1" :style="'color:'+gradeColor">{{ grade || $p.t('lehre/noGrades') }}</span>
-					</span>
-				</template>
+			<div
+				@click.prevent="openPruefungen()"
+				:type="LvHasPruefungenInformation ? 'button' : ''"
+				class="d-flex flex-row align-items-center gap-1"
+			>
+				<i class="fa fa-check text-success" v-if="positiv"></i>
+				<span :style="'color:'+gradeColor">{{ grade || $p.t('lehre/noGrades') }}</span>
+				<i v-if="LvHasPruefungenInformation" class="fa fa-circle-info ms-1"></i>
 			</div>
 		</div>
 	</div>`

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

@@ -96,34 +96,35 @@ export default {
 
 	},
 	template: `
-
-	<h2>{{$p.t('lehre/myLV')}}</h2>
-	<hr>
-	<div class="mylv-student" v-if="ready">
-		<div v-if="currentSemester" class="row justify-content-center mb-3">
-			<div class="col-auto d-none">
-				<label class="col-form-label">{{$p.t('lehre/studiensemester')}}</label>
-			</div>
-			<div class="col-auto">
-				<div class="input-group">
-					<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="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">
-						<i class="fa fa-caret-right" aria-hidden="true"></i>
-					</button>
+	<div>
+		<h2>{{$p.t('lehre/myLV')}}</h2>
+		<hr>
+		<div class="mylv-student" v-if="ready">
+			<div v-if="currentSemester" class="row justify-content-center mb-3">
+				<div class="col-auto d-none">
+					<label class="col-form-label">{{$p.t('lehre/studiensemester')}}</label>
+				</div>
+				<div class="col-auto">
+					<div class="input-group">
+						<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="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">
+							<i class="fa fa-caret-right" aria-hidden="true"></i>
+						</button>
+					</div>
 				</div>
 			</div>
+			<div class="alert alert-danger" role="alert" v-else>
+				{{$p.t('lehre/noLvFound')}}
+			</div>
+			<mylv-semester v-bind="current"/>
 		</div>
-		<div class="alert alert-danger" role="alert" v-else>
-			{{$p.t('lehre/noLvFound')}}
+		<div class="mylv-student text-center" v-else>
+			<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
 		</div>
-		<mylv-semester v-bind="current"/>
-	</div>
-	<div class="mylv-student text-center" v-else>
-		<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
 	</div>`
 };

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

@@ -36,7 +36,7 @@ export default {
 		return {
 			showModal: false,
 			editDataFilter: null,
-			preloadedPhrasen:{},
+			arePhrasesPreloaded: false,
 			// tabulator options
 			funktionen_table_options: {
 				persistenceID: "filterTableMaProfilFunktionen",
@@ -48,6 +48,7 @@ export default {
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
 				responsiveLayoutCollapseFormatter: Vue.$collapseFormatter,
+				responsiveLayoutCollapseStartOpen: false,
 				columns: [
 					{
 						title:
@@ -58,24 +59,27 @@ export default {
 						formatter: "responsiveCollapse",
 						maxWidth: 40,
 						headerClick: this.collapseFunction,
-						visible: true
+						visible: true,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.bezeichnungPhrase),
+						title: Vue.computed(() => this.$p.t('ui/bezeichnung')),
 						field: "Bezeichnung",
 						headerFilter: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.organisationseinheitPhrase),
+						title: Vue.computed(() => this.$p.t('lehre/organisationseinheit')),
 						field: "Organisationseinheit",
 						headerFilter: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 1,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.gueltigVonPhrase),
+						title: Vue.computed(() => this.$p.t('global/gueltigVon')),
 						field: "Gültig_von",
 						headerFilterFunc: 'dates',
 						headerFilter: dateFilter,
@@ -83,10 +87,11 @@ export default {
 						minWidth: 200,
 						visible: true,
 						formatter:"datetime",
-						formatterParams: this.datetimeFormatterParams()
+						formatterParams: this.datetimeFormatterParams(),
+						responsive: 4,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.gueltigBisPhrase),
+						title: Vue.computed(() => this.$p.t('global/gueltigBis')),
 						field: "Gültig_bis",
 						headerFilterFunc: 'dates',
 						headerFilter: dateFilter,
@@ -94,14 +99,16 @@ export default {
 						minWidth: 200,
 						visible: true,
 						formatter:"datetime",
-						formatterParams: this.datetimeFormatterParams()
+						formatterParams: this.datetimeFormatterParams(),
+						responsive: 3,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.wochenstundenPhrase),
+						title: Vue.computed(() => this.$p.t('profil/wochenstunden')),
 						field: "Wochenstunden",
 						headerFilter: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 2,
 					},
 				],
 			},
@@ -116,6 +123,7 @@ export default {
 				responsiveLayoutCollapseUseFormatters: false,
 				responsiveLayoutCollapseFormatter: Vue.$collapseFormatter,
 				data: [{betriebsmittel: "", Nummer: "", Ausgegeben_am: ""}],
+				responsiveLayoutCollapseStartOpen: false,
 				columns: [
 					{
 						title:
@@ -126,32 +134,36 @@ export default {
 						formatter: "responsiveCollapse",
 						maxWidth: 40,
 						headerClick: this.collapseFunction,
-						visible: true
+						visible: true,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.entlehnteBetriebsmittelPhrase),
+						title: Vue.computed(() => this.$p.t('profil/entlehnteBetriebsmittel')),
 						field: "betriebsmittel",
 						headerFilter: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.inventarnummerPhrase),
+						title: Vue.computed(() => this.$p.t('profil/inventarnummer')),
 						field: "Nummer",
 						headerFilter: true,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 2,
 					},
 					{
-						title: Vue.computed(() => this.preloadedPhrasen.ausgabedatumPhrase),
+						title: Vue.computed(() => this.$p.t('profil/ausgabedatum')),
 						field: "Ausgegeben_am",
 						headerFilterFunc: 'dates',
 						headerFilter: dateFilter,
 						minWidth: 200,
 						visible: true,
 						formatter:"datetime",
-						formatterParams: this.datetimeFormatterParams()
+						formatterParams: this.datetimeFormatterParams(),
+						responsive: 1,
 					},
 				],
 			}
@@ -166,11 +178,9 @@ export default {
 	
 	methods: {
 		betriebsmittelTableBuilt: function () {
-			this.$refs.betriebsmittelTable.tabulator.setColumns(this.betriebsmittel_table_options.columns)
 			this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
 		},
 		funktionenTableBuilt: function () {
-			this.$refs.funktionenTable.tabulator.setColumns(this.funktionen_table_options.columns)
 			this.$refs.funktionenTable.tabulator.setData(this.data.funktionen);
 		},
 		hideEditProfilModal: function () {
@@ -221,8 +231,8 @@ 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)
+			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 = {
@@ -308,15 +318,7 @@ export default {
 	created() {
 		// preload phrasen
 		this.$p.loadCategory(["ui","lehre","global","profil"]).then(() => {
-			this.preloadedPhrasen.bezeichnungPhrase = this.$p.t('ui/bezeichnung');
-			this.preloadedPhrasen.organisationseinheitPhrase = this.$p.t('lehre/organisationseinheit');
-			this.preloadedPhrasen.gueltigVonPhrase = this.$p.t('global/gueltigVon');
-			this.preloadedPhrasen.gueltigBisPhrase = this.$p.t('global/gueltigBis');
-			this.preloadedPhrasen.wochenstundenPhrase = this.$p.t('profil/wochenstunden');
-			this.preloadedPhrasen.entlehnteBetriebsmittelPhrase = this.$p.t('profil/entlehnteBetriebsmittel');
-			this.preloadedPhrasen.inventarnummerPhrase = this.$p.t('profil/inventarnummer');
-			this.preloadedPhrasen.ausgabedatumPhrase = this.$p.t('profil/ausgabedatum');
-			this.preloadedPhrasen.loaded=true;
+			this.arePhrasesPreloaded = true;
 		});
 		//? sorts the profil Updates: pending -> accepted -> rejected
 		this.data.profilUpdates?.sort(this.sortProfilUpdates);
@@ -336,8 +338,8 @@ export default {
 <div class="container-fluid text-break fhc-form"  >
     <edit-profil v-if="showModal" ref="editModal" :isMitarbeiter="true" @hideBsModal="hideEditProfilModal" :value="JSON.parse(JSON.stringify(filteredEditData))" :titel="$p.t('profil','profilBearbeiten')"></edit-profil>
     <div class="row">
-        <div  class="d-md-none col-12 ">
-            <!-- Bearbeiten Button -->
+		<div class="d-md-none col-12">
+			<!-- Bearbeiten Button -->
             <div v-if="isEditable" class="row mb-3 ">
                 <div class="col">
                     <button @click="()=>showEditProfilModal()" type="button" class="text-start card w-100 btn btn-outline-secondary" >
@@ -350,9 +352,9 @@ export default {
                     </button>
                 </div>
             </div>
+			<!-- MOBILE PROFIL UPDATES -->
             <div v-if="data.profilUpdates" class="row mb-3">
                 <div class="col">
-                    <!-- MOBILE PROFIL UPDATES -->
                     <fetch-profil-updates v-if="data.profilUpdates && data.profilUpdates.length" @fetchUpdates="fetchProfilUpdates"  :data="data.profilUpdates" ></fetch-profil-updates>
                 </div>
             </div>
@@ -365,30 +367,42 @@ export default {
             <!-- ROW WITH THE PROFIL INFORMATION -->
             <div class="row mb-4">
                 <div  class="col-lg-12 col-xl-6 ">
+					<!-- PROFIL INFORMATION -->
                     <div class="row mb-4">
                         <div class="col">
-                            <!-- PROFIL INFORMATION -->
                             <profil-information @showEditProfilModal="showEditProfilModal" :title="$p.t('profil','mitarbeiterIn')" :data="profilInformation" :fotoStatus="fotoStatus"></profil-information>
                         </div>
                     </div>
+					<!-- QUICK LINKS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+					<div v-if="quickLinks.length" class="row mb-4 d-md-none">
+						<div class="col">
+							<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+						</div>
+					</div>
+					<!-- CALENDAR SYNC OPTIONS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+					<div class="row mb-4 d-md-none">
+            		    <div class="col">
+							<calendar-sync :uid="$props.data.username" :calendarSyncUrls="$props.calendarSyncUrls"></calendar-sync>
+            		    </div>
+					</div>
+					<!-- MITARBEITER INFO -->
                     <div class="row mb-4">
                         <div  class=" col-lg-12">
-                            <!-- MITARBEITER INFO -->
                             <role-information :title="$p.t('profil','mitarbeiterInformation')" :data="roleInformation"></role-information>
                         </div>
                     </div>
                     <!-- START OF SECOND PROFIL  INFORMATION COLUMN -->
                 </div>
                 <div  class="col-xl-6 col-lg-12 ">
+					<!-- EMAILS -->
                     <div class="row mb-4">
                         <div class="col">
-                            <!-- EMAILS -->
                             <profil-emails :title="this.$p.t('person','email')" :data="data.emails" ></profil-emails>
                         </div>
                     </div>
+					<!-- PRIVATE KONTAKTE-->
                     <div class="row mb-4 ">
                         <div class="col">
-                            <!-- PRIVATE KONTAKTE-->
                             <div class="card">
                                 <div class="card-header">
                                     <div class="row">
@@ -410,9 +424,9 @@ export default {
                             </div>
                         </div>
                     </div>
+					<!-- PRIVATE ADRESSEN-->
                     <div class="row mb-4">
                         <div class="col">
-                            <!-- PRIVATE ADRESSEN-->
                             <div class="card">
                                 <div class="card-header">
                                     <div class="row">
@@ -437,10 +451,10 @@ export default {
                 </div>
             </div  >
             <div class="row">
+				<!-- FUNKTIONEN TABELLE -->
                 <div class="col-12 mb-4" >
-                    <!-- FUNKTIONEN TABELLE -->
                     <core-filter-cmpt
-						v-if="preloadedPhrasen.loaded"
+						v-if="arePhrasesPreloaded"
                     	@tableBuilt="funktionenTableBuilt"
 						:title="$p.t('person','funktionen')"
 						ref="funktionenTable"
@@ -449,10 +463,10 @@ export default {
 						:sideMenu="false"
                      />
                 </div>
+				<!-- BETRIEBSMITTEL TABELLE -->
                 <div class="col-12 mb-4" >
-                    <!-- BETRIEBSMITTEL TABELLE -->
                     <core-filter-cmpt
-						v-if="preloadedPhrasen.loaded"
+						v-if="arePhrasesPreloaded"
                     	@tableBuilt="betriebsmittelTableBuilt"
 						:title="$p.t('profil','entlehnteBetriebsmittel')"
 						ref="betriebsmittelTable"
@@ -465,11 +479,6 @@ export default {
         </div>
         <!-- START OF SIDE PANEL -->
         <div  class="col-md-4 col-xxl-3 col-sm-12 text-break" >
-			<div v-if="quickLinks.length" class="row mb-4">
-				<div class="col">
-					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
-				</div>
-			</div>
             <!-- Bearbeiten Button -->
             <div class="row d-none d-md-block ">
                 <div class="col mb-3">
@@ -483,29 +492,36 @@ export default {
                     </button>
                 </div>
             </div>
-            <div v-if="data.profilUpdates" class="row d-none d-md-block mb-3">
-                <div class="col mb-3">
-                    <!-- PROFIL UPDATES -->
-                    <fetch-profil-updates v-if="data.profilUpdates && data.profilUpdates.length" @fetchUpdates="fetchProfilUpdates" :data="data.profilUpdates"></fetch-profil-updates>
-                </div>
-            </div>
-            <div class="row mb-3" >
-                <div class="col-12">
-                    <!-- AUSWEIS STATUS -->
-                    <ausweis-status :data="data.zutrittsdatum"></ausweis-status>
-                </div>
-            </div>
-            <div class="row mb-3">
-                <div class="col">
-                    <!-- MAILVERTEILER -->
-                    <mailverteiler  :data="data?.mailverteiler" :title="$p.t('profil','mailverteiler')"></mailverteiler>
-                </div>
-            </div>
-			<div class="row">
+			<!-- QUICK LINKS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div v-if="quickLinks.length" class="row mb-3 d-none d-md-block">
+				<div class="col">
+					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+				</div>
+			</div>
+			<!-- CALENDAR SYNC OPTIONS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div class="row mb-3 d-none d-md-block">
                 <div class="col">
 					<calendar-sync :uid="$props.data.username" :calendarSyncUrls="$props.calendarSyncUrls"></calendar-sync>
                 </div>
 			</div>
+			<!-- PROFIL UPDATES -->
+            <div v-if="data.profilUpdates" class="row d-none d-md-block mb-3">
+                <div class="col mb-3">
+                    <fetch-profil-updates v-if="data.profilUpdates && data.profilUpdates.length" @fetchUpdates="fetchProfilUpdates" :data="data.profilUpdates"></fetch-profil-updates>
+                </div>
+            </div>
+			<!-- AUSWEIS STATUS -->
+            <div class="row mb-3" >
+                <div class="col-12">
+                    <ausweis-status :data="data.zutrittsdatum"></ausweis-status>
+                </div>
+            </div>
+			<!-- MAILVERTEILER -->
+            <div class="row mb-3">
+                <div class="col">
+                    <mailverteiler  :data="data?.mailverteiler" :title="$p.t('profil','mailverteiler')"></mailverteiler>
+                </div>
+            </div>
         </div>
     </div>
 </div>

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

@@ -20,7 +20,7 @@ export default {
 	data() {
 		return {
 			collapseIconFunktionen: true,
-			preloadedPhrasen: {},
+			arePhrasesPreloaded: false,
 			funktionen_table_options: {
 				persistenceID: "filterTableMaViewProfilFunktionen",
 				persistence: {
@@ -216,19 +216,7 @@ export default {
 	},
 	created() {
 		this.$p.loadCategory(["ui", "lehre", "global", "profil"]).then(() => {
-			this.preloadedPhrasen.bezeichnungPhrase =
-				this.$p.t("ui/bezeichnung");
-			this.preloadedPhrasen.organisationseinheitPhrase = this.$p.t(
-				"lehre/organisationseinheit",
-			);
-			this.preloadedPhrasen.gueltigVonPhrase =
-				this.$p.t("global/gueltigVon");
-			this.preloadedPhrasen.gueltigBisPhrase =
-				this.$p.t("global/gueltigBis");
-			this.preloadedPhrasen.wochenstundenPhrase = this.$p.t(
-				"profil/wochenstunden",
-			);
-			this.preloadedPhrasen.loaded = true;
+			this.arePhrasesPreloaded = true;
 		});
 	},
 
@@ -237,15 +225,6 @@ export default {
 <div class="container-fluid text-break fhc-form"  >
     <!-- ROW -->
     <div class="row">
-        <!-- HIDDEN QUICK LINKS -->
-        <!-- TODO: uncomment when implemented
-            <div  class="d-md-none col-12 ">
-
-            <quick-links :title="$p.t('profil','quickLinks')" :mobile="true" ></quick-links>
-
-            </div>
-            -->
-        <!-- END OF HIDDEN QUCK LINKS -->
         <!-- MAIN PANNEL -->
         <div class="col-sm-12 col-md-8 col-xxl-9 ">
             <!-- ROW WITH PROFIL IMAGE AND INFORMATION -->
@@ -254,27 +233,33 @@ export default {
             <div class="row mb-4">
                 <!-- FIRST KAESTCHEN -->
                 <div  class="col-lg-12 col-xl-6 ">
+					<!-- Profil Informationen -->
                     <div class="row mb-4">
                         <div class="col">
-                            <!-- Profil Informationen -->
                             <profil-information :title="$p.t('profil','mitarbeiterIn')" :data="profilInformation" :fotoStatus="fotoStatus"></profil-information>
                         </div>
                     </div>
+					<!-- QUICK LINKS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+					<div v-if="quickLinks.length" class="row mb-4 d-md-none">
+						<div class="col">
+							<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+						</div>
+					</div>
                     <!-- START OF SECOND PROFIL  INFORMATION COLUMN -->
                     <!-- END OF PROFIL INFORMATION ROW -->
                     <!-- INFORMATION CONTENT END -->
                 </div>
                 <div  class="col-xl-6 col-lg-12 ">
+					<!-- EMAILS -->
                     <div class="row mb-4">
                         <div class="col">
-                            <!-- EMAILS -->
                             <profil-emails :title="this.$p.t('person','email')" :data="personEmails"></profil-emails>
                         </div>
                     </div>
                     <!-- SECOND ROW OF SECOND COLUMN IN MAIN CONTENT -->
+					<!-- roleInformation -->
                     <div class="row mb-4">
                         <div  class=" col-lg-12">
-                            <!-- roleInformation -->
                             <role-information :data="roleInformation" :title="$p.t('profil','mitarbeiterInformation')"></role-information>
                         </div>
                     </div>
@@ -288,7 +273,7 @@ export default {
             <div class="row">
                 <!-- FIRST TABLE -->
                 <div class="col-12 mb-4" >
-                    <core-filter-cmpt v-if="preloadedPhrasen.loaded" @tableBuilt="funktionenTableBuilt" :title="$p.t('person','funktionen')"  ref="funktionenTable" :tabulator-options="funktionen_table_options"  tableOnly :sideMenu="false" />
+                    <core-filter-cmpt v-if="arePhrasesPreloaded" @tableBuilt="funktionenTableBuilt" :title="$p.t('person','funktionen')"  ref="funktionenTable" :tabulator-options="funktionen_table_options"  tableOnly :sideMenu="false" />
                 </div>
                 <!-- END OF THE ROW WITH THE TABLES UNDER THE PROFIL INFORMATION -->
             </div>
@@ -296,15 +281,15 @@ export default {
         </div>
         <!-- START OF SIDE PANEL -->
         <div  class="col-md-4 col-xxl-3 col-sm-12 text-break" >
-            <!-- VISIBLE UNTIL VIEWPORT MD -->
-			<div v-if="quickLinks.length" class="row mb-4">
+			<!-- QUICK LINKS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div v-if="quickLinks.length" class="row mb-3 d-none d-md-block">
 				<div class="col">
 					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
 				</div>
 			</div>
+			<!-- MAILVERTEILER -->
 			<div class="row">
 				<div class="col">
-					<!-- MAILVERTEILER -->
 					<mailverteiler :data="data?.mailverteiler" :title="$p.t('profil','mailverteiler')"></mailverteiler>
 				</div>
 			</div>

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

@@ -176,6 +176,7 @@ export const Profil = {
 			this.data = data.profil_data.data;
 			this.calendarSyncUrls = data.calendar_sync_urls ?? [];
 			this.authPermissions = data.permissions;
+			console.log(data.profil_data);
 		},
 		zustellAdressenCount() {
 			if (!this.data || !this.data.adressen) {
@@ -401,7 +402,7 @@ export const Profil = {
 		this.load();
 	},
 	template: `
-	<div>
+	<div class="pb-4">
 		<div v-if="notFoundUID">
 			<h3>Es wurde keine Person mit der UID {{this.notFoundUID}} gefunden</h3>
 		</div>

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

@@ -35,7 +35,7 @@ export default {
 			showModal: false,
 			collapseIconBetriebsmittel: true,
 			editDataFilter: null,
-			preloadedPhrasen:{},
+			arePhrasesPreloaded: false,
 			// tabulator options
 			zutrittsgruppen_table_options: {
 				persistenceID: "filterTableStudentProfilZutrittsgruppen",
@@ -44,10 +44,12 @@ export default {
 				},
 				minHeight: 200,
 				layout: "fitColumns",
-				columns: [{
-					title: Vue.computed(() => this.preloadedPhrasen.zutrittsGruppenPhrase),
+				columns: [
+					{
+					title: Vue.computed(() => this.$p.t('profil/zutrittsGruppen')),
 					field: "bezeichnung"
-				}],
+					}
+				],
 			},
 			betriebsmittel_table_options: {
 				persistenceID: "filterTableStudentProfilBetriebsmittel",
@@ -59,6 +61,7 @@ export default {
 				responsiveLayout: "collapse",
 				responsiveLayoutCollapseUseFormatters: false,
 				responsiveLayoutCollapseFormatter: Vue.$collapseFormatter,
+				responsiveLayoutCollapseStartOpen: false,
 				columns: [
 					{
 						title:
@@ -69,31 +72,35 @@ export default {
 						formatter: "responsiveCollapse",
 						maxWidth: 40,
 						headerClick: this.collapseFunction,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(()=>this.preloadedPhrasen.entlehnteBetriebsmittelPhrase),
+						title: Vue.computed(()=>this.$p.t('profil/entlehnteBetriebsmittel')),
 						field: "betriebsmittel",
 						headerFilter: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 0,
 					},
 					{
-						title: Vue.computed(() =>this.preloadedPhrasen.inventarnummerPhrase) ,
+						title: Vue.computed(() => this.$p.t('profil/inventarnummer')) ,
 						field: "Nummer",
 						headerFilter: true,
 						resizable: true,
 						minWidth: 200,
-						visible: true
+						visible: true,
+						responsive: 2,
 					},
 					{
-						title: Vue.computed(() =>this.preloadedPhrasen.ausgabedatum) ,
+						title: Vue.computed(() => this.$p.t('profil/ausgabedatum')) ,
 						field: "Ausgegeben_am",
 						headerFilterFunc: 'dates',
 						headerFilter: dateFilter,
 						minWidth: 200,
 						visible: true,
 						formatter:"datetime",
-						formatterParams: this.datetimeFormatterParams()
+						formatterParams: this.datetimeFormatterParams(),
+						responsive: 1,
 					},
 				],
 			},
@@ -113,11 +120,9 @@ export default {
 	methods: {
 
 		betriebsmittelTableBuilt: function () {
-			this.$refs.betriebsmittelTable.tabulator.setColumns(this.betriebsmittel_table_options.columns)
 			this.$refs.betriebsmittelTable.tabulator.setData(this.data.mittel);
 		},
 		zutrittsgruppenTableBuilt: function () {
-			this.$refs.zutrittsgruppenTable.tabulator.setColumns(this.zutrittsgruppen_table_options.columns)
 			this.$refs.zutrittsgruppenTable.tabulator.setData(
 				this.data.zuttritsgruppen
 			);
@@ -225,6 +230,10 @@ export default {
 					label: `${this.$p.t('person','personenkennzeichen')}`,
 					value: this.data.personenkennzeichen
 				},
+				matrikelnummer: {
+					label: this.$p.t('person/matrikelnummer'),
+					value: this.data.matrikelnummer
+				},
 				studiengang: {
 					label: `${this.$p.t('lehre','studiengang')}`,
 					value: this.data.studiengang
@@ -252,11 +261,7 @@ export default {
 	created() {
 		// preload phrasen
 		this.$p.loadCategory('profil').then(() => {
-			this.preloadedPhrasen.zutrittsGruppenPhrase = this.$p.t('profil/zutrittsGruppen');
-			this.preloadedPhrasen.entlehnteBetriebsmittelPhrase = this.$p.t('profil/entlehnteBetriebsmittel');
-			this.preloadedPhrasen.inventarnummerPhrase = this.$p.t('profil/inventarnummer');
-			this.preloadedPhrasen.ausgabedatum = this.$p.t('profil/ausgabedatum');
-			this.preloadedPhrasen.loaded = true;
+			this.arePhrasesPreloaded = true;
 		});
 		//? sorts the profil Updates: pending -> accepted -> rejected
 		this.data.profilUpdates?.sort(this.sortProfilUpdates);
@@ -287,14 +292,13 @@ export default {
 					</button>
 				</div>
 			</div>
+			<!-- MOBILE PROFIL UPDATES -->
 				<div v-if="data.profilUpdates" class="row mb-3">
 					<div class="col">
-						<!-- MOBILE PROFIL UPDATES -->
 						<fetch-profil-updates v-if="data.profilUpdates && data.profilUpdates.length" @fetchUpdates="fetchProfilUpdates"  :data="data.profilUpdates"></fetch-profil-updates>
 					</div>
 				</div>
 			</div>
-			<!-- END OF HIDDEN QUCK LINKS -->
 
 			<!-- MAIN PANNEL -->
 			<div class="col-sm-12 col-md-8 col-xxl-9 ">
@@ -303,30 +307,42 @@ export default {
 				<!-- ROW WITH THE PROFIL INFORMATION -->
 				<div class="row mb-4 ">
 					<div  class="col-lg-12 col-xl-6 ">
+						<!-- PROFIL INFORMATION -->
 						<div class="row mb-4">
 							<div class="col">
-								<!-- PROFIL INFORMATION -->
 								<profil-information @showEditProfilModal="showEditProfilModal" :title="$p.t('profil','studentIn')" :data="profilInformation" :fotoStatus="fotoStatus"></profil-information>
 							</div>
 						</div>
+						<!-- QUICK LINKS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+						<div v-if="quickLinks.length" class="row mb-4 d-md-none">
+							<div class="col">
+								<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+							</div>
+						</div>
+						<!-- CALENDAR SYNC OPTIONS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+						<div class="row mb-4 d-md-none">
+            			    <div class="col">
+								<calendar-sync :uid="$props.data.username" :calendarSyncUrls="$props.calendarSyncUrls"></calendar-sync>
+            			    </div>
+						</div>
+						<!-- STUDENT INFO -->
 						<div class="row mb-4">
 							<div  class=" col-lg-12">
-								<!-- STUDENT INFO -->
 								<role-information :title="$p.t('profil','studentInformation')" :data="roleInformation"></role-information>
 							</div>
 						</div>
 					<!-- START OF SECOND PROFIL  INFORMATION COLUMN -->
 					</div>
 					<div  class="col-xl-6 col-lg-12 ">
+						<!-- EMAILS -->
 						<div class="row mb-4">
 							<div class="col">
-								<!-- EMAILS -->
 								<profil-emails :title="this.$p.t('person','email')" :data="data.emails" ></profil-emails>
 							</div>
 						</div>
+						<!-- PRIVATE KONTAKTE-->
 						<div class="row mb-4 ">
 							<div class="col">
-								<!-- PRIVATE KONTAKTE-->
 								<div class="card">
 									<div class="card-header">
 										<div class="row">
@@ -349,9 +365,9 @@ export default {
 						</div>
 					</div>
 
+					<!-- PRIVATE ADRESSEN-->
 					<div class="row mb-4">
 						<div class="col">
-							<!-- PRIVATE ADRESSEN-->
 							<div class="card">
 								<div class="card-header">
 									<div class="row">
@@ -379,7 +395,7 @@ export default {
 			<div class="row">
 				<div class="col-12 mb-4" >
 					<core-filter-cmpt
-					v-if="preloadedPhrasen.loaded"
+					v-if="arePhrasesPreloaded"
 					@tableBuilt="betriebsmittelTableBuilt"
 					:title="$p.t('profil','entlehnteBetriebsmittel')"
 					ref="betriebsmittelTable"
@@ -389,7 +405,7 @@ export default {
 				</div>
 				<div class="col-12 mb-4" >
 					<core-filter-cmpt
-					v-if="preloadedPhrasen.loaded"
+					v-if="arePhrasesPreloaded"
 					@tableBuilt="zutrittsgruppenTableBuilt" 
 					:title="$p.t('profil','zutrittsGruppen')" 
 					ref="zutrittsgruppenTable" 
@@ -403,11 +419,6 @@ export default {
 		</div>
 		<!-- START OF SIDE PANEL -->
 		<div  class="col-md-4 col-xxl-3 col-sm-12 text-break" >
-			<div v-if="quickLinks.length" class="row mb-4">
-				<div class="col">
-					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
-				</div>
-			</div>
 			<!-- Bearbeiten Button -->
 			<div class="row d-none d-md-block">
 				<div class="col mb-3">
@@ -421,9 +432,21 @@ export default {
 					</button>
 				</div>
 			</div>
+			<!-- QUICK LINKS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div v-if="quickLinks.length" class="row mb-3 d-none d-md-block">
+				<div class="col">
+					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+				</div>
+			</div>
+			<!-- CALENDAR SYNC OPTIONS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div class="row mb-3 d-none d-md-block">
+                <div class="col">
+					<calendar-sync :uid="$props.data.username" :calendarSyncUrls="$props.calendarSyncUrls"></calendar-sync>
+                </div>
+			</div>
+			<!-- PROFIL UPDATES -->
 			<div v-if="data.profilUpdates" class="row d-none d-md-block mb-3">
 				<div class="col mb-3">
-					<!-- PROFIL UPDATES -->
 					<fetch-profil-updates v-if="data.profilUpdates && data.profilUpdates.length" @fetchUpdates="fetchProfilUpdates"  :data="data.profilUpdates"></fetch-profil-updates>
 				</div>
 			</div>
@@ -433,18 +456,13 @@ export default {
 				</div>
 			</div>
 			<!-- START OF THE SECOND ROW IN THE SIDE PANEL -->
+			<!-- MAILVERTEILER -->
             <div class="row mb-3">
 				<div class="col">
-					<!-- HIER SIND DIE MAILVERTEILER -->
 					<mailverteiler :title="$p.t('profil','mailverteiler')" :data="data?.mailverteiler"></mailverteiler>
 				</div>
-            <!-- END OF THE SECOND ROW IN THE SIDE PANEL -->
             </div>
-			<div class="row">
-                <div class="col">
-					<calendar-sync :uid="$props.data.username" :calendarSyncUrls="$props.calendarSyncUrls"></calendar-sync>
-                </div>
-			</div>
+            <!-- END OF THE SECOND ROW IN THE SIDE PANEL -->
         <!-- END OF SIDE PANEL -->
         </div>
     <!-- END OF CONTAINER ROW-->

public/js/components/Cis/Profil/StudentViewProfil.js

@@ -64,6 +64,10 @@ export default {
 					label: `${this.$p.t("person", "personenkennzeichen")}`,
 					value: this.data.personenkennzeichen,
 				},
+				matrikelnummer: {
+					label: this.$p.t('person/matrikelnummer'),
+					value: this.data.matrikelnummer
+				},
 				studiengang: {
 					label: `${this.$p.t("lehre", "studiengang")}`,
 					value: this.data.studiengang,
@@ -117,12 +121,12 @@ export default {
                             <profil-information :data="profilInformation" :title="$p.t('profil','studentIn')" :fotoStatus="fotoStatus"></profil-information>
                         </div>
                     </div>
-                    <!-- SECOND ROW OF FIRST COLUMN -->
-					<div class="row mb-4">
-                        <div class="col">
-                            
-                        </div>
-                    </div>
+					<!-- QUICK LINKS, MOBILE VIEW (HIDDEN IF VIEWPORT >= MD BREAKPOINT) -->
+					<div v-if="quickLinks.length" class="row mb-4 d-md-none">
+						<div class="col">
+							<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
+						</div>
+					</div>
                     <!-- START OF SECOND PROFIL  INFORMATION COLUMN -->
                     <!-- END OF PROFIL INFORMATION ROW -->
                     <!-- INFORMATION CONTENT END -->
@@ -151,7 +155,8 @@ export default {
         <!-- START OF SIDE PANEL -->
         <div  class="col-md-4 col-xxl-3 col-sm-12 text-break" >
             <!-- START OF THE FIRST ROW IN THE SIDE PANEL -->
-            <div v-if="quickLinks.length" class="row mb-4">
+            <!-- QUICK LINKS, HIDDEN IF VIEWPORT < MD BREAKPOINT -->
+			<div v-if="quickLinks.length" class="row mb-3 d-none d-md-block">
 				<div class="col">
 					<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
 				</div>

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

@@ -8,6 +8,7 @@ export const Raumsuche =  {
 		CoreFilterCmpt,
 		InputNumber: primevue.inputnumber,
 	},
+	inject: ["isMobile"],
 	data() {
 		return {
 			phrasenPromise: null,
@@ -70,6 +71,11 @@ export const Raumsuche =  {
 			}
 			]};
 	},
+	computed: {
+		isDarkMode(){
+			return this.$theme.theme_name.value == 'dark';
+		}
+	},
 	methods: {
 		tableResolve(resolve) {
 			this.tableBuiltResolve = resolve
@@ -175,11 +181,6 @@ export const Raumsuche =  {
 			
 		}
 	},
-	computed: {
-		isDarkMode(){
-			return this.$theme.theme_name.value == 'dark';
-		}
-	},
 	created() {
 		this.phrasenPromise = this.$p.loadCategory(['rauminfo', 'global'])
 		this.phrasenPromise.then(()=> {this.phrasenResolved = true})
@@ -191,46 +192,50 @@ export const Raumsuche =  {
 	<h1 class="h3">{{$p.t('rauminfo/roomSearch')}}</h1>
 	<hr>
 	<div class="row">
-		<div class="col-12 col-lg-2">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-2">
 			<VueDatePicker
-				:dark="isDarkMode"
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="datum"
+				:dark="isDarkMode"
 				:clearable="false"
-				date-picker
 				:enable-time-picker="false"
 				:format="dateFormat"
 				:text-input="datepickerTextInputOptions"
 				:min-date="new Date()"
-				auto-apply>
-			</VueDatePicker>
-		</div>
-		<div class="col-12 col-lg-1">
-			<VueDatePicker
-				:dark="isDarkMode"
-				v-model="von"
-				:clearable="false"
-				time-picker
-				:format="timeFormat"
-				:text-input="timepickerTextInputOptions"
-				:is-24="true"
+				date-picker
 				auto-apply
 				>
 			</VueDatePicker>
 		</div>
-		<div class="col-12 col-lg-1">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-1">
 			<VueDatePicker
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
+				v-model="von"
 				:dark="isDarkMode"
-				v-model="bis"
 				:clearable="false"
-				time-picker
 				:format="timeFormat"
 				:text-input="timepickerTextInputOptions"
 				:is-24="true"
+				time-picker
+				auto-apply
+				>
+			</VueDatePicker>
+		</div>
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-1">
+			<VueDatePicker
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
+				v-model="bis"
+				:dark="isDarkMode"
+				:clearable="false"
+				:format="timeFormat"
+				:text-input="timepickerTextInputOptions"
+				:is-24="true"
+				time-picker
 				auto-apply>
 			</VueDatePicker>
 		</div>
 		
-		<div class="col-12 col-lg-3">
+		<div :class="{'pb-1': isMobile}" 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>
@@ -239,7 +244,7 @@ export const Raumsuche =  {
 		</div>
 		
 
-		<div class="col-12 col-lg-3">
+		<div :class="{'pb-2': isMobile}" class="col-12 col-lg-3">
 			<InputNumber v-model="anzahl" 
 			:prefix="$p.t('rauminfo/minCapacity') + ': '" 
 			inputId="anzahlInput" :min="1" :max="1000" 

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

@@ -3,6 +3,11 @@ export default {
 		event: {
 			type: Object,
 			required: true
+		},
+		timeSlotDisplayBehavior: {
+			type: String,
+			default: "default",
+			// options: default, always, never 
 		}
 	},
 	computed:{
@@ -50,7 +55,17 @@ export default {
 			return luxon.Duration
 				.fromISOTime(this.event.ende)
 				.toISOTime({ suppressSeconds: true });
-		}
+		},
+		timeSlotDisplayClasses() {
+			switch (this.$props.timeSlotDisplayBehavior) {
+				case "always":
+					return "d-grid";
+				case "never":
+					return "d-none";
+				default:
+					return "d-none d-xl-grid";
+			}
+		},
 	},
 	template: /*html*/`
 	<div
@@ -58,8 +73,9 @@ export default {
 		@wheel.stop
 	>
 		<div
-			v-if="!event.allDayEvent && event?.beginn && event?.ende"
-			class="event-time d-none d-xl-grid h-100"
+			v-if="!event?.allDayEvent && event?.beginn && event?.ende"
+			:class="timeSlotDisplayClasses"
+			class="event-time h-100"
 		>
 			<span>{{ start }}</span>
 			<span>{{ end }}</span>

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

@@ -3,6 +3,11 @@ export default {
 		event: {
 			type: Object,
 			required: true
+		},
+		timeSlotDisplayBehavior: {
+			type: String,
+			default: "default",
+			// options: default, always, never 
 		}
 	},
 	computed: {
@@ -50,21 +55,33 @@ export default {
 			return luxon.Duration
 				.fromISOTime(this.event.ende)
 				.toISOTime({ suppressSeconds: true });
-		}
+		},
+		timeSlotDisplayClasses() {
+			switch (this.$props.timeSlotDisplayBehavior) {
+				case "always":
+					return "d-grid";
+				case "never":
+					return "d-none";
+				default:
+					return "d-none d-xl-grid";
+			}
+		},
 	},
 	template: /* html */`
 	<div
 		class="cis-renderer-reservierungen-calendar-event calendar-event-default h-100 w-100 p-1"
 	>
 		<div
-			v-if="!event.allDayEvent && event?.beginn && event?.ende"
-			class="event-time d-grid h-100"
+			v-if="!event?.allDayEvent && event?.beginn && event?.ende"
+			:class="timeSlotDisplayClasses"
+			class="event-time h-100"
 		>
 			<span>{{ start }}</span>
 			<span>{{ end }}</span>
 		</div>
 		<div class="event-text" v-tooltip="tooltipString">
 			<span class="event-topic">{{ event.topic }}</span>
+			<span class="event-place">{{ event.ort_kurzbz }}</span>
 			<span
 				v-for="lektor in event.lektor.slice(0, 3)"
 				class="event-lectors"
@@ -77,7 +94,6 @@ export default {
 			>
 				... +{{ event.lektor.length - 3 }}
 			</span>
-			<span class="event-place">{{ event.ort_kurzbz }}</span>
 		</div>
 	</div>
 	`,

public/js/components/Cis/Studium/Studium.js

@@ -1,5 +1,6 @@
 import LvUebersicht from "../Mylv/LvUebersicht.js";
 
+import ApiCisStudium from '../../../api/factory/cis/studium.js';
 
 export default {
 	data(){
@@ -26,6 +27,7 @@ export default {
 
 		}
 	},
+	name: "OverviewStudiengaenge",
 	components: {
 		LvUebersicht,
 	},
@@ -88,6 +90,27 @@ export default {
 			studienordnung.selectedIndex = newSelectIndex;
 			this.changeSelectedStudienPlan(studienordnung.value);
 		},
+		onStudiensemesterChange(event) {
+			const value = event.target.value;
+			this.setHash(value);
+			this.changeSelectedStudienSemester(value);
+
+		},
+		onStudiengangChange(event) {
+			const value = event.target.value;
+			this.setHash(value);
+			this.changeSelectedStudienGang(value);
+		},
+		onSemesterChange(event) {
+			const value = event.target.value;
+			this.setHash(value);
+			this.changeSelectedSemester(value);
+		},
+		onStudienordnungChange(event) {
+			const value = event.target.value;
+			this.setHash(value);
+			this.changeSelectedStudienPlan(value);
+		},
 		
 		storeDataToLocalStorage(key,value){
 			localStorage.setItem(key, value);
@@ -97,28 +120,32 @@ export default {
 			return value;
 		},
 		changeSelectedStudienSemester(studiensemester_kurzbz) {
-			this.$fhcApi.factory.studium.getAllStudienSemester(studiensemester_kurzbz, this.selectedStudiengang, this.selectedSemester, this.selectedStudienordnung)
+			return this.$api
+				.call(ApiCisStudium.getAllStudienSemester(studiensemester_kurzbz, this.selectedStudiengang, this.selectedSemester, this.selectedStudienordnung))
 				.then(data => data.data)
 				.then(res => {
 					this.extractPropertyValues(res);
 				})
 		},
 		changeSelectedStudienGang(studiengang_kz) {
-			this.$fhcApi.factory.studium.getAllStudienSemester(this.selectedStudiensemester, studiengang_kz, this.selectedSemester, this.selectedStudienordnung)
+			return this.$api
+				.call(ApiCisStudium.getAllStudienSemester(this.selectedStudiensemester, studiengang_kz,  this.selectedSemester, this.selectedStudienordnung))
 				.then(data => data.data)
 				.then(res => {
 					this.extractPropertyValues(res);
 				})
 		},
 		changeSelectedSemester(semester) {
-			this.$fhcApi.factory.studium.getAllStudienSemester(this.selectedStudiensemester, this.selectedStudiengang, semester, this.selectedStudienordnung)
+			return this.$api
+				.call(ApiCisStudium.getAllStudienSemester(this.selectedStudiensemester, this.selectedStudiengang, semester, this.selectedStudienordnung))
 				.then(data => data.data)
 				.then(res => {
 					this.extractPropertyValues(res);
 				})
 		},
 		changeSelectedStudienPlan(studienplan_id) {
-			this.$fhcApi.factory.studium.getAllStudienSemester(this.selectedStudiensemester, this.selectedStudiengang, this.selectedSemester, studienplan_id)
+			return this.$api
+				.call(ApiCisStudium.getAllStudienSemester(this.selectedStudiensemester, this.selectedStudiengang, this.selectedSemester, studienplan_id))
 				.then(data => data.data)
 				.then(res => {
 					this.extractPropertyValues(res);
@@ -160,6 +187,7 @@ export default {
 			this.studiengaenge = studiengang.all;
 			this.selectedStudiengang = studiengang.preselected?.studiengang_kz;
 
+
 			this.semester = semester.all;
 			this.selectedSemester = semester?.preselected;
 
@@ -195,7 +223,11 @@ export default {
 		},
 		studiengangTitel(studiengang) {
 			if (!studiengang) return "";
-			return `${studiengang?.kurzbzlang} (${studiengang?.bezeichnung})`;
+			if(this.isGermanLanguage){
+				return `${studiengang?.kurzbzlang} (${studiengang?.bezeichnung})`;
+			}else{
+				return `${studiengang?.kurzbzlang} (${studiengang?.english})`;
+			}
 		},
 		studiensemesterTitel(studiensemester){
 			if (!studiensemester) return "";
@@ -213,9 +245,12 @@ export default {
 	},
 
 	computed:{
+		isGermanLanguage(){
+			return this.$p.user_language.value == "German"
+		},
 		selectedLehrveranstaltungTitel(){
 			const studiengang = this.studiengaenge.find((studiengang) => studiengang.studiengang_kz == this.selectedStudiengang);
-			return `${this.selectedLehrveranstaltung?.bezeichnung} ${this.selectedLehrveranstaltung?.lehrform_kurzbz} / ${studiengang.kurzbzlang}-${this.selectedSemester} ${this.selectedLehrveranstaltung?.orgform_kurzbz} (${this.selectedStudiensemester})`;
+			return `${this.isGermanLanguage ? this.selectedLehrveranstaltung?.bezeichnung : this.selectedLehrveranstaltung?.bezeichnung_english} ${this.selectedLehrveranstaltung?.lehrform_kurzbz} / ${studiengang.kurzbzlang}-${this.selectedSemester} ${this.selectedLehrveranstaltung?.orgform_kurzbz} (${this.selectedStudiensemester})`;
 		},
 		computedStudienOrdnung(){
 			if(!this.studienOrdnung) return null;
@@ -232,14 +267,14 @@ export default {
 			let result = [];
 			Object.entries(this.computedStudienOrdnung).forEach(([key,value])=>{
 				result.push({
-					bezeichnung: `Studienordnung: ${key}`,
+					bezeichnung: `${this.$p.t('studium', 'studienordnung') }: ${key}`,
 					disabled: true,
 				});
 				value.forEach((studienplan)=>{
 					result.push({
 						studienplan:studienplan,
 						diabled: false,
-						bezeichnung: `${studienplan?.bezeichnung}-${studienplan?.orgform_kurzbz} ( ${studienplan?.orgform_bezeichnung}, ${studienplan?.sprache} )`
+						bezeichnung: `${studienplan?.bezeichnung}-${studienplan?.orgform_kurzbz} ( ${this.isGermanLanguage ? studienplan?.orgform_bezeichnung : studienplan?.orgform_bezeichnung_english}, ${studienplan?.sprache} )`
 							
 					});
 				})
@@ -256,22 +291,23 @@ export default {
 		const studienordnung = JSON.parse(this.getDataFromLocalStorage("studienordnung")) ?? undefined;
 
 		// only fetch default data if no data is stored in the local storage
-		
-		this.$fhcApi.factory.studium.getAllStudienSemester(studiensemester, studiengang, semester, studienordnung)
-		.then(data => data.data)
-		.then(res => {
-			this.extractPropertyValues(res);
-		})
+
+		this.$api
+			.call(ApiCisStudium.getAllStudienSemester(studiensemester, studiengang, semester, studienordnung))
+			.then(data => data.data)
+			.then(res => {
+				this.extractPropertyValues(res);
+			})
 
 	},
-	template: `
+	template: /*html*/`
 	<div>
-	<h2>Studium</h2>
+	<h2>{{$p.t('studium','studium')}}</h2>
 	<hr>
 	<lv-uebersicht ref="lvUebersicht" :titel="selectedLehrveranstaltungTitel" :event="selectedLehrveranstaltung" :studiensemester="selectedStudiensemester" v-if="selectedLehrveranstaltung">
 		<template #content>
 			<div v-if="Array.isArray(selectedLehrveranstaltung.lektoren) && selectedLehrveranstaltung.lektoren.length>0" class="mb-4">
-				<h4>Lektoren:</h4>
+				<h4>{{$p.t('studium','lektoren')}}:</h4>
 				<a :href="'mailto:'+lektor?.email" class="fhc-link-color mx-2" v-for="lektor in selectedLehrveranstaltung.lektoren">{{lektor.name}}</a>
 			</div>
 			<h4>Menu:</h4>
@@ -279,13 +315,13 @@ export default {
 	</lv-uebersicht>
 	<div class="lvOptions">
 		<div>
-		<h6>Studiensemester:</h6>
+		<h6>{{$p.t('studium','studiensemester')}}:</h6>
 		<div class="input-group">
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudiensemester(1)" :aria-label="$p.t('global','previous')" :title="$p.t('global','previous')">
 				<i class="fa fa-caret-left" aria-hidden="true"></i>
 			</button>
-			<select ref="studiensemester" v-model="selectedStudiensemester" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setHash($event.target.value)">
-				<option v-for="semester in studienSemester" @click="changeSelectedStudienSemester(semester.studiensemester_kurzbz)" :key="semester" :value="semester.studiensemester_kurzbz">{{studiensemesterTitel(semester.studiensemester_kurzbz)	}}</option>
+			<select ref="studiensemester" v-model="selectedStudiensemester"  @change="onStudiensemesterChange" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')">
+				<option v-for="semester in studienSemester"  :key="semester" :value="semester.studiensemester_kurzbz">{{studiensemesterTitel(semester.studiensemester_kurzbz)	}}</option>
 			</select>
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudiensemester(-1)" :aria-label="$p.t('global','next')" :title="$p.t('global','next')">
 				<i class="fa fa-caret-right" aria-hidden="true"></i>
@@ -294,13 +330,13 @@ export default {
 		</div>
 
 		<div>
-		<h6>Studiengang:</h6>
+		<h6>{{$p.t('lehre','studiengang')}}:</h6>
 		<div class="input-group">
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudiengang(-1)" :aria-label="$p.t('global','previous')" :title="$p.t('global','previous')">
 				<i class="fa fa-caret-left" aria-hidden="true"></i>
 			</button>
-			<select ref="studiengaenge" v-model="selectedStudiengang" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setHash($event.target.value)">
-				<option v-for="studiengang in studiengaenge" @click="changeSelectedStudienGang(studiengang.studiengang_kz)" :key="studiengang.studiengang_kz" :value="studiengang.studiengang_kz" >{{studiengangTitel(studiengang)}}</option>
+			<select ref="studiengaenge" v-model="selectedStudiengang" class="form-select" @change="onStudiengangChange" :aria-label="$p.t('global/studiensemester_auswaehlen')">
+				<option v-for="studiengang in studiengaenge"  :key="studiengang.studiengang_kz" :value="studiengang.studiengang_kz" >{{studiengangTitel(studiengang)}}</option>
 			</select>
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudiengang(1)" :aria-label="$p.t('global','next')" :title="$p.t('global','next')">
 				<i class="fa fa-caret-right" aria-hidden="true"></i>
@@ -309,13 +345,13 @@ export default {
 		</div>
 
 		<div>
-		<h6>Semester:</h6>
+		<h6>{{$p.t('lehre','semester')}}:</h6>
 		<div class="input-group">
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeSemester(-1)" :aria-label="$p.t('global','previous')" :title="$p.t('global','previous')">
 				<i class="fa fa-caret-left" aria-hidden="true"></i>
 			</button>
-			<select ref="semester" v-model="selectedSemester" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setHash($event.target.value)">
-				<option v-for="sem in semester" @click="changeSelectedSemester(sem)" :key="semester" :value="sem">{{sem}}. Semester</option>
+			<select ref="semester" v-model="selectedSemester" class="form-select"  @change="onSemesterChange" :aria-label="$p.t('global/studiensemester_auswaehlen')">
+				<option v-for="sem in semester" :key="sem" :value="sem">{{sem}}. Semester</option>
 			</select>
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeSemester(1)" :aria-label="$p.t('global','next')" :title="$p.t('global','next')">
 				<i class="fa fa-caret-right" aria-hidden="true"></i>
@@ -324,13 +360,13 @@ export default {
 		</div>
 
 		<div>
-		<h6>Studienordnung:</h6>
+		<h6>{{$p.t('studium','studienordnung')}}:</h6>
 		<div class="input-group">
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudienordnung(-1)" :aria-label="$p.t('global','previous')" :title="$p.t('global','previous')">
 				<i class="fa fa-caret-left" aria-hidden="true"></i>
 			</button>
-			<select ref="studienordnung" v-model="selectedStudienordnung" class="form-select" :aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setHash($event.target.value)">
-				<option v-for="ordnung in computedStudienOrdnungSelectValues" :disabled="ordnung.disabled" @click="changeSelectedStudienPlan(ordnung?.studienplan?.studienplan_id)" :key="ordnung?.studienplan?.bezeichnung	" :value="ordnung?.studienplan?.studienplan_id">{{ordnung.bezeichnung}}</option>
+			<select ref="studienordnung" v-model="selectedStudienordnung" class="form-select"  @change="onStudienordnungChange" :aria-label="$p.t('global/studiensemester_auswaehlen')">
+				<option v-for="ordnung in computedStudienOrdnungSelectValues" :disabled="ordnung.disabled" :key="ordnung?.studienplan?.studienplan_id" :value="ordnung?.studienplan?.studienplan_id">{{ordnung.bezeichnung}}</option>
 			</select>
 			<button class="btn btn-outline-secondary" type="button" :disabled="false" @click="changeStudienordnung(1)" :aria-label="$p.t('global','next')" :title="$p.t('global','next')">
 				<i class="fa fa-caret-right" aria-hidden="true"></i>
@@ -345,13 +381,13 @@ export default {
 	<template v-for="lehrveranstaltung in lehrveranstaltungen" :key="lehrveranstaltung.lehrveranstaltung_id">
 		<div  class="card" v-if="Array.isArray(lehrveranstaltung.lehrveranstaltungen) && lehrveranstaltung.lehrveranstaltungen.length >0" >
 			<div class="card-header">
-				<h5 class=" card-title">{{lehrveranstaltung.bezeichnung}}</h5>
+				<h5 class=" card-title">{{isGermanLanguage == 'German' ? lehrveranstaltung.bezeichnung : lehrveranstaltung.bezeichnung_english }}</h5>
 				<h6 class=" card-subtitle">{{lehrveranstaltung.lehrform_kurzbz}}</h6>
 			</div>
 			<div class="card-body">
 				<ul class="list-group list-group-flush">
 					<li class="d-flex list-group-item" v-for="lv in lehrveranstaltung.lehrveranstaltungen">
-						<a class="fhc-link-color d-block me-auto" href="#" @click="openLvUebersicht(lv)">{{lv.bezeichnung}}</a>
+						<a class="fhc-link-color d-block me-auto" href="#" @click="openLvUebersicht(lv)">{{isGermanLanguage == 'German' ? lv.bezeichnung : lv.bezeichnung_english}}</a>
 						<p>{{lv.lehrform_kurzbz}}</p>
 					</li>	
 				</ul>

public/js/components/Dashboard/Admin.js

@@ -4,7 +4,6 @@ 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',
@@ -16,7 +15,7 @@ export default {
 	provide() {
 		return {
 			adminMode: true,
-			widgetsSetup: Vue.computed(() => this.dashboards[this.current] ? this.dashboards[this.current].widgetSetup : null)
+			widgetsSetup: Vue.computed(() => this.dashboard ? this.dashboard.widgetSetup : null)
 		};
 	},
 	data() {
@@ -34,33 +33,32 @@ export default {
 	methods: {
 		dashboardAdd() {
 			let _name = '';
-			BsPrompt.popup('New Dashboard name').then(
-				name => {
-					_name = name;
+			BsPrompt
+				.popup('New Dashboard name')
+				.then(dashboard_kurzbz => {
 					const params = {
-						dashboard_kurzbz: name
+						dashboard_kurzbz
 					};
 					return this.$api
 						.call(ApiDashboardBoard.add(params))
-						.then(response =>{
+						.then(response => {
 							this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSave'));
 
 							let newDashboard = {
 								dashboard_id: response.data,
-								dashboard_kurzbz: _name,
+								dashboard_kurzbz,
 								beschreibung: ''
 							};
 							this.dashboards.push(newDashboard);
 							this.current = newDashboard.dashboard_id;
 						})
 						.catch(this.$fhcAlert.handleSystemError);
-					});
+				});
 		},
 		dashboardUpdate(dashboard) {
-			return this.$api
+			this.$api
 				.call(ApiDashboardBoard.update(dashboard))
-				.then(response =>{
-
+				.then(response => {
 					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSave'));
 
 					let old = this.dashboards.find(el => el.dashboard_id == dashboard.dashboard_id);
@@ -70,73 +68,122 @@ export default {
 				.catch(this.$fhcAlert.handleSystemError);
 		},
 		dashboardDelete(dashboard_id) {
-			return this.$api
+			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);
-				});
+				})
+				.catch(this.$fhcAlert.handleSystemError);
 		},
 		assignWidgets(widgets) {
 			this.widgets = widgets;
-			/*while (this.widgets.length)
-				this.widgets.pop();
-			for (var i in widgets)
-				this.widgets.push(widgets[i]);*/
 		}
 	},
 	created() {
 		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);
-				}
+				this.dashboards = result.data;
 			})
 			.catch(this.$fhcAlert.handleSystemError);
 	},
-	template: `<div class="dashboard-admin">
-
+	template: /* html */`
+	<div class="dashboard-admin">
 		<div class="input-group">
-			<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>
+			<label for="dashboard-select" class="input-group-text">
+				Dashboard:
+			</label>
+			<select id="dashboard-select" v-model="current" class="form-select">
+				<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>
+			<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">{{this.$p.t('ui', 'bearbeiten')}}</button>
+					<button
+						id="edit-tab"
+						class="nav-link"
+						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>
+					<button
+						id="widgets-tab"
+						class="nav-link active"
+						data-bs-toggle="tab"
+						data-bs-target="#widgets"
+						type="button"
+						role="tab"
+						aria-controls="widgets"
+						aria-selected="true"
+					>Widgets</button>
 				</li>
 				<li class="nav-item" role="presentation">
-					<button class="nav-link" id="presets-tab" data-bs-toggle="tab" data-bs-target="#presets" type="button" role="tab" aria-controls="presets" aria-selected="false">Presets</button>
+					<button
+						class="nav-link"
+						id="presets-tab"
+						data-bs-toggle="tab"
+						data-bs-target="#presets"
+						type="button"
+						role="tab"
+						aria-controls="presets"
+						aria-selected="false"
+					>Presets</button>
 				</li>
 			</ul>
 			<div class="tab-content pt-3">
-				<div class="tab-pane fade" id="edit" role="tabpanel" aria-labelledby="edit-tab">
-					<dashboard-admin-edit v-bind="dashboard" :key="dashboard.dashboard_id" @change="dashboardUpdate($event)" @delete="dashboardDelete($event)"></dashboard-admin-edit>
+				<div
+					id="edit"
+					class="tab-pane fade"
+					role="tabpanel"
+					aria-labelledby="edit-tab"
+				>
+					<dashboard-admin-edit
+						v-bind="dashboard"
+						@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" @assign-widgets="assignWidgets"></dashboard-admin-widgets>
+				<div
+					id="widgets"
+					class="tab-pane fade show active"
+					role="tabpanel"
+					aria-labelledby="widgets-tab"
+				>
+					<dashboard-admin-widgets
+						: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>
+				<div
+					id="presets"
+					class="tab-pane fade"
+					role="tabpanel"
+					aria-labelledby="presets-tab"
+				>
+					<dashboard-admin-presets
+						:dashboard="dashboard.dashboard_kurzbz"
+						:widgets="widgets"
+					></dashboard-admin-presets>
 				</div>
 			</div>
 		</div>

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

@@ -1,15 +1,15 @@
 import BsConfirm from '../../Bootstrap/Confirm.js';
 
 export default {
-	emits: [
-		"change",
-		"delete"
-	],
 	props: {
 		dashboard_id: Number,
 		dashboard_kurzbz: String,
 		beschreibung: String
 	},
+	emits: [
+		"change",
+		"delete"
+	],
 	data() {
 		return {
 			kurzbz: this.dashboard_kurzbz,
@@ -18,22 +18,43 @@ export default {
 	},
 	methods: {
 		sendDelete() {
-			BsConfirm.popup(this.$p.t('ui', 'confirm_delete') + " " + this.$p.t('ui', 'deleteInfo'))
-				.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">
+	template: /* html */`
+	<div class="dashboard-admin-edit px-3">
 		<div class="mb-3">
-			<label for="dashboard-admin-edit-kurzbz">Kurz Bezeichnung</label>
-			<input id="dashboard-admin-edit-kurzbz" type="text" class="form-control" v-model="kurzbz">
+			<label for="dashboard-admin-edit-kurzbz">{{ $p.t('dashboard/kurzbz') }}</label>
+			<input
+				id="dashboard-admin-edit-kurzbz"
+				v-model="kurzbz"
+				type="text"
+				class="form-control"
+			>
 		</div>
 		<div class="mb-3">
-			<label for="dashboard-admin-edit-beschreibung">Beschreibung</label>
-			<textarea id="dashboard-admin-edit-beschreibung" class="form-control" v-model="desc"></textarea>
+			<label for="dashboard-admin-edit-beschreibung">{{ $p.t('global/beschreibung') }}</label>
+			<textarea
+				id="dashboard-admin-edit-beschreibung"
+				v-model="desc"
+				class="form-control"
+			></textarea>
 		</div>
 		<div>
-			<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>
+			<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

@@ -12,20 +12,61 @@ export default {
 		dashboard: String,
 		widgets: Array
 	},
-	data: () => ({
-		funktionen: {},
-		sections: [],
-		tmpLoading: ''
-	}),
+	data() {
+		return {
+			funktionen: {},
+			sections: [],
+			selectedFunktionen: [],
+			abortController: null
+		};
+	},
 	computed: {
 		pickerWidgets() {
 			return this.widgets.filter(widget => widget.allowed);
+		},
+		sizeLimits() {
+			return Object.fromEntries(this.widgets.map(({ setup, widget_id: type }) => {
+				const result = {}; // work on a copy
+				if (setup.height === undefined)
+					result.height = { min: 1, max: undefined };
+				else if (Number.isInteger(setup.height))
+					result.height = { min: setup.height, max: setup.height };
+				else
+					result.height = {
+						min: setup.height.min ?? 1,
+						max: setup.height.max
+					};
+
+				if (setup.width === undefined)
+					result.width = { min: 1, max: undefined };
+				else if (Number.isInteger(setup.width))
+					result.width = { min: setup.width, max: setup.width };
+				else
+					result.width = {
+						min: setup.width.min ?? 1,
+						max: setup.width.max
+					};
+
+				return [type, result];
+			}));
+		}
+	},
+	watch: {
+		dashboard() {
+			this.loadSections();
+			this.loadFunktionen();
 		}
 	},
 	methods: {
-		widgetAdd(section_name, widget) {
+		widgetAdd(widget, section_name) {
 			this.$refs.widgetpicker.getWidget().then(widget_id => {
 				widget.widget = widget_id;
+				// NOTE(chris): min size
+				widget.place = Object.fromEntries(Object.entries(widget.place).map(([key, value]) => {
+					value.w = this.sizeLimits[widget_id].width.min;
+					value.h = this.sizeLimits[widget_id].height.min;
+					return [key, value];
+				}));
 				widget.id = 'loading_' + String((new Date()).valueOf());
 				delete widget.custom;
 				widget.preset = 1;
@@ -36,6 +77,8 @@ export default {
 						section.widgets.push(loading);
 				});
 
+				delete widget.id;
+
 				const params = {
 					dashboard: this.dashboard,
 					funktion_kurzbz: section_name,
@@ -64,22 +107,29 @@ export default {
 			})
 			.catch(() => {});
 		},
-		widgetUpdate(section_name, payload) {
-			payload = payload[section_name];
+		widgetUpdate(payload, section_name) {
 			for (var k in payload) {
 				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]);
+						const copy = ObjectUtils.mergeDeep(section.widgets[wid], payload[k]);
+						if (payload[k].config)
+							copy.config = payload[k].config;
+						payload[k] = copy;
 						// NOTE(chris): remove internal props
-						for (var prop of ['_x', '_y', '_w', '_h', 'index', 'id'])
+						for (var prop of ['_x', '_y', '_w', '_h', 'index', 'id', 'custom'])
 							if (payload[k][prop])
 								delete payload[k][prop];
 						break;
 					}
 				}
+				if (payload[k].place) {
+					Object.values(payload[k].place).forEach(place => {
+						if (place.pinned === false)
+							delete place.pinned;
+					});
+				}
 				payload[k].widgetid = k;
-				delete payload[k].custom;
 			}
 			this.$api
 				.call(Object.entries(payload).map(([key, widget]) => [
@@ -106,7 +156,7 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-		widgetRemove(section_name, id) {
+		widgetRemove(id, section_name) {
 			const params = {
 				db: this.dashboard,
 				funktion_kurzbz: section_name,
@@ -122,21 +172,22 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-		loadSections(evt) {
-			let funktionen = Array.from(evt.target.querySelectorAll("option:checked"),e=>e.value);
-			this.sections = [];
-			this.tmpLoading = funktionen.join('###');
-
+		loadSections() {
 			const params = {
 				db: this.dashboard,
-				funktionen
+				funktionen: this.selectedFunktionen
 			};
 
+			if (this.abortController)
+				this.abortController.abort();
+			this.abortController = new AbortController();
+			const signal = this.abortController.signal;
+
+			this.sections = [];
+			
 			return this.$api
-				.call(ApiDashboardPreset.getBatch(params))
+				.call(ApiDashboardPreset.getBatch(params), { signal })
 				.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]) {
@@ -151,7 +202,6 @@ export default {
 					}
 				})
 				.catch(this.$fhcAlert.handleSystemError);
-
 		},
 		loadFunktionen() {
 			this.$api
@@ -165,17 +215,17 @@ export default {
 	created() {
 		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">
+	template: /* html */`
+	<div class="dashboard-admin-presets">
 		<div class="row">
 			<div class="col-3">
-				<select ref="funktionenList" style="height:30em" class="form-control" multiple @input="loadSections">
+				<select
+					v-model="selectedFunktionen"
+					class="form-control"
+					style="height:30em"
+					multiple
+					@change="loadSections"
+				>
 					<option
 						v-for="funktion in funktionen"
 						:key="funktion.funktion_kurzbz"
@@ -185,9 +235,20 @@ export default {
 				</select>
 			</div>
 			<div class="col-9">
-				<dashboard-section v-for="section in sections" :key="section.name" :name="section.name" :widgets="section.widgets" @widget-add="widgetAdd" @widget-update="widgetUpdate" @widget-remove="widgetRemove"></dashboard-section>
+				<dashboard-section
+					v-for="section in sections"
+					:key="section.name"
+					:name="section.name"
+					:widgets="section.widgets"
+					@widget-add="widgetAdd"
+					@widget-update="widgetUpdate"
+					@widget-remove="widgetRemove"
+				></dashboard-section>
 			</div>
 		</div>
-		<dashboard-widget-picker ref="widgetpicker" :widgets="pickerWidgets"></dashboard-widget-picker>
+		<dashboard-widget-picker
+			ref="widgetpicker"
+			:widgets="pickerWidgets"
+		></dashboard-widget-picker>
 	</div>`
 }

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

@@ -1,14 +1,14 @@
 import ApiDashboardWidget from "../../../api/factory/dashboard/widget.js";
 
 export default {
-	emits: [
-		"change",
-		"assignWidgets"
-	],
 	props: {
 		dashboard_id: Number,
 		widgets: Array
 	},
+	emits: [
+		"change",
+		"assignWidgets"
+	],
 	methods: {
 		sendChange(widget_id) {
 			let allow = !this.widgets.find(el => el.widget_id == widget_id).allowed;
@@ -29,11 +29,27 @@ export default {
 			})
 			.catch(this.$fhcAlert.handleSystemError);
 	},
-	template: `
+	template: /* html */`
 	<div class="dashboard-admin-widgets">
-		<div v-for="widget in widgets" :key="widget.widget_id" class="form-check form-switch">
-			<input class="form-check-input" type="checkbox" role="switch" :id="'dashboard-admin-widgets-' + widget.widget_id" v-model="widget.allowed" @input.prevent="sendChange(widget.widget_id)">
-			<label class="form-check-label" :for="'dashboard-admin-widgets-' + widget.widget_id">{{(widget.setup && widget.setup.name) || widget.widget_kurzbz}}</label>
+		<div
+			v-for="widget in widgets"
+			:key="widget.widget_id"
+			class="form-check form-switch"
+		>
+			<input
+				:id="'dashboard-admin-widgets-' + widget.widget_id"
+				v-model="widget.allowed"
+				class="form-check-input"
+				type="checkbox"
+				role="switch"
+				@input.prevent="sendChange(widget.widget_id)"
+			>
+			<label
+				class="form-check-label"
+				:for="'dashboard-admin-widgets-' + widget.widget_id"
+			>
+				{{ (widget.setup && widget.setup.name) || widget.widget_kurzbz }}
+			</label>
 		</div>
 	</div>`
 }

public/js/components/Dashboard/Dashboard.js

@@ -31,22 +31,57 @@ export default {
 	},
 	provide() {
 		return {
-			editMode: Vue.computed(()=>this.editMode),
+			editMode: Vue.computed(() => this.editMode),
 			widgetsSetup: Vue.computed(() => this.widgetsSetup),
 			timezone: this.timezone
 		}
 	},
+	computed: {
+		sizeLimits() {
+			return Object.fromEntries(this.widgetsSetup.map(({ setup, widget_id: type }) => {
+				const result = {}; // work on a copy
+				if (setup.height === undefined)
+					result.height = { min: 1, max: undefined };
+				else if (Number.isInteger(setup.height))
+					result.height = { min: setup.height, max: setup.height };
+				else
+					result.height = {
+						min: setup.height.min ?? 1,
+						max: setup.height.max
+					};
+
+				if (setup.width === undefined)
+					result.width = { min: 1, max: undefined };
+				else if (Number.isInteger(setup.width))
+					result.width = { min: setup.width, max: setup.width };
+				else
+					result.width = {
+						min: setup.width.min ?? 1,
+						max: setup.width.max
+					};
+
+				return [type, result];
+			}));
+		}
+	},
 	methods: {
-		widgetAdd(section_name, widget) {
-			// TODO(chris): remove section_name? (change order of params => get rid of it)
+		widgetAdd(widget) {
 			this.$refs.widgetpicker
 				.getWidget()
 				.then(widget_id => {
 					widget.widget = widget_id;
+					// NOTE(chris): min size
+					widget.place = Object.fromEntries(Object.entries(widget.place).map(([key, value]) => {
+						value.w = this.sizeLimits[widget_id].width.min;
+						value.h = this.sizeLimits[widget_id].height.min;
+						return [key, value];
+					}));
 					widget.id = 'loading_' + String((new Date()).valueOf());
 					let loading = { ...widget };
 					loading.loading = true;
 					this.widgets.push(loading);
+
+					delete widget.id;
 					
 					this.$api
 						.call(ApiDashboardUser.addWidget(this.dashboard, widget))
@@ -60,19 +95,27 @@ export default {
 				})
 				.catch(() => {});
 		},
-		widgetUpdate(section_name, payload) {
-			payload = payload[section_name];
+		widgetUpdate(payload) {
 			for (var k in payload) {
 				for (var wid in this.widgets) {
 					if (this.widgets[wid].id == k) {
-						payload[k] = ObjectUtils.mergeDeep(this.widgets[wid], payload[k]);
+						const copy = ObjectUtils.mergeDeep(this.widgets[wid], payload[k]);
+						if (payload[k].config)
+							copy.config = payload[k].config;
+						payload[k] = copy;
 						// NOTE(chris): remove internal props
-						for (var prop of ['_x','_y','_w','_h','index','id','preset'])
+						for (var prop of ['_x', '_y', '_w', '_h', 'index', 'id', 'preset'])
 							if (payload[k][prop])
 								delete payload[k][prop];
 						break;
 					}
 				}
+				if (payload[k].place) {
+					Object.values(payload[k].place).forEach(place => {
+						if (place.pinned === false)
+							delete place.pinned;
+					});
+				}
 				payload[k].widgetid = k;
 			}
 			this.$api
@@ -109,7 +152,7 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-		widgetRemove(section_name, id) {
+		widgetRemove(id) {
 			this.$api
 				.call(ApiDashboardUser.removeWidget(this.dashboard, id))
 				.then(() => {
@@ -142,8 +185,8 @@ export default {
 				const widgets = [];
 				const remove = [];
 
-				for (var wid in res.data.general.widgets) {
-					let widget = res.data.general.widgets[wid];
+				for (var wid in res.data) {
+					let widget = res.data[wid];
 					widget.id = wid;
 					if (widget.custom || widget.preset) {
 						widgets.push(widget);
@@ -153,19 +196,33 @@ export default {
 					}
 				}
 
-				remove.forEach(wid => this.widgetRemove('general', wid));
+				remove.forEach(wid => this.widgetRemove(wid));
 
 				this.widgets = widgets;
 			})
 			.catch(this.$fhcAlert.handleSystemError);
 	},
-	template: `
+	template: /* html */`
 	<div class="core-dashboard">
 		<h3>
 			{{ userFirstName ? $p.t('global/personalGreeting', [ userFirstName ]) : '' }}
-			<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>
+			<button
+				class="btn ms-2"
+				aria-label="edit dashboard"
+				v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/edit') }"
+				@click="editMode = !editMode"
+			><i class="fa-solid fa-gear" aria-hidden="true"></i></button>
 		</h3>
-		<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>
+		<dashboard-section
+			name="general"
+			:widgets="widgets"
+			@widget-add="widgetAdd"
+			@widget-update="widgetUpdate"
+			@widget-remove="widgetRemove"
+		></dashboard-section>
+		<dashboard-widget-picker
+			ref="widgetpicker"
+			:widgets="widgetsSetup"
+		></dashboard-widget-picker>
 	</div>`
 }

public/js/components/Dashboard/Item.js

@@ -1,7 +1,13 @@
 import BsModal from "../Bootstrap/Modal.js";
-import { useCachedWidgetLoader } from "../../composables/Dashboard/CachedWidgetLoader.js";
 import HeightTransition from "../Tranistion/HeightTransition.js";
 
+import { enableDragDropTouch } from "../../../../vendor/drag-drop-touch-js/dragdroptouch/dist/drag-drop-touch.esm.min.js";
+
+if (!document.dragDropTouchActive) {
+	enableDragDropTouch();
+	document.dragDropTouchActive = true;
+}
+
 export default {
 	name: 'Item',
 	components: {
@@ -11,18 +17,14 @@ export default {
 	data: () => ({
 		component: "",
 		arguments: null,
-		target: false,
-		widget: null,
 		tmpConfig: {},
 		isLoading: false,
 		hasConfig: false,
-		sharedData: null,
+		sharedData: null
 	}),
 	emits: [
 		"change",
 		"remove",
-		"dragstart",
-		"resizestart",
 		"configOpened",
 		"configClosed",
 		"pinItem",
@@ -30,41 +32,85 @@ export default {
 	],
 	props: [
 		"id",
-		"widgetID",
 		"config",
 		"width",
 		"height",
 		"custom",
 		"hidden",
 		"editMode",
-		"loading",
+		"loading", // widget got added and is waiting for backend to save in db
 		"item_data",
 		"place",
-		"setup",
-		"dragstate",
-		"resizeOverlay",
-		"additionalRow"
+		"widgetTemplate",
+		"source"
 	],
 	computed: {
-		maxHeight(){
-			return this.setup?.height?.max;
-		},
-		maxWidth(){
-			if (Object.prototype.toString.call(this.setup?.width) == "[object Number]"){
-				return this.setup?.width;
+		sourceInfoTooltip() {
+			switch (this.source) {
+				case null:
+					return '';
+				case 'general':
+					return this.$p.t('dashboard', 'widgetFromGeneralSection');
+				case 'custom':
+					return this.$p.t('dashboard', 'widgetFromCustomSection');
+				default:
+					return this.$p.t('dashboard', 'widgetFromFunktionSection', [this.source]);
 			}
-			return this.setup?.width?.max;
 		},
-		minHeight() {
-			return this.setup?.height?.min;
+		isResizeableHorizontal() {
+			if (this.widgetTemplate.setup.width === undefined)
+				return true;
+
+			if (Object.prototype.toString.call(this.widgetTemplate.setup.width) == "[object Number]")
+				return false;
+
+			if (this.widgetTemplate.setup.width.min === undefined) {
+				if (this.widgetTemplate.setup.width.max === undefined)
+					return true;
+				return this.widgetTemplate.setup.width.max > 1;
+			}
+
+			if (this.widgetTemplate.setup.width.max === undefined)
+				return true;
+
+			return this.widgetTemplate.setup.width.max > this.widgetTemplate.setup.width.min;
 		},
-		minWidth() {
-			return this.setup?.width?.min;
+		isResizeableVertical() {
+			if (this.widgetTemplate.setup.height === undefined)
+				return true;
+
+			if (Object.prototype.toString.call(this.widgetTemplate.setup.height) == "[object Number]")
+				return false;
+
+			if (this.widgetTemplate.setup.height.min === undefined) {
+				if (this.widgetTemplate.setup.height.max === undefined)
+					return true;
+				return this.widgetTemplate.setup.height.max > 1;
+			}
+
+			if (this.widgetTemplate.setup.height.max === undefined)
+				return true;
+
+			return this.widgetTemplate.setup.height.max > this.widgetTemplate.setup.height.min;
 		},
-		isResizeable(){
-			return this.maxWidth >1 || this.maxHeight >1;
+		isResizeable() {
+			return this.isResizeableVertical || this.isResizeableHorizontal;
 		},
-		isPinned(){
+		resizeClasses() {
+			const classes = {
+				icon: 'fa-up-right-and-down-left-from-center mirror-x',
+				button: 'cursor-nw-resize'
+			};
+			if (!this.isResizeableHorizontal) {
+				classes.icon = 'fa-up-down pe-2';
+				classes.button = 'cursor-ns-resize';
+			} else if (!this.isResizeableVertical) {
+				classes.icon = 'fa-left-right pe-2';
+				classes.button = 'cursor-ew-resize';
+			}
+			return classes;
+		},
+		isPinned() {
 			return this.place?.pinned ? true : false;
 		},
 		ready() {
@@ -80,16 +126,16 @@ export default {
 		}
 	},
 	methods: {
-		unpin(){
+		unpin() {
 			// Unpinning is only possible in edit mode
-			if(!this.editMode)
+			if (!this.editMode)
 				return;
-			let result = { item: this.item_data, x: this.item_data.x, y: this.item_data.y };
+			let result = { item: this.item_data, pinned: false };
 			this.$emit('unPinItem', [result]);
 		},
-		pinItem(){
-			let result = { item: this.item_data, x: this.item_data.x, y: this.item_data.y};
-			this.$emit('pinItem',[result]);
+		pinItem() {
+			let result = { item: this.item_data, pinned: true };
+			this.$emit('pinItem', [result]);
 		},
 		getWidgetC4Link(widget) {
 			return (FHC_JS_DATA_STORAGE_OBJECT.app_root +
@@ -101,22 +147,6 @@ export default {
 		handleHideBsModal() {
 			this.$emit('configClosed')
 		},
-		mouseDown(e) {
-			this.target = e.target;
-		},
-		startDrag(e) {
-			if (this.$refs.dragHandle.contains(this.target)) {
-				this.$emit("dragstart", e);
-			} else if (
-				this.isResizeable &&
-				this.$refs.resizeHandle.contains(this.target)
-			) {
-				if (this.isResizeable) this.$emit("resizestart", e);
-				else e.preventDefault();
-			} else {
-				e.preventDefault();
-			}
-		},
 		openConfig() {
 			this.tmpConfig = { ...this.arguments };
 			this.$refs.config.show();
@@ -135,110 +165,243 @@ export default {
 		},
 		sendChangeConfig(config) {
 			for (var k in config) {
-				if (this.widget.arguments[k] == config[k]) {
-				delete config[k];
+				if (this.widgetTemplate.arguments[k] == config[k]) {
+					delete config[k];
 				}
 			}
 			this.$emit("change", config);
 		},
+		async initializeComponent() {
+			if (
+				this.widgetTemplate
+				&& this.widgetTemplate.setup
+				&& this.widgetTemplate.widget_id
+				&& this.widgetTemplate.arguments
+			) {
+				let component = (await import(this.widgetTemplate.setup.file)).default;
+				this.$options.components["widget" + this.widgetTemplate.widget_id] = component;
+				this.component = "widget" + this.widgetTemplate.widget_id;
+				this.arguments = { ...this.widgetTemplate.arguments, ...this.config };
+				this.tmpConfig = { ...this.arguments };
+			}
+		}
 	},
 	watch: {
 		config() {
-			this.arguments = { ...this.widget?.arguments, ...this.config };
+			this.arguments = { ...this.widgetTemplate?.arguments, ...this.config };
 			this.tmpConfig = { ...this.arguments };
 			this.$refs.config && this.$refs.config.hide();
 			this.isLoading = false;
 		},
+		widgetTemplate() {
+			this.initializeComponent();
+		}
 	},
-	setup() {
-		const { actions } = useCachedWidgetLoader();
-		return {
-			loadWidget: actions.load
-		};
-	},
-	async created() {
-		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;
-		this.arguments = { ...this.widget.arguments, ...this.config };
-		this.tmpConfig = { ...this.arguments };
+	created() {
+		this.initializeComponent();
 	},
 	template: /*html*/ `
-	<div v-if="loading">
-		<div class="d-flex justify-content-center align-items-center h-100">
+	<article
+		v-if="!hidden || editMode"
+		class="dashboard-item card overflow-hidden h-100 position-relative"
+		:class="{
+			'hidden-widget': hidden,
+			[arguments?.className]: arguments && arguments.className
+		}"
+	>
+		<div v-if="loading" class="d-flex justify-content-center align-items-center h-100">
 			<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="{'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>
-				<span type="button" v-if="editMode && !isPinned" drag-action="move" class="col-auto mx-2 px-2 cursor-move" aria-label="move widget" v-tooltip="{showDelay:1000, value:'move widget'}"><i class="fa-solid fa-grip-vertical" aria-hidden="true"></i></span>
-			</Transition>
-			<span class="col mx-2 px-2">{{ widget.setup.name }}</span>
-			<template v-if="isPinned">
-				<div type="button" role="button" v-if="editMode" pinned="true" @click="unpin" title="unpin item" aria-label="unpin item" class="pin cursor-pointer col-auto me-2">
-					<i class="fa-solid fa-thumbtack " aria-hidden="true"></i>
-				</div>
-				<div v-else class="col-auto me-2">
-					<i class="fa-solid fa-thumbtack "></i>
-				</div>
-			</template>
-			<template v-else>
-				<div type="button" role="button" v-if="editMode"  class="col-auto me-2 pin" @click="pinItem" aria-label="pin item" title="pin item">
-					<i class="fa-solid fa-thumbtack" aria-hidden="true" style="color:lightgray;"></i>
-				</div>
-			</template>
-			<a type="button" v-if="widget.setup.cis4link" :href="getWidgetC4Link(widget)" aria-label="widget link" v-tooltip="{showDelay:1000, value:'widget link'}" class="col-auto ms-auto ">
-          		<i class="fa fa-arrow-up-right-from-square me-1" aria-hidden="true"></i>
-          	</a>
-			<a type="button" v-if="hasConfig" class="col-auto px-1" href="#" @click.prevent="openConfig" aria-label="configure widget" v-tooltip="{showDelay:1000,value:'configure widget'}"><i class="fa-solid fa-gear" aria-hidden="true"></i></a>
-			<a type="button" v-if="custom && editMode" class="col-auto px-1" aria-label="delete widget" v-tooltip="{showDelay:1000,value:'delete widget'}" href="#" @click.prevent="$emit('remove')">
-				<i class="fa-solid fa-trash" aria-hidden="true"></i>
-			</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" v-model="visible" :value="true">
-				</div>
-			</Transition>
-		</div>
-		<div v-if="ready" class="card-body overflow-hidden p-0">
-			<component :is="component" v-model:shared-data="sharedData" :config="arguments" :width="width" :height="height" @setConfig="setConfig" @change="changeConfigManually"></component>
-		</div>
-		<div v-else class="card-body overflow-hidden text-center d-flex flex-column justify-content-center"><i class="fa-solid fa-spinner fa-pulse fa-3x"></i></div>
-		<bs-modal v-if="hasConfig" ref="config" @hideBsModal="handleHideBsModal" @showBsModal="handleShowBsModal">
-			<template v-slot:title>
-				{{ widget ? 'Config for ' + widget.setup.name : '' }}
-			</template>
-			<template v-slot:default>
-				<component v-if="ready && !isLoading" :is="component" v-model:shared-data="sharedData" :config="tmpConfig" @change="changeConfig" :configMode="true"></component>
-				<div v-else class="text-center"><i class="fa-solid fa-spinner fa-pulse fa-3x"></i></div>
-			</template>
-			<template v-if="!widget?.setup?.hideFooter" v-slot:footer>
-				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-				<button type="button" class="btn btn-primary" @click="changeConfig">Save changes</button>
-			</template>
-		</bs-modal>
-		<height-transition>
-			<div v-if="editMode && isResizeable && !isPinned " class="card-footer d-flex justify-content-end p-0">
-				<template v-if="maxWidth < 2">
-					<span type="button" drag-action="resize" class="col-auto px-1 cursor-ns-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
-						<i  class="fa-solid fa-up-down pe-2" aria-hidden="true"></i>
-					</span>
-				</template>
-				<template v-else-if="maxHeight < 2">
-					<span type="button" drag-action="resize" class="col-auto px-1 cursor-ew-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
-						<i class="fa-solid fa-left-right pe-2" aria-hidden="true"></i>
+		<template v-else>
+			<header
+				v-if="widgetTemplate"
+				class="card-header d-flex ps-0 pe-2 align-items-center"
+			>
+				<!-- move handle -->
+				<Transition>
+					<span
+						v-if="editMode && !isPinned"
+						type="button"
+						drag-action="move"
+						class="col-auto mx-2 px-2 cursor-move"
+						draggable="true"
+						aria-hidden="true"
+						:aria-label="$p.t('dashboard/widget_move')"
+						v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/widget_move') }"
+					>
+						<i class="fa-solid fa-grip-vertical" aria-hidden="true"></i>
 					</span>
+				</Transition>
+				<!-- TITLE -->
+				<h4 class="col mb-0 mx-2 px-2 fs-6 lh-base">
+					{{ widgetTemplate.setup.name }}
+				</h4>
+				<!-- source info -->
+				<div
+					v-if="source"
+					class="col-auto me-2"
+					:aria-label="sourceInfoTooltip"
+					v-tooltip="{ class: 'w-100', value: sourceInfoTooltip }"
+				>
+					<i class="fa-solid fa-circle-info" aria-hidden="true"></i>
+				</div>
+				<!-- pin button -->
+				<template v-if="isPinned">
+					<div
+						v-if="editMode"
+						type="button"
+						role="button"
+						class="pin cursor-pointer col-auto me-2"
+						:title="$p.t('dashboard/widget_unpin')"
+						aria-hidden="true"
+						:aria-label="$p.t('dashboard/widget_unpin')"
+						pinned="true"
+						@click="unpin"
+					>
+						<i class="fa-solid fa-thumbtack" aria-hidden="true"></i>
+					</div>
+					<div v-else class="col-auto me-2" aria-hidden="true">
+						<i class="fa-solid fa-thumbtack"></i>
+					</div>
 				</template>
 				<template v-else>
-					<span type="button" drag-action="resize" class="col-auto px-1 cursor-nw-resize" aria-label="resize widget" v-tooltip="{showDelay:1000, value:'resize widget'}">
-						<i  class="fa-solid fa-up-right-and-down-left-from-center mirror-x" aria-hidden="true"></i>
-					</span>
+					<div
+						v-if="editMode"
+						type="button"
+						role="button"
+						class="col-auto me-2 pin"
+						:title="$p.t('dashboard/widget_pin')"
+						aria-hidden="true"
+						:aria-label="$p.t('dashboard/widget_pin')"
+						@click="pinItem"
+					>
+						<i class="fa-solid fa-thumbtack" aria-hidden="true" style="color:lightgray;"></i>
+					</div>
 				</template>
+				<!-- widget link -->
+				<a
+					v-if="widgetTemplate.setup.cis4link"
+					:href="getWidgetC4Link(widgetTemplate)"
+					class="col-auto ms-auto"
+					:aria-label="$p.t('dashboard/widget_link')"
+					v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/widget_link') }"
+				>
+					<i class="fa fa-arrow-up-right-from-square me-1" aria-hidden="true"></i>
+				</a>
+				<!-- config button -->
+				<a
+					v-if="hasConfig"
+					href="#"
+					class="col-auto px-1"
+					:aria-label="$p.t('dashboard/widget_configure')"
+					v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/widget_configure') }"
+					@click.prevent="openConfig"
+				>
+					<i class="fa-solid fa-gear" aria-hidden="true"></i>
+				</a>
+				<!-- delete button -->
+				<a
+					v-if="custom && editMode"
+					href="#"
+					class="col-auto px-1"
+					:aria-label="$p.t('dashboard/widget_delete')"
+					v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/widget_delete') }"
+					@click.prevent="$emit('remove')"
+				>
+					<i class="fa-solid fa-trash" aria-hidden="true"></i>
+				</a>
+				<!-- hide button -->
+				<Transition>
+					<div v-if="!custom && editMode" class="col-auto px-1 form-switch">
+						<input
+							type="checkbox"
+							role="switch"
+							v-model="visible"
+							class="form-check-input ms-0"
+							:value="true"
+							:aria-label="$p.t('dashboard/widget_toggle_visibility')"
+						>
+					</div>
+				</Transition>
+			</header>
+			<!-- TODO Manu rename/remove-->
+			<div v-if="ready" class="card-body overflow-hidden p-0">
+				<component
+					:is="component"
+					v-model:shared-data="sharedData"
+					:config="arguments"
+					:width="width"
+					:height="height"
+					:widget-id="item_data.id" 
+					:item_data="item_data"
+					@setConfig="setConfig"
+					@change="changeConfigManually"
+				></component>
 			</div>
-		</height-transition>
-		</div>
-	</div>`,
+			<div
+				v-else
+				class="card-body overflow-hidden text-center d-flex flex-column justify-content-center"
+			>
+				<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
+			</div>
+			<bs-modal
+				v-if="hasConfig"
+				ref="config"
+				@hideBsModal="handleHideBsModal"
+				@showBsModal="handleShowBsModal"
+			>
+				<template v-slot:title>
+					{{ widgetTemplate ? $p.t('dashboard/widget_config_title', widgetTemplate.setup) : '' }}
+				</template>
+				<template v-slot:default>
+					<component
+						:is="component"
+						v-if="ready && !isLoading"
+						v-model:shared-data="sharedData"
+						:config="tmpConfig"
+						@change="changeConfig"
+						:configMode="true"
+					></component>
+					<div v-else class="text-center">
+						<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
+					</div>
+				</template>
+				<template v-if="!widgetTemplate?.setup?.hideFooter" v-slot:footer>
+					<button
+						type="button"
+						class="btn btn-secondary"
+						data-bs-dismiss="modal"
+					>{{ $p.t('ui/schliessen') }}</button>
+					<button
+						type="button"
+						class="btn btn-primary"
+						@click="changeConfig"
+					>{{ $p.t('ui/speichern') }}</button>
+				</template>
+			</bs-modal>
+			<height-transition>
+				<footer
+					v-if="editMode && isResizeable && !isPinned"
+					class="card-footer d-flex justify-content-end p-0"
+				>
+					<span
+						type="button"
+						drag-action="resize"
+						class="col-auto px-1"
+						:class="resizeClasses.button"
+						draggable="true"
+						aria-hidden="true"
+						:aria-label="$p.t('dashboard/widget_resize')"
+						v-tooltip="{ showDelay: 1000, value: $p.t('dashboard/widget_resize') }"
+					>
+						<i
+							class="fa-solid"
+							:class="resizeClasses.icon"
+							aria-hidden="true"
+						></i>
+					</span>
+				</footer>
+			</height-transition>
+		</template>
+	</article>`,
 };

public/js/components/Dashboard/Section.js

@@ -1,9 +1,12 @@
 import BsConfirm from "../Bootstrap/Confirm.js";
 import DropGrid from '../Drop/Grid.js'
 import DashboardItem from "./Item.js";
-import { useCachedWidgetLoader } from "../../composables/Dashboard/CachedWidgetLoader.js";
 import WidgetIcon from "./Widget/WidgetIcon.js"
 
+import dragClick from '../../directives/dragClick.js';
+
+import ObjectUtils from "../../helpers/ObjectUtils.js";
+
 export default {
 	name: 'Section',
 	components: {
@@ -11,8 +14,11 @@ export default {
 		DashboardItem,
 		WidgetIcon,
 	},
+	directives: {
+		dragClick
+	},
 	inject: {
-		widgetsSetup:{
+		widgetsSetup: {
 			type: Array,
 			default: [],
 		},
@@ -39,9 +45,8 @@ export default {
 			configOpened: false,
 			gridWidth: 1,
 			gridHeight: null,
-			draggedItem:null,
-			additionalRow:false,
-		}
+			additionalRow: false
+		};
 	},
 	provide() {
 		return {
@@ -49,22 +54,40 @@ export default {
 				this.editModeIsActive
 			),	
 			sectionName: Vue.computed(() => this.name),	
-		}
+		};
 	},
 	computed: {
-		computedWidgetsSetup(){
-			if(!this.widgetsSetup) return {};
-			return this.widgetsSetup.reduce((acc, setup)=>{
-				acc[setup.widget_id] = setup.setup;
+		sectionNameTranslation() {
+			switch (this.name) {
+				case "general": 
+					return this.$p.t('dashboard', this.name); 
+				case "custom":
+					return this.$p.t('dashboard', this.name);
+				default:
+					return this.name;
+			}
+		},
+		showSectionInformation() {
+			switch (this.name) {
+				case "general": 
+					return this.$p.t('dashboard', 'dashboardGeneralSectionDescription'); 
+				case "custom":
+					return this.$p.t('dashboard', 'dashboardCustomSectionDescription');
+				default:
+					return this.$p.t('dashboard', 'dashboardSectionDescription', [this.name]);
+			}
+		},
+		indexedWidgetsTemplates() {
+			if (!this.widgetsSetup)
+				return {};
+			return this.widgetsSetup.reduce((acc, setup) => {
+				acc[setup.widget_id] = setup;
 				return acc;
-			},{})
+			}, {});
 		},
 		editModeIsActive() {
 			return (this.editMode || this.adminMode) && !this.configOpened	
 		},
-		getSectionStyle() {
-			return 'margin-bottom: 8px;';
-		},
 		items() {
 			// reuses the nearest placement of the widget from another viewport 
 			/* const computeNearestPlace = (item, gridWidth) =>{
@@ -85,76 +108,55 @@ export default {
 				if(!item?.widgetid && item?.id){
 					item.widgetid = item.id;
 				}
-				return { ...item, reorder: false, ...(item.place[this.gridWidth] || { reorder: true, ...{ x: 0, y: 0, w: 1, h: 1 } })};
+
+				let weight = 5;
+				if (!item.source)
+					weight = 6;
+				else if (item.source == 'general')
+					weight = 4;
+
+				let placement = item.place[this.gridWidth];
+				if (!placement) {
+					weight -= 3;
+					placement = {};
+				}
+
+				return { ...item, ...placement, weight };
 			});
-			return placedItems;
-			
-		},
-		
+
+			if (this.editModeIsActive)
+				return placedItems;
+			return placedItems.filter(item => !item.hidden);
+		}
+	},
+	watch: {
+		items() {
+			this.additionalRow = false;
+		}
 	},
 	methods: {
-		sectionNameTranslation(){
-			switch(this.name){
-				case "general": 
-					return this.$p.t('dashboard',this.name); 
-					break;
-				case "custom":
-					return this.$p.t('dashboard',this.name);
-					break;
-				default:
-					return this.name;
-					break;
-			}
-		},
-		showSectionInformation(){
-			if (this.name == "general"){
-				return this.$p.t('dashboard', 'dashboardGeneralSectionDescription'); 
-			}
-			else if(this.name == "custom"){
-				return this.$p.t('dashboard', 'dashboardCustomSectionDescription');
-			}
-			else{
-				return this.$p.t('dashboard', 'dashboardSectionDescription', [this.name]);
-			}
-		},
 		handleConfigOpened() {
 			this.configOpened = true
 		},
 		handleConfigClosed() {
 			this.configOpened = false
 		},
-		checkResizeLimit(item, w, h) {
-			// NOTE(chris): widgets needs to be loaded for this to work
-			let widget = this.widgetState[item.widget];
-			if (widget) {
-				let minmaxW = { ...widget.setup.width };
-				if (minmaxW.max)
-					minmaxW.min = minmaxW.min || 1;
-				else
-					minmaxW = { min: minmaxW, max: minmaxW };
-				if (w < minmaxW.min)
-					w = minmaxW.min; 
-				if (w > minmaxW.max)
-					w = minmaxW.max;
-
-				let minmaxH = { ...widget.setup.height };
-				if (minmaxH.max)
-					minmaxH.min = minmaxH.min || 1;
-				else
-					minmaxH = { min: minmaxH, max: minmaxH };
-				if (h < minmaxH.min)
-					h = minmaxH.min;
-				if (h > minmaxH.max)
-					h = minmaxH.max;
-			}
-			return [w, h];
-		},
 		removeWidget(item, revert) {
 			if (item.custom) {
-				BsConfirm.popup(this.$p.t('dashboard', 'alert_deleteWidget')).then(() => this.$emit('widgetRemove', this.name, item.id));
+				BsConfirm.popup(this.$p.t('dashboard', 'alert_deleteWidget')).then(() => this.$emit('widgetRemove', item.id, this.name));
 			} else {
 				let update = {};
 				update[item.id] = { hidden: !revert };
+				
+				if (!revert) {
+					// NOTE(chris): move to last line
+					update[item.id].place = [];
+					let y = this.gridHeight;
+					if (this.additionalRow)
+						y--;
+					update[item.id].place[this.gridWidth] = { x: 0, y };
+				}
+				
 				this.updatePreset(update);
 			}
 		},
@@ -163,49 +165,42 @@ export default {
 			payload[item.id] = { config };
 			this.updatePreset(payload);
 		},
-		updatePositions(updated, pinned=false) {
+		updatePositions(updated) {
 			let result = {};
 			updated.forEach(update => {
-				
-				let item = {...update.item};
-				if (!item.placeholder) {
-				if (!item.place[this.gridWidth])
-					item.place[this.gridWidth] = {x: 0, y: 0, w: 1, h: 1};
-				delete item.x;
-				delete item.y;
-				delete item.w;
-				delete item.h;
-				delete item.place[this.gridWidth].pinned;
-				if (update.x !== undefined)
-					item.place[this.gridWidth].x = update.x;
-				if (update.y !== undefined)
-					item.place[this.gridWidth].y = update.y;
-				if (update.w !== undefined)
-					item.place[this.gridWidth].w = update.w;
-				if (update.h !== undefined)
-					item.place[this.gridWidth].h = update.h;
-				if (pinned){
-					item.place[this.gridWidth].pinned = true;
-				}
+				let item = structuredClone(ObjectUtils.deepToRaw(update.item));
 
-				result[item.id] = item;
+				if (!item.placeholder) {
+					if (!item.place[this.gridWidth])
+						item.place[this.gridWidth] = { x: 0, y: 0, w: 1, h: 1 };
+					
+					delete item.x;
+					delete item.y;
+					delete item.w;
+					delete item.h;
+					delete item.pinned;
+					delete item.weight;
+
+					if (update.x !== undefined)
+						item.place[this.gridWidth].x = update.x;
+					if (update.y !== undefined)
+						item.place[this.gridWidth].y = update.y;
+					if (update.w !== undefined)
+						item.place[this.gridWidth].w = update.w;
+					if (update.h !== undefined)
+						item.place[this.gridWidth].h = update.h;
+					if (update.pinned !== undefined)
+						item.place[this.gridWidth].pinned = update.pinned;
+
+					result[item.id] = item;
 				}
 			});
 			this.updatePreset(result);
 		},
 		updatePreset(update) {
-			let payload = {};
-			payload[this.name] = update;
-			this.$emit('widgetUpdate', this.name, payload);
+			this.$emit('widgetUpdate', update, this.name);
 		}
 	},
-	setup() {
-		const { state: widgetState } = useCachedWidgetLoader();
-
-		return {
-			widgetState
-		};
-	},
 	mounted() {
 		let self = this;
 		let cont = self.$refs.container;
@@ -215,44 +210,62 @@ export default {
 			self.gridWidth = parseInt(window.getComputedStyle(cont).getPropertyValue('--fhc-dashboard-grid-size'));
 		});
 	},
-	template: `
-	<div class="dashboard-section position-relative pb-3 border-bottom" ref="container" :style="getSectionStyle">
-		<h4 v-if="editModeIsActive" class=" mb-2">
-			<i v-tooltip="showSectionInformation(name)" class="fa-solid fa-circle-info section-info" ></i>
-			{{sectionNameTranslation()}}:
-		</h4>
-		<button v-tooltip="$p.t('dashboard','addLine')" v-if="!additionalRow && editModeIsActive" @click="additionalRow=true" class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center">+</button>
-		<drop-grid v-model:cols="gridWidth" v-model:additionalRow="additionalRow" :items="items" :itemsSetup="computedWidgetsSetup" :active="editModeIsActive" :resize-limit="checkResizeLimit" :margin-for-extra-row=".01" @draggedItem="draggedItem=$event" @rearrange-items="updatePositions" @gridHeight="gridHeight=$event" >
+	template: /* html */`
+	<section
+		class="dashboard-section position-relative pb-3 mb-3 border-bottom"
+		ref="container"
+		:class="{ 'edit-active': editModeIsActive }"
+	>
+		<h3 v-if="adminMode" class="h4">
+			<i v-tooltip="showSectionInformation" class="fa-solid fa-circle-info section-info"></i>
+			{{ sectionNameTranslation }}:
+		</h3>
+		<button
+			v-tooltip="$p.t('dashboard/addLine')"
+			v-if="!additionalRow && editModeIsActive"
+			class="btn btn-outline-secondary rounded-circle newGridRow d-flex justify-content-center align-items-center"
+			@click="additionalRow=true"
+			v-drag-click="() => additionalRow=true"
+		>+</button>
+		<drop-grid
+			v-model:cols="gridWidth"
+			:additional-row="additionalRow"
+			:items="items"
+			:items-setup="indexedWidgetsTemplates"
+			:active="editModeIsActive"
+			@rearrange-items="updatePositions"
+			@grid-height="gridHeight=$event"
+		>
 			<template #default="item">
-				<div v-if="item.placeholder" class="empty-tile-hover" @pointerdown="$emit('widgetAdd', name, { widget: 1, config: {}, place: {[gridWidth]: {x:item.x,y:item.y,w:1,h:1}}, custom: 1 })"></div>
+				<div
+					v-if="item.placeholder"
+					class="empty-tile-hover"
+					@click="$emit('widgetAdd', { config: [], place: {[gridWidth]: { x: item.x, y: item.y, w: 1, h: 1 } }, custom: 1 }, name)"
+				></div>
 				<dashboard-item 
 					v-else
 					:id="item.widget"
-					:dragstate="item.blank || (item.widgetid && item.widgetid == draggedItem?.data.widgetid)"
-					:resizeOverlay="item.resizeOverlay"
-					:widgetID="item.id"
 					:width="item.w"
 					:height="item.h"
-					:item_data="{config:item.config, custom:item.custom, h:item.h, w:item.w,id:item.id,reorder:item.reorder,place:item.place,widget:item.widget,widgetid:item.widgetid,x:item.x,y:item.y}"
+					:item_data="{config:item.config, custom:item.custom, h:item.h, w:item.w,id:item.id,place:item.place,widget:item.widget,widgetid:item.widgetid,x:item.x,y:item.y}"
 					:loading="item.loading"
 					:config="item.config"
 					:custom="item.custom"
 					:hidden="item.hidden"
 					:editMode="editModeIsActive"
 					:place="item.place[gridWidth]"
-					:setup="computedWidgetsSetup[item.widget]"
+					:widget-template="indexedWidgetsTemplates[item.widget]"
+					:source="adminMode ? null : item.source || 'custom'"
 					@change="saveConfig($event, item)"
 					@remove="removeWidget(item, $event)"
 					@config-opened="handleConfigOpened"
 					@config-closed="handleConfigClosed"
-					@pinItem="updatePositions($event,true)"
-					@unPinItem="updatePositions">
-				</dashboard-item>
-				
+					@pin-item="updatePositions"
+					@un-pin-item="updatePositions"
+				></dashboard-item>
 			</template>
-			
 		</drop-grid>
-	</div>`
+	</section>`
 }
 
 /*

public/js/components/Dashboard/Widget/Picker.js

@@ -32,19 +32,31 @@ export default {
 		},
 		
 	},
-	template: `<div class="dashboard-widget-picker">
-		<bs-modal ref="modal" class="fade" :dialog-class="{'modal-fullscreen-sm-down': 1, 'modal-xl': widgets && widgets.length > 0}" @hiddenBsModal="close">
-			<template v-slot:title>Create new widget</template>
+	template: /* html */`
+	<div class="dashboard-widget-picker">
+		<bs-modal
+			ref="modal"
+			class="fade"
+			:dialog-class="{ 'modal-fullscreen-sm-down': 1, 'modal-xl': widgets && widgets.length > 0 }"
+			@hiddenBsModal="close"
+		>
+			<template v-slot:title>{{ $p.t('dashboard/createWidget') }}</template>
 			<template v-slot:default>
 				<div v-if="widgets" class="row g-2">
 					<div v-if="!widgets.length">
-						No Widgets available
+						{{ $p.t('dashboard/noWidgetsAvailable') }}
 					</div>
-					<div v-for="widget in widgets" :key="widget.widget_id" class="widget-icon-container col-sm-6 col-md-4 col-lg-3 col-xl-2">
-						<widget-icon @select="pick" :widget="widget" ></widget-icon>
+					<div
+						v-for="widget in widgets"
+						:key="widget.widget_id"
+						class="widget-icon-container col-sm-6 col-md-4 col-lg-3 col-xl-2"
+					>
+						<widget-icon @select="pick" :widget="widget"></widget-icon>
 					</div>
 				</div>
-				<div v-else class="text-center"><i class="fa-solid fa-spinner fa-pulse fa-3x"></i></div>
+				<div v-else class="text-center">
+					<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
+				</div>
 			</template>
 		</bs-modal>
 	</div>`

public/js/components/DashboardWidget/Abstract.js

@@ -5,7 +5,9 @@ export default {
 		"height",
 		"configMode",
 		"sharedData",
-		"widgetInfo"
+		"widgetInfo",
+		"widgetId",
+		"item_data"
 	],
 	emits: [
 		"setConfig",

public/js/components/DashboardWidget/LvPlan.js

@@ -11,9 +11,6 @@ export default {
 	mixins: [
 		AbstractWidget
 	],
-	inject: [
-		"timezone"
-	],
 	methods: {
 		getPromiseFunc(start, end) {
 			return [
@@ -27,6 +24,6 @@ export default {
 	},
 	template: /*html*/`
 	<div class="dashboard-widget-lvplan d-flex flex-column h-100">
-		<fhc-calendar :timezone="timezone" :get-promise-func="getPromiseFunc" />
+		<fhc-calendar :get-promise-func="getPromiseFunc" />
 	</div>`
 }

public/js/components/DashboardWidget/Url.js

@@ -3,23 +3,27 @@ import FormInput from "../Form/Input.js";
 import BsModal from "../Bootstrap/Modal.js";
 import AbstractWidget from './Abstract.js';
 
-import ApiBookmark from '../../api/factory/widget/bookmark.js';
+import { useUrlStore } from '../../composables/Pseudostore/DashboardWidget/UrlStore.js';
 
 export default {
 	name: "WidgetsUrl",
-	mixins: [AbstractWidget],
-	inject: {
-		editModeIsActive: {
-			type: Boolean,
-			default: false
-		}
-	},
 	components:{
 		CoreForm,
 		FormInput,
-		BsModal
+		BsModal,
+		PvChips: primevue.chips,
+		PvMultiSelect: primevue.multiselect,
+		PvAutoComplete: primevue.autocomplete,
+	},
+	mixins: [AbstractWidget],
+	inject: {
+		adminMode: {
+			from: 'adminMode',
+			default: false
+		}
 	},
 	data: () => ({
+		ready: false,
 		bookmark_id: null,
 		title_input: "",
 		url_input: "",
@@ -27,29 +31,53 @@ export default {
 			invalidURL: false,
 			invalidTitel: false,
 		},
+		selectedTags: [],
+		selectedFilters: [],
+		filteredArray: []
 	}),
-
 	computed: {
-		tagName() {
-			return this.config.tag !== undefined && this.config.tag.length > 0
-				? this.config.tag
-				: this.$p.t("bookmark", "myBookmarks");
+		availableTags() {
+			return (this.bookmarks || [])
+				.map(bookmark => JSON.parse(bookmark.tag))
+				.flat()
+				.filter((v, i, a) => v && a.indexOf(v) === i);
 		},
-		emptyBookmarks() {
-			if (this.shared instanceof Array && this.shared.length == 0) return true;
+		filteredBookmarks() {
+			if (!this.bookmarks)
+				return [];
 
-			if (!this.shared) return true;
+			if (!this.config.tags || !this.config.tags.length)
+				return this.bookmarks;
 
-			return false;
+			return this.bookmarks.filter(bookmark => {
+				const tags = JSON.parse(bookmark.tag || "[]");
+				return tags.some(tag => this.config.tags.includes(tag));
+			});
 		},
+		newSort() {
+			if (this.bookmarks.length == 0)
+				return 1;
+			else
+				return Math.max(...this.bookmarks.map(b => b.sort)) + 1;
+		},
+		maxSort() {
+			if (this.bookmarks.length == 0)
+				return 0;
+			else
+				return Math.max(...this.filteredBookmarks.map(b => b.sort));
+		},
+		minSort() {
+			if (this.bookmarks.length == 0)
+				return 0;
+			else
+				return Math.min(...this.filteredBookmarks.map(b => b.sort));
+		}
 	},
 	methods: {
-		stopDrag(event){
-			event.preventDefault();
-		},
-		clearInputs(){
+		clearInputs() {
 			this.title_input = "";
-			this.url_input = "";	
+			this.url_input = "";
+			this.selectedTags = [];
 		},
 		openCreateModal() {
 			this.$refs.createModal.show()
@@ -58,23 +86,23 @@ export default {
 			this.title_input = bookmark.title;
 			this.url_input = bookmark.url;
 			this.bookmark_id = bookmark.bookmark_id;
-			this.$refs.editModal.show()
+			this.selectedTags = JSON.parse(bookmark.tag);
+
+			this.$refs.editModal.show();
 		},
-		editBookmark(event){
-			event.preventDefault();
-			if(!this.bookmark_id || !this.url_input || !this.title_input) return;
-			
-			this.$api
-				.call(ApiBookmark.update({
-					bookmark_id: this.bookmark_id,
-					title: this.title_input,
-					url: this.url_input,
-				}))
-				.then((res) => res.data)
-				.then((result) => {
+		editBookmark() {
+			if (!this.bookmark_id || !this.url_input || !this.title_input)
+				return;
+
+			this.actions
+				.update(
+					this.bookmark_id,
+					this.title_input,
+					this.url_input,
+					this.selectedTags
+				)
+				.then(() => {
 					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkUpdated"));
-					// refetch the bookmarks to see the updates
-					this.fetchBookmarks();
 					// reset the values for the title and url inputs
 					this.clearInputs();
 					this.$refs.editModal.hide();
@@ -82,10 +110,7 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-
-		insertBookmark(event) {
-			event.preventDefault();
-
+		insertBookmark() {
 			// reset is-invalid css on url input field
 			for (let key of Object.keys(this.validation)) {
 				this.validation[key] = false;
@@ -94,24 +119,24 @@ export default {
 			// early return if validation failed
 			if (!this.isValidationSuccessfull()) return;
 
-			this.$api
-				.call(ApiBookmark.insert({
-					tag: this.config.tag,
-					title: this.title_input,
-					url: this.url_input,
-				}))
-				.then((res) => res.data)
-				.then((result) => {
+			// get highest Sort
+			const sort = this.newSort;
+
+			this.actions
+				.insert(
+					this.title_input,
+					this.url_input,
+					this.selectedTags,
+					sort
+				)
+				.then(() => {
 					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
-					// refetch the bookmarks to see the updates
-					this.fetchBookmarks();
 					this.$refs.createModal.hide();
 					// reset the values for the title and url inputs
 					this.clearInputs();
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-
 		isValidationSuccessfull() {
 			// validate the input fields
 			if (this.title_input.length === 0) {
@@ -125,111 +150,349 @@ export default {
 
 			return !Object.values(this.validation).some(value => value === true);
 		},
-		async fetchBookmarks() {
-			await this.$api
-				.call(ApiBookmark.getBookmarks())
-				.then((res) => res.data)
-				.then((result) => {
-					this.shared = result;
-				})
-				.catch(this.$fhcAlert.handleSystemError);
-		},
 		async removeLink(bookmark_id) {
 			let isConfirmed = await this.$fhcAlert.confirmDelete();
 
 			// early return if the confirm dialog was not confirmed
-			if (!isConfirmed) return;
+			if (!isConfirmed)
+				return;
 
-			this.$api
-				.call(ApiBookmark.delete(bookmark_id))
-				.then((res) => res.data)
-				.then((result) => {
-					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkDeleted"));
-					// refetch the bookmarks to see the updates
-					this.fetchBookmarks();
-				})
-				.catch(this.$fhcAlert.handleSystemError);
+			const errors = await this.actions.remove(bookmark_id);
+			
+			if (!errors) {
+				this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkDeleted"));
+			}
 		},
+		sortDown(bookmark_id) {
+			const current = this.filteredBookmarks.find(b => b.bookmark_id === bookmark_id);
+
+			const next = this.filteredBookmarks
+				.filter(b => b.sort > current.sort)
+				.sort((a, b) => a.sort - b.sort)[0];
+
+			if (!next) {
+				console.log("lowest sort item, no change");
+				return;
+			}
+			this.actions.swap(current.bookmark_id, next.bookmark_id);
+		},
+		sortUp(bookmark_id) {
+			const current = this.filteredBookmarks.find(b => b.bookmark_id === bookmark_id);
+
+			const next = this.filteredBookmarks
+				.filter(b => b.sort < current.sort)
+				.sort((a, b) => a.sort + b.sort)[0];
+
+			if (!next) {
+				console.log("highest sort item, no change");
+				return;
+			}
+			this.actions.swap(current.bookmark_id, next.bookmark_id);
+		},
+		hasTags(link) {
+			if (!link || !link.tag) return false;
+
+			let tags = link.tag;
+			if (typeof tags === 'string') {
+				try {
+					tags = JSON.parse(tags)
+				} catch {
+					return false;
+				}
+			}
+			if (Array.isArray(tags) && tags.length > 0) {
+				return tags.join(' ');
+			}
+		},
+		openFilterModal() {
+			if (this.config.tags && this.config.tags.length)
+				this.selectedFilters = [ ...this.config.tags ];
+			else
+				this.selectedFilters = [];
+			this.$refs.filterModal.show();
+		},
+		async handleAddingTagFilter() {
+			this.config.tags = this.selectedFilters;
+			this.$emit('change');
+			this.$fhcAlert.alertInfo(this.$p.t("bookmark", "filterUpdated"));
+			this.$refs.filterModal.hide();
+		},
+		search(event) {
+			const query = event.query ?? "";
+
+			// Filter for text
+			this.filteredArray = this.availableTags.filter(item =>
+				item.toLowerCase().includes(query.toLowerCase())
+			);
+
+			// input if search not successful
+			if (this.filteredArray.length === 0 && query) {
+				this.filteredArray = [query];
+			}
+		}
+	},
+	setup() {
+		const {
+			bookmarks,
+			getters: { tags },
+			actions
+		} = useUrlStore();
+
+		return { bookmarks, tags, actions }
 	},
 	async mounted() {
-		await this.fetchBookmarks();
-	},
-	created() {
-		// 
-		// this.$emit('setConfig', true); -> use this to enable widget config mode if needed
+		if (!this.adminMode) {
+			await this.actions.fetch();
+			this.ready = true;
+		}
 	},
 	template: /*html*/ `
-    <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>
+	<div class="widgets-url w-100 h-100 overflow-auto p-3">
 
-            <template v-if="shared">
+		<div v-if="!adminMode" class="d-flex mt-2">
+			<button
+				class="btn btn-outline-secondary btn-sm flex-grow-1 me-2"
+				@click="openCreateModal"
+			>
+				{{ $p.t('bookmark', 'newLink') }}
+			</button>
+			<button
+				v-if="config.tags && config.tags.length"
+				class="btn btn-secondary btn-sm"
+				:title="$p.t('bookmark/editFilter')"
+				@click="openFilterModal"
+			>
+				<i class="fa-solid fa-filter-circle-xmark"></i>
+			</button>  
+			<button
+				v-else
+				class="btn btn-outline-secondary btn-sm"
+				:title="$p.t('bookmark/filterByTags')"
+				@click="openFilterModal"
+			>
+				<i class="fa-solid fa-filter"></i>
+			</button>
+		</div>
 
-                <template v-if="!emptyBookmarks">
-					<div v-for="link in shared" :key="link.id" class="d-flex mt-2">
-						<a target="_blank" :href="link.url">
-							<i class="fa fa-solid fa-arrow-up-right-from-square me-1"></i>{{ link.title }}
+		<div
+			v-if="adminMode"
+			class="h-100 d-flex align-items-center text-center"
+		>
+			{{ $p.t('bookmark/adminMode') }}
+		</div>
+		<template v-else-if="ready">
+			<template v-if="filteredBookmarks.length">
+				<div
+					v-for="link in filteredBookmarks"
+					:key="link.id"
+					class="d-flex mt-2"
+				>
+					<a target="_blank" :href="link.url" class="me-1">
+						<i
+							class="fa fa-solid fa-arrow-up-right-from-square me-1"
+							aria-hidden="true"
+						></i>
+						{{ link.title }}
+					</a>
+					<span
+						v-if="hasTags(link)"
+						:title="hasTags(link)"
+						style="color: silver;"
+					>
+						<i
+							class="fa fa-solid fa-tag text-gray-500"
+							aria-hidden="true"
+						></i>
+					</span>
+
+					<div class="ms-auto">
+						<!--EDIT BOOKMARK-->
+						<a
+							type="button"
+							href="#"
+							:title="$p.t('bookmark/editBookmark')"
+							aria-label="edit bookmark"
+							@click.prevent="openEditModal(link)"
+						>
+							<i class="fa fa-edit me-1" aria-hidden="true"></i>
+						</a>
+						<!--DELETE BOOKMARK-->
+						<a
+							type="button"
+							href="#"
+							:title="$p.t('bookmark/deleteBookmark')"
+							aria-label="delete bookmark"
+							@click.prevent="removeLink(link.bookmark_id)"
+						>
+							<i class="fa fa-regular fa-trash-can" aria-hidden="true"></i>
+						</a>
+						<!--SORT BOOKMARKS-->
+						<a
+							v-if="filteredBookmarks.length > 1"
+							type="button"
+							href="#"
+							:title="$p.t('bookmark/sortDownwards')"
+							aria-label="sortdown bookmark"
+							@click.prevent="sortDown(link.bookmark_id)"
+						>
+							<i
+								class="fa fa-arrow-down me-1"
+								:class="{ 'text-light pointer-events-none': link.sort === maxSort }"
+							></i>
+						</a>
+						<a
+							v-if="filteredBookmarks.length > 1"
+							type="button"
+							href="#"
+							:title="$p.t('bookmark/sortToTop')"
+							aria-label="sortup bookmark"
+							@click.prevent="sortUp(link.bookmark_id)"
+						>
+							<i
+								class="fa fa-arrow-up me-1"
+								:class="{ 'text-light pointer-events-none': link.sort === minSort }"
+							></i>
 						</a>
-
-						<div class="ms-auto">
-							<!--EDIT BOOKMARK-->
-							<a type="button" href="#" @click.prevent="openEditModal(link)" aria-label="edit bookmark" v-tooltip="{showDelay:1000,value:'edit bookmark'}">
-								<i class="fa fa-edit me-1" aria-hidden="true"></i>
-							</a>
-							<!--DELETE BOOKMARK-->
-							<a type="button" id="deleteBookmark" href="#" aria-label="delete bookmark" v-tooltip="{showDelay:1000,value:'delete bookmark'}" @click.prevent="removeLink(link.bookmark_id)">
-								<i class="fa fa-regular fa-trash-can" aria-hidden="true"></i>
-							</a>
-						</div>
 					</div>
-                </template>
+				</div>
+			</template>
 
-                <div v-else class="d-flex mt-2">
-                    <span>{{$p.t('bookmark','emptyBookmarks')}}</span>
-                </div>
-
-            </template>
-
-            <template v-else>
-                <p v-for="i in 4" class="placeholder-glow">
-                    <span class="placeholder" :class="{'col-9' : true}"></span>
-                </p>
-            </template>
-        </div>
-    </div>
+			<div v-else class="d-flex mt-2">
+				<span>{{ $p.t('bookmark', 'emptyBookmarks') }}</span>
+			</div>
+		</template>
+		<template v-else>
+			<p v-for="i in 4" class="placeholder-glow">
+				<span class="placeholder col-9"></span>
+			</p>
+		</template>
+	</div>
 	<!--EDIT MODAL-->
 	<teleport to="body">
-		<bs-modal @[\`hide.bs.modal\`]="bookmark_id=null; clearInputs();" ref="editModal">
+		<bs-modal
+			ref="editModal"
+			@hide-bs-modal="bookmark_id=null; clearInputs();"
+		>
 			<template #title>
-				<h2>{{$p.t('bookmark','editLink')}}</h2>
+				<h2>{{ $p.t('bookmark', 'editLink') }}</h2>
 			</template>
 			<template #default>
-				<form-input  :label="$p.t('profil','Titel')" :title="$p.t('profil','Titel')" id="editTitle" v-model="title_input" name="title" class="mb-2"></form-input>
-				<form-input label="Url" title="Url" id="editUrl" v-model="url_input" name="url"></form-input>
+
+				<form-input
+					id="editTitle"
+					name="title"
+					v-model="title_input"
+					:label="$p.t('profil', 'Titel')"
+					:title="$p.t('profil', 'Titel')"
+					class="mb-2"
+				></form-input>
+				<form-input
+					id="editUrl"
+					name="url"
+					v-model="url_input"
+					label="Url"
+					title="Url"
+				></form-input>
+
+				<label class="mt-2">Tags</label>
+				<div class="mt-2">
+					<pv-auto-complete
+						v-model="selectedTags"
+						multiple
+						dropdown
+						:suggestions="filteredArray"
+						@complete="search" 
+					/>
+				</div>
 			</template>
 			<template #footer>
-				<button @click="editBookmark" class="btn btn-primary">{{$p.t('bookmark','saveLink')}}</button>
+				<button class="btn btn-primary" @click.prevent="editBookmark">
+					{{ $p.t('bookmark', 'saveLink') }}
+				</button>
 			</template>
 		</bs-modal>
 	</teleport>
 	<!--CREATE MODAL-->
 	<teleport to="body">
-		<bs-modal @[\`hide.bs.modal\`]="clearInputs();" ref="createModal">
+		<bs-modal ref="createModal" @hide-bs-modal="clearInputs();">
 			<template #title>
-				<h2>{{$p.t('bookmark','newLink')}}</h2>
+				<h2>{{ $p.t('bookmark', 'newLink') }}</h2>
 			</template>
 			<template #default>
-				<form-input :label="$p.t('profil','Titel')" :title="$p.t('profil','Titel')" id="insertTitle" v-model="title_input" name="title" class="mb-2"></form-input>
-				<form-input label="Url" title="Url" id="insertUrl" v-model="url_input" name="url"></form-input>
+
+				<form-input
+					id="insertTitle"
+					name="title"
+					v-model="title_input"
+					:label="$p.t('profil', 'Titel')"
+					:title="$p.t('profil', 'Titel')"
+					class="mb-2"
+				></form-input>
+				<form-input
+					id="insertUrl"
+					name="url"
+					v-model="url_input"
+					label="Url"
+					title="Url"
+				></form-input>
+
+				<label class="mt-2">Tags</label>
+				<div class="mt-2">
+					<pv-auto-complete
+						v-model="selectedTags"
+						multiple
+						dropdown
+						:suggestions="filteredArray"
+						@complete="search" 
+					/>
+				</div>					
+
 			</template>
 			<template #footer>
-				<button @click="insertBookmark" class="btn btn-primary">{{$p.t('bookmark','saveLink')}}</button>
+				<button class="btn btn-primary" @click.prevent="insertBookmark">
+					{{ $p.t('bookmark', 'saveLink') }}
+				</button>
+			</template>
+		</bs-modal>
+	</teleport>
+	<!--FILTER MODAL-->
+	<teleport to="body">
+		<bs-modal ref="filterModal" @hide-bs-modal="clearInputs();">
+			<template #title>
+				<h2>{{ $p.t('bookmark', 'headerFilterBookmark') }}</h2>
+			</template>
+			<template #default>
+
+				<div class="mt-2 row">
+					<div class="col-10">
+						<pv-multi-select
+							id="tagFilterUrl"
+							v-model="selectedFilters"
+							:options="availableTags"
+							display="chip"
+							:placeholder="$p.t('bookmark', 'noFilter')"
+							:maxSelectedLabels="3"
+							class="p-inputtext-sm w-100 me-2"
+						/>
+					</div>
+				</div>				
+
+			</template>
+			<template #footer>
+				<button
+					class="btn btn-secondary"
+					:title="$p.t('bookmark', 'filterByTags')"
+					@click="handleAddingTagFilter()"
+				>
+					{{ $p.t('ui/ok') }}
+				</button>
 			</template>
 		</bs-modal>
 	</teleport>
 	`,
 };
 
+
 /*
 Link JSON structure:
 { 

public/js/components/Drop/Grid/Item.js

@@ -1,88 +1,26 @@
 export default {
 	name:'GridItem',
-	components: {
-	},
-	inject: {
-	},
 	props: {
-		item: Object,
-		active: Boolean
+		item: Object
 	},
 	emits: [
-		"mouseDown",
-		"mouseUp",
 		"startMove",
-		"startResize",
-		"dragging",
-		"endDrag",
-		"dropDrag",
-		"item",
-		"touchStart",
-		"touchEnd",
+		"startResize"
 	],
-	data() {
-		return {
-			dragAction: '',
-			dragging: false
-		}
-	},
-	computed: {
-	},
 	methods: {
-		registerDragAction(evt) {
-			this.$emit('mouseDown', evt);
-			if (evt.target.hasAttribute('drag-action')) {
-				this.dragAction = evt.target.getAttribute('drag-action');
-			} else {
-				let parent = evt.target.closest('[drag-action]');
-				if (parent) {
-					this.dragAction = parent.getAttribute('drag-action');
-				} else {
-					this.dragAction = '';
-				}
-			}
-		},
-		tryDragStart(evt, item) {
-			let dragAction = this.dragAction || evt.target.getAttribute('drag-action');
+		tryDragStart(evt) {
+			let dragAction = evt.target.getAttribute('drag-action');
 			if (dragAction) {
-				this.dragging = true;
 				if (dragAction == 'move')
-					return this.$emit('startMove', evt, item);
+					return this.$emit('startMove', evt, this.item);
 				else if (dragAction == 'resize')
-					return this.$emit('startResize', evt, item);
-			}
-			//evt.preventDefault();
-		},
-		touchDragEnd(evt) {
-			if (!this.dragging)
-				return;
-			this.dragging = false;
-			this.$emit('touchEnd', evt);
-		},
-		touchStart(event){
-			this.$emit('touchStart', event); 
-			this.registerDragAction(event); 
-			this.tryDragStart(event, this.item);
-		},
-		touchMove(event){
-			if(this.dragging){
-				event.preventDefault();
-				this.$emit('dragging', event);
+					return this.$emit('startResize', evt, this.item);
 			}
 		}
 		
 	},
-	template: `
-	<div class="drop-grid-item"
-		@mousedown="registerDragAction"
-		@mouseup="$emit('mouseUp', $event)"
-		@touchstart="touchStart"
-		@touchend="touchDragEnd"
-		@dragstart="tryDragStart($event, item)"
-		@drag="$emit('dragging',$event)"
-		@touchmove="touchMove"
-		@dragend="$emit('endDrag', $event); dragging = false"
-		:draggable="active && !item.placeholder">
+	template: /* html */`
+	<li class="drop-grid-item" @dragstart="tryDragStart">
 		<slot v-bind="item"></slot>
-	</div>`
+	</li>`
 }

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',
@@ -313,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">
 
@@ -338,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,7 +62,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',

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

@@ -30,6 +30,7 @@ export default {
 			personId: null,
 			layoutColumnsOnNewData:	false,
 			height: '400',
+			arePhrasesLoaded: false
 		}
 	},
 	methods: {
@@ -195,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;
 						},
 					},
 					{
@@ -305,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;
@@ -357,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,
@@ -381,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"
@@ -413,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/Pagination/Pagination.js

@@ -1,37 +1,60 @@
 export default {
-  components: {
-    paginator: primevue.paginator,
-  },
-  emits: ["update:rows"],
-  props: {
-    maxPageCount: {
-      type: Number,
-      default: 0,
-    },
-    page_size: {
-      type: Number,
-      required: true,
-    },
-  },
-  data() {
-    return {};
-  },
-  methods: {
-    newPageEvent: function (data) {
-      
-    },
-  },
-  mounted() {},
-  template: /*html*/ `
- 	<!-- Desktop -->
+	components: {
+		paginator: primevue.paginator,
+	},
+	emits: ["pageUpdated"],
+	props: {
+		maxPageCount: {
+			type: Number,
+			default: 0,
+		},
+		page_size: {
+			type: Number,
+			required: true,
+		},
+		page: {
+			type: [Number, null],
+			default: null,
+		},
+	},
+	data() {
+		return {
+			first: 0,
+			rowsPerPageOptions: [10, 20, 30],
+		};
+	},
+	watch: {
+		page(newValue) {
+			this.first = (newValue - 1) * this.$props.page_size;
+		},
+	},
+	methods: {
+		afterPageUpdated(data) {
+			this.$emit("pageUpdated", { ...data, page: data.page + 1 });
+			this.first = data.page * this.$props.page_size;
+		},
+	},
+	template: /*html*/ `
+	<!-- Desktop -->
 	<div class="d-none d-md-block">
-		<paginator v-model:rows="page_size" @page="(data)=>$emit('page',{...data, page:data.page+1})" :rows="page_size" :totalRecords="maxPageCount" :rowsPerPageOptions="[10, 20, 30]" >
-		</paginator>
+        <paginator 
+			@page="afterPageUpdated($event)"
+			v-model:first="first"
+			:rows="page_size"
+			:totalRecords="maxPageCount"
+			:rowsPerPageOptions="rowsPerPageOptions"
+		></paginator>
 	</div>
 	<!-- Mobile -->
 	<div class="d-block d-md-none">
-		<paginator v-model:rows="page_size" @page="(data)=>$emit('page',{...data, page:data.page+1})" :rows="page_size" :totalRecords="maxPageCount" :rowsPerPageOptions="[10, 20, 30]" template="FirstPageLink PrevPageLink CurrentPageReport NextPageLink LastPageLink RowsPerPageDropdown">
-		</paginator>
+		<paginator
+			@page="afterPageUpdated($event)"
+			v-model:first="first"
+			:rows="page_size"
+			:totalRecords="maxPageCount"
+			:rowsPerPageOptions="rowsPerPageOptions"
+			template="FirstPageLink PrevPageLink CurrentPageReport NextPageLink LastPageLink RowsPerPageDropdown"
+		></paginator>
 	</div>
   `,
 };