Merge remote-tracking branch 'origin/master' into tonitch/feat/notifications
This commit is contained in:
@ -1,15 +1,12 @@
|
||||
<script setup>
|
||||
|
||||
import {
|
||||
addUninscReq, editChangeCurrReq, editChangeCurrReqTeacherState,
|
||||
editScholarshipReq,
|
||||
editUnregReq, getChangeCurrReqById,
|
||||
getScholarshipReqById,
|
||||
getUnregisterbyId
|
||||
editChangeCurrReq, editChangeCurrReqTeacherState,
|
||||
getChangeCurrReqById,
|
||||
} from "@/rest/requests.js";
|
||||
import i18n from "@/i18n.js";
|
||||
import {getSelf, getUser} from "@/rest/Users.js";
|
||||
import {reactive, ref} from "vue";
|
||||
import {getSelf} from "@/rest/Users.js";
|
||||
import {ref} from "vue";
|
||||
import AboutStudent from "@/Apps/Inscription/AboutStudent.vue";
|
||||
|
||||
const props = defineProps(["reqId"])
|
||||
@ -88,11 +85,6 @@ async function editChangeCurrReqTeacherApproval(state){
|
||||
"minfos minfos";
|
||||
}
|
||||
|
||||
.profilPic{
|
||||
width:100%;
|
||||
grid-area:profilPic;
|
||||
}
|
||||
|
||||
.globalInfos {
|
||||
grid-area:globalInfos;
|
||||
align-self :center;
|
||||
@ -108,13 +100,6 @@ async function editChangeCurrReqTeacherApproval(state){
|
||||
margin-top:7%;
|
||||
}
|
||||
|
||||
.subContainter{
|
||||
width:100%;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
border:4px solid black;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
min-width:350px;
|
||||
padding-bottom:50px;
|
||||
|
||||
@ -1,15 +1,11 @@
|
||||
<script setup>
|
||||
|
||||
import {
|
||||
addUninscReq,
|
||||
editExempReqState,
|
||||
editScholarshipReq,
|
||||
getExempReq,
|
||||
getScholarshipReqById
|
||||
} from "@/rest/requests.js";
|
||||
import i18n from "@/i18n.js";
|
||||
import {getUser} from "@/rest/Users.js";
|
||||
import {reactive, ref} from "vue";
|
||||
import {ref} from "vue";
|
||||
import AboutStudent from "@/Apps/Inscription/AboutStudent.vue";
|
||||
|
||||
const props = defineProps(["reqId"])
|
||||
@ -44,7 +40,7 @@ async function editExemp(newstate){
|
||||
<button @click="profile = !profile">{{ i18n("seeprofile") }}</button>
|
||||
</div>
|
||||
<div>
|
||||
<button>{{ i18n("dljustifdoc") }}</button>
|
||||
<button><a :href="req.justifDocument">{{ i18n("dljustifdoc") }}</a></button>
|
||||
</div>
|
||||
<div>
|
||||
<button v-if="req.state === 'Pending'" @click="req.state='Accepted';editExemp('Accepted')">{{ i18n("request.accept") }}</button>
|
||||
@ -76,11 +72,6 @@ async function editExemp(newstate){
|
||||
"minfos minfos";
|
||||
}
|
||||
|
||||
.profilPic{
|
||||
width:100%;
|
||||
grid-area:profilPic;
|
||||
}
|
||||
|
||||
.globalInfos {
|
||||
grid-area:globalInfos;
|
||||
align-self :center;
|
||||
@ -96,13 +87,6 @@ async function editExemp(newstate){
|
||||
margin-top:7%;
|
||||
}
|
||||
|
||||
.subContainter{
|
||||
width:100%;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
border:4px solid black;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
min-width:350px;
|
||||
padding-bottom:50px;
|
||||
|
||||
@ -1,20 +1,23 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {getSelf, getUser} from '../../rest/Users.js'
|
||||
import {getcurriculum} from "@/rest/curriculum.js";
|
||||
import {getSelf} from '../../rest/Users.js'
|
||||
import {getAllCurriculums, getcurriculum} from "@/rest/curriculum.js";
|
||||
import {getRegisters} from "@/rest/ServiceInscription.js";
|
||||
import {get} from "jsdom/lib/jsdom/named-properties-tracker.js";
|
||||
import {getExternalCurriculumByInscrReq} from "@/rest/externalCurriculum.js";
|
||||
import {ref} from "vue";
|
||||
import ExternalCurriculumList from "@/Apps/Inscription/ExternalCurriculumList.vue";
|
||||
import {editEquivalenceState} from "@/rest/requests.js";
|
||||
import {editEquivalenceState, imposeCurriculum} from "@/rest/requests.js";
|
||||
|
||||
const curriculums = await getAllCurriculums()
|
||||
const props = defineProps(['target']);
|
||||
const request = await getRegisters(props.target);
|
||||
const cursus = await getcurriculum(request.curriculum);
|
||||
const user = await getSelf();
|
||||
const list = ref(false);
|
||||
const externalCurriculum = await getExternalCurriculumByInscrReq(request.id)
|
||||
const impose = ref(false)
|
||||
const imposeCurr = ref(0)
|
||||
const imposed = ref(false)
|
||||
|
||||
//Get the parent page windowState to display the correct button
|
||||
const windowState = defineModel("windowState")
|
||||
@ -28,6 +31,10 @@ function getPP(){
|
||||
async function editEquivalence(id, newstate){
|
||||
await editEquivalenceState(id, newstate)
|
||||
}
|
||||
|
||||
async function refreshCursus(){
|
||||
cursus.value = await getcurriculum(request.curriculum)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -57,10 +64,10 @@ async function editEquivalence(id, newstate){
|
||||
{{ i18n("WantedCursus") }} : BAB {{cursus.year}} {{cursus.option}}
|
||||
</div>
|
||||
<div style="margin-top: 3%">
|
||||
<a :href="request.identityCard">{{ i18n("dlidentitycard") }}</a>
|
||||
<button v-if="request.admissionDocUrl != null">{{ i18n("dladmissiondoc") }}</button>
|
||||
<button><a :href="request.identityCard">{{ i18n("dlidentitycard") }}</a></button>
|
||||
<button v-if="request.admissionDocUrl != null"><a :href="request.admissionDocUrl">{{ i18n("dladmissiondoc") }}</a></button>
|
||||
</div>
|
||||
<div v-if="cursus.year > 1">
|
||||
<div v-if="externalCurriculum.length !== 0">
|
||||
<button style="background-color:rgb(105,05,105);margin-top: 3%" @click="list=!list" v-if="(user.role == 'Teacher' || user.role == 'Admin')">{{ i18n("seeextcur") }}</button>
|
||||
</div>
|
||||
</div>
|
||||
@ -73,9 +80,20 @@ async function editEquivalence(id, newstate){
|
||||
<div v-if="list==true">
|
||||
<ExternalCurriculumList :ext-curr-list="externalCurriculum" :mode="0"></ExternalCurriculumList>
|
||||
<div style="margin-left: 15%;margin-top: 5%;">
|
||||
<button style="margin-left: 2%" v-if="request.equivalenceState === 'Pending'" @click="list = false;editEquivalence(request.id, 'Accepted'); request.equivalenceState='Accepted'">{{i18n("acceptequiv")}}</button>
|
||||
<button style="margin-left: 2%" v-if="request.equivalenceState === 'Pending'" @click="list = false;editEquivalence(request.id, 'Refused'); request.equivalenceState='Refused'">{{i18n("refuseequiv")}}</button>
|
||||
<button style="margin-left: 2%" @click="list=false">Back</button>
|
||||
<button style="margin-left: 2%" v-if="request.equivalenceState === 'Pending' && !impose" @click="list = false;editEquivalence(request.id, 'Accepted'); request.equivalenceState='Accepted'">{{i18n("acceptequiv")}}</button>
|
||||
<button style="margin-left: 2%;margin-right: 3%" v-if="request.equivalenceState === 'Pending' && !impose" @click="list = false;editEquivalence(request.id, 'Refused'); request.equivalenceState='Refused'">{{i18n("refuseequiv")}}</button>
|
||||
<div v-if="!imposed && request.equivalenceState !== 'Accepted'" style="margin-top: 3%;margin-left: 1%">
|
||||
{{i18n("imposecurriculum")}}
|
||||
<input type="checkbox" v-model="impose" v-if="!imposed">
|
||||
<select v-if="impose" v-model="imposeCurr">
|
||||
<option v-for="item in curriculums" :value="item.curriculumId">Bac {{item.year}} {{item.option}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<button v-if="impose && !imposed" style="margin-left: 2%" @click="imposeCurriculum(request.id, imposeCurr);request.equivalenceState='Accepted';imposed=true;">{{ i18n("impose") }}</button>
|
||||
<div v-if="imposed">
|
||||
{{ i18n("gotimposed") }}
|
||||
</div>
|
||||
<button style="margin-left: 2%" @click="list=false;refreshCursus()">{{ i18n("courses.back") }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
<script setup>
|
||||
|
||||
import {addUninscReq, editScholarshipReq, getScholarshipReqById} from "@/rest/requests.js";
|
||||
import {editScholarshipReq, getScholarshipReqById} from "@/rest/requests.js";
|
||||
import i18n from "@/i18n.js";
|
||||
import {getUser} from "@/rest/Users.js";
|
||||
import {reactive, ref} from "vue";
|
||||
|
||||
const props = defineProps(["reqId"])
|
||||
@ -54,8 +53,8 @@ async function uploadandrefreshScholarshipRequest(){
|
||||
{{ i18n("login.guest.birthday") }} : {{user.birthDate.slice(0,10)}}
|
||||
</div>
|
||||
<div>
|
||||
<button @click="">{{ i18n("dltaxdoc") }}</button>
|
||||
<button style="margin-left: 2%">{{ i18n("dlresidency") }}</button>
|
||||
<button><a :href="req.taxDocUrl">{{ i18n("dltaxdoc") }}</a></button>
|
||||
<button style="margin-left: 2%"><a :href="req.residencyDocUrl">{{ i18n("dlresidency") }}</a></button>
|
||||
</div>
|
||||
<div v-if="req.state == 'Pending'" style="margin-top: 2%; margin-bottom: 2%;">
|
||||
{{i18n("enteramount")}}
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
import {ref} from "vue";
|
||||
import ExternalCurriculumList from "@/Apps/Inscription/ExternalCurriculumList.vue";
|
||||
import {getExternalCurriculumByUser} from "@/rest/externalCurriculum.js";
|
||||
import {getUserActualCourses} from "@/rest/courses.js";
|
||||
|
||||
const props = defineProps(['target'])
|
||||
const user = await getUser(props.target)
|
||||
@ -13,9 +12,6 @@
|
||||
const externalcurrlist = await getExternalCurriculumByUser(user.regNo)
|
||||
const extercurrlist = ref(false)
|
||||
|
||||
const courselist = await getUserActualCourses(user.regNo)
|
||||
console.log(courselist)
|
||||
|
||||
const watchingUser = await getSelf()
|
||||
function getPP(){
|
||||
if(user.profilePictureUrl === null){
|
||||
@ -23,17 +19,6 @@
|
||||
}
|
||||
return user.profilePictureUrl
|
||||
}
|
||||
|
||||
//Cette function renvoie l'année académique concernée si on est dans l'année 2023-2024 elle renvoie 2023
|
||||
//car dans la db l'année scolaire 2023-2024 est representée juste par 2023 (le même système s'applique pour chaque années on prend la borne inférieure
|
||||
function getYear(){
|
||||
let date = new Date();
|
||||
if (date.getMonth() <= 6){
|
||||
return date.getFullYear()-1
|
||||
}
|
||||
return date.getFullYear()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -60,7 +45,7 @@
|
||||
{{ i18n("login.guest.birthday") }} : {{user.birthDate}}
|
||||
</div>
|
||||
<div>
|
||||
<button v-if="watchingUser.role === 'Admin' || watchingUser.role === 'InscriptionService' || watchingUser.role === 'Secretary' || watchingUser.regNo === user.regNo">{{i18n("dlidentitycard")}}</button>
|
||||
<button v-if="watchingUser.role === 'Admin' || watchingUser.role === 'InscriptionService' || watchingUser.role === 'Secretary' || watchingUser.regNo === user.regNo"><a :href="user.identityCard">{{i18n("dlidentitycard")}}</a></button>
|
||||
</div>
|
||||
<div>
|
||||
<button @click="extercurrlist=!extercurrlist">{{i18n("seeextcur")}}</button>
|
||||
|
||||
@ -1,26 +1,15 @@
|
||||
<script setup>
|
||||
|
||||
import {
|
||||
addUninscReq,
|
||||
editScholarshipReq,
|
||||
editUnregReq,
|
||||
getScholarshipReqById,
|
||||
getUnregisterbyId
|
||||
} from "@/rest/requests.js";
|
||||
import i18n from "@/i18n.js";
|
||||
import {getUser} from "@/rest/Users.js";
|
||||
import {reactive, ref} from "vue";
|
||||
import {ref} from "vue";
|
||||
|
||||
const props = defineProps(["reqId"])
|
||||
const req = ref(await getUnregisterbyId(props.reqId))
|
||||
|
||||
function getPP(){
|
||||
if(user.profilePictureUrl === null){
|
||||
return "/Clyde.png"
|
||||
}
|
||||
return user.profilePictureUrl
|
||||
}
|
||||
|
||||
async function uploadandrefreshUnregRequest(state){
|
||||
await editUnregReq(req.value.id, state)
|
||||
req.value.state = state
|
||||
@ -69,15 +58,9 @@ async function uploadandrefreshUnregRequest(state){
|
||||
"minfos minfos";
|
||||
}
|
||||
|
||||
.profilPic{
|
||||
width:100%;
|
||||
grid-area:profilPic;
|
||||
}
|
||||
|
||||
.globalInfos {
|
||||
grid-area:globalInfos;
|
||||
align-self :center;
|
||||
|
||||
}
|
||||
|
||||
.body {
|
||||
@ -89,13 +72,6 @@ async function uploadandrefreshUnregRequest(state){
|
||||
margin-top:7%;
|
||||
}
|
||||
|
||||
.subContainter{
|
||||
width:100%;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
border:4px solid black;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
min-width:350px;
|
||||
padding-bottom:50px;
|
||||
|
||||
@ -2,9 +2,8 @@
|
||||
|
||||
import {reactive, ref} from "vue";
|
||||
import i18n from "@/i18n.js";
|
||||
import {getCourse} from "@/rest/courses.js";
|
||||
import {getcurriculum} from "@/rest/curriculum.js";
|
||||
import {uploadFile, uploadProfilePicture} from "@/rest/uploads.js";
|
||||
import {uploadFile} from "@/rest/uploads.js";
|
||||
import {createExemptionsRequest, getExempByUser} from "@/rest/requests.js";
|
||||
import {getSelf} from "@/rest/Users.js";
|
||||
|
||||
@ -14,7 +13,7 @@ const user = await getSelf()
|
||||
|
||||
const windowState = defineModel("windowState")
|
||||
const exempList = await getExempByUser(user.regNo)
|
||||
|
||||
const submitted = ref(false)
|
||||
const courseslist = ref(await getcurriculum(selectedCurriculum.value.curriculumId))
|
||||
const list = ref(true)
|
||||
|
||||
@ -57,7 +56,7 @@ function isExempted(course){
|
||||
<div class="firstname">{{item.owner.firstName}}</div>
|
||||
<div class="lastname">{{item.owner.lastName}}</div>
|
||||
<div class="credits">credits : {{item.credits}}</div>
|
||||
<div class="askexemption" v-if="!isExempted(item)"><button style="background-color:rgb(105,0,0);" @click="list= !list;exemptReq.courseId=item.courseId">{{i18n("askexemp")}}</button></div>
|
||||
<div class="askexemption" v-if="!isExempted(item)"><button style="background-color:rgb(105,0,0);" @click="list= !list;exemptReq.courseId=item.courseID;">{{i18n("askexemp")}}</button></div>
|
||||
<div v-else class="askexemption" style="font-size: 50%">{{ i18n("exemp") }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -66,19 +65,22 @@ function isExempted(course){
|
||||
<button @click="windowState = 0">{{ i18n("courses.back")}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list === false" class="infosContainer">
|
||||
<p>{{ i18n("uploadjustifdoc") }} </p>
|
||||
<div v-if="list === false" class="infosContainer">
|
||||
<p v-if="!submitted">{{ i18n("uploadjustifdoc") }} </p>
|
||||
<div>
|
||||
<label class="browser">
|
||||
<input type="file" @change="ppData.value = $event.target.files" accept="image/*" ref="filepath">
|
||||
<label class="browser" v-if="!submitted">
|
||||
<input type="file" @change="ppData.value = $event.target.files" ref="filepath">
|
||||
</label>
|
||||
</div>
|
||||
<button style="margin-top: 3%" @click="postExemptionRequest(ppData.value, 'JustificationDocument');">
|
||||
<button style="margin-top: 3%" v-if="!submitted" @click="postExemptionRequest(ppData.value, 'JustificationDocument');submitted=!submitted">
|
||||
{{ i18n("subexemreq") }}
|
||||
</button>
|
||||
<div v-if="submitted">
|
||||
{{i18n("reqsent")}}
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list === false">
|
||||
<button @click="list=!list">{{ i18n("courses.back") }}</button>
|
||||
<button @click="list=!list;submitted=!submitted">{{ i18n("courses.back") }}</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
completion : "completed",
|
||||
startYear : 0,
|
||||
endYear: 0,
|
||||
justifdocUrl : null,
|
||||
justifdocUrl : "",
|
||||
userRegNo : null
|
||||
})
|
||||
|
||||
@ -43,7 +43,6 @@
|
||||
|
||||
if(props.mode !== 2){
|
||||
extCurrList.value = props.extCurrList
|
||||
console.log("oe")
|
||||
}
|
||||
|
||||
function deleteExtCursus(extcursus){
|
||||
@ -86,7 +85,7 @@
|
||||
<div class="school"><a>{{item.school}}</a></div>
|
||||
<div class="formation"><a>{{item.formation}}</a></div>
|
||||
<div class="completion"><a>{{item.completion}}</a></div>
|
||||
<div class="download"><button>{{ i18n("dldoc") }}</button></div>
|
||||
<div class="download" v-if="props.mode!==2"><button><a :href="item.justifdocUrl">{{ i18n("dldoc") }}</a></button></div>
|
||||
<div class="edit" v-if="props.mode === 2"><button @click="list=!list;externalCurr.justifdocUrl=item.justifDocUrl; externalCurr.endYear = item.endYear; externalCurr.startYear = item.startYear; externalCurr.school = item.school;externalCurr.completion = item.completion;externalCurr.formation=item.formation;editmode=!editmode;extNum=index">{{i18n("edit")}}</button></div>
|
||||
<div class="delete" v-if="props.mode === 2"><button @click="deleteExtCursus(item)">{{ i18n("delete") }}</button></div>
|
||||
</div>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {ref, vModelSelect, watch} from 'vue'
|
||||
import {ref, watch} from 'vue'
|
||||
import {validateRegister, getAllRegisters } from '@/rest/ServiceInscription.js'
|
||||
import AboutRequest from "@/Apps/Inscription/AboutRequest.vue";
|
||||
import {
|
||||
@ -18,7 +18,7 @@
|
||||
const requests = ref(await getAllRegisters());
|
||||
let targetId = "";
|
||||
const user = await getSelf()
|
||||
const requestType = ref("inscription");
|
||||
const requestType = ref(i18n("inscription"));
|
||||
const filterType = ref("None");
|
||||
|
||||
//0 = liste, 1 = détails, 2 = sure?, 3 = manage scholarship, 4 manage unregister, 5 = manage curriculum change, 6 = manage exemptions
|
||||
@ -91,8 +91,8 @@
|
||||
<div class="equivalencestate" style="font-size: 80%">{{ i18n("teacherapproval") }} {{item.equivalenceState}}</div>
|
||||
<div class="surname">{{item.lastName}}</div>
|
||||
<div class="firstname">{{item.firstName}}</div>
|
||||
<div class="accept" v-if="item.state === 'Pending'"><button @click="windowsState=2;targetId=item.id;" style="background-color:rgb(0,105,50);">{{i18n("request.accept")}}</button></div>
|
||||
<div class="refuse" v-if="item.state === 'Pending'"><button @click="upPage(item.id,'Refused')" style="background-color:rgb(105,0,0);">{{i18n("request.refuse")}}</button></div>
|
||||
<div class="accept" v-if="item.state === 'Pending' && (user.role === 'Admin' || user.role === 'InscriptionService')"><button @click="windowsState=2;targetId=item.id;" style="background-color:rgb(0,105,50);">{{i18n("request.accept")}}</button></div>
|
||||
<div class="refuse" v-if="item.state === 'Pending' && (user.role === 'Admin' || user.role === 'InscriptionService')"><button @click="upPage(item.id,'Refused')" style="background-color:rgb(105,0,0);">{{i18n("request.refuse")}}</button></div>
|
||||
<div class="infos"><button style="background-color:rgb(105,05,105);" @click="targetId=item.id;windowsState=1;">{{i18n("request.moreInfos")}}</button></div>
|
||||
</div>
|
||||
<div class="container" style="grid-template-columns:25% 15% 15% 25% 14.2%;grid-template-areas:'date reqState studentfirstname studentlastname infos';" v-if="requestType === i18n('scholarship')">
|
||||
@ -131,10 +131,12 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style='display:flex; justify-content:center; min-width:1140px;margin-top: 10%' v-if="windowsState === 2">
|
||||
<div class="infosContainer" style='margin-left:15%;display:flex; justify-content:center; width: 70%;margin-top: 10%' v-if="windowsState === 2">
|
||||
<p>{{ i18n("surreq") }}</p>
|
||||
<button style="background-color:rgb(105,05,105);" @click="upPage(targetId,'Accepted');windowsState=0;">{{ i18n("validate") }}</button>
|
||||
<button style="background-color:rgb(105,05,105);" @click="windowsState=0;">{{ i18n("courses.back")}}</button>
|
||||
<div style="margin-left: 10%; margin-top: 1.5%; width: 30%">
|
||||
<button style="background-color:rgb(105,05,105);margin-right: 2%" @click="upPage(targetId,'Accepted');windowsState=0;">{{ i18n("validate") }}</button>
|
||||
<button style="background-color:rgb(105,05,105);" @click="windowsState=0;">{{ i18n("courses.back")}}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="windowsState === 3">
|
||||
<AboutScholarship :req-id="targetId"></AboutScholarship>
|
||||
@ -253,7 +255,15 @@
|
||||
background-color:rgb(50,50,50);
|
||||
}
|
||||
|
||||
|
||||
.infosContainer {
|
||||
padding-bottom:50px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js";
|
||||
import {ref} from "vue";
|
||||
import {getAllPayments} from "@/rest/requests.js";
|
||||
|
||||
const paymentsList = await getAllPayments()
|
||||
|
||||
218
frontend/src/Apps/LessonRequests.vue
Normal file
218
frontend/src/Apps/LessonRequests.vue
Normal file
@ -0,0 +1,218 @@
|
||||
|
||||
<!----------------------------------------------------
|
||||
File: LessonRequests.vue
|
||||
Author: William Karpinski
|
||||
Scope: Extension Horaire
|
||||
Description: Lesson Requests Management Page
|
||||
----------------------------------------------------->
|
||||
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {ref} from 'vue'
|
||||
import {changeRequestState, getAllRequests} from "@/rest/LessonRequests.js";
|
||||
import {getLesson} from "@/rest/lessonSchedule.js";
|
||||
import {formatDate, getHoursMinutes} from "@/scheduleFunctions.js";
|
||||
|
||||
const requests = ref(await getAllRequests());
|
||||
const AcceptMod = ref(false);
|
||||
const moreInfosMod = ref(false);
|
||||
const requestTypes = ["Create", "Modify", "Delete"]
|
||||
const editElementID = ref('');
|
||||
const chosenLocal = ref("");
|
||||
const locals = ["A0B1","A1B1","A2B1","A0B2"];
|
||||
const moreInfos = ref({});
|
||||
|
||||
|
||||
/*
|
||||
* Change a request's state and refreshes the requests '
|
||||
*/
|
||||
|
||||
async function upPage(id,review){
|
||||
await changeRequestState(id, review) ;
|
||||
requests.value = await getAllRequests();
|
||||
}
|
||||
|
||||
/*
|
||||
* Set correctly the variables after clicking on the ACCEPT button
|
||||
*/
|
||||
|
||||
async function AcceptSetup(id,type){
|
||||
if(type !== 2 ){
|
||||
editElementID.value = id
|
||||
AcceptMod.value = true;
|
||||
}
|
||||
else{
|
||||
await upPage(id,{local: null,state:'Accepted'});
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Set the infos to show when clicking MORE INFOS
|
||||
*/
|
||||
async function setMoreInfos(item){
|
||||
|
||||
moreInfos.value = Object.assign({},{})
|
||||
moreInfos.value["requestType"] = requestTypes[item.requestType]
|
||||
if(item.requestType == 0 || item.requestType == 1){
|
||||
moreInfos.value["day"] = item.lessonStart == null ? null : formatDate(new Date(item.lessonStart))
|
||||
moreInfos.value["start"] = item.lessonStart == null ? null : getHoursMinutes(new Date(item.lessonStart))
|
||||
moreInfos.value["end"] = item.lessonEnd == null ? null : getHoursMinutes(new Date(item.lessonEnd))
|
||||
moreInfos.value["lessonType"] = item.lessonType;
|
||||
moreInfos.value["course"] = item["course"] == null ? null:item.course.title}
|
||||
if (item.requestType==1 || item.requestType == 2){
|
||||
let temp = await getLesson(item.lessonId);
|
||||
if(item.requestType == 1 || item.requestType == 2){
|
||||
moreInfos.value["course"] = temp.course.title;
|
||||
moreInfos.value[item.requestType == 2 ? "day" : "old_day"] = formatDate(new Date(temp.lessonStart));
|
||||
moreInfos.value[item.requestType == 2 ? "start" : "old_start"] = getHoursMinutes(new Date(temp.lessonStart));
|
||||
moreInfos.value[item.requestType == 2 ? "end":"old_end"] = getHoursMinutes(new Date(temp.lessonEnd));
|
||||
moreInfos.value[item.requestType == 2 ? "lessonType":"old_type"] = temp.lessonType;
|
||||
}}
|
||||
editElementID.value = item.id ;
|
||||
moreInfosMod.value =true;
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<template>
|
||||
|
||||
<div class="body">
|
||||
<div v-for="item of requests" :key="item.id" :style="{width:[moreInfosMod ? 95:70] + '%'}" class="center">
|
||||
|
||||
<button v-if="moreInfosMod && editElementID == item.id" @click="moreInfosMod = false; editElementID = ''; moreInfos='';">{{i18n("courses.back")}}</button>
|
||||
<div v-if ="item.state === 'Pending'" class="listElement">
|
||||
<div class="containerElement" v-if="editElementID !== item.id">
|
||||
<div class="id">{{i18n(requestTypes[item.requestType].toString())}}</div>
|
||||
<div class="surname">{{i18n(item.state.toString())}}</div>
|
||||
<div class="firstname">{{item.user.lastName}}</div>
|
||||
|
||||
<div class="infos">
|
||||
<button @click=" setMoreInfos(item);" style="background-color:rgb(105,05,105);" >
|
||||
{{i18n("request.moreInfos")}}
|
||||
</button></div>
|
||||
<div class="accept"><button @click="AcceptSetup(item.id,item.requestType);" style="background-color:rgb(0,105,50);">{{i18n("request.accept")}}</button></div>
|
||||
<div class="refuse"><button @click="upPage(item.id,{local: null,state:'Refused'})" style="background-color:rgb(105,0,0);">{{i18n("request.refuse")}}</button></div>
|
||||
</div>
|
||||
|
||||
<div v-else class="containerElement" style="width:auto; height:auto;">
|
||||
<div v-if="AcceptMod" style="margin-left:20%;">
|
||||
Local:
|
||||
<select v-model="chosenLocal">
|
||||
<option v-for="item in locals">{{item}}</option>
|
||||
</select>
|
||||
<button @click="AcceptMod = false;upPage(item.id,{local: chosenLocal, state:'Accepted'})">{{i18n("request.accept")}}</button>
|
||||
</div>
|
||||
<template v-if="moreInfosMod" v-for="(key,value) in moreInfos">
|
||||
|
||||
<div class="container" v-if="key != null" style="align-self:center;">
|
||||
<div style="margin:0 auto 0 auto">
|
||||
{{i18n(value.toString())}}:
|
||||
{{key}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
|
||||
.center{
|
||||
margin:0 auto 0 auto;
|
||||
}
|
||||
|
||||
|
||||
.containerElement{
|
||||
justify-content:center;
|
||||
display:grid;
|
||||
grid-template-columns:10% 14.2% 19% 14.2% 14.2% 14.2% 14.2%;
|
||||
grid-template-areas:
|
||||
"id type surname firstname infos accept refuse";
|
||||
column-gap:10px; }
|
||||
|
||||
.container{
|
||||
padding-left:50px;
|
||||
font-size:.8em;
|
||||
justify-content:center;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
grid-template-rows: repeat(auto-fill, 120px);
|
||||
grid-row-gap: 1em;
|
||||
|
||||
grid-column-gap: 0.2em;
|
||||
|
||||
}
|
||||
|
||||
.listElement{
|
||||
min-width:625px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
margin-bottom:10px;
|
||||
|
||||
}
|
||||
.infos {
|
||||
grid-area:infos;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.accept{
|
||||
grid-area:accept;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.refuse{
|
||||
grid-area:refuse;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.id{
|
||||
grid-area:id;
|
||||
margin-left:40px;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
|
||||
.surname{
|
||||
grid-area:surname;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
|
||||
.firstname{
|
||||
grid-area:firstname;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
|
||||
button{
|
||||
font-size:15px;
|
||||
height:50px;
|
||||
width:100px;
|
||||
border:none;
|
||||
border-radius:20px;
|
||||
|
||||
}
|
||||
|
||||
.body {
|
||||
width:100%;
|
||||
margin-top:3.5%;
|
||||
}
|
||||
button:hover{
|
||||
opacity:0.8;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
import {reactive, ref } from 'vue'
|
||||
import i18n from '@/i18n.js'
|
||||
import {login, register, disconnect, isLogged} from '@/rest/Users.js'
|
||||
import {getAllCurriculums, getcurriculum} from '@/rest/curriculum.js'
|
||||
import {getAllCurriculums} from '@/rest/curriculum.js'
|
||||
import {uploadFile, uploadProfilePicture} from '@/rest/uploads.js'
|
||||
import {toast} from 'vue3-toastify'
|
||||
import 'vue3-toastify/dist/index.css';
|
||||
@ -31,8 +31,9 @@
|
||||
const passwordConfirm=ref("")
|
||||
|
||||
const imageSaved = ref(false)
|
||||
let ppData = ""
|
||||
|
||||
|
||||
const ppData = ref({})
|
||||
const idcardfile = ref({})
|
||||
const justifcardfile = ref({})
|
||||
|
||||
@ -58,11 +59,6 @@
|
||||
disconnect();
|
||||
window.location.reload();}
|
||||
|
||||
async function uploadPP(arg){
|
||||
const data = await uploadProfilePicture(arg);
|
||||
ppData = data.url;
|
||||
}
|
||||
|
||||
//This functions makes the distinction between a master cursus (year 4 or more) and a bachelor cursus (year 3 or less)
|
||||
function getCursusDisplay(cursus){
|
||||
if (cursus.year <= 3){
|
||||
@ -77,6 +73,7 @@
|
||||
//We upload the two files and we get their paths on the server
|
||||
const identityCardFile = await uploadFile(idcardfile.value, "IdentityCard")
|
||||
const justifFile = ref(null)
|
||||
const profilepic = await uploadProfilePicture(ppData.value)
|
||||
|
||||
if (curricula[outputs.curriculum-1].requireCertificate){
|
||||
justifFile.value = await uploadFile(justifcardfile.value, "JustificationDocument")
|
||||
@ -89,7 +86,7 @@
|
||||
justif = null
|
||||
}
|
||||
|
||||
const val = await register(outputs.firstname, outputs.surname, outputs.birthday, outputs.password, outputs.email, outputs.address, outputs.country, outputs.curriculum, ppData, identityCardFile.url, new Date(), outputs.equivalenceState, justif);
|
||||
const val = await register(outputs.firstname, outputs.surname, outputs.birthday, outputs.password, outputs.email, outputs.address, outputs.country, outputs.curriculum, profilepic.url, identityCardFile.url, new Date(), outputs.equivalenceState, justif);
|
||||
|
||||
for (let item in externalCurrTab.value){
|
||||
const temp = await uploadFile(externalCurrTab.value[item].justifdocUrl, "JustificationDocument")
|
||||
@ -178,10 +175,10 @@
|
||||
</form>
|
||||
<label class="browser">
|
||||
{{i18n("login.guest.browse")}}
|
||||
<input type="file" :disabled="imageSaved" @change="ppData = uploadProfilePicture($event.target.files); imageSaved = true;" accept="image/*">
|
||||
<input type="file" :disabled="imageSaved" @change="ppData = $event.target.files; imageSaved = true;" accept="image/*">
|
||||
</label>
|
||||
<form novalidate enctype="multipart/form-data" class="inputBox">
|
||||
<input type="file" @change="uploadPP($event.target.files); imageSaved = true;" accept="image/*">
|
||||
<input type="file" @change="imageSaved = true;" accept="image/*">
|
||||
</form>
|
||||
<div class="inputBox">
|
||||
<p>{{i18n("Curriculum").toUpperCase()}}</p>
|
||||
@ -221,15 +218,17 @@
|
||||
</div>
|
||||
</div>
|
||||
<button @click="page++;" style="margin-top: 10%">{{i18n("login.guest.nextpage")}}</button>
|
||||
|
||||
</div>
|
||||
<div v-if="page === 3">
|
||||
<p style="color:rgb(239,60,168);margin-bottom: 5%">
|
||||
{{i18n("login.guest.formationdisclaimer")}}
|
||||
</p>
|
||||
<button @click="page++">{{i18n("login.guest.managecareer")}}</button>
|
||||
<button @click="postRegisterReq();">{{ i18n("login.guest.sendRegReq") }}</button>
|
||||
<button @click="postRegisterReq();page+=2">{{ i18n("login.guest.sendRegReq") }}</button>
|
||||
</div>
|
||||
<div v-if="page===5" style="margin-left: 7%">
|
||||
<p style="color: rgb(239,60,168);">{{i18n("reqsent")}}</p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
@ -297,13 +296,7 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bodu {
|
||||
margin-top:2%;
|
||||
width:50%;
|
||||
border:2px solid black;
|
||||
border-radius:9px;
|
||||
background-color:rgb(50,50,50);
|
||||
}
|
||||
|
||||
|
||||
.switchpage{
|
||||
width:100px;
|
||||
@ -342,22 +335,8 @@ input[type=file]{
|
||||
background:#FFFFFF;
|
||||
}
|
||||
|
||||
.container{
|
||||
margin-top: 2%;
|
||||
color:white;
|
||||
height:60px;
|
||||
font-size:30px;
|
||||
display:grid;
|
||||
grid-template-columns:30% 30% 20% 20%;
|
||||
grid-template-areas:
|
||||
"school formation completion edit remove";
|
||||
column-gap:10px;
|
||||
}
|
||||
|
||||
button:active ,.switchpage:active{
|
||||
opacity:0.8;
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
@ -35,7 +35,6 @@
|
||||
let isnull= false;
|
||||
|
||||
for(const [key, value] of Object.entries(toAdd)){
|
||||
console.log(toAdd.owner);
|
||||
if(value === null){
|
||||
isnull=true;
|
||||
}
|
||||
@ -64,17 +63,14 @@
|
||||
|
||||
async function patchCourse(course){
|
||||
for (let element in toModify){
|
||||
console.log(toModify,1)
|
||||
console.log(toModify[element],2)
|
||||
|
||||
if (element =="owner" && (toModify[element].regNo != course.owner.regNo)){
|
||||
await alterCourse(course.courseId,{owner:toModify[element].regNo});
|
||||
await alterCourse(course.courseID,{owner:toModify[element].regNo});
|
||||
}
|
||||
else if(element == "title" && (toModify[element] != course.title)){
|
||||
await alterCourse(course.courseId,{title:toModify[element]});
|
||||
await alterCourse(course.courseID,{title:toModify[element]});
|
||||
}
|
||||
else if(element == "credits" && (parseInt(toModify[element]) != course.credits)){
|
||||
await alterCourse(course.courseId,{credits:parseInt(toModify[element])});
|
||||
await alterCourse(course.courseID,{credits:parseInt(toModify[element])});
|
||||
}
|
||||
}
|
||||
toModify= Object.assign({},pattern);
|
||||
@ -159,11 +155,11 @@
|
||||
</div>
|
||||
<div class="containerElement"v-else>
|
||||
<input style="max-width:200px;" class="name" v-model="toModify.title">
|
||||
<select v-if="self.role === 'Secretary'" style="max-width:200px;" class="teacher" v-model="toModify.owner">
|
||||
<select v-if="self.role != 'Secretary'" style="max-width:200px;" class="teacher" v-model="toModify.owner">
|
||||
<option v-for="(item,index) in profList" :value='item'>{{item.lastName}}</option>
|
||||
</select>
|
||||
<div v-else class="teacher">{{item.owner.lastName}}</div>
|
||||
<input v-if="self.role==='Secretary'"style="max-width:100px;"class="credits" v-model="toModify.credits">
|
||||
<input v-if="self.role !='Secretary'"style="max-width:100px;"class="credits" v-model="toModify.credits">
|
||||
<div v-else class="credits">{{i18n("Credits")}}:{{item.credits}}</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -177,17 +173,6 @@
|
||||
margin-top:3.5%;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
min-width:350px;
|
||||
padding-bottom:50px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
}
|
||||
|
||||
.containerElement{
|
||||
justify-content:center;
|
||||
display:grid;
|
||||
|
||||
277
frontend/src/Apps/ManageOwnLessons.vue
Normal file
277
frontend/src/Apps/ManageOwnLessons.vue
Normal file
@ -0,0 +1,277 @@
|
||||
<!----------------------------------------------------
|
||||
File: LessonRequests.vue
|
||||
Author: William Karpinski
|
||||
Scope: Extension Horaire
|
||||
Description: Lessons Management Page for the teachers
|
||||
----------------------------------------------------->
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import i18n from '@/i18n.js'
|
||||
import {formatDate,invertedFormatDate,getHoursMinutes,sortByDate, createLessonEvent} from '../scheduleFunctions.js'
|
||||
import {getOwnedLessons} from "@/rest/lessonSchedule.js";
|
||||
import {getSelf} from "@/rest/Users.js";
|
||||
import {createRequest} from "@/rest/LessonRequests.js"
|
||||
import {getcurriculum} from "@/rest/curriculum.js";
|
||||
import {getAllSchedule} from "@/rest/scheduleRest.js";
|
||||
|
||||
|
||||
const curriculum = ref();
|
||||
const allSchedules = ref(await getAllSchedule());
|
||||
const schedule = ref(await getOwnedLessons());
|
||||
schedule.value.sort((a,b) => sortByDate(b,a))
|
||||
const createMod = ref(false);
|
||||
const user = await getSelf();
|
||||
const editElementID = ref();
|
||||
const requestType = ref(0);
|
||||
const currentDate = new Date();
|
||||
const types = ["TP","TD","Course","Exam"];
|
||||
const colors = {"TP":"rgb(36,175,255)","TD":"rgb(255,36,175)","Exam":"rgb(175,255,36)","Course":"rgb(255,36,175)"}
|
||||
const courses = ref();
|
||||
|
||||
const maxDate = ref(invertedFormatDate(new Date([currentDate.getMonth()<7 ? currentDate.getFullYear() : (currentDate.getFullYear())+1],7,31)));
|
||||
|
||||
const minDate = ref(invertedFormatDate((new Date()).setDate(currentDate.getDate()+1)))
|
||||
|
||||
/*
|
||||
* Checks if a lesson is in the future or not
|
||||
*/
|
||||
function inFuture(lesson){
|
||||
let toCompare = new Date(lesson.lessonStart);
|
||||
let current = new Date();
|
||||
return (current < toCompare)
|
||||
}
|
||||
|
||||
|
||||
async function setCourses(){
|
||||
courses.value = (await getcurriculum(curriculum.value.curriculumId)).courses
|
||||
}
|
||||
|
||||
const pattern = {
|
||||
"lessonId":null,
|
||||
"course": null,
|
||||
"day":null,
|
||||
"lessonStart": null,
|
||||
"lessonEnd": null,
|
||||
"lessonType": null,
|
||||
}
|
||||
const patternRequest ={
|
||||
"user": user.regNo,
|
||||
"state": "Pending",
|
||||
"requestType": 0,
|
||||
"lessonId":null,
|
||||
"lessonType":null,
|
||||
"lessonStart":null,
|
||||
"lessonEnd":null,
|
||||
"color":null,
|
||||
"course":0,}
|
||||
|
||||
const toModify = ref(Object.assign({}, pattern));
|
||||
const requestBuffer = ref(Object.assign({},patternRequest));
|
||||
|
||||
function setModify(lesson){
|
||||
toModify.value.lessonId = editElementID.value;
|
||||
toModify.value.day = invertedFormatDate(new Date(lesson.lessonStart));
|
||||
toModify.value.lessonStart = getHoursMinutes(lesson.lessonStart);
|
||||
toModify.value.lessonEnd = getHoursMinutes(lesson.lessonEnd);
|
||||
toModify.value.lessonType = lesson.lessonType
|
||||
}
|
||||
|
||||
function setCreate(){
|
||||
toModify.value = ref(Object.assign({},pattern));
|
||||
createMod.value = !createMod.value;
|
||||
}
|
||||
|
||||
/*
|
||||
* Constructs a request and posts it
|
||||
*/
|
||||
async function createLessonRequest(){
|
||||
if(requestType.value === 0 || requestType.value === 1){
|
||||
//modify
|
||||
requestBuffer.value.color = colors[toModify.value.lessonType] ;
|
||||
requestBuffer.value.requestType = requestType.value;
|
||||
requestBuffer.value.course = toModify.value.course;
|
||||
let start = createLessonEvent(toModify.value.day,toModify.value.lessonStart)
|
||||
let end = createLessonEvent(toModify.value.day,toModify.value.lessonEnd)
|
||||
for (let element in toModify.value){
|
||||
if(element !== "day" && element !== "lessonStart" && element !== "lessonEnd"){
|
||||
requestBuffer.value[element] = toModify.value[element];
|
||||
}
|
||||
if(element === "lessonStart"){
|
||||
requestBuffer.value.lessonStart = start;
|
||||
}
|
||||
if(element === "lessonEnd"){
|
||||
requestBuffer.value.lessonEnd = end;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
else if(requestType.value === 2 || requestType.value === 1) {
|
||||
//delete
|
||||
requestBuffer.value.lessonId = editElementID;
|
||||
requestBuffer.value.requestType = requestType.value;
|
||||
}
|
||||
await createRequest(requestBuffer.value);
|
||||
editElementID.value = '';
|
||||
}
|
||||
|
||||
/*
|
||||
* Creates a request of a certain type
|
||||
* 0 = CREATE REQUEST
|
||||
* 1 = MODIFY REQUEST
|
||||
* 2 = DELETE REQUEST
|
||||
*/
|
||||
async function askChanges(i){
|
||||
requestType.value= i;
|
||||
await createLessonRequest()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
<div class="body">
|
||||
<div v-if="createMod">
|
||||
<form class="listElement" style="width:40%; margin:0 auto 0 auto;">
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("schedule")}} :
|
||||
<select @change="setCourses()"v-model="curriculum">
|
||||
<option v-for="item in allSchedules" :value='item.curriculum'>{{item.curriculum.option}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("course")}}:
|
||||
<select v-if="curriculum != null" v-model="toModify.course">
|
||||
<option v-for="item in courses" :value='item.courseID'>{{item.title}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("day")}}:
|
||||
<input type="date" :min="minDate" :max="maxDate" v-model="toModify.day">
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("start")}}:
|
||||
<input v-model="toModify.lessonStart" type="time" min="08:00" max="18:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("end")}}:
|
||||
<input v-model="toModify.lessonEnd" type="time" min="10:00" max="20:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Type:
|
||||
<select v-model="toModify.lessonType">
|
||||
<option v-for="item in types" :value='item'>{{i18n(item)}}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<button class="create" @click="createMod=!createMod; askChanges(0);"> {{i18n("courses.confirm")}} </button>
|
||||
<button style="float:right;" @click="createMod=!createMod">{{i18n("courses.back")}}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<button v-if="!createMod" @click="setCreate()" style="display:flex; margin:0 auto 0 auto;">{{i18n("schedule.askCreate")}}</button>
|
||||
<div v-if="!createMod"v-for="element in schedule" style="width:50%;margin-left:auto; margin-right:auto;" >
|
||||
<div v-if="editElementID !== element.lessonID" style ="padding:15px 15px 15px 15px;">
|
||||
<button v-if="inFuture(element)" @click="editElementID = element.lessonID;setModify(element);">
|
||||
{{i18n("schedule.askChanges")}}
|
||||
</button>
|
||||
</div>
|
||||
<div v-else>
|
||||
<button @click="askChanges(1);"> {{i18n("courses.confirm")}} </button>
|
||||
<button @click="editElementID= '';"> {{i18n("courses.back")}} </button>
|
||||
</div>
|
||||
<div class="listElement">
|
||||
<div v-if="editElementID !== element.lessonID">
|
||||
<div>
|
||||
{{element.course.title}}
|
||||
</div>
|
||||
<div>{{formatDate(element.lessonStart)}}</div>
|
||||
<div>{{getHoursMinutes(element.lessonStart)}}-{{getHoursMinutes(element.lessonEnd)}}
|
||||
</div>
|
||||
<div>{{element.local}}</div>
|
||||
<div>{{i18n(element.lessonType)}}</div>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<div>{{element.course.title}}</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("day")}}:
|
||||
<input type="date" :min="minDate" :max="maxDate" v-model="toModify.day">
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("start")}}:
|
||||
<input v-model="toModify.lessonStart" type="time" min="8:00" max="20:00"/>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("end")}}:
|
||||
<input v-model="toModify.lessonEnd" type="time" min="10:00" max="20:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("Type")}}:
|
||||
<select v-model="toModify.lessonType">
|
||||
<option v-for="item in types" :value='item'>{{i18n(item)}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Local:
|
||||
{{element.local}}
|
||||
<div style="float:right;">
|
||||
<button @click="askChanges(2)" class="delete"> {{i18n("schedule.askDeletion")}} </button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.body {
|
||||
width:100%;
|
||||
margin-top:3.5%;
|
||||
}
|
||||
|
||||
.listElement{
|
||||
min-width:625px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
margin-bottom:10px;
|
||||
|
||||
}
|
||||
|
||||
input, select{
|
||||
padding:10px 10px 10px 10px;
|
||||
font-size:25px;
|
||||
cursor: pointer;
|
||||
border:none;
|
||||
border-radius:15px;
|
||||
}
|
||||
button{
|
||||
font-size:15px;
|
||||
height:auto;
|
||||
width:100px;
|
||||
border:none;
|
||||
border-radius:20px;
|
||||
|
||||
}
|
||||
|
||||
.delete{
|
||||
grid-area:delete;
|
||||
background-color:rgb(200,0,0);
|
||||
}
|
||||
button:hover{
|
||||
opacity:0.8;
|
||||
}
|
||||
|
||||
</style>
|
||||
506
frontend/src/Apps/ManageSchedule.vue
Normal file
506
frontend/src/Apps/ManageSchedule.vue
Normal file
@ -0,0 +1,506 @@
|
||||
|
||||
<!----------------------------------------------------
|
||||
File: LessonRequests.vue
|
||||
Author: William Karpinski
|
||||
Scope: Extension Horaire
|
||||
Description: Lessons Management Page for the secretary
|
||||
----------------------------------------------------->
|
||||
|
||||
<script setup>
|
||||
|
||||
import { ref } from 'vue'
|
||||
import i18n from '@/i18n.js'
|
||||
import {formatDate,getHoursMinutes, invertedFormatDate, createLessonEvent} from '../scheduleFunctions.js'
|
||||
import {getAllSchedule, deleteLessonFromSchedule ,getSchedule, createSchedule} from "@/rest/scheduleRest.js";
|
||||
import {getLessons, createLesson, alterLesson, deleteLesson} from "@/rest/lessonSchedule.js"
|
||||
import {getTeachers} from "@/rest/Users.js"
|
||||
import {getcurriculum, getAllCurriculums} from "@/rest/curriculum.js"
|
||||
|
||||
const trueSchedule = ref()
|
||||
const schedule = ref();
|
||||
const lessonFinder = ref();
|
||||
const curriculum = ref();
|
||||
const allSchedules = ref(await getAllSchedule());
|
||||
const filter = ref("null");
|
||||
const subFilter = ref("null");
|
||||
const filters = ["Type","Teacher","Course"];
|
||||
const types = ["TP","TD","Course","Exam"];
|
||||
const locals = ["A0B1","A1B1","A2B1","A0B2"]
|
||||
const teachers = await getTeachers() ;
|
||||
const allCurriculum = ref();
|
||||
const courses = ref();
|
||||
|
||||
const createScheduleMod = ref(false);
|
||||
const createMod = ref(false);
|
||||
const deleteMod = ref(false);
|
||||
|
||||
const colors = {"TP":"rgb(36,175,255)","TD":"rgb(255,36,175)","Exam":"rgb(175,255,36)","Course":"rgb(255,36,175)"}
|
||||
const currentDate = new Date();
|
||||
|
||||
const editElementID = ref();
|
||||
|
||||
const maxDate = ref(invertedFormatDate(new Date([currentDate.getMonth()<7 ? currentDate.getFullYear() : (currentDate.getFullYear())+1],7,31)));
|
||||
|
||||
const minDate = ref(invertedFormatDate((new Date()).setDate(currentDate.getDate()+1)))
|
||||
|
||||
|
||||
const pattern = {
|
||||
"course": null,
|
||||
"day":null,
|
||||
"lessonStart": null,
|
||||
"lessonEnd": null,
|
||||
"lessonType": null,
|
||||
"local": null,
|
||||
"color": null,
|
||||
}
|
||||
|
||||
const lessonCreator = {
|
||||
"courseID" : null,
|
||||
"lessonStart":null,
|
||||
"lessonEnd":null,
|
||||
"lessonType":null,
|
||||
"local":null,
|
||||
"color":null,
|
||||
}
|
||||
|
||||
const patternModify = {
|
||||
"day": null,
|
||||
"lessonStart": null,
|
||||
"lesssonEnd": null,
|
||||
"local":null,
|
||||
"lessonType":null,
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Sets up allCurriculum to contain only the curriculums that don't have any schedule
|
||||
*/
|
||||
async function setCurriculum(){
|
||||
const temp = await getAllCurriculums();
|
||||
let isIn = false;
|
||||
let toReturn =[] ;
|
||||
for (let element in temp){
|
||||
for (let item in allSchedules.value){
|
||||
console.log(allSchedules.value[item])
|
||||
console.log(temp[element])
|
||||
if((allSchedules.value[item].curriculum.option == temp[element].option) && (allSchedules.value[item].curriculum.year == temp[element].year)){
|
||||
|
||||
isIn = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if(!isIn){
|
||||
toReturn.push(temp[element])
|
||||
}
|
||||
isIn = false;
|
||||
}
|
||||
allCurriculum.value = toReturn.slice();
|
||||
}
|
||||
|
||||
|
||||
const toModify = ref(Object.assign({}, pattern));
|
||||
const lessonBuffer = ref(Object.assign({}, pattern));
|
||||
const lessonCreatorBuffer = ref(Object.assign({},lessonCreator));
|
||||
|
||||
|
||||
function setModify(lesson){
|
||||
toModify.value.day = invertedFormatDate(new Date(lesson.lessonStart));
|
||||
toModify.value.lessonStart = getHoursMinutes(lesson.lessonStart);
|
||||
toModify.value.lessonEnd = getHoursMinutes(lesson.lessonEnd);
|
||||
toModify.value.local = lesson.local;
|
||||
toModify.value.lessonType = lesson.lessonType;
|
||||
}
|
||||
|
||||
function inFuture(lesson){
|
||||
let toCompare = new Date(lesson.lessonStart);
|
||||
let current = new Date();
|
||||
return (current < toCompare)
|
||||
}
|
||||
|
||||
async function setCourses(){
|
||||
courses.value = (await getcurriculum(curriculum.value.curriculumId)).courses
|
||||
}
|
||||
|
||||
/*
|
||||
* Sort the lessons via a criteria
|
||||
*/
|
||||
function sortSchedule(){
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
if(filter.value =="Teacher"){
|
||||
schedule.value = sortByTeacher(schedule.value,subFilter.value);
|
||||
|
||||
}
|
||||
else if(filter.value =="Type"){
|
||||
schedule.value = sortByType(schedule.value,subFilter.value);
|
||||
}
|
||||
else if(filter.value =="Course"){
|
||||
schedule.value = sortByCourse(schedule.value,subFilter.value);
|
||||
}
|
||||
}
|
||||
|
||||
function sortByType(lessons,type){
|
||||
if(type == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].lessonType == type){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
function sortByCourse(lessons,course){
|
||||
if(course == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].course.courseID == course.courseID){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
function sortByTeacher(lessons, teacher){
|
||||
if(teacher == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].course.owner.regNo == teacher.regNo){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
/*
|
||||
* Change the schedule filter
|
||||
*/
|
||||
async function changeSchedule(){
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
curriculum.value = trueSchedule.value.curriculum;
|
||||
|
||||
courses.value = (await getcurriculum(curriculum.value.curriculumId)).courses;
|
||||
filter.value = "null";
|
||||
subFilter.value = "null"
|
||||
}
|
||||
|
||||
|
||||
async function newLesson(){
|
||||
let isnull = false;
|
||||
if (lessonBuffer.value.lessonType != null){
|
||||
lessonBuffer.value.color = colors[lessonBuffer.value.lessonType];
|
||||
for(let element in lessonBuffer.value){
|
||||
if(lessonBuffer.value[element] == null){
|
||||
isnull=true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if(!isnull){
|
||||
|
||||
let start = createLessonEvent(lessonBuffer.value.day,lessonBuffer.value.lessonStart)
|
||||
let end = createLessonEvent(lessonBuffer.value.day,lessonBuffer.value.lessonEnd)
|
||||
|
||||
lessonCreatorBuffer.value.lessonStart = start;
|
||||
lessonCreatorBuffer.value.lessonEnd = end;
|
||||
lessonCreatorBuffer.value.color = lessonBuffer.value.color;
|
||||
lessonCreatorBuffer.value.lessonType =lessonBuffer.value.lessonType;
|
||||
lessonCreatorBuffer.value.local = lessonBuffer.value.local;
|
||||
lessonCreatorBuffer.value.courseID = lessonBuffer.value.course.courseID;
|
||||
|
||||
await createLesson(lessonCreatorBuffer.value);
|
||||
|
||||
lessonFinder.value = await getLessons();
|
||||
|
||||
}
|
||||
}
|
||||
lessonBuffer.value = Object.assign({}, pattern);
|
||||
lessonFinder.value = null;
|
||||
lessonCreatorBuffer.value = Object.assign({},lessonCreator)
|
||||
trueSchedule.value = null;
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* Modify a lesson
|
||||
*/
|
||||
|
||||
async function patchLesson(lesson){
|
||||
|
||||
for (let element in toModify.value){
|
||||
if (element =="lessonType" && (toModify.value[element] != lesson[element])){
|
||||
await alterLesson(lesson.lessonID,{lessonType:toModify.value[element]});
|
||||
}
|
||||
if (element =="local" && (toModify.value[element] != lesson[element])){
|
||||
await alterLesson(lesson.lessonID,{local:toModify.value[element]});
|
||||
}
|
||||
if (element =="lessonStart" && (toModify.value[element] != lesson[element])){
|
||||
await alterLesson(lesson.lessonID,{lessonStart:createLessonEvent(toModify.value.day,toModify.value[element])
|
||||
});
|
||||
}
|
||||
if (element =="lessonEnd" && (toModify.value[element] != lesson[element])){
|
||||
await alterLesson(lesson.lessonID,{lessonEnd:createLessonEvent(toModify.value.day,toModify.value[element])
|
||||
});
|
||||
}
|
||||
if(element == "day" && (toModify.value[element] != invertedFormatDate(new Date(lesson.lessonStart))) ){
|
||||
|
||||
if(toModify.value.lessonStart == lesson.lessonStart){
|
||||
await alterLesson(lesson.lessonID,{lessonStart:createLessonEvent(toModify.value.day,lesson.lessonStart)
|
||||
});}
|
||||
if(toModify.value.lessonEnd == lesson.lessonEnd){
|
||||
await alterLesson(lesson.lessonID,{lessonStart:createLessonEvent(toModify.value.day,lesson.lessonStart)});
|
||||
}
|
||||
}
|
||||
}
|
||||
toModify.value= Object.assign({},patternModify);
|
||||
trueSchedule.value = await getSchedule(trueSchedule.value.scheduleId);
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
editElementID.value= '';
|
||||
}
|
||||
|
||||
|
||||
|
||||
async function removeLesson() {
|
||||
await deleteLessonFromSchedule(trueSchedule.value.scheduleId, editElementID.value)
|
||||
await deleteLesson(editElementID.value);
|
||||
trueSchedule.value = await getSchedule(trueSchedule.value.scheduleId);
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
editElementID.value= '';
|
||||
|
||||
}
|
||||
/*
|
||||
* Create a new Schedule
|
||||
*/
|
||||
async function newSchedule(){
|
||||
await createSchedule(curriculum.value);
|
||||
allSchedules.value = await getAllSchedule();
|
||||
setCurriculum();
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<div class="body">
|
||||
<div class="listTitle buttonGrid"v-if="!createMod && !createScheduleMod" >
|
||||
<button class="create" @click="setCurriculum();createScheduleMod = true"> {{i18n("schedule.createSchedule")}}</button>
|
||||
<button class="create" @click="createMod = true;">{{i18n("schedule.createLesson")}}</button>
|
||||
<button class="delete" @click="deleteMod = !deleteMod;">{{!deleteMod ? i18n("schedule.deleteMod") : i18n("schedule.noDeleteMod")}}</button>
|
||||
|
||||
</div>
|
||||
<div v-if="createMod">
|
||||
<form class="listElement" style="width:40%; margin:0 auto 0 auto;">
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("schedule")}} :
|
||||
<select @change="setCourses()"v-model="curriculum">
|
||||
<option v-for="item in allSchedules" :value='item.curriculum'>{{item.curriculum.option}} - {{item.curriculum.year}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("Course")}} :
|
||||
<select v-if="curriculum != null" v-model="lessonBuffer.course">
|
||||
<option v-for="item in courses" :value='item'>{{item.title}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("day")}}:
|
||||
<input type="date" :min="minDate" :max="maxDate" v-model="lessonBuffer.day">
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("start")}}:
|
||||
<input v-model="lessonBuffer.lessonStart" type="time" min="08:00" max="18:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("end")}}:
|
||||
<input v-model="lessonBuffer.lessonEnd" type="time" min="10:00" max="20:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Type:
|
||||
<select v-model="lessonBuffer.lessonType">
|
||||
<option v-for="item in types" :value='item'>{{item}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Local:
|
||||
<select v-model="lessonBuffer.local">
|
||||
<option v-for="item in locals" :value='item'>{{item}}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<button class="create" @click="createMod=!createMod; newLesson();"> {{i18n("courses.confirm")}} </button>
|
||||
<button style="float:right;" @click="createMod=!createMod">{{i18n("courses.back")}}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div v-if="createScheduleMod">
|
||||
<form class="listElement" style="width:40%; margin:0 auto 0 auto;">
|
||||
<div style="margin-bottom:20px;">
|
||||
{{i18n("schedule")}} :
|
||||
<select v-model="curriculum">
|
||||
<option v-for="item in allCurriculum" :value='item'>{{item.option}} - {{item.year}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<button class="create" @click="createScheduleMod=!createScheduleMod ;newSchedule();"> {{i18n("courses.confirm")}} </button>
|
||||
<button style="float:right;" @click="createScheduleMod=!createScheduleMod;">{{i18n("courses.back")}}</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div v-if="!createMod && !createScheduleMod">
|
||||
<select @change="changeSchedule()" v-model="trueSchedule">
|
||||
<option v-for="item in allSchedules" :value='item'>{{item.curriculum.option}} - {{item.curriculum.year}}</option>
|
||||
</select>
|
||||
<select v-if="schedule != null" @change="subFilter = 'null'" v-model="filter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in filters" :value="item">{{i18n(item.toString())}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Teacher'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in teachers" :value=item>{{item.lastName}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Course'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in courses" :value=item>{{item.title}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Type'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in types" :value='item'>{{item}}</option>
|
||||
</select>
|
||||
|
||||
</div>
|
||||
<div v-if="!createMod && !createScheduleMod" :key="element.lessonID" v-for="element in schedule" style="width:50%;margin-left:auto; margin-right:auto;" >
|
||||
<div v-if="editElementID !== element.lessonID" style ="padding:15px 15px 15px 15px;">
|
||||
<button v-if="inFuture(element)" @click="editElementID = element.lessonID;setModify(element);">
|
||||
{{i18n("courses.modify")}}
|
||||
</button>
|
||||
</div>
|
||||
<div v-else>
|
||||
<button @click="patchLesson(element);"> {{i18n("courses.confirm")}} </button>
|
||||
<button @click="editElementID= '';"> {{i18n("courses.back")}} </button>
|
||||
</div>
|
||||
<div class="listElement">
|
||||
<div v-if="editElementID != element.lessonID">
|
||||
<div>
|
||||
{{element.course.title}}
|
||||
</div>
|
||||
<div>{{formatDate(element.lessonStart)}}</div>
|
||||
<div>{{getHoursMinutes(element.lessonStart)}}-{{getHoursMinutes(element.lessonEnd)}}
|
||||
</div>
|
||||
<div>{{element.local}}</div>
|
||||
<div>{{element.lessonType}}</div>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<div>{{element.course.title}}</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Day:
|
||||
<input type="date" :min="minDate" :max="maxDate" v-model="toModify.day">
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Start:
|
||||
<input v-model="toModify.lessonStart" type="time" min="8:00" max="20:00"/>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
End:
|
||||
<input v-model="toModify.lessonEnd" type="time" min="10:00" max="20:00" required />
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Type:
|
||||
<select v-model="toModify.lessonType">
|
||||
<option v-for="item in types" :value='item'>{{item}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style="margin-bottom:20px;">
|
||||
Local:
|
||||
<select v-model="toModify.local">
|
||||
<option v-for="item in locals" :value='item'>{{item}}</option>
|
||||
</select>
|
||||
<div v-if="deleteMod" style="float:right;">
|
||||
<button class="delete" @click="removeLesson(element);"> {{i18n("courses.deleteCourse")}} </button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.body {
|
||||
width:100%;
|
||||
margin-top:3.5%;
|
||||
}
|
||||
|
||||
.listElement{
|
||||
min-width:625px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
margin-bottom:10px;
|
||||
|
||||
}
|
||||
|
||||
input, select{
|
||||
padding:10px 10px 10px 10px;
|
||||
font-size:25px;
|
||||
cursor: pointer;
|
||||
border:none;
|
||||
border-radius:15px;
|
||||
}
|
||||
button{
|
||||
font-size:15px;
|
||||
height:50px;
|
||||
width:100px;
|
||||
border:none;
|
||||
border-radius:20px;
|
||||
|
||||
}
|
||||
|
||||
.buttonGrid{
|
||||
display:grid;
|
||||
grid-template-columns: auto auto;
|
||||
column-gap:50px;
|
||||
grid-template-areas:
|
||||
"create delete";
|
||||
}
|
||||
|
||||
.create{
|
||||
grid-area:create;
|
||||
|
||||
background-color:rgb(0,200,0);
|
||||
|
||||
}
|
||||
|
||||
.delete{
|
||||
grid-area:delete;
|
||||
background-color:rgb(200,0,0);
|
||||
}
|
||||
|
||||
.listTitle{
|
||||
min-width:380px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width:25%;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
margin-bottom:10px;
|
||||
|
||||
button:hover{
|
||||
opacity:0.8;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,7 @@
|
||||
<script setup>
|
||||
import {reactive, ref } from 'vue'
|
||||
import {getSelf,alterSelf,disconnect,deleteUser} from '../rest/Users.js'
|
||||
import {getSelfCurriculum, getAllCurriculums, getSomeonesCurriculumList, getcurriculum} from '../rest/curriculum.js'
|
||||
import {getSelf,alterSelf} from '../rest/Users.js'
|
||||
import {getAllCurriculums, getSomeonesCurriculumList, getcurriculum} from '../rest/curriculum.js'
|
||||
import {getCourses} from "../rest/courses.js"
|
||||
import i18n from "@/i18n.js"
|
||||
import {uploadFile, uploadProfilePicture} from '@/rest/uploads.js'
|
||||
@ -119,16 +119,6 @@
|
||||
toModify.password= item.password;
|
||||
}
|
||||
|
||||
|
||||
async function unRegister(){
|
||||
deleteUser(user.value.regNo);
|
||||
disconnect()
|
||||
setTimeout(() => {
|
||||
window.location.href="#/home";
|
||||
}, "500");
|
||||
|
||||
}
|
||||
|
||||
function getPP(){
|
||||
if(user.value.profilePictureUrl === null){
|
||||
return "/Clyde.png"
|
||||
@ -136,14 +126,6 @@
|
||||
return user.profilePictureUrl
|
||||
}
|
||||
|
||||
function getYear(){
|
||||
let date = new Date();
|
||||
if (date.getMonth() <= 6){
|
||||
return date.getFullYear()-1
|
||||
}
|
||||
return date.getFullYear()
|
||||
}
|
||||
|
||||
async function refreshExtCurrList(){
|
||||
extcurrlist.value = await getExternalCurriculumByUser(user.value.regNo)
|
||||
}
|
||||
@ -258,7 +240,7 @@
|
||||
<button @click="windowState=0">{{i18n("courses.back")}}</button>
|
||||
</div>
|
||||
<div v-else-if="windowState === 5" class="infosContainer">
|
||||
<div v-if="minerv.value.toPay !== 0">
|
||||
<div v-if="minerv.value.toPay > 0">
|
||||
{{ i18n("payment") }} : {{minerv.value.toPay}}€ {{ i18n("lefttopay") }}
|
||||
<div v-if="minerv.value.paidAmount <= 50">
|
||||
<button @click="windowState=6; paymentAmount = 50">{{ i18n("paydeposit") }} (50€)</button>
|
||||
@ -271,7 +253,7 @@
|
||||
{{ i18n("alreadypaid") }}
|
||||
</div>
|
||||
<div>
|
||||
<button @click="windowState=7">{{ i18n("askscholarship") }}</button>
|
||||
<button @click="windowState=7" v-if="minerv.value.toPay <= 0">{{ i18n("askscholarship") }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="windowState === 5">
|
||||
|
||||
802
frontend/src/Apps/Schedule.vue
Normal file
802
frontend/src/Apps/Schedule.vue
Normal file
@ -0,0 +1,802 @@
|
||||
|
||||
<!----------------------------------------------------
|
||||
File: Schedule.vue
|
||||
Author: William Karpinski
|
||||
Scope: Extension Horaire
|
||||
Description: Schedules Page accessed by everyone
|
||||
----------------------------------------------------->
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import {getDifferenceTime,lastDateOfMonth,formatDate,getFirstDay,sortByDate,weekFromList,sundayToTheEnd,getMarginTop,getHoursMinutes, monthFromList, durationCourse} from '../scheduleFunctions.js'
|
||||
import {getAllSchedule} from "@/rest/scheduleRest.js";
|
||||
import {getOnesLessons, getOwnedLessons } from "@/rest/lessonSchedule.js"
|
||||
import {isLogged, getSelf,getTeachers} from "@/rest/Users.js"
|
||||
import {getUserActualCourses} from "@/rest/courses.js";
|
||||
import {getcurriculum} from "@/rest/curriculum.js";
|
||||
import i18n from "../i18n.js";
|
||||
|
||||
const trueSchedule = ref()
|
||||
const log = await isLogged();
|
||||
const schedule = ref();
|
||||
const importedJSON = ref();
|
||||
const jsonSchedule = ref();
|
||||
const jsonMod = ref(false);
|
||||
const curriculum = ref();
|
||||
const shift = ref(getFirstDay(new Date()).getDay());
|
||||
let value = 1;
|
||||
let done = false;
|
||||
const len = ref(lastDateOfMonth(new Date()));
|
||||
const scheduleByWeek = ref();
|
||||
const month = ref();
|
||||
const mondayOfWeek =ref(getMonday(new Date()))
|
||||
const currentDate = ref(new Date())
|
||||
const allSchedules = await getAllSchedule();
|
||||
let counter = 0;
|
||||
const ownSchedule = ref();
|
||||
const filter = ref("null");
|
||||
const subFilter = ref("null");
|
||||
const focus = ref();
|
||||
const focusLessons = ref();
|
||||
let user;
|
||||
|
||||
if(log){
|
||||
user = await getSelf();
|
||||
if(user.role == "Teacher" || user.role == "Student"){
|
||||
|
||||
if(user.role == "Teacher"){
|
||||
ownSchedule.value = await getOwnedLessons();
|
||||
}
|
||||
|
||||
if(user.role == "Student"){
|
||||
let test = await getUserActualCourses();
|
||||
console.log(test);
|
||||
ownSchedule.value = await getOnesLessons();}
|
||||
|
||||
schedule.value = ownSchedule.value;
|
||||
|
||||
schedule.value.sort((a,b) => sortByDate(a,b));
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,new Date().getMonth());
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const display =ref("Week");
|
||||
const format = ref("Grid");
|
||||
const filters = ["Type","Teacher","Course"];
|
||||
const types = ["TP","TD","Course","Exam"];
|
||||
const teachers = await getTeachers() ;
|
||||
const courses = ref();
|
||||
|
||||
|
||||
if(curriculum.value != null){
|
||||
courses.value = curriculum.value.courses;
|
||||
}
|
||||
const days = ["monday","tuesday","wednesday","thursday","friday","saturday","sunday"];
|
||||
const months = ["january","february","march","april",'may',"june","july","august","september","october","november","december"]
|
||||
const firstDayOfMonth = ref(getFirstDay(new Date()))
|
||||
const monthDone = ref(false);
|
||||
function getMonday(d) {
|
||||
d = new Date(d);
|
||||
d.setHours(0,0,0);
|
||||
var day = d.getDay(),
|
||||
diff = d.getDate() - day + (day == 0 ? -6 : 1);
|
||||
return new Date(d.setDate(diff));
|
||||
}
|
||||
|
||||
function getAnyDays(d){
|
||||
var day = new Date(mondayOfWeek.value);
|
||||
day.setDate(day.getDate() + d );
|
||||
return day;
|
||||
}
|
||||
|
||||
|
||||
function verifUser(){
|
||||
if(log)
|
||||
return (user.role == "Student" || user.role == "Teacher");
|
||||
return false
|
||||
}
|
||||
function displayOwnSchedule(){
|
||||
schedule.value = ownSchedule.value;
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
|
||||
value = 1;
|
||||
counter=0;
|
||||
done = false;
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* Create a JSON from a schedule
|
||||
*/
|
||||
function createJSON(){
|
||||
const json = {"data":[]};
|
||||
for(let element in schedule.value){
|
||||
let item = {};
|
||||
item["title"] = schedule.value[element].course.title + "\n" + schedule.value[element].course.owner.lastName+ "\n" + schedule.value[element].local
|
||||
item["start"] = schedule.value[element].lessonStart;
|
||||
item["end"] = schedule.value[element].lessonEnd;
|
||||
item["color"] = schedule.value[element].color;
|
||||
json.data.push(item)
|
||||
}
|
||||
return json
|
||||
}
|
||||
|
||||
/*
|
||||
* Export a JSON
|
||||
*/
|
||||
|
||||
function exportJSON(){
|
||||
let json = createJSON();
|
||||
const data = JSON.stringify(json);
|
||||
const blob = new Blob([data], {type:"application/json"});
|
||||
const a = document.createElement('a');
|
||||
a.href = URL.createObjectURL(blob);
|
||||
a.download = "Schedule.json";
|
||||
a.click();
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* Used to convert a JSON imported to an object
|
||||
*/
|
||||
function onFileChange(e) {
|
||||
let files = e.target.files || e.dataTransfer.files;
|
||||
if (!files.length) return;
|
||||
readFile(files[0]);
|
||||
}
|
||||
function readFile(file) {
|
||||
let reader = new FileReader();
|
||||
reader.onload = e => {
|
||||
let json = JSON.parse(e.target.result);
|
||||
importedJSON.value = json
|
||||
createScheduleFromJSON();
|
||||
jsonMod.value= true;
|
||||
};
|
||||
reader.readAsText(file);
|
||||
|
||||
|
||||
}
|
||||
|
||||
function createScheduleFromJSON(){
|
||||
let jsonBrut = importedJSON.value;
|
||||
let toEventList = [];
|
||||
for(let element in jsonBrut["data"]){
|
||||
let temp = {}
|
||||
temp["title"] = jsonBrut["data"][element].title;
|
||||
temp["lessonStart"] = jsonBrut["data"][element].start;
|
||||
temp["lessonEnd"] = jsonBrut["data"][element].end;
|
||||
temp["color"] = jsonBrut["data"][element].color;
|
||||
toEventList.push(temp);
|
||||
}
|
||||
jsonSchedule.value = toEventList;
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(jsonSchedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(jsonSchedule.value,new Date().getMonth());
|
||||
}
|
||||
|
||||
/*
|
||||
* Display the JSON on the schedule
|
||||
*/
|
||||
function switchToJSON(){
|
||||
jsonMod.value = true;
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(jsonSchedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(jsonSchedule.value,new Date().getMonth());
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*
|
||||
* used to focus on a lesson when we click on it
|
||||
*/
|
||||
function lessonFocus(element){
|
||||
if(!jsonMod.value){
|
||||
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;}
|
||||
}
|
||||
|
||||
/*
|
||||
* convert the current date to a DATE object
|
||||
*/
|
||||
function dateOfMonth(i){
|
||||
|
||||
return new Date(currentDate.value.getFullYear(),currentDate.value.getMonth(),i);
|
||||
}
|
||||
|
||||
function sortSchedule(){
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
if(filter.value =="Teacher"){
|
||||
schedule.value = sortByTeacher(schedule.value,subFilter.value);
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
|
||||
value = 1;
|
||||
counter=0;
|
||||
|
||||
|
||||
}
|
||||
else if(filter.value =="Type"){
|
||||
schedule.value = sortByType(schedule.value,subFilter.value);
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
|
||||
value = 1;
|
||||
counter=0;
|
||||
|
||||
|
||||
|
||||
}
|
||||
else if(filter.value =="Course"){
|
||||
schedule.value = sortByCourse(schedule.value,subFilter.value);
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
|
||||
value = 1;
|
||||
counter=0;
|
||||
}
|
||||
|
||||
if(focus.value != null){
|
||||
lessonFocus(focus.value)
|
||||
}
|
||||
}
|
||||
|
||||
function sortByType(lessons,type){
|
||||
if(type == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].lessonType == type){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
function sortByCourse(lessons,course){
|
||||
if(course == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].course.courseID == course.courseID){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
function sortByTeacher(lessons, teacher){
|
||||
if(teacher == null){
|
||||
return lessons;
|
||||
}
|
||||
const matrix = [];
|
||||
for (let element in lessons){
|
||||
if(lessons[element].course.owner.regNo == teacher.regNo){
|
||||
matrix.push(lessons[element])
|
||||
}
|
||||
}
|
||||
return matrix
|
||||
}
|
||||
|
||||
/*
|
||||
* Change the schedule filter
|
||||
*/
|
||||
async function changeSchedule(){
|
||||
schedule.value =trueSchedule.value.lessons;
|
||||
curriculum.value = trueSchedule.value.curriculum;
|
||||
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value,mondayOfWeek.value));
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth());
|
||||
value = 1;
|
||||
counter=0;
|
||||
done = false;
|
||||
courses.value = (await getcurriculum(curriculum.value.curriculumId)).courses;
|
||||
filter.value = "null";
|
||||
subFilter.value = "null"
|
||||
focus.value = null;
|
||||
focusLessons.value = null;
|
||||
jsonMod.value = false;
|
||||
}
|
||||
/*
|
||||
* change the week to display
|
||||
*/
|
||||
function changeWeek(i){
|
||||
const temp = getAnyDays(i);
|
||||
mondayOfWeek.value = temp;
|
||||
if(scheduleByWeek.value != null)
|
||||
if(jsonMod.value){
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(jsonSchedule.value, mondayOfWeek.value))}
|
||||
else{
|
||||
scheduleByWeek.value = sundayToTheEnd(weekFromList(schedule.value, mondayOfWeek.value))}
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* change the month to display
|
||||
*/
|
||||
function changeMonth(i){
|
||||
const temp = currentDate.value;
|
||||
currentDate.value = new Date( ( 0< temp.getMonth()+i < 13 ? temp.getFullYear() : temp.getFullYear()+i), (0< temp.getMonth()+i <13 ? temp.getMonth()+i : 12 ),1);
|
||||
shift.value= getFirstDay(currentDate.value).getDay();
|
||||
len.value= lastDateOfMonth(currentDate.value);
|
||||
value = 1;
|
||||
counter = 0;
|
||||
done=false;
|
||||
if(month.value != null){
|
||||
if(jsonMod.value){
|
||||
month.value = monthFromList(jsonSchedule.value,currentDate.value.getMonth())}
|
||||
}
|
||||
else{
|
||||
month.value = monthFromList(schedule.value,currentDate.value.getMonth())}
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
* used to display correctly the dates of a month
|
||||
*/
|
||||
|
||||
function isAValue(){
|
||||
if(value-shift.value<0 ){
|
||||
counter++;
|
||||
value++;
|
||||
return false;
|
||||
}
|
||||
if(value-shift.value<len.value){
|
||||
value++;
|
||||
counter++;
|
||||
return true;}
|
||||
|
||||
if(value-shift.value==len.value){
|
||||
done = true;
|
||||
counter++;
|
||||
|
||||
|
||||
if(counter> 35){
|
||||
counter=1;
|
||||
value = 2;
|
||||
done = false;
|
||||
return true; }
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<div class="grid">
|
||||
<div class="schedule" v-if="format == 'Grid'">
|
||||
<template v-if="display=='Week'">
|
||||
<table class="table">
|
||||
<tr style="background-color:rgb(24,24,24)">
|
||||
<th>
|
||||
<button @click="changeWeek(-7)">{{i18n("schedule.previous")}}</button>
|
||||
<button @click="changeWeek(7)">{{i18n("schedule.next")}}</button>
|
||||
<button @click="mondayOfWeek = getMonday(new Date());
|
||||
scheduleByWeek != null ? scheduleByWeek = sundayToTheEnd(weekFromList(schedule.value, mondayOfWeek)) : null;">{{i18n("schedule.current")}}</button>
|
||||
|
||||
</th>
|
||||
<th class="header" v-for='d,index in 7' >
|
||||
<p class="childHeader">
|
||||
{{i18n(days[index])}}
|
||||
</p>
|
||||
<p class="childHeader">
|
||||
{{formatDate(getAnyDays(index))}}
|
||||
</p>
|
||||
</th>
|
||||
|
||||
|
||||
</tr>
|
||||
<tr v-for="(n,index) in 12">
|
||||
<th class="hour">{{8 + index}}:00-{{9+index}}:00</th>
|
||||
<td v-for="m in 7"></td>
|
||||
</tr>
|
||||
</table>
|
||||
<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" @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">
|
||||
<p class="childInfos" >{{jsonMod ? element[index].title : element[index].course.title}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element[index].local}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element[index].lessonType}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element[index].course.owner.lastName}}</p>
|
||||
|
||||
</div>
|
||||
<div class="hourEnd">
|
||||
{{getHoursMinutes(element[index].lessonEnd)}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<table class="table">
|
||||
<tr style="background-color:rgb(24,24,24); height:8.33%;">
|
||||
<th colspan="7" class="header">
|
||||
<div>{{i18n(months[currentDate.getMonth()])}} {{currentDate.getFullYear()}}</div>
|
||||
<button style="position:absolute; top:0; left:0;" @click="changeMonth(-1)">{{i18n("schedule.previous")}}</button>
|
||||
<button style="position:absolute; bottom:0; left:0;"@click="changeMonth(1)">{{i18n("schedule.next")}}</button>
|
||||
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
<tr style="background-color:rgb(24,24,24); height:8.33%;" >
|
||||
<th class="header" v-for='d,index in 7' >
|
||||
{{i18n(days[index])}}
|
||||
</th>
|
||||
</tr>
|
||||
<tr v-for="n in 5" style="height:16.67%;">
|
||||
<td v-for="m,i in 7" style="height:16.67%; position:relative;">
|
||||
<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 v-if="!done"class="course" @click.native="lessonFocus(element)" v-bind:style="{background:element.color, height:100+'%'}">
|
||||
|
||||
<div class="hourStart">
|
||||
{{getHoursMinutes(element.lessonStart)}}
|
||||
</div>
|
||||
<div class="infos">
|
||||
<p class="childInfos" >{{jsonMod ? element.title : element.course.title}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element.local}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element.lessonType}}</p>
|
||||
<p class="childInfos"v-if="!jsonMod">{{element.course.owner.lastName}}</p>
|
||||
|
||||
</div>
|
||||
<div class="hourEnd">
|
||||
{{getHoursMinutes(element.lessonEnd)}}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
</div>
|
||||
<div class="schedule" v-else>
|
||||
|
||||
<div v-if="display == 'Week'">
|
||||
<button @click="changeWeek(-7)">Previous</button>
|
||||
<button @click="changeWeek(7)">Next</button>
|
||||
<button @click="mondayOfWeek = getMonday(new Date());
|
||||
scheduleByWeek != null ? scheduleByWeek = sundayToTheEnd(weekFromList(schedule.value, mondayOfWeek)) : null;">Current</button>
|
||||
|
||||
|
||||
<template v-for="i,index in 7">
|
||||
<div class="body" style="background-color:#181818;">{{i18n(days[index])}} {{formatDate(getAnyDays(index))}}
|
||||
</div>
|
||||
<template v-if="scheduleByWeek != null">
|
||||
<div class="body" style="background-color:#353535;" >
|
||||
<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>
|
||||
<div class="teacherList">{{scheduleByWeek[index][j].course.owner.lastName}}</div>
|
||||
<div class="localList">{{scheduleByWeek[index][j].local}}</div>
|
||||
<div class="typeList">{{scheduleByWeek[index][j].lessonType}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div v-if="display == 'Month'">
|
||||
<button @click="changeMonth(-1)">Previous</button>
|
||||
<button @click="changeMonth(1)">Next</button>
|
||||
<div class="body" >{{i18n(months[currentDate.getMonth()])}} {{currentDate.getFullYear()}}</div>
|
||||
|
||||
<template v-for="i,index in lastDateOfMonth(currentDate.getMonth())-1">
|
||||
<div class="body" style="background-color:#181818;">{{ dateOfMonth(i).getDay()-1== -1 ? i18n(days[6]) : i18n(days[dateOfMonth(i).getDay()-1]) }} {{formatDate(dateOfMonth(i))}}
|
||||
</div>
|
||||
<template v-if="scheduleByWeek != null">
|
||||
<div class="body" style="background-color:#353535;" >
|
||||
<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>
|
||||
<div class="teacherList">{{month[i][j].course.owner.lastName}}</div>
|
||||
<div class="localList">{{month[i][j].local}}</div>
|
||||
<div class="typeList">{{month[i][j].lessonType}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="options">
|
||||
<div class="settings">
|
||||
<div class="body" style="background-color:rgb(50,50,50);margin:5% 0 5% 0;">{{i18n("schedule.settings")}}</div>
|
||||
<select @change="changeSchedule()" v-model="trueSchedule">
|
||||
<option v-for="item in allSchedules" :value='item'>{{item.curriculum.option}}-{{item.curriculum.year}}</option>
|
||||
</select>
|
||||
<button v-if="display=='Week'" @click="display='Month'">{{i18n("Week")}}</button>
|
||||
<button v-if="display=='Month'" @click="display='Week'; value=1;">{{i18("Month")}}</button>
|
||||
<button v-if="format == 'Grid'" @click="format ='List'">{{i18n("Grid")}}</button>
|
||||
<button v-if="format == 'List'" @click ="format = 'Grid'">{{i18n("List")}}</button>
|
||||
<button v-if="verifUser()" @click="jsonMod=false ;displayOwnSchedule();">{{i18n("OwnSchedule")}}</button>
|
||||
<button v-if="importedJSON != null" @click="switchToJSON()">{{i18n("SwitchToJSON")}}</button>
|
||||
|
||||
<select v-if="schedule != null && !jsonMod" @change="subFilter = 'null'" v-model="filter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in filters" :value="item">{{i18n(item)}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Teacher'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in teachers" :value=item>{{item.lastName}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Course'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in courses" :value=item>{{item.title}}</option>
|
||||
</select>
|
||||
<select @change="sortSchedule()" v-if="filter == 'Type'" v-model="subFilter">
|
||||
<option :value ="null">No Filter</option>
|
||||
<option v-for="item in types" :value='item'>{{i18n(item)}}</option>
|
||||
</select>
|
||||
<button @click="exportJSON()" >Export JSON</button>
|
||||
|
||||
<div style="color:white;">IMPORT JSON</div>
|
||||
<input type="file" @change="onFileChange" accept="application/JSON" ></input>
|
||||
|
||||
|
||||
</div>
|
||||
<div v-if="focus != null && !jsonMod" class="moreInfos">
|
||||
<div class="body" style="background-color:rgb(50,50,50); height:10%; font-size:2em;" >{{i18n("request.moreInfos")}}</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);">{{i18n("schedule.teachers")}}</div>
|
||||
<div class="body" style="background-color:#484848;">
|
||||
<div>{{focus.course.owner.lastName}}</div>
|
||||
<div v-for="element in focus.course.assistants">
|
||||
{{element.lastName}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="body" style="background-color:rgb(50,50,50);">{{i18n("schedule.courses")}}</div>
|
||||
<div class="body" style="background-color:#484848;"v-for="lesson in focusLessons">
|
||||
{{ getHoursMinutes(lesson.lessonStart)}}-{{getHoursMinutes(lesson.lessonEnd)}}
|
||||
{{ lesson.local}}
|
||||
{{i18n(lesson.lessonType.toString())}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.grid{
|
||||
min-width:1400px;
|
||||
display:grid;
|
||||
margin-top:2%;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
grid-template-columns:72% 14.5%;
|
||||
column-gap:2vw;
|
||||
overflow:hidden;
|
||||
grid-template-areas:"schedule options";
|
||||
}
|
||||
.schedule{
|
||||
min-width:900px;
|
||||
position:relative;
|
||||
overflow-y:scroll;
|
||||
border-radius:20px;
|
||||
grid-area:schedule;
|
||||
width:100%;
|
||||
height:85vh;
|
||||
background-color:rgba(255,255,255,0.1);
|
||||
}
|
||||
.options{
|
||||
display:grid;
|
||||
border-radius:20px;
|
||||
grid-area:options;
|
||||
background-color:rgba(255,255,255,0.1);
|
||||
width:100%;
|
||||
height:85vh;
|
||||
min-width:240px;
|
||||
|
||||
grid-template-rows:40% 60%;
|
||||
}
|
||||
|
||||
.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{
|
||||
width:100%;
|
||||
height:100%;
|
||||
border-spacing:0;
|
||||
border-collapse:separate;
|
||||
border-radius: 20px;
|
||||
border: 2px solid black
|
||||
}
|
||||
|
||||
.hour{
|
||||
background-color:rgb(72,72,72)
|
||||
|
||||
}
|
||||
|
||||
.header{
|
||||
width:12.5%;
|
||||
color:#FFFFFF;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
|
||||
.childHeader{
|
||||
margin-top:0;
|
||||
margin-bottom:0;
|
||||
max-height:14.28%
|
||||
|
||||
}
|
||||
table th:not(:last-child),
|
||||
table td:not(:last-child) {
|
||||
border-right: 1px solid black;
|
||||
}
|
||||
|
||||
table tr:not(:last-child)>td,
|
||||
table tr:not(:last-child)>th
|
||||
{
|
||||
border-bottom:1px solid black;
|
||||
}
|
||||
|
||||
.courseGrid{
|
||||
top:13.75%;
|
||||
left:12.5%;
|
||||
position:absolute;
|
||||
width:87.5%;
|
||||
height:86.25%;
|
||||
display:grid;
|
||||
grid-template-columns:repeat(7,1fr);
|
||||
}
|
||||
|
||||
|
||||
.course{
|
||||
position:relative;
|
||||
border: 1px solid black;
|
||||
border-radius:10px;
|
||||
width:90%;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
display:grid;
|
||||
grid-template-rows:1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
.dayCourse{
|
||||
display:block;
|
||||
}
|
||||
|
||||
.infos{
|
||||
height:100%;
|
||||
width:100%;
|
||||
font-size:0.75em;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
position:absolute;
|
||||
}
|
||||
|
||||
.childInfos{
|
||||
text-align:center;
|
||||
margin-top:0%;
|
||||
margin-bottom:0%;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.hourStart{
|
||||
background-color:rgb(200,200,200);
|
||||
border-radius:5px;
|
||||
position:absolute;
|
||||
top:2%;
|
||||
left:2%;
|
||||
font-size:0.75em;
|
||||
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
||||
.hourEnd{
|
||||
background-color:rgb(200,200,200);
|
||||
border-radius:3px;
|
||||
position:absolute;
|
||||
bottom:2%;
|
||||
left:2%;
|
||||
font-size:0.7em;
|
||||
}
|
||||
|
||||
.containerList{
|
||||
color:white;
|
||||
height:100px;
|
||||
font-size:20px;
|
||||
display:grid;
|
||||
grid-template-columns:5vw auto auto auto auto auto;
|
||||
grid-template-areas:
|
||||
"color hours title teacher local type";
|
||||
|
||||
}
|
||||
|
||||
.colorList{
|
||||
grid-area:color;
|
||||
align-self:center;
|
||||
|
||||
width:75%;
|
||||
height:75%;
|
||||
border:1px solid black;
|
||||
border-radius:20%;
|
||||
}
|
||||
|
||||
.hoursList{
|
||||
grid-area:hours;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
|
||||
.titleList{
|
||||
grid-area:title;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.teacherList {
|
||||
grid-area:teacher;
|
||||
align-self:center;
|
||||
}
|
||||
.localList{
|
||||
grid-area:local;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.typeList{
|
||||
grid-area:type;
|
||||
align-self:center;
|
||||
}
|
||||
.body {
|
||||
color:white;
|
||||
margin-top:2%;
|
||||
width:98%;
|
||||
border:2px solid black;
|
||||
border-radius:9px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user