PGL/Clyde
PGL/Clyde
3
2
Fork 3
Code Issues 13 Pull Requests Actions Projects 3 Releases 2 Wiki Activity

course management

Browse Source
This commit is contained in:
Wawilski 2024-03-12 11:10:14 +01:00 committed by Wal
parent 4f511bf066
commit d5b1df32b6
2 changed files with 89 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/App.vue
View File

@ -8,11 +8,13 @@
import LoginPage from './Apps/Login.vue' import LoginPage from './Apps/Login.vue'
import Inscription from "./Apps/Inscription.vue" import Inscription from "./Apps/Inscription.vue"
import Profil from "./Apps/Profil.vue" import Profil from "./Apps/Profil.vue"
import Courses from "./Apps/ManageCourses.vue"
const apps = { const apps = {
'/login': LoginPage, '/login': LoginPage,
'/inscription': Inscription, '/inscription': Inscription,
'/profil': Profil '/profil': Profil,
'/manage-courses' : Courses,
} }
const currentPath = ref(window.location.hash) const currentPath = ref(window.location.hash)
@ -97,8 +99,12 @@
<div class="fa-solid fa-envelope" style="font-size: 40px;" ></div> <div class="fa-solid fa-envelope" style="font-size: 40px;" ></div>
<div class="text">{{i18n("app.forum")}}</div></a></li> <div class="text">{{i18n("app.forum")}}</div></a></li>
<li><a href="#/inscription"> <li><a href="#/inscription">
<div class="fa-solid fa-users" style="font-size: 40px;"></div> <div class="fa-solid fa-users" style="align-self:center;font-size: 40px;"></div>
<div class="text">{{i18n("app.inscription.requests")}}</div></a></li> <div class="text" style="top:0;">{{i18n("app.inscription.requests")}}</div></a></li>
<li><a href="#/manage-courses">
<div class="fa-solid fa-book" style="align-self:center;font-size: 40px;overflow:none;"></div>
<div class="text">Manage courses</div></a></li>
</ul> </ul>
</div> </div>
@ -246,7 +252,6 @@
} }
.text { .text {
position: absolute;
right: 0%; right: 0%;
width: 0%; width: 0%;
opacity: 0; opacity: 0;
@ -258,9 +263,9 @@
ul.vertical:hover .text { ul.vertical:hover .text {
opacity: 1; opacity: 1;
width: 70%; width: 60%;
transition-duration: .3s; transition-duration: .3s;
padding-left: 5px; padding-left: 15px;
} }
</style> </style>

78
frontend/src/Apps/ManageCourses.vue Normal file
View File

@ -0,0 +1,78 @@
<script setup>
const cursus=[
{
"id": 12,
"name": "Math pour l'info",
"credits": 11,
"faculty": "science",
"teacher": 42,
"Assistants": []},
{
"id": 42,
"name": "Operating Systems",
"credits": 8,
"faculty": "science",
"teacher": 14,
"Assistants": []},
{
"id": 42,
"name": "Fonctionnement des ordinateurs",
"credits": 11,
"faculty": "science",
"teacher": 42,
"Assistants": []},
]
</script>
<template>
<div class="body">
<div class="listElement " v-for="item in cursus">
<div class=" containerElement">
<div class="name"> {{item.name}} </div>
<div class="teacher">{{item.teacher}}</div>
<div class="credits">Credits:{{item.credits}}</div>
</div>
</div>
</div>
</template>
<style scoped>
.body {
width:100%;
margin-bottom:10px;
}
.containerElement{
justify-content:center;
display:grid;
grid-template-columns:350px 350px 200px;
grid-template-areas:
"name teacher credits";
column-gap:10px;
}
.name {
grid-area:name;
align-self:center;
}
.teacher{
grid-area:teacher;
align-self:center;
}
.credits{
grid-area:credits;
align-self:center;
}
.listElement{
border:2px solid black;
font-size:25px;
color:white;
padding:20px;
background-color:rgb(50,50,50);
border-radius:20px;
margin-bottom:10px;
}
</style>