Merge branch 'feature-25999/C4_cleanup' into feature-25999/C4_anwesenheiten_widget

config/global.config-default.inc.php

@@ -29,6 +29,9 @@ define('CIS_LEHRVERANSTALTUNG_GESAMTNOTE_ANZEIGEN', true);
 define('CIS_LEHRVERANSTALTUNG_ANRECHNUNG_ANZEIGEN', true);
 define('CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN', true);
 
+// Wenn gesetzt, werden die Digitale Anwesenheit-Icons nur fuer diese Studiengaenge angezeigt, sonst für alle
+// define('CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN_STG', serialize(array('257')));
+
 // Im CIS Menue Links bei Modulen anzeigen wenn Lehrauftrag
 define('CIS_LEHRVERANSTALTUNG_MODULE_LINK',true);
 

include/tw/cis_menu_lv.inc.php

@@ -242,12 +242,12 @@ function checkZeilenUmbruch()
 
 	// Digitale Anwesenheiten
 	if(defined('CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN') && CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN && $angemeldet
+			&& (!defined('CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN_STG') || in_array($lv->studiengang_kz, unserialize(CIS_LEHRVERANSTALTUNG_ANWESENHEIT_ANZEIGEN_STG)))
 			&& ($rechte->isBerechtigt('extension/anw_ent_admin')
 				|| $rechte->isBerechtigt('extension/anwesenheit_lektor')
 				|| $rechte->isBerechtigt('extension/anwesenheit_student')
 				|| $rechte->isBerechtigt('extension/anwesenheit_admin')))
 	{
-
 		$link='';
 		$text='';
 

public/css/Cis4/Cis.css

@@ -182,6 +182,10 @@ html {
   transform: rotate(-90deg);
 }
 
+#nav-sprachen{
+	transition: none;
+}
+
 /* searchbar */
 #nav-search {
   z-index: 1;
@@ -540,4 +544,25 @@ html {
 		padding-left: 2.5rem;
 		overflow-wrap: anywhere;
 	}
+}
+
+/* classes used for the Vue <Transition> component*/
+.v-enter-active,
+.v-leave-active {
+	transition: opacity 0.2s ease-out;
+}
+
+.v-enter-from,
+.v-leave-to {
+	opacity: 0;
+}
+
+.height-enter-active,
+.height-leave-active {
+	transition: height 0.3s ease-out;
+}
+
+.height-enter-from,
+.height-leave-to {
+	height: 0px;
 }

public/js/components/Calendar/Day/Page.js

