Big commit:

make some changes to profile to provide an interface for a student to manage his courses.

implements the submission of exemptions request
This commit is contained in:
2024-04-06 16:12:11 +02:00
parent 648b73b585
commit 3c721de18b
14 changed files with 360 additions and 74 deletions

View File

@ -1,16 +1,18 @@
<script setup>
import {reactive, ref } from 'vue'
import {getSelf,alterSelf,disconnect,deleteUser} from '../rest/Users.js'
import {getSelfCurriculum, getAllCurriculums} from '../rest/curriculum.js'
import {getSelfCurriculum, getAllCurriculums, getSomeonesCurriculumList} from '../rest/curriculum.js'
import {getCourses} from "../rest/courses.js"
import i18n from "@/i18n.js"
import { uploadProfilePicture } from '@/rest/uploads.js'
import CourseList from "@/Apps/CourseList.vue";
const user = ref(await getSelf());
const UserCurriculum = ref("");
const curricula = ref (await getAllCurriculums());
if(user.value.role === "Student"){
UserCurriculum.value = await getSelfCurriculum();
UserCurriculum.value = await getSomeonesCurriculumList(user.value.regNo);
}
if(user.role === "Teacher"){
@ -19,6 +21,7 @@
const modif = ref(false);
const curric = ref(false);
const reg = ref(false);
const courseslist = ref(false);
const pattern = {
profilPictureUrl:null,
@ -86,17 +89,35 @@
}
return user.profilePictureUrl
}
function getYear(){
let date = new Date();
if (date.getMonth() <= 6){
return date.getFullYear()-1
}
return date.getFullYear()
}
//This function travels through the student cursus array and extract the current cursus of the student
function getActualCurriculumList(){
let actualCurriculumList = [];
for (let i = 0; i < UserCurriculum.value.curriculumList.length; i++){
if (UserCurriculum.value.curriculumList[i].dateyear === getYear()){
actualCurriculumList.push(UserCurriculum.value.curriculumList[i]);
}
}
return actualCurriculumList
}
</script>
<template>
<div class="body">
<div class="container">
<div class="container" v-if="courseslist == false">
<div class="profilPic">
<img class="subContainter" :src=getPP()>
</div>
<div class="globalInfos">
<div v-if="modif==false && curric==false && reg==false " class="infosContainer" >
<div v-if="modif==false && curric==false && reg==false" class="infosContainer">
<div>
{{user.firstName}} {{user.lastName}}
</div>
@ -119,6 +140,9 @@
<div v-if="(user.role==='Student')">
<button @click="curric=!curric">{{i18n("profile.change.curriculum")}}</button>
</div>
<div v-if="(user.role==='Student')">
<button @click="courseslist=!courseslist">Manage Courses</button>
</div>
</div>
<div v-else-if="modif" class="infosContainer">
<div>
@ -182,29 +206,38 @@
<button @click=" reg=!reg; resetInputs(personnalInfos,patternInfos);" style="float:right;">{{i18n("courses.back")}}</button>
</div>
</div>
</div>
<div v-if="modif==false && curric==false && reg==false "class="moreInfos">
<div v-if="(user.role ==='Student')">
<div class="listTitle">
{{i18n("profile.course.list")}}
<div class = "oldcursus">
<div class="listTitle">
Anciens Cursus
</div>
<div class="listElement">
<div class=" containerElement" v-for="item in UserCurriculum.curriculumList">
<div class="year" v-if="parseInt(item.dateyear) !== getYear()">Bac {{item.year}}</div>
<div class="option" v-if="parseInt(item.dateyear) !== getYear()">{{item.option}}</div>
<div class="dateyear" v-if="parseInt(item.dateyear) !== getYear()">Année {{item.dateyear}}-{{item.dateyear+1}}</div>
</div>
</div>
</div>
<div class="listElement" v-for="item in UserCurriculum.courses">
<div class=" containerElement">
<div class="name"> {{item.title}} </div>
<div class="teacher">{{item.owner.lastName}}</div>
<div class="credits">Credits:{{item.credits}}</div>
<div class="actualcursus">
<div class="listTitle">
Cursus Actuel
</div>
<div class="listElement">
<div class=" containerElement" v-for="item in UserCurriculum.curriculumList" >
<div class="year" v-if="parseInt(item.dateyear) === getYear()">Bac {{item.year}}</div>
<div class="option" v-if="parseInt(item.dateyear) === getYear()">{{item.option}}</div>
<div class="dateyear" v-if="parseInt(item.dateyear) === getYear()">Année {{item.dateyear}}-{{item.dateyear+1}}</div>
</div>
</div>
</div>
</div>
</div>
<div>
</div>
</div>
</div>
<div v-if="courseslist === true" style="width: 80%">
<CourseList :cursuslist="getActualCurriculumList()"/>
<button style="width: 10%; margin-top: 5%" @click="courseslist = false">Return to profile</button>
</div>
</div>
</template>
<style scoped>
@ -240,7 +273,32 @@
}
.moreInfos {
grid-area:minfos;
margin-top: 50%;
display:grid;
grid-template-rows:200px auto;
column-gap:50px;
row-gap:45px;
grid-template-areas:
"minfos minfos";
grid-template-columns:600px 600px;
align-items:center;
justify-content:center;
margin-left: 320%;
}
.listTitle{
display: flex;
justify-content: center;
align-items: center;
width:250px;
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;
}
.body {
min-width:960px;
@ -250,16 +308,17 @@
justify-content:center;
margin-top:5%;
}
.containerElement{
.containerElement{
justify-content:center;
display:grid;
grid-template-columns:38.8% 38.8% 22.4%;
grid-template-areas:
"name teacher credits";
column-gap:10px;
display:grid;
grid-template-columns:100px 100px 300px;
grid-template-areas:
"year option dateyear";
column-gap:40px;
padding-left: 25px;
}
.name {
grid-area:name;
align-self:center;
@ -275,24 +334,8 @@
align-self:center;
}
.listTitle{
min-width:197px;
display: flex;
justify-content: center;
align-items: center;
width:8vw;
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;
}
.listElement{
min-width:625px;
border:2px solid black;
font-size:25px;
color:white;