Refactor and Cleanup

- adapt tabulator and queries for remote pagination - use formatterParams for messageStati to enable phrase logic - adapt logic for mitarbeiter_uid - refactor logic to use new Page, new Tab and newDiv with one child component - add phrases
2026-06-01 20:29:29 +00:00 · 2025-03-12 15:04:37 +01:00
parent 1989e65d72
commit a0ce635c7e
10 changed files with 459 additions and 299 deletions
@@ -41,17 +41,27 @@ class Messages extends FHCAPI_Controller
 		]);
 	}

-	public function getMessages($id, $type_id)
+	public function getMessages($id, $type_id, $size, $page)
 	{
 		if($type_id != 'person_id'){
 			$id = $this->_getPersonId($id, $type_id);
 		}

-		$result = $this->MessageModel->getMessagesForTable($id);
+		$offset = $size * ($page - 1);
+		$limit = $size;
+
+		$result = $this->MessageModel->getMessagesForTable($id, $offset, $limit);

 		$data = $this->getDataOrTerminateWithError($result);

-		$this->terminateWithSuccess($data);
+		//return null if count == 0
+		if($data['count'] == 0){
+			$this->terminateWithSuccess([]);
+		}
+
+		$this->addMeta('count', $data['count']);
+
+		$this->terminateWithSuccess($data['data']);
 	}

 	public function getVorlagen()
@@ -107,9 +117,10 @@ class Messages extends FHCAPI_Controller
 		$this->terminateWithSuccess($vorlage->text);
 	}

