adds a general modal for the lehrveranstaltungs Uebersicht with all the links connected to the lehrveranstaltung

This commit is contained in:
SimonGschnell
2024-06-17 11:39:14 +02:00
parent d92ad0a6c6
commit bb9d4bda04
4 changed files with 69 additions and 6 deletions
+2
View File
@@ -1,6 +1,7 @@
import {CoreNavigationCmpt} from '../../components/navigation/Navigation.js';
import DashboardAdmin from '../../components/Dashboard/Admin.js';
import FhcApi from '../../plugin/FhcApi.js';
import Phrasen from '../../plugin/Phrasen.js';
const app = Vue.createApp({
data: () => ({
@@ -13,4 +14,5 @@ const app = Vue.createApp({
});
app.config.unwrapInjectedRef = true;
app.use(FhcApi);
app.use(Phrasen);
app.mount('#main');
+2
View File
@@ -1,5 +1,6 @@
import FhcDashboard from '../../components/Dashboard/Dashboard.js';
import FhcApi from '../../plugin/FhcApi.js';
import Phrasen from '../../plugin/Phrasen.js';
const app = Vue.createApp({
data: () => ({
@@ -11,4 +12,5 @@ const app = Vue.createApp({
});
app.config.unwrapInjectedRef = true;
app.use(FhcApi);
app.use(Phrasen);
app.mount('#content');
@@ -0,0 +1,48 @@
import BsModal from "../../Bootstrap/Modal";
export default {
data(){
return {
// reactive data
items:["lehrveranstaltungsInformationen","Notenlisten","Moodle","Gesamtnote","E-mail","Pinboard","Alle Termine der LV","Anrechnung","Evaluierung","Neue Einmeldung"],
lehreinheit:null,
stg:null,
lv:null,
result: false,
}
},
mixins:[BsModal],
components:{
BsModal,
},
mounted(){
this.modal = this.$refs.modalContainer;
},
template:/*html*/`
<bs-modal ref="modalContainer" dialogClass="modal-lg">
<template #title>
<span v-if="lv ">
{{lv + (stg?' / ' + stg:'')}}
</span>
<span v-else>
Lehrveranstaltungs Übersicht
</span>
</template>
<template #default>
<div :style="{'display':'grid', 'row-gap':'10px', 'column-gap':'10px', 'grid-template-columns':'repeat(3,minmax(100px,1fr))', 'grid-template-rows':'repeat('+Math.ceil(items.length / 3)+',minmax(100px,1fr))'} ">
<div class="d-flex flex-column align-items-center justify-content-center" v-for="item in items" :key="item">
<span>{{item}}</span>
<i class="fa fa-file"></i>
</div>
</div>
</template>
<template #footer>
<button type="button" class="btn btn-primary" @click="result=true;this.hide()">OK</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
</template>
</bs-modal>
`,
};
@@ -1,6 +1,8 @@
import Phrasen from '../../mixins/Phrasen.js';
import AbstractWidget from './Abstract.js';
import FhcCalendar from '../Calendar/Calendar.js';
import LvUebersicht from '../Cis/Mylv/LvUebersicht.js';
export default {
mixins: [
@@ -8,14 +10,17 @@ export default {
AbstractWidget
],
components: {
FhcCalendar
FhcCalendar,
LvUebersicht,
},
data() {
return {
stunden: [],
minimized: true,
events: null,
currentDay: new Date()
currentDay: new Date(),
}
},
computed: {
@@ -30,9 +35,14 @@ export default {
}
},
methods: {
printEntry: function(item){
console.log(item);
showLvUebersicht: function (event){
this.$refs.lvUebersicht.lehreinheit = event.lehreinheit_id;
this.$refs.lvUebersicht.lv = event.title;
this.$refs.lvUebersicht.stg = event.stg_typ + event.stg_kurzbz + (event.verband?'-' + event.verband:'' );
this.$refs.lvUebersicht.show();
},
selectDay(day) {
this.currentDay = day;
this.minimized = true;
@@ -76,15 +86,16 @@ export default {
})
.catch(err => { console.error('ERROR: ', err.response.data) });
},
template: `
template: /*html*/`
<div class="dashboard-widget-stundenplan d-flex flex-column h-100">
<lv-uebersicht ref="lvUebersicht" />
<fhc-calendar :initial-date="currentDay" class="border-0" class-header="p-0" @select:day="selectDay" v-model:minimized="minimized" :events="events" no-week-view :show-weeks="false" />
<div v-show="minimized" class="flex-grow-1 overflow-scroll">
<div v-if="events === null" class="d-flex h-100 justify-content-center align-items-center">
<i class="fa-solid fa-spinner fa-pulse fa-3x"></i>
</div>
<div v-else-if="currentEvents.length" class="list-group list-group-flush">
<div @click="printEntry(evt)" class="" v-for="evt in currentEvents" :key="evt.id" class="list-group-item small" :style="{'background-color':evt.color}">
<div @click="showLvUebersicht(evt)" class="" v-for="evt in currentEvents" :key="evt.id" class="list-group-item small" :style="{'background-color':evt.color}">
<b>{{evt.title}}</b>
<br>
<small class="d-flex w-100 justify-content-between">