Fix fews things and rename the inscription app to managerequests also sort the files
This commit is contained in:
132
frontend/src/Apps/Inscription/AboutRequest.vue
Normal file
132
frontend/src/Apps/Inscription/AboutRequest.vue
Normal file
@ -0,0 +1,132 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {getSelf, getUser} from '../../rest/Users.js'
|
||||
import {getcurriculum,getSomeonesCurriculumList} 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";
|
||||
|
||||
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)
|
||||
|
||||
function getPP(){
|
||||
if(request.profilePictureUrl === null){
|
||||
return "/Clyde.png"
|
||||
}
|
||||
return request.profilePictureUrl;
|
||||
}
|
||||
|
||||
async function editEquivalence(id, newstate){
|
||||
await editEquivalenceState(id, newstate)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="body" v-if="list == false">
|
||||
<div class="container">
|
||||
<div class="profilPic">
|
||||
<img class="subContainter" :src=getPP()>
|
||||
</div>
|
||||
<div class = "globalInfos">
|
||||
<div class="infosContainer">
|
||||
<div>
|
||||
FirstName/Name : {{request.firstName}} {{request.lastName}}
|
||||
</div>
|
||||
<div>
|
||||
E-mail: {{request.email}}
|
||||
</div>
|
||||
<div>
|
||||
Adresse : {{request.address}}
|
||||
</div>
|
||||
<div>
|
||||
Pays : {{request.country}}
|
||||
</div>
|
||||
<div>
|
||||
Date de naissance : {{request.birthDate}}
|
||||
</div>
|
||||
<div>
|
||||
Cursus voulu : BAB {{cursus.year}} {{cursus.option}}
|
||||
</div>
|
||||
<div v-if="cursus.year > 1">
|
||||
<button style="background-color:rgb(105,05,105);margin-left: 5%" @click="list=!list" v-if="(user.role == 'Teacher' || user.role == 'Admin')&& request.equivalenceState == 'Pending'">See external curriculums</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="list==true">
|
||||
<ExternalCurriculumList :ext-curr-list="externalCurriculum" :inscr-req-id="request.id"></ExternalCurriculumList>
|
||||
<div style="margin-left: 15%;margin-top: 5%;">
|
||||
<button style="margin-left: 2%" @click="list = false;editEquivalence(request.id, 'Accepted'); request.equivalenceState='Accepted'">Accept Equivalence</button>
|
||||
<button style="margin-left: 2%" @click="list = false;editEquivalence(request.id, 'Refused'); request.equivalenceState='Refused'">Refuse Equivalence</button>
|
||||
<button style="margin-left: 2%" @click="list=false">Return to profile</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.container{
|
||||
min-width:675px;
|
||||
display:grid;
|
||||
grid-template-columns:10vw 50vw;
|
||||
grid-template-rows:200px auto;
|
||||
column-gap:2.7%;
|
||||
row-gap:45px;
|
||||
grid-template-areas:
|
||||
"profilPic globalInfos"
|
||||
"minfos minfos";
|
||||
}
|
||||
|
||||
.profilPic{
|
||||
grid-area:profilPic;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.globalInfos {
|
||||
grid-area:globalInfos;
|
||||
align-self :center;
|
||||
|
||||
}
|
||||
|
||||
.body {
|
||||
min-width:960px;
|
||||
width:100%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
margin-top:5%;
|
||||
}
|
||||
|
||||
.subContainter{
|
||||
width:100%;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
border:4px solid black;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
padding-bottom:50px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
}
|
||||
|
||||
button{
|
||||
font-size:15px;
|
||||
height:50px;
|
||||
width:100px;
|
||||
border:none;
|
||||
border-radius:20px;
|
||||
}
|
||||
</style>
|
||||
182
frontend/src/Apps/Inscription/AboutStudent.vue
Normal file
182
frontend/src/Apps/Inscription/AboutStudent.vue
Normal file
@ -0,0 +1,182 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {getUser} from '../../rest/Users.js'
|
||||
import {getSomeonesCurriculumList} from "@/rest/curriculum.js";
|
||||
|
||||
const props = defineProps(['target']);
|
||||
let user = await getUser(props.target);
|
||||
let UserCurriculum = await getSomeonesCurriculumList(props.target);
|
||||
|
||||
function getPP(){
|
||||
if(user.profilePictureUrl === null){
|
||||
return "/Clyde.png"
|
||||
}
|
||||
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>
|
||||
<div class="body">
|
||||
<div class="container">
|
||||
<div class="profilPic">
|
||||
<img class="subContainter" :src=getPP()>
|
||||
</div>
|
||||
<div class = "globalInfos">
|
||||
<div class="infosContainer">
|
||||
<div>
|
||||
FirstName/Name : {{user.firstName}} {{user.lastName}}
|
||||
</div>
|
||||
<div>
|
||||
E-mail: {{user.email}}
|
||||
</div>
|
||||
<div>
|
||||
Adresse : {{user.address}}
|
||||
</div>
|
||||
<div>
|
||||
Pays : {{user.country}}
|
||||
</div>
|
||||
<div>
|
||||
Date de naissance : {{user.birthDate}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="moreInfos">
|
||||
<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="newcursus">
|
||||
<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>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.container{
|
||||
min-width:675px;
|
||||
display:grid;
|
||||
grid-template-columns:10vw 50vw;
|
||||
grid-template-rows:200px auto;
|
||||
column-gap:2.7%;
|
||||
row-gap:45px;
|
||||
grid-template-areas:
|
||||
"profilPic globalInfos"
|
||||
"minfos minfos";
|
||||
}
|
||||
|
||||
.profilPic{
|
||||
grid-area:profilPic;
|
||||
}
|
||||
|
||||
.globalInfos {
|
||||
grid-area:globalInfos;
|
||||
align-self :center;
|
||||
|
||||
}
|
||||
|
||||
.body {
|
||||
min-width:960px;
|
||||
width:100%;
|
||||
display:flex;
|
||||
align-items:center;
|
||||
justify-content:center;
|
||||
margin-top:5%;
|
||||
}
|
||||
|
||||
.subContainter{
|
||||
width:100%;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
border:4px solid black;
|
||||
}
|
||||
|
||||
.infosContainer {
|
||||
padding-bottom:50px;
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
}
|
||||
|
||||
.moreInfos {
|
||||
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;
|
||||
}
|
||||
|
||||
.listElement{
|
||||
border:2px solid black;
|
||||
font-size:25px;
|
||||
color:white;
|
||||
padding:20px;
|
||||
background-color:rgb(50,50,50);
|
||||
border-radius:20px;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
.containerElement{
|
||||
justify-content:center;
|
||||
display:grid;
|
||||
grid-template-columns:100px 100px 300px;
|
||||
grid-template-areas:
|
||||
"year option dateyear";
|
||||
column-gap:40px;
|
||||
padding-left: 25px;
|
||||
}
|
||||
</style>
|
||||
139
frontend/src/Apps/Inscription/CourseList.vue
Normal file
139
frontend/src/Apps/Inscription/CourseList.vue
Normal file
@ -0,0 +1,139 @@
|
||||
<script setup>
|
||||
|
||||
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 {createExemptionsRequest} from "@/rest/requests.js";
|
||||
import {getSelf} from "@/rest/Users.js";
|
||||
|
||||
const props = defineProps(["cursuslist"])
|
||||
const selectedCurriculum = ref(props.cursuslist[0])
|
||||
const user = await getSelf()
|
||||
|
||||
const courseslist = ref(await getcurriculum(selectedCurriculum.value.curriculumId))
|
||||
const list = ref(true)
|
||||
|
||||
const ppData = ref({})
|
||||
async function updateCourseList(){
|
||||
courseslist.value = await getcurriculum(selectedCurriculum.value.curriculumId)
|
||||
}
|
||||
|
||||
async function postExemptionRequest(file, type){
|
||||
const a = await uploadFile(file, type);
|
||||
exemptReq.justifDocument = a.url
|
||||
await createExemptionsRequest(exemptReq)
|
||||
}
|
||||
const exemptReq = reactive({
|
||||
userRegNo : user.regNo,
|
||||
courseId : null,
|
||||
justifDocument : "",
|
||||
})
|
||||
</script>
|
||||
|
||||
<template style="margin-top:5%;">
|
||||
<div v-if="list == true">
|
||||
<span>Selected Cursus : </span>
|
||||
<select v-model="selectedCurriculum" @change="updateCourseList">
|
||||
<option v-for="item in props.cursuslist" :value="item">Bac {{item.year}} {{item.option}}</option>
|
||||
</select>
|
||||
<div style="display:flex; justify-content:center;" v-for="item in courseslist.courses">
|
||||
<div class="bodu">
|
||||
<div class="container">
|
||||
<div class="title">{{item.title}}</div>
|
||||
<div class="firstname">{{item.owner.firstName}}</div>
|
||||
<div class="lastname">{{item.owner.lastName}}</div>
|
||||
<div class="credits">credits : {{item.credits}}</div>
|
||||
<div class="askexemption"><button style="background-color:rgb(105,0,0);" @click="list= !list;exemptReq.courseId=item.courseId">Ask exemption</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<p>Please upload the justification document for the exemption </p>
|
||||
<label class="browser">
|
||||
<input type="file" @change="ppData.value = $event.target.files" accept="image/*" ref="filepath">
|
||||
</label>
|
||||
<button style="width:15%; margin-top: 5%;" @click="postExemptionRequest(ppData.value, 'JustificationDocument');">
|
||||
Submit exemption request
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.container{
|
||||
color:white;
|
||||
height:100px;
|
||||
font-size:30px;
|
||||
display:grid;
|
||||
grid-template-columns:30% 20% 15% 15% 15%;
|
||||
grid-template-areas:"title firstname lastname credits askexemption";
|
||||
column-gap:10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
grid-area:title;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
font-size: 50%;
|
||||
margin-left:30px;
|
||||
}
|
||||
|
||||
.credits {
|
||||
grid-area:credits;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
font-size: 50%;
|
||||
}
|
||||
|
||||
.askexemption {
|
||||
grid-area:askexemption;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
.lastname{
|
||||
grid-area:lastname;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
font-size: 50%;
|
||||
}
|
||||
|
||||
|
||||
.firstname{
|
||||
grid-area:firstname;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
font-size: 50%;
|
||||
padding-left: 30%;
|
||||
}
|
||||
|
||||
|
||||
.bodu {
|
||||
margin-top:2%;
|
||||
width:100%;
|
||||
border:2px solid black;
|
||||
border-radius:9px;
|
||||
background-color:rgb(50,50,50);
|
||||
}
|
||||
|
||||
button{
|
||||
border:none;
|
||||
background-color:rgb(239, 60, 168);
|
||||
border-radius:10px;
|
||||
height:35px;
|
||||
margin-top:10px;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
88
frontend/src/Apps/Inscription/ExternalCurriculumList.vue
Normal file
88
frontend/src/Apps/Inscription/ExternalCurriculumList.vue
Normal file
@ -0,0 +1,88 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js";
|
||||
import {ref} from "vue";
|
||||
|
||||
const props = defineProps(["extCurrList","inscrReqId"])
|
||||
|
||||
const extCurrList = ref(props.extCurrList)
|
||||
|
||||
</script>
|
||||
|
||||
<template style="margin-top:5%;">
|
||||
<div style="display:flex; justify-content:center; " v-for="item in extCurrList">
|
||||
<div class="bodu">
|
||||
<div class="container">
|
||||
<div class="status"><a style="margin-left:30px">{{item.state}}</a></div>
|
||||
<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>Download document</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.container{
|
||||
color:white;
|
||||
height:100px;
|
||||
font-size:30px;
|
||||
display:grid;
|
||||
grid-template-columns:15% 10% 20% 15% 13.1%;
|
||||
grid-template-areas:
|
||||
"status school formation completion download";
|
||||
column-gap:10px;
|
||||
}
|
||||
|
||||
.status {
|
||||
grid-area:status;
|
||||
align-self:center;
|
||||
font-size: 70%;
|
||||
}
|
||||
|
||||
.school{
|
||||
grid-area:school;
|
||||
align-self:center;
|
||||
font-size: 70%;
|
||||
}
|
||||
|
||||
.formation{
|
||||
grid-area:formation;
|
||||
align-self:center;
|
||||
font-size: 70%;
|
||||
}
|
||||
|
||||
.completion{
|
||||
grid-area:completion;
|
||||
align-self:center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
font-size: 70%;
|
||||
}
|
||||
|
||||
.download{
|
||||
grid-area: download;
|
||||
align-self:center;
|
||||
}
|
||||
button{
|
||||
font-size:15px;
|
||||
height:50px;
|
||||
width:75%;
|
||||
border:none;
|
||||
border-radius:20px;
|
||||
|
||||
}
|
||||
|
||||
.bodu {
|
||||
margin-top:2%;
|
||||
width:66%;
|
||||
border:2px solid black;
|
||||
border-radius:9px;
|
||||
background-color:rgb(50,50,50);
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
196
frontend/src/Apps/Inscription/ManageRequests.vue
Normal file
196
frontend/src/Apps/Inscription/ManageRequests.vue
Normal file
@ -0,0 +1,196 @@
|
||||
<script setup>
|
||||
import i18n from "@/i18n.js"
|
||||
import {ref} from 'vue'
|
||||
import {validateRegister, getAllRegisters } from '@/rest/ServiceInscription.js'
|
||||
import AboutRequest from "@/Apps/Inscription/AboutRequest.vue";
|
||||
import {getAllExemptionsRequest, getAllScholarShipsRequest} from "@/rest/requests.js";
|
||||
|
||||
const requests = ref(await getAllRegisters());
|
||||
let targetId = "";
|
||||
|
||||
const requestType = ref("inscription");
|
||||
const filterType = ref("None");
|
||||
|
||||
//0 = liste, 1 = détails, 2 = sure?
|
||||
let windowsState = ref(0);
|
||||
|
||||
async function upPage(id,review){
|
||||
await validateRegister(id,review);
|
||||
|
||||
requests.value = await getAllRegisters();
|
||||
}
|
||||
|
||||
async function loadRequests(){
|
||||
if (requestType.value === "inscription"){
|
||||
requests.value = await getAllRegisters();
|
||||
}
|
||||
if (requestType.value === "scholarship"){
|
||||
requests.value = await getAllScholarShipsRequest();
|
||||
}
|
||||
if(requestType.value === "exemption"){
|
||||
requests.value = await getAllExemptionsRequest();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<template>
|
||||
<div v-if="windowsState === 1">
|
||||
<AboutRequest :target="targetId"></AboutRequest>
|
||||
</div>
|
||||
<div v-if="windowsState === 0">
|
||||
<div style="margin-top: 2%;margin-left: 2%">
|
||||
<span>Request type : </span>
|
||||
<select v-model="requestType" @change="loadRequests()">
|
||||
<option>inscription</option>
|
||||
<option>scholarship</option>
|
||||
<option>exemption</option>
|
||||
</select>
|
||||
<span style="margin-left: 5%">
|
||||
Filter :
|
||||
<select v-model="filterType">
|
||||
<option>None</option>
|
||||
<option>Pending</option>
|
||||
<option>Accepted</option>
|
||||
<option>Refused</option>
|
||||
</select>
|
||||
</span>
|
||||
</div>
|
||||
<div style='display:flex; justify-content:center; min-width:1140px;' v-for="item of requests">
|
||||
<div class="bodu" style="width: 95%" v-if="filterType == 'None' || filterType == item.state">
|
||||
<div class="container" style="grid-template-columns:11% 15% 20% 10% 10% 9% 9%;grid-template-areas:'date state equivalencestate surname firstname accept refuse infos';" v-if="requestType === 'inscription'">
|
||||
<!--
|
||||
The condition below avoids an error occuring because loadRequests() finishes after the vue refresh
|
||||
then submissionDate is undefined an it triggers an error in the console despite the fact that it is working
|
||||
properly at the end.
|
||||
-->
|
||||
<div class="date" v-if="item.submissionDate !== undefined">{{item.submissionDate.slice(0, 10)}}</div>
|
||||
<div class="state" style="font-size: 80%">Approval : {{item.state}}</div>
|
||||
<div class="equivalencestate" style="font-size: 80%">Teacher approval : {{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="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 === 'scholarship'">
|
||||
<div class="date" v-if="item.date !== undefined"> {{item.date.slice(0,10)}}</div>
|
||||
<div class="studentfirstname">{{item.user.firstName}}</div>
|
||||
<div class="studentlastname">{{item.user.lastName}}</div>
|
||||
<div class="reqState">{{item.state}}</div>
|
||||
<div class="infos"><button>More infos</button></div>
|
||||
</div>
|
||||
<div class="container" style="grid-template-columns:17% 15% 12% 15% 25%;grid-template-areas:'date reqState studentfirstname studentlastname course infos';"v-if="requestType === 'exemption'">
|
||||
<div class="date" v-if="item.date != undefined">{{item.date.slice(0,10)}}</div>
|
||||
<div class="studentfirstname">{{item.user.firstName}}</div>
|
||||
<div class="studentlastname">{{item.user.lastName}}</div>
|
||||
<div class="course">{{item.course.title}}</div>
|
||||
<div class="reqState">{{item.state}}</div>
|
||||
<div class="infos"><button>More infos</button></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style='display:flex; justify-content:center; min-width:1140px;margin-top: 10%' v-if="windowsState === 2">
|
||||
<p>Etes vous sur de vouloir accepter cette demande ?</p>
|
||||
<button style="background-color:rgb(105,05,105);" @click="upPage(targetId,'Accepted');windowsState=0;">Valider</button>
|
||||
<button style="background-color:rgb(105,05,105);" @click="windowsState=0;">Retour</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.container{
|
||||
color:white;
|
||||
height:100px;
|
||||
font-size:20px;
|
||||
display:grid;
|
||||
column-gap:10px;
|
||||
}
|
||||
|
||||
.equivalencestate{
|
||||
grid-area: equivalencestate;
|
||||
align-self: center;
|
||||
}
|
||||
.studentfirstname{
|
||||
grid-area: studentfirstname;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.studentlastname{
|
||||
grid-area: studentlastname;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.course{
|
||||
grid-area: course;
|
||||
align-self: center;
|
||||
}
|
||||
.reqState{
|
||||
grid-area: reqState;
|
||||
align-self: center;
|
||||
}
|
||||
.infos {
|
||||
grid-area:infos;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.accept{
|
||||
grid-area:accept;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.refuse{
|
||||
grid-area:refuse;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.date{
|
||||
grid-area:date;
|
||||
margin-left:40px;
|
||||
align-self:center;
|
||||
}
|
||||
|
||||
.state{
|
||||
grid-area:state;
|
||||
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;
|
||||
|
||||
}
|
||||
|
||||
.bodu {
|
||||
margin-top:2%;
|
||||
width:66%;
|
||||
border:2px solid black;
|
||||
border-radius:9px;
|
||||
background-color:rgb(50,50,50);
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user