implemented 'OtherLvPlan' to view other users' timetables

This commit is contained in:
adisposkofh
2026-04-13 10:41:41 +02:00
parent f06e59b362
commit f1c3c8296f
21 changed files with 1285 additions and 219 deletions
+4 -5
View File
@@ -30,11 +30,11 @@ export default {
params: { start_date, end_date, lv_id }
};
},
eventsPersonal(start_date, end_date) {
eventsPersonal(start_date, end_date, uid = null) {
return {
method: 'post',
url: '/api/frontend/v1/lvPlan/eventsPersonal',
params: { start_date, end_date }
params: { start_date, end_date, uid }
};
},
eventsLv(lv_id, start_date, end_date) {
@@ -57,11 +57,11 @@ export default {
params: { start_date, end_date }
};
},
getLvPlanReservierungen(start_date, end_date) {
getLvPlanReservierungen(start_date, end_date, uid = null) {
return {
method: 'post',
url: '/api/frontend/v1/LvPlan/getReservierungen',
params: { start_date, end_date }
params: { start_date, end_date, uid }
};
},
getLehreinheitStudiensemester(lehreinheit_id) {
@@ -118,5 +118,4 @@ export default {
url: `/api/frontend/v1/lvPlan/getLehrverband/${stg_kz}/${sem}/${verband}`
}
},
};
+25
View File
@@ -0,0 +1,25 @@
/**
* Copyright (C) 2025 fhcomplete.org
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
export default {
getBasicUserAttributesForLvPlanDisplay(uid) {
return {
method: 'get',
url: `/api/frontend/v1/OtherLvPlan/getBasicUserAttributesForLvPlanDisplay/${uid}`,
};
},
};
+28 -2
View File
@@ -33,7 +33,20 @@ const app = Vue.createApp({
"/Cis/Profil/View/"+data.uid;
}
},
childactions: []
childactions: [
{
label: Vue.computed(() => this.$p.t("lehre/stundenplan")),
icon: "fas fa-calendar-days",
type: "link",
action: function(data) {
const uid = JSON.parse(data.data).uid;
const link = FHC_JS_DATA_STORAGE_OBJECT.app_root +
FHC_JS_DATA_STORAGE_OBJECT.ci_router +
'/Cis/OtherLvPlan/' + uid;
return link;
}
}
]
},
student: {
defaultaction: {
@@ -44,7 +57,20 @@ const app = Vue.createApp({
}
},
childactions: []
childactions: [
{
label: Vue.computed(() => this.$p.t("lehre/stundenplan")),
icon: "fas fa-calendar-days",
type: "link",
action: function(data) {
const uid = JSON.parse(data.data).uid;
const link = FHC_JS_DATA_STORAGE_OBJECT.app_root +
FHC_JS_DATA_STORAGE_OBJECT.ci_router +
'/Cis/OtherLvPlan/' + uid;
return link;
}
}
]
},
room: {
defaultaction: {
+11
View File
@@ -19,6 +19,7 @@ import DeadlineOverview from "../../components/Cis/Abgabetool/DeadlineOverview.j
import Studium from "../../components/Cis/Studium/Studium.js";
import StgOrgLvPlan from "../../components/Cis/LvPlan/StgOrg.js";
import OverviewLvPlan from "../../components/Cis/LvPlan/OverviewLvPlan.js";
import OtherLvPlan from "../../components/Cis/LvPlan/OtherLvPlan.js";
import ApiRenderers from '../../api/factory/renderers.js';
import ApiRouteInfo from '../../api/factory/routeinfo.js';
@@ -219,6 +220,16 @@ const router = VueRouter.createRouter({
};
}
},
{
path: `/Cis/OtherLvPlan/:otherUid/:mode?/:focus_date?`,
name: "OtherLvPlan",
component: OtherLvPlan,
props(route) {
return {
propsViewData: route.params
};
}
},
{
path: `/Cis4`,
name: 'Cis4',
@@ -0,0 +1,248 @@
import FormForm from "../../Form/Form.js";
import FormInput from "../../Form/Input.js";
import FhcCalendar from "../../Calendar/LvPlan.js";
import ApiLvPlan from "../.././../api/factory/lvPlan.js";
import ApiOtherLvPlan from "../.././../api/factory/otherLvPlan.js";
import ApiAuthinfo from "../../../api/factory/authinfo.js";
export const DEFAULT_MODE_LVPLAN = "Week";
export default {
name: "OtherLvPlan",
components: {
FormForm,
FormInput,
FhcCalendar,
},
props: {
viewData: Object,
propsViewData: Object,
},
data() {
return {
localProps: {},
studiensemester_kurzbz: null,
studiensemester_start: null,
studiensemester_ende: null,
isOtherPersonMitarbeiter: false,
isOtherPersonStudent: false,
currentStgBezeichnung: null,
listVerband: [],
listGroup: [],
rangeIntervalFirst: null,
otherPersonData: {
fullName: "",
photo: "",
},
};
},
computed: {
currentDay() {
if (
!this.propsViewData?.focus_date ||
isNaN(new Date(this.propsViewData?.focus_date))
)
return luxon.DateTime.now().setZone(this.viewData.timezone).toISODate();
return this.propsViewData?.focus_date;
},
currentMode() {
if (
!this.propsViewData?.mode ||
!["day", "week", "month"].includes(
this.propsViewData?.mode.toLowerCase(),
)
)
return DEFAULT_MODE_LVPLAN;
return this.propsViewData?.mode;
},
downloadLinks() {
if (
!this.studiensemester_start ||
!this.studiensemester_ende ||
!this.propsViewData.otherUid
)
return false;
const type = this.isOtherPersonStudent
? "student"
: this.isOtherPersonMitarbeiter
? "lektor"
: null;
if (!type) return;
const opts = { zone: this.viewData.timezone };
const start = luxon.DateTime.fromISO(
this.studiensemester_start,
opts,
).toUnixInteger();
const ende = luxon.DateTime.fromISO(
this.studiensemester_ende,
opts,
).toUnixInteger();
const download_link =
FHC_JS_DATA_STORAGE_OBJECT.app_root +
"cis/private/lvplan/stpl_kalender.php" +
"?type=" +
type +
"&pers_uid=" +
this.propsViewData.otherUid +
"&begin=" +
start +
"&ende=" +
ende;
return [
{
title: "excel",
icon: "fa-solid fa-file-excel",
link: download_link + "&format=excel",
},
{
title: "csv",
icon: "fa-solid fa-file-csv",
link: download_link + "&format=csv",
},
{
title: "ical1",
icon: "fa-regular fa-calendar",
link: download_link + "&format=ical&version=1&target=ical",
},
{
title: "ical2",
icon: "fa-regular fa-calendar",
link: download_link + "&format=ical&version=2&target=ical",
},
];
},
get_image_base64_src: function () {
if (!this.otherPersonData.photo?.length) {
return "";
}
return "data:image/jpeg;base64," + this.otherPersonData.photo;
},
},
watch: {
"propsViewData.otherUid": {
handler() {
this.$router.go();
},
},
},
methods: {
handleChangeDate(day, newMode) {
return this.handleChangeMode(newMode, day);
},
handleChangeMode(newMode, day) {
const mode = newMode[0].toUpperCase() + newMode.slice(1);
const focus_date = day.toISODate();
this.$router.push({
name: "OtherLvPlan",
params: {
mode,
focus_date,
},
});
},
updateRange(rangeInterval) {
this.$api
.call(
ApiLvPlan.studiensemesterDateInterval(
rangeInterval.end.startOf("week").toISODate(),
),
)
.then((res) => {
this.studiensemester_kurzbz = res.data.studiensemester_kurzbz;
this.studiensemester_start = res.data.start;
this.studiensemester_ende = res.data.ende;
});
},
getPromiseFunc(start, end) {
return [
this.$api.call(
ApiLvPlan.eventsPersonal(
start.toISODate(),
end.toISODate(),
this.propsViewData.otherUid,
),
),
this.$api.call(
ApiLvPlan.getLvPlanReservierungen(
start.toISODate(),
end.toISODate(),
this.propsViewData.otherUid,
),
),
];
},
},
async created() {
const authInfoResponse = await this.$api.call(ApiAuthinfo.getAuthInfo());
const authId = authInfoResponse.data.uid;
if (authId === this.propsViewData.otherUid) {
this.$router.push({ name: "MyLvPlan" });
}
const userDataResponse = await this.$api.call(
ApiOtherLvPlan.getBasicUserAttributesForLvPlanDisplay(
this.propsViewData.otherUid,
),
);
const userData = userDataResponse.data;
this.isOtherPersonMitarbeiter = !!userData.is_mitarbeiter;
this.isOtherPersonStudent = !!userData.is_student;
this.otherPersonData.fullName = userData.vorname + " " + userData.nachname;
this.otherPersonData.photo = userData.foto;
},
template: `
<div class="d-flex flex-column h-100">
<h2>
<div class="d-flex flex-row justify-content-between align-items-center">
<span>
{{ $p.t('lehre/stundenplan') + (studiensemester_kurzbz ? " " + studiensemester_kurzbz : "") }}
</span>
<div @click="this.$router.push({name: 'ProfilView', params: {uid: propsViewData.otherUid}})" type="button" class="d-flex flex-row align-items-center gap-3">
<span v-if="otherPersonData.fullName?.length">
{{ otherPersonData.fullName }}
</span>
<img v-if="otherPersonData.photo?.length" alt="profile picture" class=" img-thumbnail " style=" max-height:60px; " :src="get_image_base64_src"/>
</div>
</div>
</h2>
<hr>
<fhc-calendar
ref="calendar"
:timezone="viewData.timezone"
:get-promise-func="getPromiseFunc"
:date="currentDay"
:mode="currentMode"
@update:date="handleChangeDate"
@update:mode="handleChangeMode"
@update:range="updateRange"
class="responsive-calendar"
>
<div
v-if="downloadLinks"
class="d-flex gap-1 justify-items-start"
>
<div v-for="{ title, icon, link } in downloadLinks">
<a
:href="link"
:aria-label="title"
class="py-1 btn btn-outline-secondary"
>
<div class="d-flex flex-column">
<i aria-hidden="true" :class="icon"></i>
<span style="font-size:.5rem">{{ title }}</span>
</div>
</a>
</div>
</div>
</fhc-calendar>
</div>
`,
};
@@ -103,7 +103,18 @@ export default {
},
],
},
quickLinks: [
{
icon: "fa-calendar-days",
phrase: "lehre/stundenplan",
action: () => {
this.$router.push({
name: "OtherLvPlan",
params: { otherUid: this.$props.data.username },
})
},
}
],
betriebsmittel_table_options: {
persistenceID: "filterTableMaProfilBetriebsmittel",
persistence: {
@@ -331,12 +342,6 @@ export default {
<edit-profil v-if="showModal" ref="editModal" :isMitarbeiter="true" @hideBsModal="hideEditProfilModal" :value="JSON.parse(JSON.stringify(filteredEditData))" :titel="$p.t('profil','profilBearbeiten')"></edit-profil>
<div class="row">
<div class="d-md-none col-12 ">
<!--TODO: uncomment when implemented
<div class="row mb-3">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')" :mobile="true"></quick-links>
</div>
</div>-->
<!-- Bearbeiten Button -->
<div v-if="isEditable" class="row mb-3 ">
<div class="col">
@@ -465,17 +470,11 @@ export default {
</div>
<!-- START OF SIDE PANEL -->
<div class="col-md-4 col-xxl-3 col-sm-12 text-break" >
<!--TODO: uncomment when implemented
<div class="row d-none d-md-block mb-3">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')"></quick-links>
</div>
</div>-->
<div v-if="quickLinks.length" class="row mb-4">
<div class="col">
<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
</div>
</div>
<!-- Bearbeiten Button -->
<div class="row d-none d-md-block ">
<div class="col mb-3">
@@ -1,9 +1,9 @@
import {CoreFilterCmpt} from "../../../components/filter/Filter.js";
import Mailverteiler from "./ProfilComponents/Mailverteiler.js";
import QuickLinks from "./ProfilComponents/QuickLinks.js";
import RoleInformation from "./ProfilComponents/RoleInformation.js";
import ProfilEmails from "./ProfilComponents/ProfilEmails.js";
import ProfilInformation from "./ProfilComponents/ProfilInformation.js";
import QuickLinks from "./ProfilComponents/QuickLinks.js";
import { dateFilter } from '../../../tabulator/filters/Dates.js';
@@ -11,10 +11,10 @@ export default {
components: {
CoreFilterCmpt,
Mailverteiler,
QuickLinks,
RoleInformation,
ProfilEmails,
ProfilInformation,
QuickLinks,
},
inject: ["collapseFunction", "language"],
data() {
@@ -90,6 +90,18 @@ export default {
},
],
},
quickLinks: [
{
icon: "fa-calendar-days",
phrase: "lehre/stundenplan",
action: () => {
this.$router.push({
name: "OtherLvPlan",
params: { otherUid: this.$props.data.username },
})
},
}
],
};
},
@@ -242,7 +254,7 @@ export default {
</div>
<!-- START OF THE SECOND PROFIL INFORMATION ROW -->
<!-- ROW WITH PROFIL IMAGE AND INFORMATION END -->
</div >
</div>
<!-- SECOND ROW UNDER THE PROFIL IMAGE AND INFORMATION WITH THE TABLES -->
<div class="row">
<!-- FIRST TABLE -->
@@ -256,26 +268,22 @@ export default {
<!-- START OF SIDE PANEL -->
<div class="col-md-4 col-xxl-3 col-sm-12 text-break" >
<!-- VISIBLE UNTIL VIEWPORT MD -->
<!--TODO: uncomment when implemented
<div class="row d-none d-md-block mb-3">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')" ></quick-links>
</div>
</div>
-->
<div class="row">
<div class="col">
<!-- MAILVERTEILER -->
<mailverteiler :data="data?.mailverteiler" :title="$p.t('profil','mailverteiler')"></mailverteiler>
</div>
</div>
<!-- END OF SIDE PANEL -->
</div>
<div v-if="quickLinks.length" class="row mb-4">
<div class="col">
<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
</div>
</div>
<div class="row">
<div class="col">
<!-- MAILVERTEILER -->
<mailverteiler :data="data?.mailverteiler" :title="$p.t('profil','mailverteiler')"></mailverteiler>
</div>
</div>
<!-- END OF SIDE PANEL -->
</div>
<!-- END OF CONTAINER ROW-->
</div>
<!-- END OF CONTAINER -->
</div>
<!-- END OF CONTAINER -->
</div>
`,
};
@@ -1,53 +1,31 @@
export default {
//TODO: To be implemented
props: {
data: {
type: String,
},
title: {
type: String,
required: true,
},
mobile: {
type: Boolean,
default: false,
},
},
methods: {
hideCollapse: function () {
this.collapseOpen = false;
},
showCollapse: function () {
this.collapseOpen = true;
},
},
data() {
return {
collapseOpen: false,
};
},
template: /*html*/ `
name: "QuickLinks",
data() {
return {};
},
props: {
title: {
type: String,
required: true,
},
links: {
type: Array,
required: true,
},
},
template: `
<div class="card">
<template v-if="mobile">
<button class="btn btn-outline-primary" data-bs-toggle="collapse" data-bs-target="#quickLinks" :aria-expanded="collapseOpen" aria-controls="quickLinks" >
{{title}}
<i class="fa " :class="collapseOpen?'fa-chevron-up':'fa-chevron-down'"></i>
</button>
<div @[\`show.bs.collapse\`]="collapseOpen=true;" @[\`hide.bs.collapse\`]="collapseOpen=false;" class="mt-1 collapse" id="quickLinks">
<div class="list-group">
<a href="#" class="list-group-item list-group-item-action">{{$p.t('profil','zeitwuensche')}}</a>
<a href="#" class="list-group-item list-group-item-action">{{$p.t('profil','lehrveranstaltungen')}}</a>
<a href="#" class="list-group-item list-group-item-action ">{{$p.t('profil','zeitsperren')}}</a>
<div class="card-header">
{{title}}
</div>
<div class="card-body">
<div class="d-flex flex-row align-items-center gap-3 flex-wrap">
<div v-for="link in links" @click="link.action()" type="button" class="d-flex flex-row gap-2 px-3 py-2 border fhc-primary">
<div><i class="fa" :class="link.icon"></i></div>
{{ $p.t(link.phrase) }}
<div><i class="fa fa-arrow-up-right-from-square" style="color:var(--fhc-light) !important"></i></div>
</div>
</div>
</template>
<template v-else>
<div class="card-header">{{title}}</div>
<div class="card-body">
<a style="text-decoration:none" class="my-1 d-block" href="#">{{$p.t('profil','zeitwuensche')}}</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">{{$p.t('profil','lehrveranstaltungen')}}</a>
<a style="text-decoration:none" class="my-1 d-block" href="#">{{$p.t('profil','zeitsperren')}}</a>
</div>
</template>
</div>
</div>`,
};
@@ -1,7 +1,6 @@
import {CoreFilterCmpt} from "../../../components/filter/Filter.js";
import Mailverteiler from "./ProfilComponents/Mailverteiler.js";
import AusweisStatus from "./ProfilComponents/FhAusweisStatus.js";
import QuickLinks from "./ProfilComponents/QuickLinks.js";
import Adresse from "./ProfilComponents/Adresse.js";
import Kontakt from "./ProfilComponents/Kontakt.js";
import ProfilEmails from "./ProfilComponents/ProfilEmails.js";
@@ -9,6 +8,7 @@ import RoleInformation from "./ProfilComponents/RoleInformation.js";
import ProfilInformation from "./ProfilComponents/ProfilInformation.js";
import FetchProfilUpdates from "./ProfilComponents/FetchProfilUpdates.js";
import EditProfil from "./ProfilModal/EditProfil.js";
import QuickLinks from "./ProfilComponents/QuickLinks.js";
import ApiProfilUpdate from '../../../api/factory/profilUpdate.js';
import { dateFilter } from '../../../tabulator/filters/Dates.js';
@@ -18,7 +18,6 @@ export default {
CoreFilterCmpt,
Mailverteiler,
AusweisStatus,
QuickLinks,
Adresse,
Kontakt,
ProfilEmails,
@@ -26,6 +25,7 @@ export default {
ProfilInformation,
FetchProfilUpdates,
EditProfil,
QuickLinks,
},
inject: ["sortProfilUpdates", "collapseFunction", "language","isEditable"],
data() {
@@ -95,6 +95,18 @@ export default {
},
],
},
quickLinks: [
{
icon: "fa-calendar-days",
phrase: "lehre/stundenplan",
action: () => {
this.$router.push({
name: "OtherLvPlan",
params: { otherUid: this.$props.data.username },
})
},
}
],
};
},
@@ -265,15 +277,7 @@ export default {
:value="JSON.parse(JSON.stringify(filteredEditData))" :titel="$p.t('profil','profilBearbeiten')"></edit-profil>
<!-- ROW -->
<div class="row">
<!-- HIDDEN QUICK LINKS -->
<div class="d-md-none col-12 ">
<!--TODO: uncomment when implemented
<div class="row py-2">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')" :mobile="true"></quick-links>
</div>
</div>-->
<!-- Bearbeiten Button -->
<div v-if="isEditable" class="row ">
<div class="col mb-3">
@@ -403,12 +407,11 @@ export default {
</div>
<!-- START OF SIDE PANEL -->
<div class="col-md-4 col-xxl-3 col-sm-12 text-break" >
<!--TODO: uncomment when implemented
<div class="row d-none d-md-block mb-3">
<div v-if="quickLinks.length" class="row mb-4">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')"></quick-links>
<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
</div>
</div>-->
</div>
<!-- Bearbeiten Button -->
<div class="row d-none d-md-block">
<div class="col mb-3">
@@ -1,19 +1,32 @@
import QuickLinks from "./ProfilComponents/QuickLinks.js";
import Mailverteiler from "./ProfilComponents/Mailverteiler.js";
import ProfilEmails from "./ProfilComponents/ProfilEmails.js";
import RoleInformation from "./ProfilComponents/RoleInformation.js";
import ProfilInformation from "./ProfilComponents/ProfilInformation.js";
import QuickLinks from "./ProfilComponents/QuickLinks.js";
export default {
data() {
return {};
return {
quickLinks: [
{
icon: "fa-calendar-days",
phrase: "lehre/stundenplan",
action: () => {
this.$router.push({
name: "OtherLvPlan",
params: { otherUid: this.$props.data.username },
})
},
}
],
};
},
components: {
QuickLinks,
Mailverteiler,
ProfilEmails,
RoleInformation,
ProfilInformation,
QuickLinks,
},
props: ["data"],
@@ -88,23 +101,11 @@ export default {
};
},
},
mounted() {
},
template: /*html*/ `
<div class="container-fluid text-break fhc-form" >
<!-- ROW -->
<div class="row">
<!-- HIDDEN QUICK LINKS -->
<!-- uncomment when implemented
<div class="d-md-none col-12 ">
<quick-links :title="$p.t('profil','quickLinks')" :mobile="true"></quick-links>
</div>-->
<!-- END OF HIDDEN QUCK LINKS -->
<!-- MAIN PANNEL -->
<div class="col-sm-12 col-md-8 col-xxl-9 ">
<!-- ROW WITH PROFIL IMAGE AND INFORMATION -->
@@ -112,12 +113,18 @@ export default {
<!-- ROW WITH THE PROFIL INFORMATION -->
<div class="row mb-4">
<!-- FIRST KAESTCHEN -->
<div class="col-lg-12 col-xl-6 ">
<div class="col-lg-12 col-xl-6 ">
<div class="row mb-4">
<div class="col">
<profil-information :data="profilInformation" :title="$p.t('profil','studentIn')" :fotoStatus="fotoStatus"></profil-information>
</div>
</div>
<!-- SECOND ROW OF FIRST COLUMN -->
<div class="row mb-4">
<div class="col">
</div>
</div>
<!-- START OF SECOND PROFIL INFORMATION COLUMN -->
<!-- END OF PROFIL INFORMATION ROW -->
<!-- INFORMATION CONTENT END -->
@@ -145,17 +152,12 @@ export default {
</div>
<!-- START OF SIDE PANEL -->
<div class="col-md-4 col-xxl-3 col-sm-12 text-break" >
<!-- SRART OF QUICK LINKS IN THE SIDE PANEL -->
<!-- START OF THE FIRDT ROW IN THE SIDE PANEL -->
<!-- THESE QUCK LINKS ARE ONLY VISIBLE UNTIL VIEWPORT MD -->
<!--TODO: uncomment when implemented
<div class="row d-none d-md-block mb-3">
<div class="col">
<quick-links :title="$p.t('profil','quickLinks')"></quick-links>
</div>
</div>-->
<!-- START OF THE FIRST ROW IN THE SIDE PANEL -->
<div v-if="quickLinks.length" class="row mb-4">
<div class="col">
<quick-links :title="$p.t('profil/quickLinks')" :links="quickLinks" />
</div>
</div>
<!-- START OF THE SECOND ROW IN THE SIDE PANEL -->
<div class="row">
<div class="col">
@@ -142,7 +142,6 @@ export default {
</tr>
</tbody>
</table>
<lv-menu :containerStyles="['p-0']" :rowStyles="['m-0']" v-if="lvMenu.length" :menu="lvMenu" />
<lv-menu v-if="lvMenu.length && $route.name === 'MyLvPlan'" :containerStyles="['p-0']" :rowStyles="['m-0']" :menu="lvMenu" />
</div>`,
}