1
0
forked from PGL/Clyde

weekly set up, end

This commit is contained in:
Wawilski 2024-04-02 16:52:40 +02:00
parent 2b9493422d
commit 443cf55784
2 changed files with 58 additions and 21 deletions

View File

@ -17,7 +17,7 @@
const editElementID = ref("") const editElementID = ref("")
function editItem(id){ function editItem(id){
editElementID = id; editElementID.value = id;
} }
//Juste pour montrer le Create Mode //Juste pour montrer le Create Mode

View File

@ -3,23 +3,26 @@
const schedule = [ const schedule = [
{course:"Math Pour L'info", {course:"Math Pour L'info",
start:"Wed Mar 27 2024 10:15 GMT+0100", start:"Tue Mar 26 2024 08:15 GMT+0100",
end:"Wed Mar 27 2024 12:15 GMT+0100"}, end:"Tue Mar 26 2024 10:15 GMT+0100",
color:"rgb(0,50,100)"},
{ {
course:"Calculus", course:"Calculus",
start:"Wed Mar 27 2024 08:00 GMT+0100", start:"Wed Mar 27 2024 08:15 GMT+0100",
end:"Wed Mar 27 2024 10:00 GMT+0100" end:"Wed Mar 27 2024 09:15 GMT+0100",
color:"rgb(100,50,0)"
}, },
{ {
course:"Physique II", course:"Physique II",
start:"Tue Mar 26 2024 10:15 GMT+0100", start:"Tue Mar 26 2024 10:30 GMT+0100",
end:"Tue Mar 26 2024 12:15 GMT+0100" end:"Tue Mar 26 2024 12:30 GMT+0100",
color:"rgb(100,50,100)"
}, },
{ {
course:"Math Pour L'info", course:"Math Pour L'info",
start:"Thu Mar 28 2024 10:15 GMT+0100", start:"Tue Mar 26 2024 13:30 GMT+0100",
end:"Thu Mar 28 2024 12:15 GMT+0100" end:"Tue Mar 26 2024 15:30 GMT+0100",
color:"rgb(100,0,50)"
}] }]
function formatDate(date) { function formatDate(date) {
var d = new Date(date), var d = new Date(date),
@ -97,10 +100,28 @@
return matrix; return matrix;
} }
function sundayToTheEnd(list){
const newlist = list;
const sunday = newlist.shift();
newlist.push(sunday);
return newlist;
}
const schedule2 = matrixFromList(schedule); function getDifferenceTime(date1,date2){
const scheduleByWeek = transpose(schedule2); return Math.abs((new Date(date2).getTime() - new Date(date1).getTime())/60000);
}
function getMarginTop(list, index1, index2){
if(index2 < 0){
const temp = new Date(list[index1].start);
temp.setHours(8,0,0);
return Math.abs((new Date(list[index1].start).getTime()- temp.getTime())/60000);
}
return Math.abs((new Date(list[index1].start).getTime()- new Date(list[index2].end).getTime())/60000)+getMarginTop(list,index2,index2-1);
}
const scheduleByWeek = sundayToTheEnd(matrixFromList(schedule));
console.log(scheduleByWeek) console.log(scheduleByWeek)
</script> </script>
@ -126,8 +147,15 @@
</tr> </tr>
</table> </table>
<div class="courseGrid"> <div class="courseGrid">
<div v-for="i in 7"> <div class="dayCourse" v-for="element in scheduleByWeek">
Test <template v-for="i,index in element.length">
{{console.log(element[index].start)}}
<div class="course" v-bind:style="{background:element[index].color,
height:((getDifferenceTime(element[index].end,element[index].start)/7.2)-0.5)+'%', top:((getMarginTop(element, index, index-1)/7.20))+'%'}">
<div>Local</div>
</div>
</template>
</div> </div>
</div> </div>
</div> </div>
@ -201,11 +229,20 @@
} }
.course{ .course{
width:100%; position:relative;
height:100%; border: 1px solid black;
background-color:rgb(100,0,100); border-radius:10px;
width:90%;
margin-left:auto;
margin-right:auto;
display:grid;
grid-template-rows:1fr 1fr 1fr;
} }
.dayCourse{
display:block;
}
</style> </style>