Generalize the ExternalCurriculumList interface so it fits for inscriptionRequest, Studentlist, and inscriptionform

This commit is contained in:
2024-04-19 09:31:55 +02:00
parent a9e52d34d4
commit 5a57fc78f3
3 changed files with 68 additions and 65 deletions

View File

@ -62,7 +62,7 @@ async function editEquivalence(id, newstate){
</div>
</div>
<div v-if="list==true">
<ExternalCurriculumList :ext-curr-list="externalCurriculum" :inscr-req-id="request.id"></ExternalCurriculumList>
<ExternalCurriculumList :ext-curr-list="externalCurriculum" :mode="0"></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>

View File

@ -4,15 +4,23 @@
import {getSelf} from "@/rest/Users.js";
import {createExternalCurriculum, getExternalCurriculumByUser} from "@/rest/externalCurriculum.js";
//mode 0 = externalcurr related to inscrreq, 1 = externalcurr related to user
//mode 0 = externalcurr related to inscrreq, 1 = externalcurr related to user, 2 inscription procedure
const props = defineProps(["extCurrList", "mode"])
const extCurrList = ref(props.extCurrList)
//Only usefull to pass the external curr array in the inscription procedure
const externalCurrTab = defineModel();
const extCurrList = ref({})
let extNum = 0
const User = ref({})
if (props.mode === 1){
User.value = await getSelf()
}
const User = await getSelf()
const list = ref(true)
const editmode = ref(false)
const notcompletedCheck = ref(false);
const externalCurr = reactive({
@ -28,22 +36,49 @@
if (props.mode === 1){
externalCurr.userRegNo = props.extCurrList[0].user.regNo
}else if(props.mode === 2){
extCurrList.value = externalCurrTab.value
}
if(props.mode !== 2){
extCurrList.value = props.extCurrList
console.log("oe")
}
function deleteExtCursus(extcursus){
externalCurrTab.value.splice(externalCurrTab.value.indexOf(extcursus),1)
}
async function postExternalCurr(){
await createExternalCurriculum(externalCurr.inscriptionRequestId, externalCurr.school, externalCurr.formation, externalCurr.completion, externalCurr.startYear, externalCurr.endYear, externalCurr.justifdocUrl, externalCurr.userRegNo);
//We refresh the list
extCurrList.value = await getExternalCurriculumByUser(externalCurr.userRegNo);
list.value = !list.value;
if (props.mode === 1){
await createExternalCurriculum(externalCurr.inscriptionRequestId, externalCurr.school, externalCurr.formation, externalCurr.completion, externalCurr.startYear, externalCurr.endYear, externalCurr.justifdocUrl, externalCurr.userRegNo);
//We refresh the list
extCurrList.value = await getExternalCurriculumByUser(externalCurr.userRegNo);
list.value = !list.value;
}else if (props.mode === 2){
externalCurrTab.value.push({
inscriptionRequestId : externalCurr.inscriptionRequestId,
school:externalCurr.school,
formation :externalCurr.formation,
completion : externalCurr.completion,
startYear : externalCurr.startYear,
endYear: externalCurr.endYear,
justifdocUrl : externalCurr.justifdocUrl,
userRegNo : externalCurr.userRegNo
});
extCurrList.value = externalCurrTab.value
list.value = !list.value;
console.log(externalCurrTab.value)
}
}
</script>
<template style="margin-top:5%;">
<div v-if="list">
<div v-if="User.regNo === externalCurr.userRegNo" style="margin-left: 2%;margin-top: 2%">
<div v-if="props.mode === 2||User.regNo === externalCurr.userRegNo" style="margin-left: 2%;margin-top: 2%">
<button @click="list = !list">Add external curriculum</button>
</div>
<div style="display:flex; justify-content:center; " v-for="item in extCurrList">
<div style="display:flex; justify-content:center; " v-for="(item, index) in extCurrList">
<div class="bodu">
<div class="container">
<div class="status"><a style="margin-left:30px">{{item.state}}</a></div>
@ -51,6 +86,8 @@
<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 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">Edit</button></div>
<div class="delete" v-if="props.mode === 2"><button @click="deleteExtCursus(item)">Delete</button></div>
</div>
</div>
</div>
@ -82,7 +119,8 @@
<input type="number" v-model="externalCurr.endYear">
</div>
<div class="inputBox" style="margin-top: 3%; margin-bottom: 3%">
<input type="submit" value="Upload curriculum" @click="postExternalCurr()">
<input v-if="!editmode" type="submit" value="Upload curriculum" @click="postExternalCurr()">
<input v-else type="submit" value="Edit curriculum" @click="externalCurrTab[extNum] = {inscriptionRequestId : externalCurr.inscriptionRequestId,school:externalCurr.school,formation :externalCurr.formation,completion : externalCurr.completion,startYear : externalCurr.startYear,endYear: externalCurr.endYear,justifdocUrl : externalCurr.justifdocUrl,userRegNo : externalCurr.userRegNo};editmode=!editmode;list=!list">
</div>
</form>
</div>
@ -94,9 +132,9 @@
height:100px;
font-size:30px;
display:grid;
grid-template-columns:15% 10% 20% 15% 13.1%;
grid-template-columns:5% 10% 20% 15% 20% 10%;
grid-template-areas:
"status school formation completion download";
"status school formation completion download edit delete";
column-gap:10px;
}
@ -106,6 +144,15 @@
font-size: 70%;
}
.edit{
grid-area: edit;
align-self: center;
}
.delete{
grid-area: delete;
align-self: center;
}
.school{
grid-area:school;
align-self:center;