From 647812576e0cbb08c74771ce60b50e5de8006d95 Mon Sep 17 00:00:00 2001 From: ALAMI Adnane Date: Wed, 9 Apr 2025 00:05:15 +0200 Subject: [PATCH] feat: enhancing visuals --- front/MyINPulse-front/src/App.vue | 4 +- .../src/components/canvas/CanvasItem.vue | 40 +++-- .../src/components/canvas/HeaderCanvas.vue | 147 +++++++++++++----- 3 files changed, 133 insertions(+), 58 deletions(-) diff --git a/front/MyINPulse-front/src/App.vue b/front/MyINPulse-front/src/App.vue index b521d75..c675988 100644 --- a/front/MyINPulse-front/src/App.vue +++ b/front/MyINPulse-front/src/App.vue @@ -7,8 +7,8 @@ import ErrorWrapper from "@/views/errorWrapper.vue";
- Home | - Canvas + + diff --git a/front/MyINPulse-front/src/components/canvas/CanvasItem.vue b/front/MyINPulse-front/src/components/canvas/CanvasItem.vue index 9065461..2ff2219 100755 --- a/front/MyINPulse-front/src/components/canvas/CanvasItem.vue +++ b/front/MyINPulse-front/src/components/canvas/CanvasItem.vue @@ -35,9 +35,12 @@ - - + @@ -107,9 +110,9 @@ const mockFetch = async (projectId: number, title: number, date: string) => { return new Promise<{ txt: string }[]>((resolve) => { setTimeout(() => { resolve([ - { txt: "Ceci est une description 1 pour tester the damn front, Why are u still reading dumbass this is just some nonsense sentence XD" }, - { txt: "Ceci est une description 1 pour tester the damn front, Bruh are u still here?" }, - { txt: "Ceci est une description 1 pour tester the damn front, .-. BRUH" } + {txt: "Ceci est une description 1 pour tester le front. Franchement, si tu es encore en train de lire, c’est probablement que tu veux t'assurer que tout s’affiche bien même avec un texte bien long. Allez, encore quelques mots inutiles pour bien remplir la ligne et tester les retours à la ligne. Bravo champion."}, + {txt: "Deuxième description : elle est là pour t’aider à tester le comportement du composant avec du texte plus dense. Peut-être même avec quelques caractères spéciaux, tiens : éèàçù$#@! Et si on faisait semblant d’avoir du contenu sérieux ? Non, toujours pas."}, + {txt: "Troisième description, probablement inutile mais bon, on continue pour la forme. À ce stade, tu testes sûrement si le champ de texte peut supporter un pavé sans exploser. Spoiler alert : si t'as tout bien codé, ça devrait aller. Sinon, bah... débogue. Courage."} ]); }, 500); // Simule un délai réseau de 500ms }); @@ -118,7 +121,7 @@ const mockFetch = async (projectId: number, title: number, date: string) => { // Utilisation du mock dans handleClick pour tester sans serveur const handleClick = async () => { if (!expanded.value) { - await fetchData(props.projectId, props.title, "NaN", IS_MOCK_MODE); // true pour activer le mock + await fetchData(props.projectId, props.title, "NaN", IS_MOCK_MODE); } else if (!isEditing.value.includes(true)) { // Réinitialiser les descriptions si aucune édition n'est en cours currentDescriptions.value = [props.description]; @@ -152,7 +155,6 @@ const saveEdit = async (index: number) => { }; */ -// Utilisation de `mockSaveEdit` au lieu de `saveEdit` dans `handleClick` ou tout autre endroit const saveEdit = async (index: number) => { if (IS_MOCK_MODE) { await mockSaveEdit(index); @@ -175,10 +177,9 @@ const saveEdit = async (index: number) => { // Fonction de mock pour l'enregistrement const mockSaveEdit = async (index: number) => { try { - const id = index + 1; // À adapter selon l'ID réel des données + const id = index + 1; console.log(`Mock save pour l'ID ${id} avec la description : ${editedDescriptions.value[index]}`); - // Simuler un délai d'enregistrement comme une requête réseau await new Promise((resolve) => setTimeout(resolve, 500)); // Simulation de délai réseau // Mettre à jour l'affichage local après la mise à jour réussie @@ -198,6 +199,9 @@ const cancelEdit = (index: number) => { \ No newline at end of file diff --git a/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue b/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue index 0fea105..6d4cf5c 100644 --- a/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue +++ b/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue @@ -1,19 +1,19 @@ @@ -23,76 +23,138 @@ import { ref, onMounted } from "vue"; import axios from "axios"; +const IS_MOCK_MODE = true; + +const props = defineProps<{ + projectId: number; +}>(); + +type Entrepreneur = { + id: number; + name: string; + primaryMail: string; +}; + const isDropdownOpen = ref(false); const entrepreneurEmails = ref([]); const toggleDropdown = () => { isDropdownOpen.value = !isDropdownOpen.value; - console.log("Dropdown toggled:", isDropdownOpen.value); // for debug purposes + console.log("Dropdown toggled:", isDropdownOpen.value); }; -const fetchEntrepreneurs = async () => { + +const fetchEntrepreneurs = async (projectId :number, useMock = IS_MOCK_MODE) => { try { - const response = await axios.get("http://localhost:5000/entrepreneurs"); - entrepreneurEmails.value = response.data.map((e: { email: string }) => e.email); + const responseData = useMock + ? await mockFetchEntrepreneurs(projectId) + : (await axios.get(`http://localhost:5000/shared/projects/entrepreneurs/${projectId}`)).data; + + if (responseData.length > 0) { + entrepreneurEmails.value = responseData.map((item) => item.primaryMail); + } else { + console.warn("Aucun entrepreneur trouvé."); + } } catch (error) { - console.error("Erreur lors de la récupération des entrepreneurs:", error); + console.error("Erreur lors de la récupération des entrepreneurs :", error); } }; +// Fonction de simulation de l'API +const mockFetchEntrepreneurs = async (projectId :number) => { + console.log(`Mock fetch pour projectId: ${projectId}`); + + return new Promise((resolve) => { + setTimeout(() => { + resolve([ + { + idUser: 1, + userSurname: "Doe", + userName: "John", + primaryMail: "john.doe@example.com", + secondaryMail: "johndoe@backup.com", + phoneNumber: "612345678", + school: "ENSEIRB", + course: "Info", + sneeStatus: false + }, + { + idUser: 2, + userSurname: "Smith", + userName: "Jane", + primaryMail: "jane.smith@example.com", + secondaryMail: "janesmith@backup.com", + phoneNumber: "698765432", + school: "ENSEIRB", + course: "Info", + sneeStatus: true + } + ]); + }, 500); + }); +}; + const contactAll = () => { alert("Contacter tous les entrepreneurs : " + entrepreneurEmails.value.join(", ")); }; -onMounted(fetchEntrepreneurs); +onMounted(() => fetchEntrepreneurs(props.projectId, IS_MOCK_MODE)); -