@@ -288,11 +288,13 @@ export default {
 						<a href="#" class="small text-secondary text-decoration-none" >{{day.toLocaleString(undefined, [{day:'numeric',month:'numeric'},{day:'numeric',month:'numeric'},{day:'numeric',month:'numeric'},{dateStyle:'short'}][this.size])}}</a>
 					</div>
 				</div>
-				<div ref="eventcontainer" class="position-relative flex-grow-1" @mousemove="calcHourPosition" @mouseleave="" >
+				<div ref="eventcontainer" class="position-relative flex-grow-1" @mousemove="calcHourPosition" @mouseleave="hourPosition = null" >
 					<div :id="hourGridIdentifier(hour)" v-for="hour in hours" :key="hour"  class="position-absolute box-shadow-border-top" :style="hourGridStyle(hour)"></div>
-					<div v-if="hourPosition" class="position-absolute border-top small"  :style="indicatorStyle">
-						<span class="border border-top-0 px-2 bg-white">{{hourPositionTime}}</span>
-					</div>
+					<Transition>
+						<div v-if="hourPosition" class="position-absolute border-top small"  :style="indicatorStyle">
+							<span class="border border-top-0 px-2 bg-white">{{hourPositionTime}}</span>
+						</div>
+					</Transition>
 					<div>
 						<h1 v-if="noEventsCondition" class="m-0 text-secondary" ref="noEventsText" :style="noLvStyle">Keine Lehrveranstaltungen</h1>
 						<div :class="{'fhc-calendar-no-events-overlay':noEventsCondition, 'events':true}">

public/js/components/Calendar/Week/Page.js

@@ -212,11 +212,13 @@ export default {
 					<a href="#" class="small text-secondary text-decoration-none" >{{day.toLocaleString(undefined, [{day:'numeric',month:'numeric'},{day:'numeric',month:'numeric'},{day:'numeric',month:'numeric'},{dateStyle:'short'}][this.size])}}</a>
 				</div>
 			</div>
-			<div ref="eventcontainer" class="position-relative flex-grow-1" @mousemove="calcHourPosition" @mouseleave="" >
+			<div ref="eventcontainer" class="position-relative flex-grow-1" @mousemove="calcHourPosition" @mouseleave="hourPosition = null" >
 				<div :id="hourGridIdentifier(hour)" v-for="hour in hours" :key="hour"  class="position-absolute box-shadow-border-top" :style="hourGridStyle(hour)"></div>
-				<div v-if="hourPosition" class="position-absolute border-top small"  :style="indicatorStyle">
-					<span class="border border-top-0 px-2 bg-white">{{hourPositionTime}}</span>
-				</div>
+				<Transition>
+					<div v-if="hourPosition" class="position-absolute border-top small"  :style="indicatorStyle">
+						<span class="border border-top-0 px-2 bg-white">{{hourPositionTime}}</span>
+					</div>
+				</Transition>
 				<div class="events">
 					<div class="hours">
 						<div v-for="hour in hours" style="min-height:100px" :key="hour" class="text-muted text-end small" :ref="'hour' + hour">{{hour}}:00</div>

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

@@ -37,7 +37,8 @@ export default {
   template: /*html*/ `
   	<h2 >News</h2>
 	<hr/>
-    <pagination :page_size="page_size"  @page="loadNewPageContent" :maxPageCount="maxPageCount">
+	<pagination  :page_size="page_size"  @page="loadNewPageContent" :maxPageCount="maxPageCount">
+	</pagination>
     <div v-html="content"></div>
-    </pagination>`,
+    `,
 };

public/js/components/Cis/Menu.js

@@ -51,16 +51,18 @@ export default {
 		}
 	},
 	methods: {
-		toggleCollapsibles(target){
-			switch(target){
-				case 'settings':
-					this.navUserDropdown?.hide();
-					break;
-				case 'navUserDropdown':
-					this.$refs.searchbar?.settingsDropdown?.hide();
-					break;
+		checkSettingsVisibility: function (event) {
+			// hides the settings collapsible if the user clicks somewhere else
+			if (!this.$refs.navUserDropdown.contains(event.target)) {
+				this.navUserDropdown.hide();
 			}
 		},
+		handleShowNavUser(){
+			document.addEventListener("click", this.checkSettingsVisibility);
+		},
+		handleHideNavUser(){
+			document.removeEventListener("click", this.checkSettingsVisibility);
+		},
 		makeParentContentActive(content_id, collection=this.entries, parent=null){
 			for(let entry of collection){
 				if(entry.content_id == content_id){
@@ -86,14 +88,10 @@ export default {
 		});
 	},
     template: /*html*/`
-	<!--<p>CISVUE HEADER</p>
-	<p>highest count : {{highestMatchingUrlCount}}</p>
-	<p>active entry content_id : {{activeEntry}}</p>
-	-->
-	<button id="nav-main-btn" class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#nav-main" aria-controls="nav-main" aria-expanded="false" aria-label="Toggle navigation">
+	<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 @showSettings="toggleCollapsibles" ref="searchbar" id="nav-search" class="fhc-searchbar w-100" :searchoptions="searchbaroptions" :searchfunction="searchfunction"></fhc-searchbar>
+	<fhc-searchbar ref="searchbar" id="nav-search" class="fhc-searchbar w-100" :searchoptions="searchbaroptions" :searchfunction="searchfunction"></fhc-searchbar>
     <a id="nav-logo" class="d-none d-lg-block" :href="rootUrl">
         <img :src="logoUrl" alt="Logo">
     </a>
@@ -101,7 +99,10 @@ export default {
 		<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" class="avatar rounded-circle"/>
 		</button>
-		<ul ref="navUserDropdown" @[\`show.bs.collapse\`]="toggleCollapsibles('navUserDropdown')" id="nav-user-menu" class="top-100 end-0 collapse list-unstyled" aria-labelledby="nav-user-btn">
+		<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 class="btn-level-2"><a class="btn btn-level-2 rounded-0 d-block" :href="site_url + '/Cis/Profil'" id="menu-profil">Profil</a></li>
 			<li class="btn-level-2">
 				<cis-sprachen></cis-sprachen>
@@ -112,17 +113,17 @@ export default {
 	</div>
     <nav id="nav-main" class="offcanvas offcanvas-start bg-dark" tabindex="-1" aria-labelledby="nav-main-btn" data-bs-backdrop="false">
 		<div id="nav-main-sticky">
-			<div class="border-top border-bottom border-dark" >
+			<div id="nav-sprachen" class="nav-menu-collapse collapse collapse-horizontal show border-top border-bottom border-dark flex-shrink-0" >
 				<cis-sprachen></cis-sprachen>
 			</div>
 			<div id="nav-main-toggle" class="position-static d-none d-lg-block bg-dark">
-				<button type="button" class="btn bg-dark text-light rounded-0 p-1 d-flex align-items-center" data-bs-toggle="collapse" data-bs-target="#nav-main-menu" aria-expanded="true" aria-controls="nav-main-menu">
+				<button type="button" class="btn bg-dark 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 class="fa fa-arrow-circle-left"></i>
 				</button>
 			</div>
 			<div class="offcanvas-body p-0">
-				
-				<div id="nav-main-menu" class="collapse collapse-horizontal show">
+
+				<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>

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

@@ -196,11 +196,6 @@ export default {
 		this.checkActiveUrl(new URL(window.location.href));
     },
     template: /*html*/`
-	<!-- DEBUGGIING PRINTS
-	<p>entry content_id: {{JSON.stringify(entry.content_id,null,2)}}</p>
-	<p>entry menu: {{JSON.stringify(entry.menu_open,null,2)}}</p>
-	<p>highest count : {{urlCount}}</p>
-	-->
 	<div v-if="entry.template_kurzbz == 'include'">
         INCLUDE
     </div>

public/js/components/Cis/Mylv/LvInfo.js

@@ -11,6 +11,15 @@ export default {
 		}
 	},
 	computed: {
+		lektorenLinks: function(){
+			if (!this.event || !Array.isArray(this.event.lektor) || !this.event.lektor.length) return "a";
+
+			let lektorenLinks ={};
+			this.event.lektor.forEach((lektor)=>{
+				lektorenLinks[lektor.kurzbz] = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + `/Cis/Profil/View/${lektor.mitarbeiter_uid}`;
+			})
+			return lektorenLinks;
+		},
 		start_time: function () {
 			if (!this.event.start) return 'N/A';
 			if (!this.event.start instanceof Date) {
@@ -67,7 +76,12 @@ export default {
 						$p.t('lehre','lektor')+':'
 						:''
 					}}</th>
-					<td>{{event.lektor.map(lektor=>lektor.kurzbz).join("/")}}</td>
+					<td>
+						<div v-for="lektor in event.lektor" class="d-block">
+							<a v-if="lektorenLinks[lektor.kurzbz]" :href="lektorenLinks[lektor.kurzbz]"><i class="fa fa-arrow-up-right-from-square me-1" style="color:#00649C"></i></a>
+							{{lektor.kurzbz}}
+						</div>
+					</td>
 				</tr>
 				<tr>
 					<th>{{

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

@@ -19,8 +19,16 @@ export default {
 		info: null,
 	}),
 	computed: {
-		lektorNames() {
-			return this.info.lektoren.map(e => ((e.titelpre || '') + ' ' + (e.vorname || '') + ' ' + (e.nachname || '') + ' ' + (e.titelpost || '')).trim());
+		lektorNamesLinks(){
+			let lektorenLinks = {};
+			this.info.lektoren.forEach(e => {
+				let name = ((e.titelpre || '') + ' ' + (e.vorname || '') + ' ' + (e.nachname || '') + ' ' + (e.titelpost || '')).trim();
+				lektorenLinks[name] = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + `/Cis/Profil/View/${e.uid}`;
+			});
+			return lektorenLinks;
+		},
+		lektorNames(){
+			return this.info.lektoren.map((e)=>((e.titelpre || '') + ' ' + (e.vorname || '') + ' ' + (e.nachname || '') + ' ' + (e.titelpost || '')).trim());
 		},
 		lvLeitung() {
 			return this.info.lvLeitung && this.info.lvLeitung.length ? this.info.lvLeitung.map(e => ((e.titelpre || '') + ' ' + (e.vorname || '') + ' ' + (e.nachname || '') + ' ' + (e.titelpost || '')).trim()) : null;
@@ -69,16 +77,11 @@ export default {
 			this.info = infos[this.lehrveranstaltung_id];
 		} else {
 			axios.get(FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router + '/components/Cis/Mylv/Info/' + this.studien_semester + '/' + this.lehrveranstaltung_id).then(res => {
-				
 				this.info = infos[this.lehrveranstaltung_id] = res.data.retval || [];
 			}).catch(() => this.info = {});
 		}
 	},
 	template: /*html*/`
-
-			<!-- debugging print
-			<p>{{JSON.stringify(info,null,2)}}</p>
-			-->
 			<h1>{{$p.t('lvinfo/lehrveranstaltungsinformationen')}}</h1>
 			<hr>
 				<div v-if="!info" class="text-center">
@@ -110,8 +113,8 @@ export default {
 							<th>{{$p.t('lehre/lehrbeauftragter')}}</th>
 							<td>
 								<ul v-if="lektorNames.length" class="list-unstyled mb-0">
-									<li v-for="name in lektorNames" :key="name">
-										<!-- TODO(chris): link? -->
+									<li v-for="name in new Set(lektorNames)" :key="name">
+									<a :href="lektorNamesLinks[name]?lektorNamesLinks[name]:null"><i class="fa fa-arrow-up-right-from-square me-1" style="color:#00649C"></i></a>
 										{{name}}
 									</li>
 								</ul>
@@ -125,7 +128,7 @@ export default {
 							<td>
 								<ul class="list-unstyled mb-0">
 									<li v-for="name in lvLeitung" :key="name">
-										<!-- TODO(chris): link? -->
+										<a :href="lektorNamesLinks[name]?lektorNamesLinks[name]:null"><i class="fa fa-arrow-up-right-from-square me-1" style="color:#00649C"></i></a>
 										{{name}}
 									</li>
 								</ul>

public/js/components/Cis/Sprachen.js

@@ -22,8 +22,8 @@ export default {
 		);
 	},
 	template:/*html*/`
-	<div class="container flex-shrink-0">
-		<div class="row justify-content-center align-items-center">
+	<div class="container">
+		<div class="row justify-content-center align-items-center flex-nowrap overflow-hidden">
 			<button v-for="lang in allActiveLanguages" @click.prevent="changeLanguage(lang)" class="col text-white fhc-entry btn text-center w-100" :selected="$p.user_language.value==lang?'':null">{{lang}}</button>
 		</div>
 	</div>

public/js/components/Dashboard/Item.js

@@ -1,9 +1,11 @@
 import BsModal from "../Bootstrap/Modal.js";
 import CachedWidgetLoader from "../../composables/Dashboard/CachedWidgetLoader.js";
+import HeightTransition from "../Tranistion/HeightTransition.js";
 
 export default {
 	components: {
 		BsModal,
+		HeightTransition
 	},
 	data: () => ({
 		component: "",
@@ -118,7 +120,9 @@ export default {
 	</div>
 	<div v-else-if="!hidden || editMode" class="dashboard-item card overflow-hidden h-100" :class="arguments && arguments.className ? arguments.className : ''">
 		<div v-if="widget" class="card-header d-flex ps-0 pe-2">
-			<span v-if="editMode" drag-action="move" class="col-auto mx-2 px-2 cursor-move"><i class="fa-solid fa-grip-vertical"></i></span>
+			<Transition>
+				<span v-if="editMode" drag-action="move" class="col-auto mx-2 px-2 cursor-move"><i class="fa-solid fa-grip-vertical"></i></span>
+			</Transition>
 			<span class="col mx-2 px-2">{{ widget.setup.name }}</span>
 			<a v-if="widget.setup.cis4link" :href="getWidgetC4Link(widget)" class="ms-auto mb-2">
           		<i class="fa fa-arrow-up-right-from-square me-1"></i>
@@ -127,9 +131,11 @@ export default {
 			<a v-if="custom && editMode" class="col-auto px-1" href="#" @click.prevent="$emit('remove')">
 				<i class="fa-solid fa-trash"></i>
 			</a>
-			<div v-else-if="editMode" class="col-auto px-1 form-switch">
-				<input class="form-check-input ms-0" type="checkbox" role="switch" id="flexSwitchCheckChecked" :checked="!hidden" @input="$emit('remove', hidden)">
-			</div>
+			<Transition>
+				<div v-if="!custom && editMode" class="col-auto px-1 form-switch">
+					<input class="form-check-input ms-0" type="checkbox" role="switch" id="flexSwitchCheckChecked" :checked="!hidden" @input="$emit('remove', hidden)">
+				</div>
+			</Transition>
 		</div>
 		<div v-if="ready" class="card-body overflow-hidden" style="padding: 0px;">
 			<component :is="component" v-model:shared-data="sharedData" :config="arguments" :width="width" :height="height" @setConfig="setConfig" @change="changeConfigManually"></component>
@@ -148,8 +154,10 @@ export default {
 				<button type="button" class="btn btn-primary" @click="changeConfig">Save changes</button>
 			</template>
 		</bs-modal>
-		<div v-if="editMode && isResizeable" class="card-footer d-flex justify-content-end p-0">
-			<span drag-action="resize" class="col-auto px-1 cursor-nw-resize"><i class="fa-solid fa-up-right-and-down-left-from-center mirror-x"></i></span>
-		</div>
+		<height-transition>
+			<div v-if="editMode && isResizeable" class="card-footer d-flex justify-content-end p-0">
+				<span drag-action="resize" class="col-auto px-1 cursor-nw-resize"><i class="fa-solid fa-up-right-and-down-left-from-center mirror-x"></i></span>
+			</div>
+		</height-transition>
 	</div>`,
 };

public/js/components/Drop/Grid.js

@@ -356,29 +356,31 @@ export default {
 		@drop="dragEnd"
 		@mousemove="updateCursor"
 		@mouseleave="mouseLeave">
-		<grid-item
-			v-for="item in (mode == 0 && active? placedItems_withPlaceholders : placedItems)"
-			:key="item.id"
-			:item="item"
-			@start-move="startMove"
-			@start-resize="startResize"
-			@end-drag="dragCancel"
-			@drop-drag="dragEnd"
-			class="position-absolute"
-			:active="active"
-			:style="{
-				top: 'calc(' + item.y + ' * var(--fhc-dg-row-height))',
-				left: 'calc(' + item.x + ' * var(--fhc-dg-col-width))',
-				width: 'calc(' + item.w + ' * var(--fhc-dg-col-width))',
-				height: 'calc(' + item.h + ' * var(--fhc-dg-row-height))',
-				paddingTop: 'var(--fhc-dg-item-padding-top)',
-				paddingLeft: 'var(--fhc-dg-item-padding-horizontal)',
-				paddingRight: 'var(--fhc-dg-item-padding-horizontal)'
-			}">
-			<template v-slot="item">
-				<slot v-bind="item.data" v-bind="item" :x="item.x" :y="item.y" ></slot>
-			</template>
-		</grid-item>
+		<TransitionGroup tag="div">
+			<grid-item
+				v-for="item in (mode == 0 && active? placedItems_withPlaceholders : placedItems)"
+				:key="item.id"
+				:item="item"
+				@start-move="startMove"
+				@start-resize="startResize"
+				@end-drag="dragCancel"
+				@drop-drag="dragEnd"
+				class="position-absolute"
+				:active="active"
+				:style="{
+					top: 'calc(' + item.y + ' * var(--fhc-dg-row-height))',
+					left: 'calc(' + item.x + ' * var(--fhc-dg-col-width))',
+					width: 'calc(' + item.w + ' * var(--fhc-dg-col-width))',
+					height: 'calc(' + item.h + ' * var(--fhc-dg-row-height))',
+					paddingTop: 'var(--fhc-dg-item-padding-top)',
+					paddingLeft: 'var(--fhc-dg-item-padding-horizontal)',
+					paddingRight: 'var(--fhc-dg-item-padding-horizontal)'
+				}">
+				<template v-slot="item">
+					<slot v-bind="item.data" v-bind="item" :x="item.x" :y="item.y" ></slot>
+				</template>
+			</grid-item>
+		</TransitionGroup>
 		
 	</div>`
 }

public/js/components/Form/Input.js

@@ -265,7 +265,10 @@ export default {
 		<component
 			v-else-if="tag == 'PvAutocomplete'"
 			ref="input"
+			:is="tag"
+			:type="type"
 			v-model="modelValueCmp"
+			v-bind="$attrs"
 			:id="idCmp"
 			:input-props="{name}"
 			:class="validationClass"

public/js/components/Pagination/Pagination.js

@@ -23,11 +23,15 @@ export default {
   },
   mounted() {},
   template: /*html*/ `
-    
-   <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>
-    <slot>
-    Placeholder
-    </slot>
-   
+ 	<!-- 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>
+	</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>
+	</div>
   `,
 };

public/js/components/Tranistion/HeightTransition.js

@@ -0,0 +1,24 @@
+export default {
+	data(){
+		return {
+
+		}
+	},
+	methods:{
+		onEnter(el,done){
+			el.style.height = '0';
+			el.style.height = el.scrollHeight + 'px';
+		},
+		onLeave(el,done){
+			el.style.height = el.scrollHeight + 'px';
+			el.style.height = '0';
+		}
+	},
+	template:
+	/*html*/`
+		<Transition name="height" @enter="onEnter" @leave="onLeave">
+			<slot>
+			</slot>
+		</Transition>
+	`,
+};

public/js/components/searchbar/searchbar.js

@@ -7,12 +7,10 @@ import prestudent from "./prestudent.js";
 
 export default {
     props: [ "searchoptions", "searchfunction" ],
-    emits: ['showSettings'],
     data: function() {
       return {
         searchtimer: null,
         hidetimer: null,
-        showsettings: false,
         searchsettings: {
             searchstr: '',
             types: [],
@@ -65,8 +63,10 @@ export default {
               </div>
             </div>
 
-            <div id="searchSettings"  ref="settings"  @[\`show.bs.collapse\`]="$emit('showSettings','settings')"
-                 class="top-100 end-0 searchbar_settings text-white collapse" tabindex="-1">
+            <div id="searchSettings"  ref="settings"
+				@[\`shown.bs.collapse\`]="handleShowSettings"
+				@[\`hide.bs.collapse\`]="handleHideSettings"
+                class="top-100 end-0 searchbar_settings text-white collapse" tabindex="-1">
               <div class="d-flex flex-column m-3" v-if="this.searchoptions.types.length > 0">
               <span class="fw-light mb-2">Suche filtern nach:</span>  
               <template v-for="(type, index) in this.searchoptions.types" :key="type">
@@ -87,7 +87,6 @@ export default {
     },
     beforeMount: function() {
         this.updateSearchOptions();
-        
     },
 	mounted(){
 		this.settingsDropdown = new bootstrap.Collapse(this.$refs.settings, {
@@ -102,6 +101,21 @@ export default {
 		}
 	},
     methods: {
+		checkSettingsVisibility: function(event) {
+			// hides the settings collapsible if the user clicks somewhere else
+			if (!this.$refs.settings.contains(event.target))
+			{
+				this.settingsDropdown.hide();
+			}
+		},
+		handleShowSettings: function() {
+			// adds the event listener checkSettingsVisibility only when the collapsible is shown
+			document.addEventListener("click", this.checkSettingsVisibility);
+		},
+		handleHideSettings: function () {
+			// removes the event listener checkSettingsVisibility when the collapsible is hidden
+			document.removeEventListener("click", this.checkSettingsVisibility);
+		},
         updateSearchOptions: function() {
             this.searchsettings.types = [];
             for( const idx in this.searchoptions.types ) {

system/phrasesupdate.php

@@ -26453,7 +26453,7 @@ array(
 				'insertvon' => 'system'
 			)
 		)
-	),	
+	),
 	array(
 		'app' => 'personalverwaltung',
 		'category' => 'gehaltsband',
@@ -27518,7 +27518,7 @@ array(
 				)
 			)
 		),
-		
+
 		array(
 			'app' => 'core',
 			'category' => 'profilUpdate',
@@ -28879,7 +28879,7 @@ array(
 				)
 			)
 		),
-		
+
 		//ProfilUpdate Phrasen ende
 	array(
 		'app' => 'core',
@@ -31345,7 +31345,7 @@ array(
 			array(
 				'sprache' => 'German',
 				'text' => 'Im Entschuldigungsmanagement können Sie als Studiengangsassistenz beziehungsweise als Administrator die von Studenten hochgeladenen Entschuldigungsdokumente überprüfen und den Status entsprechend vergeben.
-				
+
 				Bitte beachten Sie dass nur Entschuldigungen INNERHALB des angegebenen Zeitraumes angezeigt werden. Sollten Sie nach einer lang wirken Entschuldigung suchen, müssen Sie die Zeitspanne entsprechend weit setzen.',
 				'description' => '',
 				'insertvon' => 'system'
@@ -31393,9 +31393,9 @@ array(
 			array(
 				'sprache' => 'German',
 				'text' => 'Um eine Anwesenheitskontrolle für Ihre ausgewählte Unterrichtsgruppe durchzuführen, wählen Sie bitte einen Termin aus dem Stundenplan aus oder geben händisch die gewünschte Gültigkeitkeitsdauer der Kontrolle an.
-				
+
 				Die Gültigkeitsdauer bestimmt die Gewichtung der Anwesenheit in Relation zum Gesamtausmaß, sie können diese aber nach eigenem Ermessen anpassen und müssen sich nicht streng an die Termine im Stundenplan halten.
-				
+
 				Sie können pro Datum und Unterrichtsgruppe eine Anwesenheitskontrolle pro Tag eröffnen, welche jedoch beliebig oft aufgerufen und von Studenten eingecheckt werden kann. Es gelten dabei ihre zuletzt eingetragenen Zeiten. Ein Student muss nur einmal am Tag pro Gruppe einchecken um als anwesend registriert zu sein, egal wie oft Sie die Kontrolle starten.',
 				'description' => '',
 				'insertvon' => 'system'
@@ -31421,9 +31421,9 @@ array(
 			array(
 				'sprache' => 'German',
 				'text' => 'In dieser Detailansicht können Sie einzelne Anwesenheiten eines Studenten bearbeiten, falls ein anwesender Student aus technischen Gründen den Zugangscode nicht eingeben kann. Ebenso steht es Ihnen frei Studenten auszutragen, welche nicht anwesend sind aber den Zugangscode mit Hilfe von anwesenden Studenten erhalten haben.
-				
+
 				Falls eine Anwesenheit durch eine akzeptierte Entschuldigung entstanden ist, können Sie den Status nicht verändern.
-				
+
 				Es steht Ihnen frei die Anwesenheitseinträge mit Notiztexten zu versehen, welche dem Studenten nicht zugänglich sind.',
 				'description' => '',
 				'insertvon' => 'system'
@@ -31440,6 +31440,26 @@ array(
 			)
 		)
 	),
+	array(
+		'app' => 'anwesenheiten',
+		'category' => 'global',
+		'phrase' => 'tooltipStudentTestphase',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Hinweis: Es handelt sich um einen nicht repräsentativen Testbetrieb und die Ergebnisse werden nicht für die Benotung herangezogen.',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Note: This is a non-representative test operation and the results are not used for grading.',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
 	//
 	// DIGITALE ANWESENHEITEN PHRASEN END
 	//