-	public function getMessageVarsPerson()
+	public function getMessageVarsPerson($id, $typeId)
 	{
-		$result = $this->MessageModel->getMessageVarsPerson();
+		$person_id = ($typeId == 'mitarbeiter_uid') ? $this->_getPersonId($id, $typeId) : $id;
+		$result = $this->MessageModel->getMessageVarsPerson($person_id);

 		$data = $this->getDataOrTerminateWithError($result);

@@ -119,7 +130,7 @@ class Messages extends FHCAPI_Controller

 	public function getMsgVarsPrestudent($id, $typeId)
 	{
-		$prestudent_id = ($typeId == 'prestudent_id') ? $id : $this->_getPrestudentIdFromUid($id);
+		$prestudent_id = ($typeId == 'uid') ? $this->_getPrestudentIdFromUid($id) : $id;

 		$result = $this->MessageModel->getMsgVarsDataByPrestudentId($prestudent_id);

@@ -138,7 +149,7 @@ class Messages extends FHCAPI_Controller

 	public function getNameOfDefaultRecipient($id, $type_id)
 	{
-		$id = $type_id!='person_id)' ? $this->_getPersonId($id, $type_id) : $id;
+		$id = ($type_id != 'person_id') ? $this->_getPersonId($id, $type_id) : $id;

 		$this->load->model('person/Person_model', 'PersonModel');

@@ -151,8 +162,8 @@ class Messages extends FHCAPI_Controller

 	public function sendMessage($recipient_id)
 	{
-		//is always uid in FAS
-		//TODO(Manu) make dynamic for other ids
+		//has to be uid
+	//	$this->terminateWithError("uid", $recipient_id, self::ERROR_TYPE_GENERAL);

 		//default setting
 		$receiversPersonId = $this->_getPersonId($recipient_id, 'uid');
@@ -205,10 +216,17 @@ class Messages extends FHCAPI_Controller
 			$result = $this->MessagesModel->parseMessageTextPrestudent($prestudent_id, $body);
 			$bodyParsed = $this->getDataOrTerminateWithError($result);
 		}
+		if($typeId == 'mitarbeiter_uid')
+		{
+			$person_id = $this->_getPersonId($id, $typeId);
+
+			$result = $this->MessagesModel->parseMessageTextPerson($person_id, $body);
+			$bodyParsed = $this->getDataOrTerminateWithError($result);
+			$this->terminateWithError($bodyParsed, self::ERROR_TYPE_GENERAL);
+
+		}
 		elseif($typeId == 'person_id')
 		{
-			$this->terminateWithError("person_id ", self::ERROR_TYPE_GENERAL);
-
 			$result = $this->MessagesModel->parseMessageTextPerson($id, $body);
 			$bodyParsed = $this->getDataOrTerminateWithError($result);
 		}
@@ -235,7 +253,6 @@ class Messages extends FHCAPI_Controller
 		{
 			$data = json_decode($_POST['data']);
 			unset($_POST['data']);
-
 		}
 		else
 			$this->terminateWithError("Textbody missing ", self::ERROR_TYPE_GENERAL);
@@ -249,6 +266,15 @@ class Messages extends FHCAPI_Controller
 			case 'prestudent_id':
 				$result = $this->MessagesModel->parseMessageTextPrestudent($id, $data);
 				break;
+			case 'person_id':
+				$result = $this->MessagesModel->parseMessageTextPerson($id, $data);
+				break;
+			case 'mitarbeiter_uid':
+				{
+					$person_id = $this->_getPersonId($id, $type_id);
+					$result = $this->MessagesModel->parseMessageTextPerson($person_id, $data);
+				}
+				break;
 			default:
 				$this->terminateWithError("MESSAGES::getPreviewText logic for type_id " . $type_id . " not defined yet", self::ERROR_TYPE_GENERAL);
 				break;
@@ -318,7 +344,7 @@ class Messages extends FHCAPI_Controller

 	public function getPersonId($id, $typeId)
 	{
-		if ($typeId == 'uid')
+		if ($typeId == 'uid' || $typeId == 'mitarbeiter_uid')
 		{
 			$this->load->model('person/Benutzer_model', 'BenutzerModel');
 			$result = $this->BenutzerModel->loadWhere(
@@ -368,7 +394,7 @@ class Messages extends FHCAPI_Controller
 				['person_id' => $person_id]
 			);
 		}
-		elseif($typeId == 'uid')
+		elseif($typeId == 'uid' || $typeId == 'mitarbeiter_uid')
 		{
 			$this->terminateWithSuccess($id);
 		}
@@ -385,7 +411,7 @@ class Messages extends FHCAPI_Controller

 	private function _getPersonId($id, $typeId)
 	{
-		if ($typeId == 'uid')
+		if ($typeId == 'uid' || $typeId == 'mitarbeiter_uid')
 		{
 			$this->load->model('person/Benutzer_model', 'BenutzerModel');
 			$result = $this->BenutzerModel->loadWhere(
@@ -408,6 +434,7 @@ class Messages extends FHCAPI_Controller

 	private function _getPrestudentIdFromUid($uid)
 	{
+	//	$this->terminateWithError($uid, self::ERROR_TYPE_GENERAL);
 		$this->load->model('crm/Student_model', 'StudentModel');
 		$result = $this->StudentModel->loadWhere(
 			['student_uid' => $uid]
@@ -415,7 +442,7 @@ class Messages extends FHCAPI_Controller

 		$data = $this->getDataOrTerminateWithError($result);
 		$student = current($data);
-
+	//	$this->terminateWithError($student->prestudent_id, self::ERROR_TYPE_GENERAL);
 		return $student->prestudent_id;
 	}

@@ -234,12 +234,15 @@ class Message_model extends DB_Model
 	/**
 	 * Gets messages for a person for tableMessages.
 	 * @param $person_id
-	 * @param null $status message status. by default, latest status is returned
+	 * paginationInitialPage: 1,
+	 * @param $offset number to skip, calculated by tabulatorParam paginationInitialPage and 	paginationSize, refers to specified numer of skipped items
+	 * and page
+	 * @param $limit refers to tabulatorParam paginationSize
 	 * @return array|null
 	 */
-	public function getMessagesForTable($person_id, $status = null)
+	public function getMessagesForTable($person_id, $offset, $limit)
 	{
-		$sql = "
+		$sql_base = "
 			SELECT
 				m.message_id AS message_id,
 				m.subject AS subject,
@@ -275,20 +278,45 @@ class Message_model extends DB_Model
 				 JOIN public.tbl_msg_message m USING(message_id)
 			WHERE r.person_id = ?
 			GROUP BY m.message_id, m.subject, m.body, m.insertamum, m.relationmessage_id, sender, recipient, sender_id, recipient_id
-			ORDER BY insertamum DESC
+				 ";
+		$sql = "
+			SELECT COUNT(*) AS count FROM (
+				" . $sql_base . "
+			) a
 				 ";

 		$parametersArray = array($person_id, $person_id);

-		return $this->execQuery($sql, $parametersArray);
+		$count = $this->execQuery($sql, $parametersArray);
+
+		if (isError($count))
+			return $count;
+
+		$count = floor(current(getData($count))->count/$limit);
+		$sql = "
+			SELECT * FROM (
+				" . $sql_base . "
+			) a
+			ORDER BY insertamum DESC
+			LIMIT ?
+			OFFSET ?
+				 ";
+
+		$parametersArray = array($person_id, $person_id, $limit, $offset);
+
+		$data = $this->execQuery($sql, $parametersArray);
+
+		if (isError($data))
+			return $data;
+
+		$data = getData($data);
+
+		return success(['data' => $data, 'count' => $count]);
 	}

 	/**
-	 * Deletes a messages from tableMessages and tbl_msg_recipient
-	 * TODO(MANU) CHECK IF NECESSARY
-	 * dependency with other tables
-	 * in case of reply... more messages?? delete all dependent ones?
-	 * maybe anonimize it
+	 * Deletes entry in dependency table tbl_msg_recipient
+	 *
 	 * @param $message_id
 	 * @return boolean success
 	 */
@@ -302,7 +330,12 @@ class Message_model extends DB_Model
 		return $this->execQuery($sql, array($message_id));
 	}

-
+	/**
+	 * Deletes entry in dependency table tbl_msg_status
+	 *
+	 * @param $message_id
+	 * @return boolean success
+	 */
 	public function deleteMessageStatus($message_id)
 	{
 		$sql = "
@@ -312,7 +345,12 @@ class Message_model extends DB_Model

 		return $this->execQuery($sql, array($message_id));
 	}
-
+	/**
+	 * Deletes entry in dependency table tbl_msg_message
+	 *
+	 * @param $message_id
+	 * @return boolean success
+	 */
 	public function deleteMessage($message_id)
 	{
 		$sql = "
@@ -1,6 +1,7 @@
 export default {
-	getMessages(url, config, params){
-		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMessages/' + params.id + '/' + params.type);
+	getMessages(url, config, params) {
+		console.log('page ' + params.page + ' size ' + params.size);
+		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMessages/' + params.id + '/' + params.type + '/' + params.size + '/' + params.page);
 	},
 	getVorlagen(){
 		return this.$fhcApi.get('api/frontend/v1/messages/messages/getVorlagen/');
@@ -8,8 +9,8 @@ export default {
 	getMsgVarsLoggedInUser(){
 		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMsgVarsLoggedInUser/');
 	},
-	getMessageVarsPerson(){
-		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMessageVarsPerson/');
+	getMessageVarsPerson(params){
+		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMessageVarsPerson/' + params.id + '/' + params.type_id);
 	},
 	getMsgVarsPrestudent(params){
 		return this.$fhcApi.get('api/frontend/v1/messages/messages/getMsgVarsPrestudent/' + params.id + '/' + params.type_id);
@@ -34,9 +35,14 @@ export default {
 		return this.$fhcApi.get('api/frontend/v1/messages/messages/getReplyData/' + messageId);
 	},
 	sendMessage(form, id, data) {
+		console.log("id" + id);
 		return this.$fhcApi.post(form,'api/frontend/v1/messages/messages/sendMessage/' + id,
 			data);
 	},
+/*	sendMessage(id, data) {
+		return this.$fhcApi.post('api/frontend/v1/messages/messages/sendMessage/' + id,
+			data);
+	},*/
 	deleteMessage(messageId){
 		return this.$fhcApi.post('api/frontend/v1/messages/messages/deleteMessage/' + messageId);
 	}
@@ -22,19 +22,25 @@ export default {
 			type: [Number, String],
 			required: true
 		},
+		messageId: {
+			type: Number,
+			required: false,
+		},
 		openMode: String,
 	},
 	data(){
 		return {
 			formData: {
-				recipient: this.id,
+				recipient: null,
 				subject: null,
 				body: null,
 				vorlage_kurzbz: null,
 				selectedValue: '',
+				relationmessage_id: null
 			},
 			statusNew: true,
 			vorlagen: [],
+			recipientsArray: [],
 			defaultRecipient: null,
 			editor: null,
 			fieldsUser: [],
@@ -47,7 +53,9 @@ export default {
 			itemsPerson: [],
 			itemsUser: [],
 			previewText: null,
-			previewBody: ""
+			previewBody: "",
+			replyData: null,
+			uid: null,
 		}
 	},
 	methods: {
@@ -98,12 +106,14 @@ export default {

 			return this.$fhcApi.factory.messages.person.sendMessage(
 				this.$refs.formMessage,
-				this.id,
+				this.uid,
 				data)
+/*			return this.$fhcApi.factory.messages.person.sendMessage(
+				this.uid,
+				data)*/
 				.then(response => {
 					this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSent'));
-					//this.hideModal('messageModal');
-					this.hideTemplate();
+					this.hideModal('modalNewMessage');
 					this.resetForm();
 				}).catch(this.$fhcAlert.handleSystemError)
 				.finally(() => {
@@ -119,7 +129,7 @@ export default {
 			return this.$fhcApi.factory.messages.person.getVorlagentext(vorlage_kurzbz)
 				.then(response => {
 					//this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSent'));
-					//this.hideModal('messageModal');
+					//this.hideModal('modalNewMessage');
 					//this.resetForm();
 					//TODO(Manu) CHECK
 					this.formData.body = response.data;
@@ -165,20 +175,22 @@ export default {
 				console.error("Editor instance is not available.");
 			}
 		},
-		replyMessage(message_id){
-			console.log("auf message " + message_id + " antworten");
-		},
 		resetForm(){
 			this.formData = {
 				vorlage_kurzbz: null,
 				body: null,
 				subject: null,
 			};
+			this.$emit('resetMessageId');
+
 			if (this.editor) {
 				this.editor.setContent("");
 			}
+
 			this.$refs.dropdownComp.setValue(null);

+			this.previewBody = null;
+
 		},
 		handleSelectedVorlage(vorlage_kurzbz) {
 			if (typeof vorlage_kurzbz === "string") {
@@ -186,22 +198,28 @@ export default {
 				this.formData.subject = vorlage_kurzbz;
 			}
 		},
-		hideTemplate(){
-			if (this.openMode == "showDiv")
-				this.isVisible = false;
-		},
-		showTemplate(){
-			if (this.openMode == "showDiv")
-				this.isVisible = true;
-		},
 		showPreview(){
 			this.getPreviewText().then(() => {
 				this.previewBody = this.previewText;
 			});
 		},
+		getUid(id, typeId){
+			const params = {
+				id: id,
+				type_id: typeId
+			};
+			this.$fhcApi.factory.messages.person.getUid(params)
+				.then(result => {
+					this.uid = result.data;
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+		},
 		show(){
 			this.$refs.modalNewMessage.show();
-		}
+		},
+		hideModal(modalRef){
+			this.$refs[modalRef].hide();
+		},
 	},
 	watch: {
 		'formData.body': {
@@ -223,11 +241,37 @@ export default {
 					return this.getVorlagentext(newVal);
 				}
 			}
+		},
+		messageId: {
+			immediate: true,
+			handler: async function (newMessageId) {
+				if (!newMessageId) return;
+
+				try {
+					const result = await this.$fhcApi.factory.messages.person.getReplyData(newMessageId);
+					this.replyData = result.data;
+					console.log(this.replyData);
+
+					if (this.replyData.length > 0) {
+						this.formData.subject = this.replyData[0].replySubject;
+						this.formData.body = this.replyData[0].replyBody;
+						this.formData.relationmessage_id = newMessageId;
+					}
+				} catch (error) {
+					this.$fhcAlert.handleSystemError(error);
+				}
+			}
 		}
 	},
 	created(){
-		if(this.typeId == 'person_id'){
-			this.$fhcApi.factory.messages.person.getMessageVarsPerson()
+		this.getUid(this.id, this.typeId);
+
+		if(this.typeId == 'person_id' || this.typeId == 'mitarbeiter_uid'){
+			const params = {
+				id: this.id,
+				type_id: this.typeId
+			};
+			this.$fhcApi.factory.messages.person.getMessageVarsPerson(params)
 				.then(result => {
 					this.fieldsPerson = result.data;
 					this.itemsPerson = Object.entries(this.fieldsPerson).map(([key, value]) => ({
@@ -237,16 +281,16 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		}
-		if(this.typeId == 'uid') {
-			this.$fhcApi.factory.messages.person.getMsgVarsPrestudent(this.id)
+
+		if(this.typeId == 'prestudent_id' || this.typeId == 'uid'){
+			const params = {
+				id: this.id,
+				type_id: this.typeId
+			};
+			this.$fhcApi.factory.messages.person.getMsgVarsPrestudent(params)
 				.then(result => {
 					this.fieldsPrestudent = result.data;
 					const prestudent = this.fieldsPrestudent[0];
-					//Just for testing with inserting values
-					/*					this.itemsPrestudent = Object.entries(prestudent).map(([key, value]) => ({
-											label: key,
-											value: value
-										}));*/
 					this.itemsPrestudent = Object.entries(prestudent).map(([key, value]) => ({
 						label: key.toLowerCase(),
 						value: '{' + key.toLowerCase() + '}'
@@ -271,8 +315,25 @@ export default {
 			type_id: this.typeId})
 			.then(result => {
 				this.defaultRecipient = result.data;
+			//	console.log("check " + this.uid + "|" + this.defaultRecipient);
+				this.recipientsArray.push({
+					'uid': this.uid,
+					'details': this.defaultRecipient});
+			//	console.log(JSON.stringify(this.recipientsArray));
 			})
 			.catch(this.$fhcAlert.handleSystemError);
+
+		//case of reply
+		if(this.messageId) {
+			this.$fhcApi.factory.messages.person.getReplyData(this.messageId)
+				.then(result => {
+					this.replyData = result.data;
+					this.formData.subject = this.replyData[0].replySubject;
+					this.formData.body = this.replyData[0].replyBody;
+					this.formData.relationmessage_id = this.messageId;
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+		}
 	},
 	async mounted() {
 		this.initTinyMCE();
@@ -281,10 +342,15 @@ export default {
 		this.editor.destroy();
 	},
 	template: `
-		<bs-modal class="messages-detail-newmessage-modal" ref="modalNewMessage" dialog-class="modal-xl">
+		<bs-modal
+			class="messages-detail-newmessage-modal"
+			ref="modalNewMessage" 
+			dialog-class="modal-xl"
+			@hidden.bs.modal="resetForm"
+			>

 			<template #title>
-				New Message
+				{{ $p.t('messages', 'neueNachricht') }}
 			</template>

 			<form-form ref="formNewMassage">
@@ -296,7 +362,6 @@ export default {
 					<div class="col-sm-8">
 						<form-form class="row g-3 mt-2" ref="formMessage">

-						<!--TODO(Manu) ist eigentlich ein Array, hier werden alle Einträge angegeben als String-->
 							<div class="row mb-3">

 								<form-input
@@ -348,7 +413,7 @@ export default {

 					<div class="col-sm-4">
 						<div v-if="this.fieldsPrestudent.length > 0">
-							<strong>Felder Prestudent</strong>
+							<strong>{{$p.t('ui', 'felder')}} {{$p.t('lehre', 'prestudent')}}</strong>
 							<div class="border p-3 overflow-auto" style="height: 200px;">

 								<list-box
@@ -365,9 +430,6 @@ export default {

 							</div>

-							<button class="m-3" @click="insertVariablePrestudent">Insert Variable</button>
-							<p>{{selectedFieldPrestudent}}</p>
-
 						</div>

 						<div v-if="this.fieldsPerson.length > 0">
@@ -387,12 +449,10 @@ export default {
 								</list-box>

 							</div>
-							<button class="m-3" @click="insertVariablePerson">Insert Variable</button>
-							<p>{{selectedFieldPerson}}</p>
 						</div>

 						<div>
-							<strong>Meine Felder</strong>
+							<strong>{{$p.t('messages', 'meineFelder')}}</strong>
 							<div class="border p-3 overflow-auto" style="height: 200px;">

 								<list-box
@@ -408,7 +468,6 @@ export default {
 								</list-box>

 							</div>
-							<button class="m-3" @click="insertVariableUser">Insert Variable</button>
 						</div>

 					</div>
@@ -417,7 +476,7 @@ export default {

 				<div class="row mt-4">

-					<h4>Vorschau:</h4>
+					<h4>{{ $p.t('global', 'vorschau') }}:</h4>
 					<div>
 						<form-form class="row g-3 mt-2" ref="formPreview">

@@ -428,12 +487,19 @@ export default {
 									:label="$p.t('messages/recipient')"
 									v-model="defaultRecipient"
 								>
+									<option :value="null">{{ $p.t('messages', 'recipient') }}...</option>
+									<option
+										v-for="recipient in recipientsArray"
+										:key="recipient.uid"
+										:value="recipient.uid" 
+										>{{recipient.details}}
+									</option>
 								</form-input>
 							</div>

 							<div class="col-md-2 mt-4">
 								<br>
-								<button type="button" class="btn bt		n-secondary" @click="showPreview()">Aktualisieren</button>
+								<button type="button" class="btn btn-secondary" @click="showPreview()">{{ $p.t('ui', 'btnAktualisieren') }}</button>
 							</div>
 						</form-form>

@@ -454,7 +520,7 @@ export default {
 			<template #footer>
 				<div class="d-grid gap-2 d-md-flex justify-content-md-end">

-					<button class="btn btn-secondary" @click="resetForm">Reset All</button>
+					<button class="btn btn-secondary" @click="resetForm">{{$p.t('ui', 'reset')}}</button>

 					<button v-if="statusNew" type="button" class="btn btn-primary" @click="sendMessage()">{{$p.t('ui', 'nachrichtSenden')}}</button>
 					<button v-else type="button" class="btn btn-primary" @click="replyMessage(formData.message_id)">{{$p.t('global', 'reply')}}</button>
@@ -15,30 +15,27 @@ export default {
 			type: String,
 			required: true
 		},
-		//for open in div and modal
-/*		typeId: String,
-		id: {
-			type: [Number, String],
-			required: true
-		},*/
 		openMode: String,
+		tempTypeId: String,
+		tempId: {
+			type: [Number, String],
+			required: false
+		},
+		tempMessageId: {
+			type: Number,
+			required: false,
+		}
 	},
 	computed: {
-		//params with routes for new tab and new window AND props
-/*		id(){
-			return this.$route.params.id || this.id;
-		},
-		typeId(){
-			return this.$route.params.typeId || this.typeId;
-		},*/
+		//params with routes for new tab and new window AND props for inSamePage
 		id(){
-			return this.$route.params.id || this.$props.id;
+			return this.$props.tempId || this.$route.params.id;
 		},
 		typeId(){
-			return this.$route.params.typeId || this.$props.id;
+			return this.$props.tempTypeId || this.$route.params.typeId;
 		},
 		messageId(){
-			return this.$route.params.messageId;
+			return this.$props.tempMessageId ||this.$route.params.messageId;
 		}
 	},
 	data(){
@@ -178,12 +175,15 @@ export default {
 		insertVariable(selectedItem){
 			if (this.editor) {
 				this.editor.insertContent(selectedItem.value + " ");
+			//	this.editor.insertContent(selectedItem.value + ". ");
 				//TODO(Manu) check: Laden von Variblen geht nicht wenn kein Zeichen danach kommt
 				// nicht mal mit Punkt adden gehts ohne eintrag nach vars
-				/*				this.editor.focus();
-								this.editor.setDirty(true);*/
+								//this.editor.focus();
+							//	this.editor.setDirty(true);
+
+				this.editor.setDirty(true);//seting dirty true if changes appear
+			//	console.log(tinyMCE.activeEditor.isDirty());//dirty output  = true

-				//this.editor.fire('change'); //forces

 				//this.editor.undoManager.add();

@@ -219,14 +219,12 @@ export default {
 			}
 		},
 		hideTemplate(){
-			if (this.openMode == "showDiv")
+			if (this.openMode == "inSamePage")
 				this.isVisible = false;
 		},
 		showTemplate(){
-			if (this.openMode == "showDiv")
+			if (this.openMode == "inSamePage")
 				this.isVisible = true;
-			//just for testing:
-			this.isVisible = true;
 		},
 		showPreview(id, typeId){
 			this.getPreviewText(id, typeId).then(() => {
@@ -267,23 +265,26 @@ export default {
 		},
 	},
 	created(){
-		if(this.typeId != 'uid')
-			this.getUid(this.id, this.typeId);
+		this.getUid(this.id, this.typeId);

-		if(this.typeId == 'person_id'){
-			this.$fhcApi.factory.messages.person.getMessageVarsPerson()
-				.then(result => {
-					this.fieldsPerson = result.data;
-					this.itemsPerson = Object.entries(this.fieldsPerson).map(([key, value]) => ({
-						label: value,
-						value: '{' + value + '}'
-					}));
-				})
-				.catch(this.$fhcAlert.handleSystemError);
-		}
+		if (['person_id', 'mitarbeiter_uid'].includes(this.typeId)){
+				const params = {
+					id: this.id,
+					type_id: this.typeId
+				};
+				this.$fhcApi.factory.messages.person.getMessageVarsPerson(params)
+					.then(result => {
+						this.fieldsPerson = result.data;
+						this.itemsPerson = Object.entries(this.fieldsPerson).map(([key, value]) => ({
+							label: value,
+							value: '{' + value + '}'
+						}));
+					})
+					.catch(this.$fhcAlert.handleSystemError);
+			}

-		if(this.typeId == 'uid' || this.typeId == 'prestudent_id') {
-			const params = {
+		if (['prestudent_id', 'uid'].includes(this.typeId)){
+				const params = {
 				id: this.id,
 				type_id: this.typeId
 			};
@@ -291,11 +292,7 @@ export default {
 				.then(result => {
 					this.fieldsPrestudent = result.data;
 					const prestudent = this.fieldsPrestudent[0];
-					//Just for testing with inserting values
-					/*					this.itemsPrestudent = Object.entries(prestudent).map(([key, value]) => ({
-											label: key,
-											value: value
-										}));*/
+
 					this.itemsPrestudent = Object.entries(prestudent).map(([key, value]) => ({
 						label: key.toLowerCase(),
 						value: '{' + key.toLowerCase() + '}'
@@ -318,11 +315,11 @@ export default {
 		this.$fhcApi.factory.messages.person.getNameOfDefaultRecipient({
 			id: this.id,
 			type_id: this.typeId
-		})
-			.then(result => {
+		}).then(result => {
 				this.defaultRecipient = result.data;
-				this.recipientsArray.push({'uid': this.uid,
-											'details': this.defaultRecipient});
+				this.recipientsArray.push({
+					'uid': this.uid,
+					'details': this.defaultRecipient});
 			})
 			.catch(this.$fhcAlert.handleSystemError);

@@ -347,13 +344,13 @@ export default {
 	},
 	template: `

-	<div class="messages-detail-newmessage">
-			<!--passt für showdiv-->
+	<div class="messages-detail-newmessage-newdiv">
+			<!--passt für inSamePage-->
 <!--			<div class="overflow-auto" style="max-height: 500px; border: 1px solid #ccc;">-->

 			<!--new page-->
 			<div v-if="!messageSent" class="overflow-auto m-3">
-				<h4>New Message</h4>
+				<h4>{{ $p.t('messages', 'neueNachricht') }}</h4>

 				<div class="row">
 					<div class="col-sm-8">
@@ -411,7 +408,7 @@ export default {

 					<div class="col-sm-4">
 						<div v-if="this.fieldsPrestudent.length > 0"  class="mt-3">
-							<strong>Felder Prestudent</strong>
+							<strong>{{$p.t('ui', 'felder')}} {{$p.t('lehre', 'prestudent')}}</strong>
 							<div class="border p-3 overflow-auto" style="height: 250px;">

 								<list-box
@@ -453,7 +450,7 @@ export default {
 						</div>

 						<div>
-							<strong>Meine Felder</strong>
+							<strong>{{$p.t('messages', 'meineFelder')}}</strong>
 							<div class="border p-3 overflow-auto" style="height: 200px;">

 								<list-box
@@ -476,7 +473,7 @@ export default {

 						<div class="d-grid gap-2 d-md-flex justify-content-md-end">

-							<button class="btn btn-secondary" @click="resetForm">Reset All</button>
+							<button class="btn btn-secondary" @click="resetForm">{{$p.t('ui', 'reset')}}</button>

 							<button v-if="statusNew" type="button" class="btn btn-primary" @click="sendMessage()">{{$p.t('ui', 'nachrichtSenden')}}</button>
 							<button v-else type="button" class="btn btn-primary" @click="replyMessage(formData.message_id)">{{$p.t('global', 'reply')}}</button>
@@ -488,18 +485,19 @@ export default {

 				<div class="row mt-4">

-					<h4>Vorschau:</h4>
+					<h4>{{ $p.t('global', 'vorschau') }}:</h4>
 					<div>
+					
 						<form-form class="row g-3 mt-2" ref="formPreview">

-							<div class="col-sm-3 mb-3">
-							
+							<div class="col-sm-2 mb-3">
 								<form-input
 									type="select"
 									name="recipient"
 									:label="$p.t('messages/recipient')"
-									v-model="formData.recipient"
+									v-model="defaultRecipient"
 								>
+									<option :value="null">{{ $p.t('messages', 'recipient') }}...</option>
 									<option 
 										v-for="recipient in recipientsArray"
 										:key="recipient.uid" 
@@ -511,7 +509,7 @@ export default {

 							<div class="col-md-2 mt-4">
 								<br>
-								<button type="button" class="btn btn-secondary" @click="showPreview(formData.recipient,'uid')">Aktualisieren</button>
+								<button type="button" class="btn btn-secondary" @click="showPreview(id, typeId)">{{ $p.t('ui', 'btnAktualisieren') }}</button>
 							</div>
 						</form-form>

@@ -528,7 +526,7 @@ export default {
 		</div>
 		
 					
-		<div v-else class="container d-flex justify-content-center align-items-center m-3">
+		<div v-if="messageSent && openMode!='inSamePage'" class="container d-flex justify-content-center align-items-center m-3">
 			<div class="card" style="width: 80%">
 			  <div class="card-body alert alert-success text-dar p-5 rounded">
 						<div class="row">
@@ -37,7 +37,8 @@ export default {
 						type: this.typeId
 					};
 				},
-				ajaxResponse: (url, params, response) => this.buildTreemap(response.data),
+				ajaxResponse: (url, params, response) => this.buildTreemap(response),
+				//ajaxResponse: (url, params, response) => this.buildTreemap(response.data),
 				columns: [
 					{title: "subject", field: "subject"},
 					{title: "body", field: "body", visible: false},
@@ -66,25 +67,15 @@ export default {
 					{
 						title: "status",
 						field: "status",
-						formatter: function (cell) {
-							//TODO(Manu) get phrases in this context to work?
-
-							/*							const statusMap = {
-															0: this.$p.t('messsages', 'unread'),
-															1: this.$p.t('messsages', 'read'),
-															2: this.$p.t('messsages', 'archived'),
-															3: this.$p.t('messsages', 'deleted')
-														};*/
-							const statusMap = {
-								0: 'unread',
-								1: 'read',
-								2: 'archived',
-								3: 'deleted'
-							};
-							return statusMap[cell.getValue()];
-							// return this.$p.t('messsages', 'deleted');
+						formatterParams: [
+							"unread",
+							"read",
+							"archived",
+							"deleted"
+						],
+						formatter: (cell, formatterParams) => {
+							return formatterParams[cell.getValue()];
 						}
-
 					},
 					{
 						title: "letzte Änderung",
@@ -144,6 +135,9 @@ export default {
 				selectableRangeMode: 'click',
 				index: 'message_id',
 				pagination: true,
+				paginationMode: "remote",
+				paginationSize: 15,
+				paginationInitialPage: 1,
 				dataTree: true,
 				headerSort: true,
 				dataTreeChildField: "children",
@@ -188,6 +182,15 @@ export default {
 						cm.getColumnByField('statusdatum').component.updateDefinition({
 							title: this.$p.t('notiz', 'letzte_aenderung')
 						});
+						cm.getColumnByField('status').component.updateDefinition({
+							formatterParams: [
+								this.$p.t('messages/unread'),
+								this.$p.t('messages/read'),
+								this.$p.t('messages/archived'),
+								this.$p.t('messages/deleted')
+							]
+						});
+						this.$refs.table.tabulator.rowManager.getDisplayRows();
 						/*
 						cm.getColumnByField('actions').component.updateDefinition({
 						title: this.$p.t('global', 'aktionen')
@@ -204,62 +207,9 @@ export default {
 					}
 				},
 			],
-			tabulatorData: [],
 			previewBody: "",
 			open: false,
 			personId: null,
-			//Testdata
-/*			messages: [
-				{
-					message_id: 7,
-					subject: "Antwort auf 4",
-					body: "Text 5",
-					insertamum: "2024-03-05",
-					relationmessage_id: 6,
-				},
-				{
-					message_id: 1,
-					subject: "Hauptnachricht",
-					body: "Text 1",
-					insertamum: "2024-03-05",
-					relationmessage_id: null,
-				},
-				{
-					message_id: 2,
-					subject: "Antwort auf 1",
-					body: "Text 2",
-					insertamum: "2024-03-05",
-					relationmessage_id: 1,
-				},
-				{
-					message_id: 3,
-					subject: "Antwort auf 2",
-					body: "Text 3",
-					insertamum: "2024-03-05",
-					relationmessage_id: 2,
-				},
-				{
-					message_id: 4,
-					subject: "Neue Nachricht",
-					body: "Text 4",
-					insertamum: "2024-03-05",
-					relationmessage_id: null,
-				},
-				{
-					message_id: 5,
-					subject: "Antwort auf 4",
-					body: "Text 5",
-					insertamum: "2024-03-05",
-					relationmessage_id: 4,
-				},
-				{
-					message_id: 6,
-					subject: "Antwort auf 4",
-					body: "Text 5",
-					insertamum: "2024-03-05",
-					relationmessage_id: 5,
-				},
-			],*/
 		}
 	},
 	methods: {
@@ -283,13 +233,7 @@ export default {
 				});
 		},
 		actionNewMessage(){
-		//	this.$emit('newMessage', this.id, this.typeId);
-
-			//here already use person_id??
 			this.$emit('newMessage', this.id, this.typeId);
-
-			//console.log("action new message");
-
 		},
 		actionReplyToMessage(message_id){
 			this.$emit('replyToMessage', this.id, this.typeId, message_id);
@@ -298,6 +242,8 @@ export default {
 			this.$refs.table.reloadTable();
 		},
 		buildTreemap(messages) {
+			const last_page = messages.meta.count;
+			messages = messages.data;
 			const messageMap = new Map();
 			const messageNested = [];
 			const remainingMessages = new Set(messages);
@@ -334,7 +280,7 @@ export default {
 		// to avoid endless loop
 		if (iteration > messages.length) break;
 	}
-	return messageNested;
+	return {data: messageNested, last_page};
 }


@@ -360,7 +306,7 @@ export default {
 		});*/
 	},
 	created(){
-		if(this.typeId == 'uid' || this.typeId == 'prestudent_id') {
+		if(this.typeId != 'person_id') {
 			const params = {
 				id: this.id,
 				type_id: this.typeId
@@ -408,7 +354,7 @@ export default {
 		</div>

 		<!--View Infocenter-->
-		<!--TODO(Manu) update-->
+		<!--TODO(Manu) finish later -->
 		<div v-if="messageLayout=='listTableTop'">

 				<!--table-->
@@ -1,15 +1,19 @@
 import TableMessages from "./Details/TableMessages.js";
-import NewMessage from "./Details/NewMessage.js";
+//import NewMessage from "./Details/NewMessage.js";
 import FormOnly from "./Details/NewMessage/NewDiv.js";
 import FhcApi from "../../../../public/js/plugin/FhcApi.js";
 import Phrasen from "../../../../public/js/plugin/Phrasen.js";
+
+//TODO(Manu) Only if openMode == modal
+import MessageModal from "../Messages/Details/NewMessage/Modal.js";
 export default {
 	components: {
 		TableMessages,
-		NewMessage,
+	//	NewMessage,
 		FormOnly,
 		FhcApi,
-		Phrasen
+		Phrasen,
+		MessageModal
 	},
 	inject: {
 		cisRoot: {
@@ -21,12 +25,22 @@ export default {
 			type: String,
 			required: true
 		},
-		typeId: String,
+		typeId: {
+			type: String,
+			required: true,
+			validator(value) {
+				return [
+					'prestudent_id',
+					'uid',
+					'person_id',
+					'mitarbeiter_uid'
+				].includes(value)
+			}
+		},
 		id: {
 			type: [Number, String],
 			required: true
 		},
-		showNew: Boolean,
 		showTable: Boolean,
 		messageLayout: {
 			type: String,
@@ -40,45 +54,29 @@ export default {
 		},
 		openMode: {
 			type: String,
-			default: 'window',
+			default: 'modal',
 			validator(value) {
 				return [
 					'window',
 					'newTab',
 					'modal',
-					'showDiv'
+					'inSamePage'
 				].includes(value)
 			}
 		}
 	},
 	data() {
 		return {
-			showDiv: false
+			isVisibleDiv: false,
+			messageId: null
 		}
 	},
 	methods: {
 		reloadTable(){
-			console.log("in parent reload");
 			this.$refs.templateTableMessage.reload();
 		},
-		newMessage(id, typeId){
-			if (this.openMode == "window") {
-				this.openInNewWindow(id, typeId);
-			}
-			else if (this.openMode == "newTab"){
-				this.openInNewTab(id, typeId);
-			}
-			else if (this.openMode == "modal"){
-				this.openInModal(id, typeId);
-			}
-			else if (this.openMode == "showDiv"){
-				this.$refs.templateNewMessage.showTemplate(id, typeId);
-			}
-			else
-				console.log("no valid openMode");
-		},
 		handleMessage(id, typeId, messageId){
-			console.log("in handleMessage " + messageId);
+			this.messageId = messageId;
 			if (this.openMode == "window") {
 				this.openInNewWindow(id, typeId, messageId);
 			}
@@ -86,32 +84,16 @@ export default {
 				this.openInNewTab(id, typeId, messageId);
 			}
 			else if (this.openMode == "modal"){
-				this.openInModal(id, typeId, messageId);
+				this.$refs.modalMsg.show();
 			}
-			else if (this.openMode == "showDiv"){
-				this.$refs.templateNewMessage.showTemplate(id, typeId, messageId);
+			else if (this.openMode == "inSamePage"){
+				this.isVisibleDiv = true;
 			}
 			else
 				console.log("no valid openMode");
 		},
-		openInDiv(id, typeId){
-			this.$refs.templateNewMessage.showTemplate(id, typeId);
-			//this.showDiv = true; //local variante
-			//this.$refs.templateNewMessage.showTemplate();
-		},
-		openInModal(id, typeId){
-			//TODO(manu) define bs-modal in this component
-			this.$refs.templateNewMessage.$refs.modalMsg.show();
-		},
-/*		openInNewTab(id, typeId){
-			//TODO(MANU) check if array of ids...
-			let path = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router;
-			path += "/NeueNachricht/" + id + "/" + typeId;
+		openInNewTab(id, typeId, messageId= null){

-			const newTab = window.open(path, "_blank");
-		},*/
-		openInNewTab(id, typeId, messageId=null){
-			//TODO(MANU) check if array of ids...
 			let path = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router;

 			if (messageId){
@@ -124,12 +106,16 @@ export default {

 			const newTab = window.open(path, "_blank");
 		},
-		openInNewWindow(id, typeId){
-			//TODO(MANU) check if array of ids...
+		openInNewWindow(id, typeId, messageId){
 			let path = FHC_JS_DATA_STORAGE_OBJECT.app_root + FHC_JS_DATA_STORAGE_OBJECT.ci_router;
-			path += "/NeueNachricht/" + id + "/" + typeId;

-			const newTab = window.open(path, "_blank");
+			if (messageId){
+				path += "/NeueNachricht/" + id + "/" + typeId + "/" + messageId;
+			}
+
+			else {
+				path += "/NeueNachricht/" + id + "/" + typeId;
+			}

 			const width = Math.round(window.innerWidth * 0.75);
 			const height = Math.round(window.innerHeight * 0.75);
@@ -138,6 +124,9 @@ export default {

 			const newWindow = window.open(path, "_blank", `width=${width},height=${height},left=${left},top=${top}`);
 		},
+		resetMessageId(){
+			this.messageId = null;
+		}

 	},
 	template: `
@@ -147,31 +136,28 @@ export default {
 			ref="modalMsg"
 			:type-id="typeId"
 			:id="id"
+			:message-id="messageId"
 			:endpoint="endpoint"
 			:openMode="openMode"
 			@reloadTable="reloadTable"
+			@resetMessageId="resetMessageId"
 			>
 		</message-modal>
-
-<!--		<div>
-			<button class="btn btn-secondary m-1" @click="openInDiv(id,typeId)">Open in Div</button>
-			<button class="btn btn-secondary" @click="openInModal(id,typeId)">Open in Modal</button>
-			<button class="btn btn-secondary m-1" @click="openInNewTab(id,typeId)">Open in Tab</button>
-			<button class="btn btn-secondary" @click="openInNewWindow(id,typeId)">Open in Page</button>
-		</div>-->
-<!--	<p>endpoint Messages.js: {{endpoint}}</p>-->
-
-		<div v-if="showNew">
-			<new-message
+		
+		<!--in same page-->
+		<div v-if="isVisibleDiv">
+			<form-only
 				ref="templateNewMessage"
-				:type-id="typeId"
-				:id="id"
+				:temp-type-id="typeId"
+				:temp-id="id"
+				:temp-message-id="messageId"
 				:endpoint="endpoint"
 				:openMode="openMode"
 				@reloadTable="reloadTable"
 			>
-			</new-message>
+			</form-only>
 		</div>
+
 		
 		<div v-if="showTable">
 			<table-messages
@@ -181,27 +167,17 @@ export default {
 				:endpoint="endpoint"
 				:messageLayout="messageLayout"
 				:openMode="openMode"
-				@newMessage="newMessage"		
+				@newMessage="handleMessage"		
 				@replyToMessage="handleMessage"
-			>
-			
+			>		
 			</table-messages>
-
-			<!--working also with form_only-->
-			<div v-if="showDiv">
-				<form-only
-					ref="templateNewForm"
-					:type-id="typeId"
-					:id="id"
-					:endpoint="endpoint"
-					:openMode="openMode"
-					@reloadTable="reloadTable"
-				>
-				</form-only>
-			</div>
-
 		</div>
-		
+		<div v-else>
+			<div class="col-md-2 mt-4">
+				<br>
+				<button type="button" class="btn btn-primary" @click="handleMessage(id, typeId)">{{ $p.t('messages', 'neueNachricht') }}</button>
+			</div>
+		</div>
 	</div>
 	`

@@ -1,7 +1,4 @@
 import CoreMessages from "../../../Messages/Messages.js";
-//import CoreMessages from "@/Messages/Messages.js";
-
-//TODO(Manu) refactor props

 export default {
 	components: {
@@ -12,6 +9,32 @@ export default {
 	},
 	template: `
 	<div class="stv-details-messages h-100 pb-3 overflow-hidden">
+	
+
+<!--		<h3>Test Dominik Schneider</h3>
+		<core-messages
+			ref="formc"
+			endpoint="$fhcApi.factory.messages.person"
+			type-id="mitarbeiter_uid"
+			id="ma0130"
+			messageLayout="twoColumnsTableLeft"
+			show-table
+			open-mode="modal"
+			>
+		</core-messages>-->
+		
+<!--		<h3>Test Person fields</h3>
+		<core-messages
+			ref="formc"
+			endpoint="$fhcApi.factory.messages.person"
+			type-id="mitarbeiter_uid"
+			id="ma0130"
+			messageLayout="twoColumnsTableLeft"
+			show-table
+			open-mode="modal"
+			>
+		</core-messages>-->
+		
 	<template v-if="modelValue.prestudent_id">
 		<core-messages
 			ref="formc"
@@ -19,8 +42,8 @@ export default {
 			type-id="prestudent_id"
 			:id="modelValue.prestudent_id"
 			messageLayout="twoColumnsTableLeft"
+			open-mode="modal"
 			show-table
-			open-mode="newTab"
 			>
 		</core-messages>
 	</template>
@@ -37539,6 +37539,86 @@ array(
 			)
 		)
 	),
+	array(
+		'app' => 'core',
+		'category' => 'ui',
+		'phrase' => 'btnAktualisieren',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Aktualisieren',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Update',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
+	array(
+		'app' => 'core',
+		'category' => 'messages',
+		'phrase' => 'neueNachricht',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Neue Nachricht',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'New Message',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
+	array(
+		'app' => 'core',
+		'category' => 'messages',
+		'phrase' => 'meineFelder',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Meine Felder',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'My fields',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
+	array(
+		'app' => 'core',
+		'category' => 'ui',
+		'phrase' => 'reset',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Zurücksetzen',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Reset',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
 	/////////// FHC4 Phrases Messages END ///////////

 );