68 lines
1.4 KiB
Vue
68 lines
1.4 KiB
Vue
<template>
|
|
<Header />
|
|
<error-wrapper></error-wrapper>
|
|
<div id="container">
|
|
<div id="main">
|
|
<ProjectComp
|
|
v-for="(project, index) in projects"
|
|
:key="index"
|
|
:projectName="project.name"
|
|
:listName="project.members"
|
|
:projectLink="project.link"
|
|
/>
|
|
</div>
|
|
|
|
<Agenda :projectRDV="rendezVous" />
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Header from '../components/HeaderComponent.vue';
|
|
import Agenda from "../components/Agenda.vue"
|
|
import ProjectComp from '../components/ProjectComponent.vue';
|
|
|
|
import { ref } from "vue";
|
|
|
|
const projects = ref([
|
|
{
|
|
name: "Projet Alpha",
|
|
link: "/canvas", // to test
|
|
members: ["Alice", "Bob", "Charlie"],
|
|
},
|
|
{
|
|
name: "Projet Beta",
|
|
link: "./canvas", // to test
|
|
members: ["David", "Eve", "Frank"],
|
|
},
|
|
]);
|
|
|
|
const rendezVous = ref([
|
|
{ projectName: "Projet Alpha", date: "2025-03-10", lieu: "P106" },
|
|
{ projectName: "Projet Beta", date: "2025-04-15", lieu: "Td10" },
|
|
]);
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
#container {
|
|
margin: 0;
|
|
display: grid;
|
|
grid-template-columns: 3fr 1fr; /* Main body takes 3/4, agenda 1/4 */
|
|
height: 100vh; /* Full viewport height */
|
|
}
|
|
|
|
button {
|
|
padding: 10px 15px;
|
|
background-color: #007bff;
|
|
color: white;
|
|
border: none;
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
}
|
|
button:hover {
|
|
background-color: #0056b3;
|
|
}
|
|
|
|
</style> |