Refactor detailHeader component for PV21

- own css.file for fotouplad
- domain as prop
- refactor link to Leitung
- slots for issuetracking and tags
This commit is contained in:
ma0068
2025-10-13 16:07:51 +02:00
parent 3664428467
commit e9c039dad2
8 changed files with 38 additions and 44 deletions
@@ -209,7 +209,7 @@ class Mitarbeiter_model extends DB_Model
{
$qry = "
SELECT
titelpre, vorname, nachname, titelpost, foto, foto_sperre, person_id, alias, telefonklappe
titelpre, vorname, nachname, titelpost, foto, foto_sperre, person_id, alias, telefonklappe, personalnummer, mitarbeiter_uid
FROM
public.tbl_person
JOIN public.tbl_benutzer b USING(person_id)
+2 -1
View File
@@ -19,7 +19,8 @@
'public/css/components/vue-datepicker.css',
'public/css/components/primevue.css',
'public/css/Studentenverwaltung.css',
'public/css/components/function.css'
'public/css/components/function.css',
'public/css/components/Detailheader.css'
],
'customJSs' => [
'vendor/vuejs/vuedatepicker_js/vue-datepicker.iife.js'
+1
View File
@@ -18,6 +18,7 @@ $includesArray = array(
'public/css/components/vue-datepicker.css',
'public/css/components/primevue.css',
'public/css/Vertragsverwaltung.css',
'public/css/components/Detailheader.css'
],
'customJSs' => [
#'vendor/npm-asset/primevue/tree/tree.min.js',
-4
View File
@@ -158,8 +158,4 @@ html {
.tiny-90 div.tox.tox-tinymce {
height: 90% !important;
}
.foto-container:hover .fotoedit {
opacity: 1 !important;
}
-4
View File
@@ -18,7 +18,3 @@ html {
.vv {
margin-left: 0 !important;
}
.foto-container:hover .fotoedit {
opacity: 1 !important;
}
+3
View File
@@ -0,0 +1,3 @@
.foto-container:hover .fotoedit {
opacity: 1 !important;
}
@@ -7,12 +7,12 @@ export default {
components: {
ModalUploadFoto
},
inject: {
/* inject: {
domain: {
from: 'configDomain',
default: 'fhcomplete.info'
},
},
},*/
props: {
headerData: {
type: Object,
@@ -31,6 +31,10 @@ export default {
required: false,
default: false
},
domain: {
type: String,
required: true
},
typeHeader: {
type: String,
default: 'student',
@@ -54,14 +58,14 @@ export default {
},
created(){
if(this.person_id) {
this.loadHeaderData();
this.loadHeaderData(this.person_id, this.mitarbeiter_uid);
}
},
watch: {
person_id: {
handler(newVal) {
if (newVal) {
this.loadHeaderData();
this.loadHeaderData(newVal, this.mitarbeiter_uid);
}
},
deep: true,
@@ -76,9 +80,9 @@ export default {
};
},
methods: {
loadHeaderData(){
this.getHeader(this.person_id);
this.loadDepartmentData(this.mitarbeiter_uid)
loadHeaderData(person_id, mitarbeiter_uid){
this.getHeader(person_id);
this.loadDepartmentData(mitarbeiter_uid)
.then(() => {
// Call getLeitungOrg only after departmentData is loaded
this.getLeitungOrg(this.departmentData.oe_kurzbz);
@@ -112,11 +116,8 @@ export default {
})
.catch(this.$fhcAlert.handleSystemError);
},
redirectToLeitung(){
this.$emit('redirectToLeitung', {
person_id: this.leitungData.person_id,
uid: this.leitungData.uid
});
async goToLeitung() {
this.loadHeaderData(this.leitungData.person_id, this.leitungData.uid);
},
showModal(person_id){
this.$refs.modalFoto.open(person_id);
@@ -143,11 +144,11 @@ export default {
},
reload() {
if(this.person_id) {
this.loadHeaderData();
this.loadHeaderData(this.person_id, this.mitarbeiter_uid);
}
else {
/* else {
this.$emit('reload');
}
}*/
},
},
template: `
@@ -282,7 +283,7 @@ export default {
{{departmentData.bezeichnung}}
<span v-if="leitungData.uid"> | </span>
<strong v-if="leitungData.uid" class="text-muted">Vorgesetzte*r </strong>
<a href="#" @click.prevent="redirectToLeitung" >
<a href="#" @click.prevent="goToLeitung" >
{{leitungData.titelpre}} {{leitungData.vorname}} {{leitungData.nachname}}
</a>
<p>
@@ -297,25 +298,24 @@ export default {
</span>
<span v-if="headerDataMa?.telefonklappe" class="mb-2"> | <strong class="text-muted">DW </strong>{{headerDataMa?.telefonklappe}}</span>
</p>
<slot name="tag"></slot>
</div>
<div class="col-md-1 d-flex flex-column align-items-end justify-content-start ms-auto">
<div class="d-flex py-1">
<!-- TODO slots for Issue Tracking and Tags
<class="px-2">
<h4 class="mb-1">Issues<a class="refresh-issues" title="checkIssues Person" @click="checkPerson"><i class="fas fa-sync"></i></a></h4>
<h6 v-if="!isFetchingIssues" class="text-muted">122</h6>
</div> -->
<div class="px-2">
<h4 class="mb-1">PNr</h4>
<h6 class="text-muted">{{ headerDataMa?.person_id }}</h6>
</div>
<div class="px-2" style="border-left: 1px solid #EEE">
<h4 class="mb-1">UID</h4>
<h6 class="text-muted">{{ mitarbeiter_uid }}</h6>
</div>
<div class="px-2" style="min-width: 100px;">
<slot name="card"></slot>
</div>
<div class="px-2">
<h4 class="mb-1">PNr</h4>
<h6 class="text-muted">{{ headerDataMa?.personalnummer }}</h6>
</div>
<div class="px-2" style="border-left: 1px solid #EEE">
<h4 class="mb-1">UID</h4>
<h6 class="text-muted">{{ headerDataMa?.mitarbeiter_uid }}</h6>
</div>
</div>
</div>
</template>
</div>
@@ -37,10 +37,6 @@ export default {
this.mitarbeiter_uid = selection.uid;
this.person_id = selection.person_id;
},
redirectToLeitung(leitung){
this.person_id = leitung.person_id;
this.mitarbeiter_uid = leitung.uid;
}
},
template: `
<!-- Navigation component -->
@@ -60,11 +56,12 @@ export default {
<template #bottom>
<div class="col" v-if="person_id!=null">
<fhc-header
ref="CoreDetailsHeaderRef"
:person_id="person_id"
:mitarbeiter_uid="this.mitarbeiter_uid"
typeHeader="mitarbeiter"
:domain="config.domain"
fotoEditable
@redirectToLeitung="redirectToLeitung"
></fhc-header>
<vertraege-mitarbeiter
:endpoint="endpoint"