merge projektarbeit details & betreuer form and handle several UX changes regarding formData of both

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

@@ -90,6 +90,15 @@ class Projektarbeit extends FHCAPI_Controller
 
 		if (!isset($projektarbeit_id) || !is_numeric($projektarbeit_id)) return $this->terminateWithError('Projektarbeit Id missing', self::ERROR_TYPE_GENERAL);
 
+		$result = $this->fetchProjektarbeitByID($projektarbeit_id);
+
+		$data = $this->getDataOrTerminateWithError($result);
+
+		$this->terminateWithSuccess(current($data));
+	}
+	
+	private function fetchProjektarbeitById($projektarbeit_id) {
+		$this->ProjektarbeitModel->resetQuery();
 		$this->ProjektarbeitModel->addSelect(
 			'lehre.tbl_projektarbeit.projektarbeit_id, titel, titel_english, themenbereich, projekttyp_kurzbz, lehrveranstaltung_id, lehreinheit_id, 
 			firma_id, beginn, ende, gesperrtbis, note, final, freigegeben, tbl_projektarbeit.anmerkung, fa.name AS firma_name'
@@ -97,13 +106,10 @@ class Projektarbeit extends FHCAPI_Controller
 		$this->ProjektarbeitModel->addJoin('lehre.tbl_lehreinheit le', 'lehreinheit_id');
 		$this->ProjektarbeitModel->addJoin('lehre.tbl_lehrveranstaltung lv', 'lehrveranstaltung_id');
 		$this->ProjektarbeitModel->addJoin('public.tbl_firma fa', 'firma_id', 'LEFT');
-		$result = $this->ProjektarbeitModel->loadWhere(
+		return $this->ProjektarbeitModel->loadWhere(
 			array('projektarbeit_id' => $projektarbeit_id)
 		);
 
-		$data = $this->getDataOrTerminateWithError($result);
-
-		$this->terminateWithSuccess(current($data));
 	}
 
 	/**
@@ -132,7 +138,8 @@ class Projektarbeit extends FHCAPI_Controller
 		);
 
 		$data = $this->getDataOrTerminateWithError($result);
-
+		$data = $this->getDataOrTerminateWithError($this->fetchProjektarbeitById($data));
+		
 		$this->terminateWithSuccess($data);
 	}
 

public/css/Studentenverwaltung.css

@@ -281,3 +281,7 @@ html.fs_huge {
 }
 */
 /* slim ende */
+
+.fhc-xxl-modal {
+	min-width: 80vw;
+}

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

@@ -5,6 +5,7 @@ import PvAutoComplete from "../../../../../../../index.ci.php/public/js/componen
 import ApiStvProjektarbeit from '../../../../../api/factory/stv/projektarbeit.js';
 
 export default {
+	name: 'ProjektarbeitDetails',
 	components: {
 		FormForm,
 		FormInput,
@@ -110,6 +111,10 @@ export default {
 			this.formData.anmerkung = null;
 			this.$refs.formDetails.clearValidation();
 		},
+		setFormData(projektarbeit) {
+			this.formData = projektarbeit;
+			if (this.formData.firma_id) this.formData.firma = {firma_id: this.formData.firma_id, name: this.formData.firma_name};
+		},
 		getFormData(newProjektarbeit, studiensemester_kurzbz, additional_lehrveranstaltung_id) {
 
 			this.additional_lehrveranstaltung_id = additional_lehrveranstaltung_id;
@@ -148,8 +153,7 @@ export default {
 			return this.$api
 				.call(ApiStvProjektarbeit.loadProjektarbeit(projektarbeit_id))
 				.then(result => {
-					this.formData = result.data;
-					if (this.formData.firma_id) this.formData.firma = {firma_id: this.formData.firma_id, name: this.formData.firma_name};
+					this.setFormData(result.data)
 					return result;
 				})
 				.catch(this.$fhcAlert.handleSystemError)

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

@@ -9,6 +9,7 @@ import ProjektarbeitDetails from "./Details.js";
 import Projektbetreuer from "./Projektbetreuer.js";
 
 export default {
+	name: 'Projektarbeit',
 	components: {
 		CoreFilterCmpt,
 		BsModal,
@@ -213,17 +214,6 @@ export default {
 							});
 							container.append(button);
 
-							button = document.createElement('button');
-							button.className = 'btn btn-outline-secondary btn-action';
-							button.innerHTML = '<i class="fa fa-users"></i>';
-							button.title = this.$p.t('projektarbeit', 'betreuerBearbeiten');
-							button.addEventListener('click', (event) => {
-								let data = cell.getData();
-								this.editedProjektarbeit = data;
-								this.actionEditBetreuer();
-							});
-							container.append(button);
-
 							button = document.createElement('button');
 							button.className = 'btn btn-outline-secondary btn-action';
 							button.innerHTML = '<i class="fa fa-xmark"></i>';
@@ -264,6 +254,7 @@ export default {
 		actionEditProjektarbeit() {
 			this.statusNew = false;
 			this.toggleMenu('details');
+			this.$refs.projektbetreuer.getProjektbetreuer(this.editedProjektarbeit?.projektarbeit_id, this.editedProjektarbeit?.studiensemester_kurzbz);
 			this.$refs.projektarbeitModal.show();
 		},
 		actionEditBetreuer() {
@@ -280,9 +271,18 @@ export default {
 				.then(this.deleteProjektarbeit)
 				.catch(this.$fhcAlert.handleSystemError);
 		},
+		saveProjektarbeit() {
+			if(this.statusNew) this.addNewProjektarbeit()
+			else this.updateProjektarbeit()
+		},
 		addNewProjektarbeit() {
 			this.$refs.projektarbeitDetails.addNewProjektarbeit()
 				.then((result) => {
+					if(result?.data?.length) {
+						this.editedProjektarbeit = result.data[0]
+						this.$refs.projektarbeitDetails.setFormData(this.editedProjektarbeit)
+						this.toggleMenu('betreuer');
+					}
 					this.projektarbeitSaved();
 				})
 				.catch(this.$fhcAlert.handleSystemError);
@@ -308,7 +308,8 @@ export default {
 		projektarbeitSaved() {
 			this.reload();
 			this.$fhcAlert.alertSuccess(this.$p.t('ui', 'successSave'));
-			this.hideModal('projektarbeitModal');
+			if(!this.statusNew) this.hideModal('projektarbeitModal');
+			else this.statusNew = false
 		},
 		setDefaultStunden(projekttyp_kurzbz) {
 			this.$refs.projektbetreuer.setDefaultStunden(projekttyp_kurzbz);
@@ -321,22 +322,22 @@ export default {
 		},
 		toggleMenu(tabId) {
 			this.activeTab = tabId;
-			if (this.statusNew == false) {
-				switch(tabId) {
-					case 'details':
-						this.$refs.projektarbeitDetails.getFormData(
-							this.statusNew, this.editedProjektarbeit?.studiensemester_kurzbz, this.editedProjektarbeit?.lehrveranstaltung_id
-						);
-						this.$refs.projektarbeitDetails.loadProjektarbeit(this.editedProjektarbeit?.projektarbeit_id);
-						break;
-					case 'betreuer':
-						this.$refs.projektbetreuer.getFormData(
-							this.editedProjektarbeit ? this.editedProjektarbeit.projekttyp_kurzbz : null
-						);
-						this.$refs.projektbetreuer.getProjektbetreuer(this.editedProjektarbeit?.projektarbeit_id, this.editedProjektarbeit?.studiensemester_kurzbz);
-						break;
-				}
+			if (this.statusNew == false && tabId == 'details') {
+				
+				this.$refs.projektarbeitDetails.getFormData(
+					this.statusNew, this.editedProjektarbeit?.studiensemester_kurzbz, this.editedProjektarbeit?.lehrveranstaltung_id
+				);
+				this.$refs.projektarbeitDetails.loadProjektarbeit(this.editedProjektarbeit?.projektarbeit_id);
+			} else if(tabId == 'betreuer') {
+				this.$refs.projektbetreuer.getFormData(
+					this.editedProjektarbeit ? this.editedProjektarbeit.projekttyp_kurzbz : null
+				);
+				this.$refs.projektbetreuer.getProjektbetreuer(this.editedProjektarbeit?.projektarbeit_id, this.editedProjektarbeit?.studiensemester_kurzbz);
 			}
+		},
+		resetFormData() {
+			this.$refs.projektarbeitDetails.resetForm()
+			this.$refs.projektbetreuer.resetForm()
 		}
 	},
 	template: `
@@ -358,46 +359,29 @@ export default {
 		</core-filter-cmpt>
 
 		<!--Modal: projektarbeitModal-->
-		<bs-modal ref="projektarbeitModal" dialog-class="modal-xl modal-dialog-scrollable" header-class="flex-wrap pb-0">
+		<bs-modal ref="projektarbeitModal" :dialog-class="(statusNew ? 'modal-xl ' : 'fhc-xxl-modal ' ) + 'modal-dialog-scrollable'"
+		 	header-class="flex-wrap pb-0"
+		 	@hideBsModal="resetFormData"
+		 	>
 			<template #title>
 				<p v-if="statusNew" class="fw-bold mt-3">{{$p.t('projektarbeit', 'projektarbeitAnlegen')}}</p>
 				<p v-else class="fw-bold mt-3">{{$p.t('projektarbeit', 'projektarbeitBearbeiten')}}</p>
 			</template>
 
-			<template #modal-header-content v-if="!statusNew">
-				<ul class="nav nav-tabs w-100 mt-3 msg_preview" id="pa_tabs" role="tablist">
-					<li class="nav-item" role="presentation">
-						<button class="nav-link" :class="activeTab == 'details' ? 'active' : ''" id="details-tab" data-bs-toggle="tab" data-bs-target="#details" type="button" role="tab" aria-controls="details" aria-selected="true" @click="toggleMenu('details')">Details</button>
-					</li>
-					<li class="nav-item" role="presentation">
-						<button class="nav-link" :class="activeTab == 'betreuer' ? 'active' : ''" id="betreuer-tab" data-bs-toggle="tab" data-bs-target="#betreuer" type="button" role="tab" aria-controls="betreuer" aria-selected="false" @click="toggleMenu('betreuer')">{{$p.t('projektarbeit', 'betreuerGross')}}</button>
-					</li>
-				</ul>
-			</template>
-
-			<div class="tab-content" id="pa_content">
-				<div class="tab-pane fade show" :class="activeTab == 'details' ? 'active' : ''" id="details" role="tabpanel" aria-labelledby="details-tab">
-					<div class="row">
-						<div class="col-12">
-							<projektarbeit-details ref="projektarbeitDetails" :student="student" @projekttyp-changed="setDefaultStunden">
-							</projektarbeit-details>
-						</div>
-					</div>
+			<div class="row" >
+				<div :class="statusNew ? 'col-12' : 'col-6'">
+					<projektarbeit-details ref="projektarbeitDetails" :student="student" @projekttyp-changed="setDefaultStunden">
+					</projektarbeit-details>
 				</div>
 
-				<div class="tab-pane fade show" :class="activeTab == 'betreuer' ? 'active' : ''" id="betreuer" role="tabpanel" aria-labelledby="betreuer-tab">
-					<div class="row">
-						<div class="col-12">
-							<projektbetreuer ref="projektbetreuer" :config="config" @betreuer-saved="reload"></projektbetreuer>
-						</div>
-					</div>
+				<div :class="statusNew ? '' : 'col-6'" :style="statusNew ? 'display: none' : ''">
+					<projektbetreuer ref="projektbetreuer" :config="config" @betreuer-saved="reload"></projektbetreuer>
 				</div>
 			</div>
 
 			<template #footer>
-				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{$p.t('ui', 'abbrechen')}}</button>
-				<button v-if="statusNew" class="btn btn-primary" @click="addNewProjektarbeit()"> {{$p.t('ui', 'speichern')}}</button>
-				<button v-if="!statusNew && activeTab == 'details'" class="btn btn-primary" @click="updateProjektarbeit()"> {{$p.t('ui', 'speichern')}}</button>
+				<button type="button" class="btn btn-secondary" @click="resetFormData" data-bs-dismiss="modal">{{$p.t('ui', 'abbrechen')}}</button>
+				<button class="btn btn-primary" @click="saveProjektarbeit()"> {{$p.t('ui', 'speichern')}}</button>
 			</template>
 
 		</bs-modal>

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

@@ -10,6 +10,7 @@ import Vertrag from "./Vertrag.js";
 import ApiStvProjektbetreuer from '../../../../../api/factory/stv/projektbetreuer.js';
 
 export default {
+	name: 'Projektbetreuer',
 	components: {
 		CoreFilterCmpt,
 		BsModal,