From ddab42123b142f1f5b527b8ba58fde25fc6424e7 Mon Sep 17 00:00:00 2001 From: Simon Gschnell Date: Tue, 2 Jan 2024 12:50:04 +0100 Subject: [PATCH] refactores the modal out of the view into its own modal component --- application/controllers/Cis/Profil.php | 1 + public/js/apps/Cis/Profil.js | 8 +- public/js/components/Cis/Profil/EditProfil.js | 197 ++++++++++++++++++ .../Cis/Profil/MitarbeiterProfil.js | 191 ++++------------- .../components/Cis/Profil/ProfilEditModal.js | 61 ------ 5 files changed, 234 insertions(+), 224 deletions(-) create mode 100644 public/js/components/Cis/Profil/EditProfil.js delete mode 100644 public/js/components/Cis/Profil/ProfilEditModal.js diff --git a/application/controllers/Cis/Profil.php b/application/controllers/Cis/Profil.php index 323d6c3ea..687f2becc 100644 --- a/application/controllers/Cis/Profil.php +++ b/application/controllers/Cis/Profil.php @@ -96,6 +96,7 @@ class Profil extends Auth_Controller } //? status code 200 OK $update_res->code = 200; + $update_res->retval = $this->ProfilChangeModel->getTimestamp($this->uid)->change_timestamp; echo json_encode($update_res); } diff --git a/public/js/apps/Cis/Profil.js b/public/js/apps/Cis/Profil.js index c4d8aee3d..ba4443b69 100644 --- a/public/js/apps/Cis/Profil.js +++ b/public/js/apps/Cis/Profil.js @@ -97,13 +97,7 @@ const app = Vue.createApp({ } }, - getFormatedDate: function(date){ - return [ - date.getDate().toString().padStart(2,'0'), - (date.getMonth()+1).toString().padStart(2,'0'), - date.getFullYear(), - ].join('/'); - }, + }, created(){ diff --git a/public/js/components/Cis/Profil/EditProfil.js b/public/js/components/Cis/Profil/EditProfil.js new file mode 100644 index 000000000..84997caea --- /dev/null +++ b/public/js/components/Cis/Profil/EditProfil.js @@ -0,0 +1,197 @@ +import BsModal from "../../Bootstrap/Modal.js"; +import Alert from "../../Bootstrap/Alert.js"; +const infos = {}; + +export default { + components: { + BsModal, + Alert, + }, + mixins: [BsModal], + props: { + + value: Object, + + timestamp: Object, + /* + * NOTE(chris): + * Hack to expose in "emits" declared events to $props which we use + * in the v-bind directive to forward all events. + * @see: https://github.com/vuejs/core/issues/3432 + */ + onHideBsModal: Function, + onHiddenBsModal: Function, + onHidePreventedBsModal: Function, + onShowBsModal: Function, + onShownBsModal: Function, + }, + data() { + return { + editData: this.value, + editTimestamp: this.timestamp, + result: true, + info: null, + } + + }, + methods: { + test(){ + console.log("test"); + }, + submitProfilChange(){ + + if(this.isEditDataChanged){ + //? inserts new row in public.tbl_cis_profil_update + Vue.$fhcapi.UserData.editProfil(this.editData).then((res)=>{ + this.result = { + editData: this.editData, + timestamp: res.data.retval, + }; + this.hide(); + + 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{ + Alert.popup("Ein Fehler ist aufgetreten: "+ JSON.stringify(res.data.retval)); + } + // + }); + + } + }, + }, + computed: { + 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); + + /* + if (infos[this.lehrveranstaltung_id]) { + 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 = {})); + } */ + }, + mounted() { + this.modal = this.$refs.modalContainer.modal; + }, + popup(options) { + return BsModal.popup.bind(this)(null, options); + }, + template: ` + + + + + + + + `, +}; diff --git a/public/js/components/Cis/Profil/MitarbeiterProfil.js b/public/js/components/Cis/Profil/MitarbeiterProfil.js index 1234eeeff..1bad5f177 100644 --- a/public/js/components/Cis/Profil/MitarbeiterProfil.js +++ b/public/js/components/Cis/Profil/MitarbeiterProfil.js @@ -1,15 +1,14 @@ -import fhcapifactory from "../../../apps/api/fhcapifactory.js"; + import { CoreFilterCmpt } from "../../../components/filter/Filter.js"; -import BsModal from "../../Bootstrap/Modal.js"; -import Alert from "../../Bootstrap/Alert.js"; +import EditProfil from "./EditProfil.js" + export default { components: { CoreFilterCmpt, - BsModal, - Alert, + EditProfil, }, data() { return { @@ -124,57 +123,36 @@ export default { props: { data: Object, - /* - * NOTE(chris): - * Hack to expose in "emits" declared events to $props which we use - * in the v-bind directive to forward all events. - * @see: https://github.com/vuejs/core/issues/3432 - - onHideBsModal: Function, - onHiddenBsModal: Function, - onHidePreventedBsModal: Function, - onShowBsModal: Function, - onShownBsModal: Function - */ + }, methods: { showModal() { - this.$refs.bsmodal.show() - }, - - hideModal() { - this.$refs.bsmodal.hide(); - }, - - - submitProfilChange(){ - if(this.isEditDataChanged){ - //? inserts new row in public.tbl_cis_profil_update - Vue.$fhcapi.UserData.editProfil(this.data.editData).then((res)=>{ - this.hideModal(); - if(res.data.error == 0){ - - //? sets the requested changes as the current data state, so that computed property isEditDataChanged works properly - this.originalEditData = JSON.stringify(this.data.editData); - console.log(this.originalEditData != JSON.stringify(this.data.editData)); - - //* sets the returned timestamp from the response - this.data.editDataTimestamp = res.data.retval? new Date(res.data.retval) : null; - Alert.popup("Ihre Anfrage wurde erfolgreich gesendet. Bitte warten Sie, während sich das Team um Ihre Anfrage kümmert."); - }else{ - Alert.popup("Ein Fehler ist aufgetreten: "+ res.data.retval); + + EditProfil.popup({ + value:JSON.parse(JSON.stringify(this.data.editData)), + timestamp:this.data.editDataTimestamp + }).then((res) => { + if(res.timestamp && res.editData){ + this.data.editDataTimestamp = new Date(res.timestamp); + this.data.editData = res.editData; } - // + + }).catch((e) => { + console.log(e); + }); - } + }, + + + sperre_foto_function() { if (!this.data) { return; } - fhcapifactory.UserData.sperre_foto_function(!this.data.foto_sperre).then((res) => { + Vue.$fhcapi.UserData.sperre_foto_function(!this.data.foto_sperre).then((res) => { this.data.foto_sperre = res.data.foto_sperre; }); }, @@ -200,9 +178,7 @@ export default { }, - isEditDataChanged(){ - return this.originalEditData != JSON.stringify(this.data.editData) - }, + get_mitarbeiter_standort_telefon(){ if(this.data.standort_telefon){ @@ -288,20 +264,16 @@ export default { - if(this.data.editData){ - this.originalEditData = JSON.stringify(this.data.editData); - }else{ - //? storing an original version of the editData to check if the editData was changed by the user and is not in the original state - this.originalEditData = JSON.stringify( - { - Personen_Informationen : {...this.personData, vorname: this.data.vorname, nachname: this.data.nachname}, - Mitarbeiter_Informatinen: this.specialData, - Emails:this.data.emails, - Private_Kontakte: this.data.kontakte, - Private_Adressen:this.privateAdressen, - }); + if(!this.data.editData){ + - this.data.editData = JSON.parse(this.originalEditData); + this.data.editData = { + Personen_Informationen : {...this.personData, vorname: this.data.vorname, nachname: this.data.nachname}, + Mitarbeiter_Informatinen: this.specialData, + Emails:this.data.emails, + Private_Kontakte: this.data.kontakte, + Private_Adressen:this.privateAdressen, + }; } }, @@ -323,8 +295,6 @@ export default { template: ` -
{{JSON.stringify(JSON.parse(originalEditData),null,2)}}
{{JSON.stringify(data.editData,null,2)}}
-

{{isEditDataChanged}}

@@ -531,95 +501,7 @@ export default {
- - - - - - - + @@ -853,12 +735,9 @@ export default {
-
-
Funktionen
-
+ -
-
+
diff --git a/public/js/components/Cis/Profil/ProfilEditModal.js b/public/js/components/Cis/Profil/ProfilEditModal.js deleted file mode 100644 index 4813e2d3b..000000000 --- a/public/js/components/Cis/Profil/ProfilEditModal.js +++ /dev/null @@ -1,61 +0,0 @@ - -export default { - - data() { - return { - - - }; - }, - - - props: ["editData"], - methods: { - - }, - - computed: { - - - - - }, - - mounted() { - console.log(this.editData); - - - }, - - template: ` - - - - - - - - `, - }; - - - - - -