mirror of
https://github.com/FH-Complete/FHC-Core.git
synced 2026-07-26 00:54:27 +00:00
more template cleanup profil
This commit is contained in:
Johann Hoffmann
+350
-355
@@ -4,405 +4,400 @@ import ViewStudentProfil from "../../components/Cis/Profil/StudentViewProfil.js"
|
|||||||
import ViewMitarbeiterProfil from "../../components/Cis/Profil/MitarbeiterViewProfil.js";
|
import ViewMitarbeiterProfil from "../../components/Cis/Profil/MitarbeiterViewProfil.js";
|
||||||
import Loading from "../../components/Loader.js";
|
import Loading from "../../components/Loader.js";
|
||||||
import Phrasen from "../../plugin/Phrasen.js";
|
import Phrasen from "../../plugin/Phrasen.js";
|
||||||
import { setScrollbarWidth } from "../../helpers/CssVarCalcHelpers";
|
import {setScrollbarWidth} from "../../helpers/CssVarCalcHelpers";
|
||||||
|
|
||||||
|
|
||||||
Vue.$collapseFormatter = function (data) {
|
Vue.$collapseFormatter = function (data) {
|
||||||
//data - an array of objects containing the column title and value for each cell
|
//data - an array of objects containing the column title and value for each cell
|
||||||
var container = document.createElement("div");
|
var container = document.createElement("div");
|
||||||
container.classList.add("tabulator-collapsed-row");
|
container.classList.add("tabulator-collapsed-row");
|
||||||
container.classList.add("text-break");
|
container.classList.add("text-break");
|
||||||
|
|
||||||
var list = document.createElement("div");
|
var list = document.createElement("div");
|
||||||
list.classList.add("row");
|
list.classList.add("row");
|
||||||
|
|
||||||
container.appendChild(list);
|
container.appendChild(list);
|
||||||
|
|
||||||
data.forEach(function (col) {
|
data.forEach(function (col) {
|
||||||
let item = document.createElement("div");
|
let item = document.createElement("div");
|
||||||
item.classList.add("col-6");
|
item.classList.add("col-6");
|
||||||
let item2 = document.createElement("div");
|
let item2 = document.createElement("div");
|
||||||
item2.classList.add("col-6");
|
item2.classList.add("col-6");
|
||||||
|
|
||||||
item.innerHTML = "<strong>" + col.title + "</strong>";
|
item.innerHTML = "<strong>" + col.title + "</strong>";
|
||||||
item2.innerHTML = col.value ? col.value : "-";
|
item2.innerHTML = col.value ? col.value : "-";
|
||||||
|
|
||||||
list.appendChild(item);
|
list.appendChild(item);
|
||||||
list.appendChild(item2);
|
list.appendChild(item2);
|
||||||
});
|
});
|
||||||
|
|
||||||
return Object.keys(data).length ? container : "";
|
return Object.keys(data).length ? container : "";
|
||||||
};
|
};
|
||||||
|
|
||||||
const profilApp = Vue.createApp({
|
const profilApp = Vue.createApp({
|
||||||
name: 'ProfilApp',
|
name: 'ProfilApp',
|
||||||
components: {
|
components: {
|
||||||
StudentProfil,
|
StudentProfil,
|
||||||
MitarbeiterProfil,
|
MitarbeiterProfil,
|
||||||
ViewStudentProfil,
|
ViewStudentProfil,
|
||||||
ViewMitarbeiterProfil,
|
ViewMitarbeiterProfil,
|
||||||
Loading,
|
Loading,
|
||||||
},
|
},
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
//? loading property is used for showing/hiding the loading modal
|
//? loading property is used for showing/hiding the loading modal
|
||||||
loading: false,
|
loading: false,
|
||||||
profilUpdateStates: null,
|
profilUpdateStates: null,
|
||||||
profilUpdateTopic: null,
|
profilUpdateTopic: null,
|
||||||
view: null,
|
view: null,
|
||||||
data: null,
|
data: null,
|
||||||
// notfound is null by default, but contains an UID if no user exists with that UID
|
// notfound is null by default, but contains an UID if no user exists with that UID
|
||||||
notFoundUID: null,
|
notFoundUID: null,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
//? use function syntax for provide so that we can access `this`
|
//? use function syntax for provide so that we can access `this`
|
||||||
provide() {
|
provide() {
|
||||||
return {
|
return {
|
||||||
profilUpdateStates: Vue.computed(() =>
|
profilUpdateStates: Vue.computed(() =>
|
||||||
this.profilUpdateStates ? this.profilUpdateStates : false
|
this.profilUpdateStates ? this.profilUpdateStates : false
|
||||||
),
|
),
|
||||||
profilUpdateTopic: Vue.computed(() =>
|
profilUpdateTopic: Vue.computed(() =>
|
||||||
this.profilUpdateTopic ? this.profilUpdateTopic : false
|
this.profilUpdateTopic ? this.profilUpdateTopic : false
|
||||||
),
|
),
|
||||||
setLoading: (newValue) => {
|
setLoading: (newValue) => {
|
||||||
this.loading = newValue;
|
this.loading = newValue;
|
||||||
},
|
},
|
||||||
getZustellkontakteCount: this.zustellKontakteCount,
|
getZustellkontakteCount: this.zustellKontakteCount,
|
||||||
getZustelladressenCount: this.zustellAdressenCount,
|
getZustelladressenCount: this.zustellAdressenCount,
|
||||||
collapseFunction: (e, column) => {
|
collapseFunction: (e, column) => {
|
||||||
//* check if property doesn't exist already and add it to the reactive this properties
|
//* check if property doesn't exist already and add it to the reactive this properties
|
||||||
if (this[e.target.id] === undefined) {
|
if (this[e.target.id] === undefined) {
|
||||||
this[e.target.id] = true;
|
this[e.target.id] = true;
|
||||||
}
|
}
|
||||||
this[e.target.id] = !this[e.target.id];
|
this[e.target.id] = !this[e.target.id];
|
||||||
|
|
||||||
//* gets all event icons of the different rows to use the onClick event later
|
//* gets all event icons of the different rows to use the onClick event later
|
||||||
let allClickableIcons = column._column.cells.map((row) => {
|
let allClickableIcons = column._column.cells.map((row) => {
|
||||||
return row.element.children[0];
|
return row.element.children[0];
|
||||||
});
|
});
|
||||||
|
|
||||||
//* changes the icon that shows or hides all the collapsed columns
|
//* changes the icon that shows or hides all the collapsed columns
|
||||||
//* if the replace function does not find the class to replace, it just simply returns false
|
//* if the replace function does not find the class to replace, it just simply returns false
|
||||||
if (this[e.target.id]) {
|
if (this[e.target.id]) {
|
||||||
e.target.classList.replace("fa-angle-up", "fa-angle-down");
|
e.target.classList.replace("fa-angle-up", "fa-angle-down");
|
||||||
} else {
|
} else {
|
||||||
e.target.classList.replace("fa-angle-down", "fa-angle-up");
|
e.target.classList.replace("fa-angle-down", "fa-angle-up");
|
||||||
}
|
}
|
||||||
|
|
||||||
//* changes the icon for every collapsed column to open or closed
|
//* changes the icon for every collapsed column to open or closed
|
||||||
if (this[e.target.id]) {
|
if (this[e.target.id]) {
|
||||||
allClickableIcons
|
allClickableIcons
|
||||||
.filter((column) => {
|
.filter((column) => {
|
||||||
return !column.classList.contains("open");
|
return !column.classList.contains("open");
|
||||||
})
|
})
|
||||||
.forEach((col) => {
|
.forEach((col) => {
|
||||||
col.click();
|
col.click();
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
allClickableIcons
|
allClickableIcons
|
||||||
.filter((column) => {
|
.filter((column) => {
|
||||||
return column.classList.contains("open");
|
return column.classList.contains("open");
|
||||||
})
|
})
|
||||||
.forEach((col) => {
|
.forEach((col) => {
|
||||||
col.click();
|
col.click();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
sortProfilUpdates: (ele1, ele2) => {
|
sortProfilUpdates: (ele1, ele2) => {
|
||||||
let result = 0;
|
let result = 0;
|
||||||
if (ele1.status === "pending") {
|
if (ele1.status === "pending") {
|
||||||
result = -1;
|
result = -1;
|
||||||
} else if (ele1.status === "accepted") {
|
} else if (ele1.status === "accepted") {
|
||||||
result = ele2.status === "rejected" ? -1 : 1;
|
result = ele2.status === "rejected" ? -1 : 1;
|
||||||
} else {
|
} else {
|
||||||
result = 1;
|
result = 1;
|
||||||
}
|
}
|
||||||
//? if they have the same status the insert date is used for ordering
|
//? if they have the same status the insert date is used for ordering
|
||||||
if (ele1.status === ele2.status) {
|
if (ele1.status === ele2.status) {
|
||||||
result =
|
result =
|
||||||
new Date(ele2.insertamum.split(".").reverse().join("-")) -
|
new Date(ele2.insertamum.split(".").reverse().join("-")) -
|
||||||
new Date(ele1.insertamum.split(".").reverse().join("-"));
|
new Date(ele1.insertamum.split(".").reverse().join("-"));
|
||||||
}
|
}
|
||||||
return result;
|
return result;
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
zustellAdressenCount() {
|
zustellAdressenCount() {
|
||||||
if (!this.data || !this.data.adressen) {
|
if (!this.data || !this.data.adressen) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
let adressenArray = [];
|
let adressenArray = [];
|
||||||
if (this.data.profilUpdates?.length) {
|
if (this.data.profilUpdates?.length) {
|
||||||
adressenArray = adressenArray.concat(
|
adressenArray = adressenArray.concat(
|
||||||
this.data.profilUpdates
|
this.data.profilUpdates
|
||||||
.filter((update) => {
|
.filter((update) => {
|
||||||
return update.requested_change.zustelladresse;
|
return update.requested_change.zustelladresse;
|
||||||
})
|
})
|
||||||
.map((adresse) => {
|
.map((adresse) => {
|
||||||
return adresse.requested_change.adresse_id;
|
return adresse.requested_change.adresse_id;
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
if (
|
||||||
!this.data.profilUpdates?.length ||
|
!this.data.profilUpdates?.length ||
|
||||||
!this.data.adressen
|
!this.data.adressen
|
||||||
.filter((adresse) => adresse.zustelladresse)
|
.filter((adresse) => adresse.zustelladresse)
|
||||||
.every((adresse) =>
|
.every((adresse) =>
|
||||||
this.data.profilUpdates.some(
|
this.data.profilUpdates.some(
|
||||||
(update) =>
|
(update) =>
|
||||||
update.requested_change.adresse_id == adresse.adresse_id
|
update.requested_change.adresse_id == adresse.adresse_id
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
) {
|
) {
|
||||||
adressenArray = adressenArray.concat(
|
adressenArray = adressenArray.concat(
|
||||||
this.data.adressen
|
this.data.adressen
|
||||||
.filter((adresse) => {
|
.filter((adresse) => {
|
||||||
return adresse.zustelladresse;
|
return adresse.zustelladresse;
|
||||||
})
|
})
|
||||||
.map((adr) => {
|
.map((adr) => {
|
||||||
return adr.adresse_id;
|
return adr.adresse_id;
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return [...new Set(adressenArray)];
|
return [...new Set(adressenArray)];
|
||||||
|
|
||||||
// OLD version
|
// OLD version
|
||||||
// return this.data.adressen.filter(adresse => {
|
// return this.data.adressen.filter(adresse => {
|
||||||
// return adresse.zustelladresse;
|
// return adresse.zustelladresse;
|
||||||
// }).map(adr => {
|
// }).map(adr => {
|
||||||
|
|
||||||
// return adr.adresse_id;
|
// return adr.adresse_id;
|
||||||
// });
|
// });
|
||||||
},
|
},
|
||||||
|
|
||||||
zustellKontakteCount() {
|
zustellKontakteCount() {
|
||||||
if (!this.data || !this.data.kontakte) {
|
if (!this.data || !this.data.kontakte) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
//TODO: not sure if how it is implemented is the best way
|
//TODO: not sure if how it is implemented is the best way
|
||||||
let kontakteArray = [];
|
let kontakteArray = [];
|
||||||
|
|
||||||
if (this.data.profilUpdates?.length) {
|
if (this.data.profilUpdates?.length) {
|
||||||
kontakteArray = kontakteArray.concat(
|
kontakteArray = kontakteArray.concat(
|
||||||
this.data.profilUpdates
|
this.data.profilUpdates
|
||||||
.filter((update) => {
|
.filter((update) => {
|
||||||
return update.requested_change.zustellung;
|
return update.requested_change.zustellung;
|
||||||
})
|
})
|
||||||
.map((kontant) => {
|
.map((kontant) => {
|
||||||
return kontant.requested_change.kontakt_id;
|
return kontant.requested_change.kontakt_id;
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (
|
if (
|
||||||
!this.data.profilUpdates?.length ||
|
!this.data.profilUpdates?.length ||
|
||||||
!this.data.kontakte
|
!this.data.kontakte
|
||||||
.filter((kontakt) => kontakt.zustellung)
|
.filter((kontakt) => kontakt.zustellung)
|
||||||
.every((kontakt) =>
|
.every((kontakt) =>
|
||||||
this.data.profilUpdates.some(
|
this.data.profilUpdates.some(
|
||||||
(update) =>
|
(update) =>
|
||||||
update.requested_change.kontakt_id == kontakt.kontakt_id
|
update.requested_change.kontakt_id == kontakt.kontakt_id
|
||||||
)
|
)
|
||||||
)
|
)
|
||||||
) {
|
) {
|
||||||
kontakteArray = kontakteArray.concat(
|
kontakteArray = kontakteArray.concat(
|
||||||
this.data.kontakte
|
this.data.kontakte
|
||||||
.filter((kontakt) => {
|
.filter((kontakt) => {
|
||||||
return kontakt.zustellung;
|
return kontakt.zustellung;
|
||||||
})
|
})
|
||||||
.map((kon) => {
|
.map((kon) => {
|
||||||
return kon.kontakt_id;
|
return kon.kontakt_id;
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return [...new Set(kontakteArray)];
|
return [...new Set(kontakteArray)];
|
||||||
|
|
||||||
// OLD version
|
// OLD version
|
||||||
// return this.data.kontakte.filter(kontakt => {
|
// return this.data.kontakte.filter(kontakt => {
|
||||||
// return kontakt.zustellung;
|
// return kontakt.zustellung;
|
||||||
// }).map(kon =>{
|
// }).map(kon =>{
|
||||||
// return kon.kontakt_id;
|
// return kon.kontakt_id;
|
||||||
// });
|
// });
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
filteredEditData() {
|
filteredEditData() {
|
||||||
if (!this.data) {
|
if (!this.data) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
view: null,
|
view: null,
|
||||||
data: {
|
data: {
|
||||||
Personen_Informationen: {
|
Personen_Informationen: {
|
||||||
title: this.$p.t("profil", "personenInformationen"),
|
title: this.$p.t("profil", "personenInformationen"),
|
||||||
topic: "Personen_informationen",
|
topic: "Personen_informationen",
|
||||||
view: null,
|
view: null,
|
||||||
data: {
|
data: {
|
||||||
vorname: {
|
vorname: {
|
||||||
title: this.$p.t("person", "vorname"),
|
title: this.$p.t("person", "vorname"),
|
||||||
topic: this.profilUpdateTopic?.["Vorname"],
|
topic: this.profilUpdateTopic?.["Vorname"],
|
||||||
view: "TextInputDokument",
|
view: "TextInputDokument",
|
||||||
withFiles: true,
|
withFiles: true,
|
||||||
data: {
|
data: {
|
||||||
titel: "vorname",
|
titel: "vorname",
|
||||||
value: this.data.vorname,
|
value: this.data.vorname,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
nachname: {
|
nachname: {
|
||||||
title: this.$p.t("person", "nachname"),
|
title: this.$p.t("person", "nachname"),
|
||||||
topic: this.profilUpdateTopic?.["Nachname"],
|
topic: this.profilUpdateTopic?.["Nachname"],
|
||||||
view: "TextInputDokument",
|
view: "TextInputDokument",
|
||||||
withFiles: true,
|
withFiles: true,
|
||||||
data: {
|
data: {
|
||||||
titel: "nachname",
|
titel: "nachname",
|
||||||
value: this.data.nachname,
|
value: this.data.nachname,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
titel: {
|
titel: {
|
||||||
title: this.$p.t("global", "titel"),
|
title: this.$p.t("global", "titel"),
|
||||||
topic: this.profilUpdateTopic?.["Titel"],
|
topic: this.profilUpdateTopic?.["Titel"],
|
||||||
view: "TextInputDokument",
|
view: "TextInputDokument",
|
||||||
withFiles: true,
|
withFiles: true,
|
||||||
data: {
|
data: {
|
||||||
titel: "titel",
|
titel: "titel",
|
||||||
value: this.data.titel,
|
value: this.data.titel,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
postnomen: {
|
postnomen: {
|
||||||
title: this.$p.t("profil", "postnomen"),
|
title: this.$p.t("profil", "postnomen"),
|
||||||
topic: this.profilUpdateTopic?.["Postnomen"],
|
topic: this.profilUpdateTopic?.["Postnomen"],
|
||||||
view: "TextInputDokument",
|
view: "TextInputDokument",
|
||||||
withFiles: true,
|
withFiles: true,
|
||||||
data: {
|
data: {
|
||||||
titel: "postnomen",
|
titel: "postnomen",
|
||||||
value: this.data.postnomen,
|
value: this.data.postnomen,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
Private_Kontakte: {
|
Private_Kontakte: {
|
||||||
title: this.$p.t("profil", "privateKontakte"),
|
title: this.$p.t("profil", "privateKontakte"),
|
||||||
topic: this.profilUpdateTopic?.["Private Kontakte"],
|
topic: this.profilUpdateTopic?.["Private Kontakte"],
|
||||||
data: this.data.kontakte
|
data: this.data.kontakte
|
||||||
?.filter((item) => {
|
?.filter((item) => {
|
||||||
// excludes all contacts that are already used in pending profil update requests
|
// excludes all contacts that are already used in pending profil update requests
|
||||||
return !this.data.profilUpdates?.some(
|
return !this.data.profilUpdates?.some(
|
||||||
(update) =>
|
(update) =>
|
||||||
update.status === this.profilUpdateStates["Pending"] &&
|
update.status === this.profilUpdateStates["Pending"] &&
|
||||||
update.requested_change?.kontakt_id === item.kontakt_id
|
update.requested_change?.kontakt_id === item.kontakt_id
|
||||||
);
|
);
|
||||||
})
|
})
|
||||||
.map((kontakt) => {
|
.map((kontakt) => {
|
||||||
return {
|
return {
|
||||||
listview: "Kontakt",
|
listview: "Kontakt",
|
||||||
view: "EditKontakt",
|
view: "EditKontakt",
|
||||||
data: kontakt,
|
data: kontakt,
|
||||||
};
|
};
|
||||||
}),
|
}),
|
||||||
},
|
},
|
||||||
Private_Adressen: {
|
Private_Adressen: {
|
||||||
title: this.$p.t("profil", "privateAdressen"),
|
title: this.$p.t("profil", "privateAdressen"),
|
||||||
topic: this.profilUpdateTopic?.["Private Adressen"],
|
topic: this.profilUpdateTopic?.["Private Adressen"],
|
||||||
data: this.data.adressen
|
data: this.data.adressen
|
||||||
?.filter((item) => {
|
?.filter((item) => {
|
||||||
return !this.data.profilUpdates?.some((update) => {
|
return !this.data.profilUpdates?.some((update) => {
|
||||||
return (
|
return (
|
||||||
update.status === this.profilUpdateStates["Pending"] &&
|
update.status === this.profilUpdateStates["Pending"] &&
|
||||||
update.requested_change?.adresse_id == item.adresse_id
|
update.requested_change?.adresse_id == item.adresse_id
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
.map((adresse) => {
|
.map((adresse) => {
|
||||||
return {
|
return {
|
||||||
listview: "Adresse",
|
listview: "Adresse",
|
||||||
view: "EditAdresse",
|
view: "EditAdresse",
|
||||||
data: adresse,
|
data: adresse,
|
||||||
};
|
};
|
||||||
}),
|
}),
|
||||||
},
|
},
|
||||||
// Password_Change : {
|
// Password_Change : {
|
||||||
// title:"Passwort Ändern",
|
// title:"Passwort Ändern",
|
||||||
// view:"ChangePassword",
|
// view:"ChangePassword",
|
||||||
// data:{
|
// data:{
|
||||||
// test:"testvalue",
|
// test:"testvalue",
|
||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
watch: {
|
watch: {
|
||||||
loading: function (newValue, oldValue) {
|
loading: function (newValue, oldValue) {
|
||||||
if (newValue) {
|
if (newValue) {
|
||||||
this.$refs.loadingModalRef.show();
|
this.$refs.loadingModalRef.show();
|
||||||
} else {
|
} else {
|
||||||
this.$refs.loadingModalRef.hide();
|
this.$refs.loadingModalRef.hide();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
async created() {
|
async created() {
|
||||||
// fetch profilUpdateStates to provide them to children components
|
// fetch profilUpdateStates to provide them to children components
|
||||||
|
|
||||||
await this.$fhcApi.factory.profilUpdate.getStatus()
|
await this.$fhcApi.factory.profilUpdate.getStatus()
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.profilUpdateStates = response.data;
|
this.profilUpdateStates = response.data;
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
});
|
});
|
||||||
|
|
||||||
this.$fhcApi.factory.profilUpdate.getTopic()
|
this.$fhcApi.factory.profilUpdate.getTopic()
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
this.profilUpdateTopic = response.data;
|
this.profilUpdateTopic = response.data;
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
});
|
});
|
||||||
|
|
||||||
//? uid contains the last part of the uri
|
//? uid contains the last part of the uri
|
||||||
let uid = location.pathname.split("/").pop();
|
let uid = location.pathname.split("/").pop();
|
||||||
|
|
||||||
this.$fhcApi.factory.profil.getView(uid).then((res) => {
|
this.$fhcApi.factory.profil.getView(uid).then((res) => {
|
||||||
if (!res.data) {
|
if (!res.data) {
|
||||||
this.notFoundUID = uid;
|
this.notFoundUID = uid;
|
||||||
} else {
|
} else {
|
||||||
this.view = res.data?.view;
|
this.view = res.data?.view;
|
||||||
this.data = res.data?.data;
|
this.data = res.data?.data;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
template: `
|
template: `
|
||||||
<div>
|
<div>
|
||||||
|
|
||||||
<div v-if="notFoundUID">
|
<div v-if="notFoundUID">
|
||||||
|
|
||||||
<h3>Es wurde keine Person mit der UID {{this.notFoundUID}} gefunden</h3>
|
<h3>Es wurde keine Person mit der UID {{this.notFoundUID}} gefunden</h3>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<loading ref="loadingModalRef" :timeout="0"></loading>
|
<loading ref="loadingModalRef" :timeout="0"></loading>
|
||||||
<component :is="view" :data="data" :editData="filteredEditData" ></component>
|
<component :is="view" :data="data" :editData="filteredEditData" ></component>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
</div>`,
|
</div>`,
|
||||||
});
|
});
|
||||||
setScrollbarWidth()
|
setScrollbarWidth();
|
||||||
profilApp
|
profilApp
|
||||||
.use(primevue.config.default, { zIndex: { overlay: 9999 } })
|
.use(primevue.config.default, {zIndex: {overlay: 9999}})
|
||||||
.use(Phrasen)
|
.use(Phrasen)
|
||||||
.mount("#content");
|
.mount("#content");
|
||||||
@@ -53,11 +53,8 @@ export default {
|
|||||||
<div v-if="withZustelladresse" class="order-5 offset-1 col-11">
|
<div v-if="withZustelladresse" class="order-5 offset-1 col-11">
|
||||||
<div class="form-underline">
|
<div class="form-underline">
|
||||||
<div class="form-underline-titel">{{$p.t('person','zustelladresse')}}</div>
|
<div class="form-underline-titel">{{$p.t('person','zustelladresse')}}</div>
|
||||||
<div class="ms-2 form-check ">
|
<div class="ms-2 form-check ">
|
||||||
<input class="form-check-input" type="checkbox" @click.prevent :checked="data.zustelladresse" >
|
<input class="form-check-input" type="checkbox" @click.prevent :checked="data.zustelladresse" >
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -16,23 +16,24 @@ export default{
|
|||||||
<div class="col-1 text-center" >
|
<div class="col-1 text-center" >
|
||||||
<i class="fa-solid " :class="{...(data.kontakt.includes('@')?{'fa-envelope':true}:{'fa-phone':true})}" style="color:rgb(0, 100, 156)"></i>
|
<i class="fa-solid " :class="{...(data.kontakt.includes('@')?{'fa-envelope':true}:{'fa-phone':true})}" style="color:rgb(0, 100, 156)"></i>
|
||||||
</div>
|
</div>
|
||||||
<div :class="{...(data.anmerkung? {'col-11':true, 'col-md-6':true, 'col-xl-11':true, 'col-xxl-6':true} : {'col-10':true, 'col-xl-9':true, 'col-xxl-10':true})}">
|
<div :class="{...(data.anmerkung? {'col-11':true, 'col-md-6':true, 'col-xl-11':true, 'col-xxl-6':true} : {'col-10':true, 'col-xl-9':true, 'col-xxl-10':true})}">
|
||||||
<!-- rendering KONTAKT emails -->
|
<!-- rendering KONTAKT emails -->
|
||||||
<div class="form-underline ">
|
<div class="form-underline ">
|
||||||
<div class="form-underline-titel">{{data.kontakttyp}}</div>
|
<div class="form-underline-titel">{{data.kontakttyp}}</div>
|
||||||
<a v-if="data.kontakt.includes('@')" role="link" :aria-disabled="view?true:false" :href="!view?('mailto:'+data.kontakt):null" class="form-underline-content">{{data.kontakt}} </a>
|
<a v-if="data.kontakt.includes('@')" role="link" :aria-disabled="view?true:false" :href="!view?('mailto:'+data.kontakt):null" class="form-underline-content">{{data.kontakt}} </a>
|
||||||
<a v-else role="link" :aria-disabled="view?true:false" :href="!view?('tel:'+data.kontakt):null" class="form-underline-content">{{data.kontakt}} </a>
|
<a v-else role="link" :aria-disabled="view?true:false" :href="!view?('tel:'+data.kontakt):null" class="form-underline-content">{{data.kontakt}} </a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div v-if="data?.anmerkung" class="offset-1 offset-md-0 offset-xl-1 offset-xxl-0 order-2 order-sm-1 col-10 col-md-4 col-xl-9 col-xxl-4 ">
|
||||||
<div v-if="data?.anmerkung" class="offset-1 offset-md-0 offset-xl-1 offset-xxl-0 order-2 order-sm-1 col-10 col-md-4 col-xl-9 col-xxl-4 ">
|
<div class="form-underline ">
|
||||||
<div class="form-underline ">
|
<div class="form-underline-titel">{{$p.t('global','anmerkung')}}</div>
|
||||||
<div class="form-underline-titel">{{$p.t('global','anmerkung')}}</div>
|
<span class="form-underline-content">{{data.anmerkung}} </span>
|
||||||
<span class="form-underline-content">{{data.anmerkung}} </span>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="text-center col-1 col-sm-1 order-2 order-lg-1 col-xl-2 col-xxl-1 allign-middle">
|
||||||
|
<i v-if="data.zustellung" class="fa-solid fa-check"></i>
|
||||||
|
<i v-else="data.zustellung" class="fa-solid fa-xmark"></i>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="text-center col-1 col-sm-1 order-2 order-lg-1 col-xl-2 col-xxl-1 allign-middle">
|
|
||||||
<i v-if="data.zustellung" class="fa-solid fa-check"></i>
|
|
||||||
<i v-else="data.zustellung" class="fa-solid fa-xmark"></i>
|
|
||||||
</div>
|
</div>
|
||||||
`,
|
`,
|
||||||
};
|
};
|
||||||
@@ -16,18 +16,19 @@ export default {
|
|||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h6 class="card-title">{{$p.t('profil','mailverteilerMitglied')}}</h6>
|
<h6 class="card-title">{{$p.t('profil','mailverteilerMitglied')}}</h6>
|
||||||
<div class="card-text row text-break mb-2" v-for="verteiler in data">
|
<div class="card-text row text-break mb-2" v-for="verteiler in data">
|
||||||
<div class="col-12 ">
|
<div class="col-12 ">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-1 ">
|
<div class="col-1 ">
|
||||||
<i class="fa-solid fa-envelope" style="color: #00649C;"></i>
|
<i class="fa-solid fa-envelope" style="color: #00649C;"></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<a :href="verteiler.mailto"><b>{{verteiler.gruppe_kurzbz}}</b></a>
|
<a :href="verteiler.mailto"><b>{{verteiler.gruppe_kurzbz}}</b></a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="col-11 offset-1 ">{{verteiler.beschreibung}}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-11 offset-1 ">{{verteiler.beschreibung}}</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>`,
|
</div>`,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -75,7 +75,7 @@ export default {
|
|||||||
<div class="col-12 col-sm-6 mb-2">
|
<div class="col-12 col-sm-6 mb-2">
|
||||||
<div class="row justify-content-center">
|
<div class="row justify-content-center">
|
||||||
<div class="col-auto " style="position:relative">
|
<div class="col-auto " style="position:relative">
|
||||||
<img class=" img-thumbnail " style=" max-height:150px; " :src="get_image_base64_src">
|
<img class=" img-thumbnail " style=" max-height:150px; " :src="get_image_base64_src"/>
|
||||||
<!-- LOCKING IMAGE FUNCTIONALITY -->
|
<!-- LOCKING IMAGE FUNCTIONALITY -->
|
||||||
<div v-if="editable" role="button" @click.prevent="sperre_foto_function" class="image-lock">
|
<div v-if="editable" role="button" @click.prevent="sperre_foto_function" class="image-lock">
|
||||||
<i :class="{'fa':true, ...(FotoSperre?{'fa-lock':true}:{'fa-lock-open':true})} "></i>
|
<i :class="{'fa':true, ...(FotoSperre?{'fa-lock':true}:{'fa-lock-open':true})} "></i>
|
||||||
|
|||||||
@@ -19,19 +19,19 @@ export default {
|
|||||||
<div class="card-header">{{title}}</div>
|
<div class="card-header">{{title}}</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="gy-3 row">
|
<div class="gy-3 row">
|
||||||
<div v-for="(wert,bez) in data" class="col-md-6 col-sm-12 ">
|
<div v-for="(wert,bez) in data" class="col-md-6 col-sm-12 ">
|
||||||
|
|
||||||
<div class="form-underline">
|
<div class="form-underline">
|
||||||
<div class="form-underline-titel">{{bez }}</div>
|
<div class="form-underline-titel">{{bez }}</div>
|
||||||
|
|
||||||
<!-- print Telefon link -->
|
<!-- print Telefon link -->
|
||||||
<a v-if="bez=='Telefon'" :href="data.Telefon?'tel:'+data.Telefon:null" :class="{'form-underline-content':true,'text-decoration-none':!data.Telefon,'text-body':!data.Telefon}">{{wert?wert:'-'}}</a>
|
<a v-if="bez=='Telefon'" :href="data.Telefon?'tel:'+data.Telefon:null" :class="{'form-underline-content':true,'text-decoration-none':!data.Telefon,'text-body':!data.Telefon}">{{wert?wert:'-'}}</a>
|
||||||
|
|
||||||
<!-- else print information -->
|
<!-- else print information -->
|
||||||
<span v-else class="form-underline-content">{{wert?wert:'-'}}</span>
|
<span v-else class="form-underline-content">{{wert?wert:'-'}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>`
|
</div>`
|
||||||
};
|
};
|
||||||
@@ -181,13 +181,13 @@ export default {
|
|||||||
return BsModal.popup(null, options);
|
return BsModal.popup(null, options);
|
||||||
},
|
},
|
||||||
template: /*html*/ `
|
template: /*html*/ `
|
||||||
<bs-modal v-show="!loading" ref="modalContainer" v-bind="$props" body-class="" dialog-class="modal-lg" class="bootstrap-alert" backdrop="false" >
|
<bs-modal v-show="!loading" ref="modalContainer" v-bind="$props" body-class="" dialog-class="modal-lg" class="bootstrap-alert" backdrop="false">
|
||||||
<template v-if="title" v-slot:title>{{title }}</template>
|
<template v-if="title" v-slot:title>{{title}}</template>
|
||||||
<template v-slot:default>
|
<template v-slot:default>
|
||||||
<div >
|
<div>
|
||||||
<nav aria-label="breadcrumb" class="ps-2 ">
|
<nav aria-label="breadcrumb" class="ps-2">
|
||||||
<ol class="breadcrumb ">
|
<ol class="breadcrumb">
|
||||||
<li class="breadcrumb-item" v-for="element in breadcrumb">{{element}}</li>
|
<li class="breadcrumb-item" v-for="element in breadcrumb">{{element}}</li>
|
||||||
</ol>
|
</ol>
|
||||||
</nav>
|
</nav>
|
||||||
<edit-profil-select @submit="submitProfilChange" v-model:breadcrumb="breadcrumb" v-model:topic="topic" v-model:profilUpdate="profilUpdate" ariaLabel="select" :list="editData"></edit-profil-select>
|
<edit-profil-select @submit="submitProfilChange" v-model:breadcrumb="breadcrumb" v-model:topic="topic" v-model:profilUpdate="profilUpdate" ariaLabel="select" :list="editData"></edit-profil-select>
|
||||||
|
|||||||
Reference in New Issue
Block a user