Schedule management

This commit is contained in:
2024-04-14 13:52:09 +02:00
parent adaa828810
commit 9112004326
15 changed files with 517 additions and 32 deletions

View File

@ -22,6 +22,8 @@
const ownSchedule = ref();
const filter = ref("null");
const subFilter = ref("null");
const focus = ref();
const focusLessons = ref();
let user;
if(log){
@ -102,6 +104,18 @@
}
function lessonFocus(element){
focus.value = element;
var lessonsList = [];
for (let element in schedule.value){
if (schedule.value[element].course.courseId == focus.value.course.courseId){
lessonsList.push(schedule.value[element]);
}
}
focusLessons.value = lessonsList;
}
function dateOfMonth(i){
return new Date(currentDate.value.getFullYear(),currentDate.value.getMonth(),i);
@ -109,7 +123,6 @@
function sortSchedule(){
schedule.value =trueSchedule.value.lessons;
console.log(filter.value)
if(filter.value =="Teacher"){
schedule.value = sortByTeacher(schedule.value,subFilter.value);
scheduleByWeek.value = sundayToTheEnd(matrixFromList(schedule.value,mondayOfWeek.value));
@ -136,6 +149,10 @@
value = 1;
counter=0;
}
if(focus.value != null){
lessonFocus(focus.value)
}
}
function sortByType(lessons,type){
@ -161,7 +178,7 @@
}
const matrix = [];
for (let element in lessons){
if(lessons[element].course.title == course.title){
if(lessons[element].course.courseId == course.courseId){
matrix.push(lessons[element])
}
}
@ -185,7 +202,7 @@
async function changeSchedule(){
schedule.value =trueSchedule.value.lessons;
curriculum.value = trueSchedule.value.curriculum;
scheduleByWeek.value = sundayToTheEnd(matrixFromList(schedule.value,mondayOfWeek.value));
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
value = 1;
@ -193,6 +210,8 @@
courses.value = (await getcurriculum(curriculum.value.curriculumId)).courses;
filter.value = "null";
subFilter.value = "null"
focus.value = null;
focusLessons.value = null;
}
function changeWeek(i){
@ -271,13 +290,14 @@
<div v-if="scheduleByWeek != null " class="courseGrid">
<div class="dayCourse" v-for="element in scheduleByWeek">
<template v-for="i,index in element.length">
<div class="course" v-bind:style="{background:element[index].color,
<div class="course" @click.native="lessonFocus(element[index])" v-bind:style="{background:element[index].color,
height:((getDifferenceTime(element[index].lessonEnd,element[index].lessonStart)/7.2)-0.5)+'%', top:((getMarginTop(element, index, index-1)/7.20))+'%'}">
<div class="hourStart">
{{getHoursMinutes(element[index].lessonStart)}}
</div>
<div class="infos" v-bind:style="{}">
<div class="infos">
<p class="childInfos">{{element[index].course.title}}</p>
<p class="childInfos">{{element[index].local}}</p>
<p class="childInfos">{{element[index].lessonType}}</p>
@ -313,7 +333,7 @@
<div v-if="isAValue()" style="top:0; right:2%; border-radius:20%;color:rgb(200,200,200) ; position:absolute;z-index:50;">{{value-shift}}</div>
<div v-if="month != null" style="overflow-y:scroll; height:100%;" >
<template v-for="element in month[value-shift]">
<div class="course" v-bind:style="{background:element.color, height:100+'%'}">
<div class="course" @click.native="lessonFocus(element)" v-bind:style="{background:element.color, height:100+'%'}">
<div class="hourStart">
{{getHoursMinutes(element.lessonStart)}}
@ -349,7 +369,7 @@
</div>
<template v-if="scheduleByWeek != null">
<div class="body" style="background-color:#353535;" >
<div class="containerList" v-for="n,j in scheduleByWeek[index].length">
<div class="containerList"v-for="n,j in scheduleByWeek[index].length" @click.native="lessonFocus(scheduleByWeek[index][j])" >
<div class="colorList" v-bind:style="{background:scheduleByWeek[index][j].color}"></div>
<div class="hoursList">{{ getHoursMinutes(scheduleByWeek[index][j].lessonStart)}}-{{getHoursMinutes(scheduleByWeek[index][j].lessonEnd)}}</div>
<div class="titleList">{{scheduleByWeek[index][j].course.title}}</div>
@ -374,7 +394,7 @@
</div>
<template v-if="scheduleByWeek != null">
<div class="body" style="background-color:#353535;" >
<div class="containerList" v-for="n,j in month[i].length">
<div class="containerList" v-for="n,j in month[i].length" @click.native="lessonFocus( month[i][j])">
<div class="colorList" v-bind:style="{background:month[i][j].color}"></div>
<div class="hoursList">{{ getHoursMinutes(month[i][j].lessonStart)}}-{{getHoursMinutes(month[i][j].lessonEnd)}}</div>
<div class="titleList">{{month[i][j].course.title}}</div>
@ -391,11 +411,9 @@
</div>
</div>
<div class="options">
<div class="settings">
<div class="body" style="background-color:rgb(50,50,50);margin:5% 0 5% 0;">Settings</div>
<select @change="changeSchedule()" v-model="trueSchedule">
<option v-for="item in allSchedules" :value='item'>{{item.curriculum.option}}</option>
</select>
@ -421,9 +439,27 @@
<option :value ="null">No Filter</option>
<option v-for="item in types" :value='item'>{{item}}</option>
</select>
</div>
<div v-if="focus != null" class="moreInfos">
<div class="body" style="background-color:rgb(50,50,50); height:10%; font-size:2em;" >More infos</div>
<div class="body" :style="{background:focus.color,height:auto,fontSize:1.2+'em', alignItems:center}">
{{focus.course.title}}</div>
<div class="body" style="background-color:rgb(50,50,50);">Teacher(s)</div>
<div class="body" style="background-color:#484848;">
<div>{{focus.course.owner.lastName}}</div>
<div v-for="element in focus.course.owner.assistants">
{{element.lastName}}
</div>
</div>
<div class="body" style="background-color:rgb(50,50,50);">Lessons</div>
<div class="body" style="background-color:#484848;"v-for="lesson in focusLessons">
{{ getHoursMinutes(lesson.lessonStart)}}-{{getHoursMinutes(lesson.lessonEnd)}}
{{ lesson.local}}
{{lesson.lessonType}}
</div>
</div>
</div>
</div>
</template>
@ -448,13 +484,36 @@
background-color:rgba(255,255,255,0.1);
}
.options{
display:flex;
flex-direction:column;
display:grid;
border-radius:20px;
grid-area:options;
background-color:rgba(255,255,255,0.1);
width:100%;
height:85vh;
grid-template-rows:30% 70%;
}
.settings{
display:flex;
flex-direction:column;
width:80%;
margin:0 auto 0 auto;
}
.settings select,.settings button{
margin-top:2%;
width:100%;
}
.moreInfos{
width:90%;
display:flex;
flex-direction:column;
margin:0 auto 0 auto;
overflow-y:scroll;
overflow-x:hidden;
}
.table{
@ -607,9 +666,10 @@
.body {
color:white;
margin-top:2%;
width:100%;
width:98%;
border:2px solid black;
border-radius:9px;
text-align:center;
}