166 lines
3.8 KiB
Vue
166 lines
3.8 KiB
Vue
<template>
|
|
<Header />
|
|
<error-wrapper></error-wrapper>
|
|
<div id="container">
|
|
<div id="main">
|
|
<h3> Projet en cours </h3>
|
|
<ProjectComp
|
|
v-for="(project, index) in projects"
|
|
:key="index"
|
|
:project-name="project.name"
|
|
:list-name="project.members"
|
|
:project-link="project.link"
|
|
/>
|
|
|
|
<div id ="main">
|
|
<h3> Projet en attente </h3>
|
|
|
|
<PendingProjectComponent
|
|
v-for="( project, index) in pendingProjects"
|
|
:key="index"
|
|
:project-name="project.name"
|
|
:creation-date="project.creationDate"
|
|
/>
|
|
</div>
|
|
|
|
<AddProjectForm/>
|
|
</div>
|
|
|
|
<Agenda :project-r-d-v="rendezVous" />
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
import { callApi } from "@/services/api";
|
|
|
|
import Header from "../components/HeaderComponent.vue";
|
|
import Agenda from "../components/Agenda.vue";
|
|
import ProjectComp from "../components/ProjectComponent.vue";
|
|
import PendingProjectComponent from "@/components/PendingProjectComponent.vue";
|
|
import AddProjectForm from "@/components/AddProjectForm.vue";
|
|
|
|
const PORT = "8081";
|
|
const URI = `http://localhost:${PORT}`;
|
|
|
|
//const projects = ref<{ name: string; link: string; members: string[] }[]>([]);
|
|
|
|
/* const fetchProjects = () => {
|
|
callApi(
|
|
`${URI}/admin/projects`,
|
|
async (response) => {
|
|
console.log(response);
|
|
const projectList = response.data;
|
|
|
|
const projectPromises = projectList.map((project: any) => {
|
|
return new Promise(async (resolve) => {
|
|
callApi(
|
|
`${URI}/shared/projects/entrepreneurs/${project.idProject}`,
|
|
(memberResponse) => {
|
|
const members = memberResponse.data.map((m: any) => m.userName);
|
|
resolve({
|
|
name: project.projectName,
|
|
link: `/project/${project.idProject}`,
|
|
members,
|
|
});
|
|
},
|
|
() => {
|
|
// Error fetching members, still resolve with empty members
|
|
resolve({
|
|
name: project.projectName,
|
|
link: `/project/${project.idProject}`,
|
|
members: [],
|
|
});
|
|
}
|
|
);
|
|
});
|
|
});
|
|
|
|
projects.value = await Promise.all(projectPromises);
|
|
},
|
|
(error) => {
|
|
console.error("Error fetching projects:", error);
|
|
}
|
|
);
|
|
};
|
|
|
|
onMounted(fetchProjects);
|
|
*/
|
|
|
|
|
|
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 pendingProjects = ref ([
|
|
{ name: "l'eau", creationDate: "26-02-2024" },
|
|
{ name: "l'air", creationDate: "09-03-2023" },
|
|
])
|
|
|
|
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 {
|
|
display: grid;
|
|
grid-template-columns: 3fr 1fr;
|
|
gap: 2rem;
|
|
padding: 2rem;
|
|
background-color: #f4f6f9;
|
|
min-height: 100vh;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
#main {
|
|
background-color: #fff;
|
|
padding: 2rem;
|
|
border-radius: 12px;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
h3 {
|
|
font-size: 1.5rem;
|
|
color: #333;
|
|
margin-bottom: 1.2rem;
|
|
border-bottom: 2px solid #ddd;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
button {
|
|
padding: 10px 15px;
|
|
background-color: #007bff;
|
|
color: white;
|
|
border: none;
|
|
cursor: pointer;
|
|
border-radius: 6px;
|
|
font-weight: 500;
|
|
transition: background-color 0.2s ease;
|
|
}
|
|
|
|
button:hover {
|
|
background-color: #0056b3;
|
|
}
|
|
|
|
/* Add spacing between project sections */
|
|
#main > * + * {
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
|
|
</style> |