weekly set up, end
This commit is contained in:
parent
2b9493422d
commit
443cf55784
@ -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
|
||||||
|
@ -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>
|
||||||
|
Loading…
Reference in New Issue
Block a user