changing the editProfil Modal from an Accordion to a select

This commit is contained in:
SimonGschnell
2024-01-08 15:19:18 +01:00
parent e479a7aa49
commit 5b597dbc31
10 changed files with 227 additions and 124 deletions
+21 -18
View File
@@ -71,35 +71,38 @@ class Profil extends Auth_Controller
{
$json = $this->input->raw_input_stream;
$data = ["uid" => $this->uid, "profil_changes" => $json, "change_timestamp" => "NOW()"];
$data = ["uid" => $this->uid, "requested_change" => $json, "change_timestamp" => "NOW()"];
$res = $this->ProfilChangeModel->load([$this->uid]);
//? gets all the requested changes from a user
$res = $this->ProfilChangeModel->loadWhere(["uid"=>$this->uid]);
$res = hasData($res) ? getData($res) : null;
if (empty($res)) {
$insert_res = $this->ProfilChangeModel->insert($data);
if(isError($insert_res)){
//catch error
}else{
$editTimestamp = $this->ProfilChangeModel->getTimestamp($this->uid);
//? status code 201 CREATED
$insert_res->code = 201;
$insert_res->retval = date_create($editTimestamp)->format('d/m/Y');
$editTimestamp = $this->ProfilChangeModel->getTimestamp($insert_res->retval);
$insert_res->retval = date_create($editTimestamp)->format('d.m.Y');
echo json_encode($insert_res);
}
/* if (empty($res)) {
} else {
$update_res = $this->ProfilChangeModel->update([$this->uid], $data);
if(isError($update_res)){
//catch error
}
$editTimestamp = $this->ProfilChangeModel->getTimestamp($this->uid);
//? status code 200 OK
$update_res->code = 200;
$update_res->retval = date_create($editTimestamp)->format('d/m/Y');;
$update_res->retval = date_create($editTimestamp)->format('d.m.Y');;
echo json_encode($update_res);
}
} */
@@ -502,12 +505,12 @@ class Profil extends Auth_Controller
//? querying if the user already has a pending profil information update request
$editData_res = $this->ProfilChangeModel->load([$this->uid]);
/* $editData_res = $this->ProfilChangeModel->load([$this->uid]);
if(isError($editData_res)){
//error handling
}else{
$editData_res = hasData($editData_res) ? getData($editData_res)[0] : null;
}
} */
$res = new stdClass();
$res->foto = $person_res->foto;
@@ -548,9 +551,9 @@ class Profil extends Auth_Controller
//telefon nummer von dem Standort
$res->standort_telefon = $telefon_res;
$res->editData = $editData_res? json_decode($editData_res->profil_changes): null;
/* $res->editData = $editData_res? json_decode($editData_res->profil_data): null;
$res->editDataTimestamp = $editData_res? date_create($editData_res->change_timestamp)->format('d/m/Y') : null;
*/
return $res;
}
@@ -705,12 +708,12 @@ class Profil extends Auth_Controller
}
//? querying if the user already has a pending profil information update request
$editData_res = $this->ProfilChangeModel->load([$this->uid]);
/* $editData_res = $this->ProfilChangeModel->load([$this->uid]);
if(isError($editData_res)){
//error handling
}else{
$editData_res = hasData($editData_res) ? getData($editData_res)[0] : null;
}
} */
$res = new stdClass();
@@ -749,9 +752,9 @@ class Profil extends Auth_Controller
$res->mailverteiler = $mailverteiler_res;
$res->editData = $editData_res? json_decode($editData_res->profil_changes): null;
/* $res->editData = $editData_res? json_decode($editData_res->profil_data): null;
$res->editDataTimestamp = $editData_res? date_create($editData_res->change_timestamp)->format('d/m/Y'): null;
*/
return $res;
@@ -9,8 +9,8 @@ class Profil_change_model extends DB_Model
{
parent::__construct();
$this->dbTable = 'public.tbl_cis_profil_update';
$this->pk = ['uid'];
$this->hasSequence = false;
$this->pk = ['profil_update_id'];
$this->hasSequence = true;
}
+73 -86
View File
@@ -27,10 +27,17 @@ export default {
},
data() {
return {
selection: null,
propertySelection:true,
selectedProperty:null,
inputField:null,
detailSelection:false,
editData: this.value,
//? tracks what specific profil data was changed
changesData: {},
editTimestamp: this.timestamp,
selectionOrder: {firstSelect: true, secondSelect:false},
result: true,
info: null,
}
@@ -38,6 +45,20 @@ export default {
},
methods: {
formSelection: function(selection){
if(Array.isArray(selection)){
return ['a','b'];
}else if(typeof(selection) === 'object'){
console.log(selection);
return Object.keys(selection);
}else{
// it is not an array or and object
return null;
}
},
updateData: function(event,key,ArrayKey,ObjectKey=null){
@@ -88,18 +109,18 @@ export default {
},
submitProfilChange(){
if(this.isEditDataChanged){
//? inserts new row in public.tbl_cis_profil_update
Vue.$fhcapi.UserData.editProfil(this.editData).then((res)=>{
Vue.$fhcapi.UserData.editProfil(this.inputField).then((res)=>{
this.result = {
editData: this.editData,
timestamp: res.data.retval,
};
this.hide();
if(res.data.error == 0){
if(res.data.error == 0){
Alert.popup("Ihre Anfrage wurde erfolgreich gesendet. Bitte warten Sie, während sich das Team um Ihre Anfrage kümmert.");
}else{
@@ -108,24 +129,34 @@ export default {
//
});
}
},
},
computed: {
firstSelection(){
return Object.keys(this.value);
},
secondSelection(){
switch(this.selectedProperty){
case "Personen_Informationen": return Object.keys(this.editData[this.selectedProperty]);
case "Private_Kontakte": return this.editData[this.selectedProperty];
case "Private_Adressen": return this.editData[this.selectedProperty];
default: return [];
}
},
getFormatedDate: function(){
return [
this.editTimestamp.getDate().toString().padStart(2,'0'),
(this.editTimestamp.getMonth()+1).toString().padStart(2,'0'),
this.editTimestamp.getFullYear(),
].join('/');
},
isEditDataChanged(){
return this.originalEditData != JSON.stringify(this.editData)
},
},
created() {
this.originalEditData = JSON.stringify(this.editData);
/*
@@ -161,86 +192,42 @@ export default {
</template>
<template v-slot:default>
<select v-if="!selectedProperty" class="form-select" size="3" aria-label="size 3 select example">
<option @click="selectedProperty=option; " v-for="option in firstSelection" :value="option">{{option}}</option>
</select>
<select v-if="selectedProperty && !inputField" class="form-select" size="3" aria-label="size 3 select example">
<option @click="
if(Array.isArray(editData[selectedProperty])){
inputField=option
}else{
inputField={[option]:editData[selectedProperty][option]};
}" v-for="option in secondSelection" :value="option"><div v-if="typeof(option)==='object'"><p v-for="(value,property) in option">{{property}}:{{value}}</p></div><template v-else>{{option}}</template></option>
</select>
<div v-if="inputField">
<div v-for="(field,index) in inputField">
<div class="form-underline">
<div class="form-underline-titel">{{index}}</div>
<input class="form-control" :id="index" v-model="inputField[index]" :placeholder="field">
</div>
</div>
</div>
<!-- START OF THE ACCORDION
-->
<pre>{{JSON.stringify(changesData,null,2)}}</pre>
<div class="accordion accordion-flush" id="accordionFlushExample" >
<div class="accordion-item" v-for="(value,key) in editData ">
<h2 class="accordion-header" :id="'flush-headingOne'+key">
<button style="font-weight:500" class="accordion-button collapsed" type="button" data-bs-toggle="collapse" :data-bs-target="'#flush-collapseOne'+key" aria-expanded="false" :aria-controls="'flush-collapseOne'+key">
{{key.replace("_"," ")}}
</button>
</h2>
<!-- SHOWING ALL MAILS IN THE FIRST PART OF THE ACCORDION -->
<div :id="'flush-collapseOne'+key" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
<div class="accordion-body">
<div v-if="Array.isArray(value)" class="row gy-5">
<template v-for="(object,objectKey) in value" >
<div class="col-12 ">
<div class="row gy-3">
<div v-for="(propertyValue,propertyKey) in object" class="col-6" >
<div class="form-underline ">
<div class="form-underline-titel">
<label :for="propertyKey+'input'" >{{propertyKey}}</label>
</div>
<div>
<input class="form-control" :id="propertyKey+'input'" :value="editData[key][objectKey][propertyKey]" @input="updateData($event,key,objectKey,propertyKey)" :placeholder="propertyValue">
</div>
</div>
</div>
</div>
</div>
<hr class="mb-0" v-if="value[value.length-1] != object">
</template>
</div>
<div v-else class="row gy-3">
<div v-for="(propertyValue,propertyKey) in value" class="col-6">
<div class="form-underline ">
<div class="form-underline-titel">
<label :for="propertyKey+'input'" >{{propertyKey}}</label>
</div>
<div>
<input type="email" class="form-control" :id="propertyKey+'input'" :value="editData[key][propertyKey]" @input="updateData($event,key,propertyKey)" :placeholder="propertyValue">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<!-- END OF THE ACCORDION -->
</template>
<!-- optional footer -->
<template v-if="editTimestamp || isEditDataChanged" v-slot:footer>
<template v-slot:footer>
<p v-if="editTimestamp" class="flex-fill">Letzte Anfrage: {{editTimestamp}}</p>
<button v-if="isEditDataChanged" @click="submitProfilChange" role="button" class="btn btn-primary">Senden</button>
<button @click="submitProfilChange" role="button" class="btn btn-primary">Senden</button>
</template>
<!-- end of optional footer -->
</bs-modal>`,
@@ -266,8 +266,13 @@ export default {
this.data.editData = {
Personen_Informationen : {...this.personData, vorname: this.data.vorname, nachname: this.data.nachname},
Mitarbeiter_Informationen: this.specialData,
Emails:this.data.emails,
Private_Kontakte: this.data.kontakte,
Private_Adressen:this.privateAdressen,
};
}else{
this.data.editData = {
Personen_Informationen : {...this.personData, vorname: this.data.vorname, nachname: this.data.nachname},
Private_Kontakte: this.data.kontakte,
Private_Adressen:this.privateAdressen,
};
@@ -317,7 +322,7 @@ export default {
<a href="#" class="list-group-item list-group-item-action">Zeitwünsche</a>
<a href="#" class="list-group-item list-group-item-action">Lehrveranstaltungen</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren von Gschnell</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren</a>
</div>
</div>
</div>
@@ -778,7 +783,7 @@ export default {
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitwuensche</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Lehrveranstaltungen</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren von Gschnell</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren</a>
</div>
</div>
@@ -176,7 +176,7 @@ export default {
<a href="#" class="list-group-item list-group-item-action">Zeitwünsche</a>
<a href="#" class="list-group-item list-group-item-action">Lehrveranstaltungen</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren von Gschnell</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren</a>
</div>
</div>
</div>
@@ -495,7 +495,7 @@ export default {
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitwuensche</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Lehrveranstaltungen</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren von Gschnell</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren</a>
</div>
</div>
@@ -189,7 +189,7 @@ export default {
<a href="#" class="list-group-item list-group-item-action">Zeitwünsche</a>
<a href="#" class="list-group-item list-group-item-action">Lehrveranstaltungen</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren von Gschnell</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren</a>
</div>
</div>
</div>
@@ -623,7 +623,7 @@ export default {
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitwuensche</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Lehrveranstaltungen</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren von Gschnell</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren</a>
</div>
</div>
@@ -103,7 +103,7 @@ export default {
<a href="#" class="list-group-item list-group-item-action">Zeitwünsche</a>
<a href="#" class="list-group-item list-group-item-action">Lehrveranstaltungen</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren von Gschnell</a>
<a href="#" class="list-group-item list-group-item-action ">Zeitsperren</a>
</div>
</div>
</div>
@@ -406,7 +406,7 @@ export default {
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitwuensche</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Lehrveranstaltungen</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren von Gschnell</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">Zeitsperren</a>
</div>
</div>
@@ -0,0 +1,72 @@
<!-- START OF THE ACCORDION
<pre>{{JSON.stringify(changesData,null,2)}}</pre>
<div class="accordion accordion-flush" id="accordionFlushExample" >
<div class="accordion-item" v-for="(value,key) in editData ">
<h2 class="accordion-header" :id="'flush-headingOne'+key">
<button style="font-weight:500" class="accordion-button collapsed" type="button" data-bs-toggle="collapse" :data-bs-target="'#flush-collapseOne'+key" aria-expanded="false" :aria-controls="'flush-collapseOne'+key">
{{key.replace("_"," ")}}
</button>
</h2>
<!-- SHOWING ALL MAILS IN THE FIRST PART OF THE ACCORDION -->
<div :id="'flush-collapseOne'+key" class="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="#accordionFlushExample">
<div class="accordion-body">
<div v-if="Array.isArray(value)" class="row gy-3">
<template v-for="(object,objectKey) in value" >
<div class="card card-body col-12 ">
<div class="row gy-3">
<div v-for="(propertyValue,propertyKey) in object" class="col-6" >
<div class="form-underline ">
<div class="form-underline-titel">
<label :for="propertyKey+'input'" >{{propertyKey}}</label>
</div>
<div>
<input class="form-control" :id="propertyKey+'input'" :value="editData[key][objectKey][propertyKey]" @input="updateData($event,key,objectKey,propertyKey)" :placeholder="propertyValue">
</div>
</div>
</div>
</div>
</div>
</template>
</div>
<div v-else class="row gy-3">
<div v-for="(propertyValue,propertyKey) in value" class="col-6">
<div class="form-underline ">
<div class="form-underline-titel">
<label :for="propertyKey+'input'" >{{propertyKey}}</label>
</div>
<div>
<input type="email" class="form-control" :id="propertyKey+'input'" :value="editData[key][propertyKey]" @input="updateData($event,key,propertyKey)" :placeholder="propertyValue">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<!-- END OF THE ACCORDION -->
+3 -1
View File
@@ -49,6 +49,8 @@ require_once('dbupdate_3.4/29835_uhstat1_erfassung_der_uhstat1_daten_ueber_das_b
require_once('dbupdate_3.4/33714_erhoehter_studienbeitrag_fuer_drittsaatenangehoerig.php');
require_once('dbupdate_3.4/25999_C4_ma0594.php');
// *** Pruefung und hinzufuegen der neuen Attribute und Tabellen
echo '<H2>Pruefe Tabellen und Attribute!</H2>';
@@ -221,7 +223,7 @@ $tabellen=array(
"public.tbl_benutzerfunktion" => array("benutzerfunktion_id","fachbereich_kurzbz","uid","oe_kurzbz","funktion_kurzbz","semester", "datum_von","datum_bis", "updateamum","updatevon","insertamum","insertvon","ext_id","bezeichnung","wochenstunden"),
"public.tbl_benutzergruppe" => array("uid","gruppe_kurzbz","studiensemester_kurzbz","updateamum","updatevon","insertamum","insertvon","ext_id"),
"public.tbl_bewerbungstermine" => array("bewerbungstermin_id","studiengang_kz","studiensemester_kurzbz","beginn","ende","nachfrist","nachfrist_ende","anmerkung", "insertamum", "insertvon", "updateamum", "updatevon","studienplan_id","nationengruppe_kurzbz"),
"public.tbl_cis_profil_update" => array("uid","profil_changes","change_timestamp"),
"public.tbl_cis_profil_update" => array("profil_update_id","uid","requested_change","change_timestamp"),
"public.tbl_buchungstyp" => array("buchungstyp_kurzbz","beschreibung","standardbetrag","standardtext","aktiv","credit_points"),
"public.tbl_dokument" => array("dokument_kurzbz","bezeichnung","ext_id","bezeichnung_mehrsprachig","dokumentbeschreibung_mehrsprachig","ausstellungsdetails"),
"public.tbl_dokumentprestudent" => array("dokument_kurzbz","prestudent_id","mitarbeiter_uid","datum","updateamum","updatevon","insertamum","insertvon","ext_id"),
+41 -7
View File
@@ -1,17 +1,29 @@
<?php
if(!$result = @$db->db_query("SELECT 1 FROM public.tbl_cis_profil_update LIMIT 1"))
{
$qry = "CREATE TABLE public.tbl_cis_profil_update (
profil_update_id INTEGER NOT NULL,
uid VARCHAR(32) NOT NULL,
profil_changes jsonb NOT NULL,
requested_change jsonb NOT NULL,
change_timestamp TIMESTAMP NOT NULL,
CONSTRAINT tbl_cis_profil_update_pk PRIMARY KEY(uid),
CONSTRAINT tbl_cis_profil_update_pk PRIMARY KEY(profil_update_id),
CONSTRAINT tbl_cis_profil_update_fk FOREIGN KEY(uid) REFERENCES public.tbl_benutzer(uid)
);
CREATE SEQUENCE public.tbl_cis_profil_update_id_seq
INCREMENT BY 1
NO MAXVALUE
NO MINVALUE
CACHE 1;
ALTER TABLE public.tbl_cis_profil_update ALTER COLUMN profil_update_id SET DEFAULT nextval('public.tbl_cis_profil_update_id_seq');
GRANT SELECT, INSERT, UPDATE, DELETE ON public.tbl_cis_profil_update TO vilesci;
GRANT SELECT, INSERT, UPDATE, DELETE ON public.tbl_cis_profil_update TO web;";
GRANT SELECT, INSERT, UPDATE, DELETE ON public.tbl_cis_profil_update TO web;
GRANT SELECT, UPDATE ON public.tbl_cis_profil_update_id_seq TO vilesci;
GRANT SELECT, UPDATE ON public.tbl_cis_profil_update_id_seq TO web;";
if(!$db->db_query($qry))
echo '<strong>public.tbl_cis_profil_update: '.$db->db_last_error().'</strong><br>';
@@ -19,13 +31,35 @@
echo '<br>public.tbl_cis_profil_update: table created';
}
/* else{
$qry = "DROP TABLE public.tbl_cis_profil_update;";
if(!$db->db_query($qry))
echo '<strong> was not able to delete public.tbl_cis_profil_update: '.$db->db_last_error().'</strong><br>';
else
echo '<br>public.tbl_cis_profil_update: table deleted';
} */
if($db->db_num_rows($result)==0)
/* if($db->db_num_rows($result)==0)
{
$qry = "INSERT INTO public.tbl_cis_profil_update(uid, profil_changes, change_timestamp) VALUES('ma0594', '{\"test\":\"data\"}', NOW());";
$qry = "INSERT INTO public.tbl_cis_profil_update(uid, profil_data, profil_changes, change_timestamp) VALUES('ma0594','{\"test\":\"data\"}', NOW());";
if(!$db->db_query($qry))
echo '<strong>Prüfungstyp: '.$db->db_last_error().'</strong><br>';
else
echo '<br>test eintrag in public.tbl_cis_profil_update hinzugefügt';
}
} */
//! was used to add an extra column to the table after the table was already created
/*
if(!$result = @$db->db_query("SELECT profil_data FROM public.tbl_cis_profil_update LIMIT 1"))
{
$qry = "ALTER TABLE public.tbl_cis_profil_update ADD COLUMN profil_data jsonb;";
if(!$db->db_query($qry))
echo '<strong>public.tbl_cis_profil_update: '.$db->db_last_error().'</strong><br>';
else
echo '<br>public.tbl_cis_profil_update: Spalte profil_data hinzugefuegt';
} */