From 4356a01e4a699b309ab30f1793ffd9108d90ce76 Mon Sep 17 00:00:00 2001
From: ALAMI Adnane <Adnane.Alami@bordeaux-inp.fr>
Date: Thu, 1 May 2025 19:23:21 +0200
Subject: [PATCH] feat: adding delete button with the corresponding endpoint

---
 .../src/components/AllEntrep.vue              | 77 +++++++++++++++++++
 .../src/components/canvas/CanvasItem.vue      | 61 ++++++++++++++-
 .../src/components/canvas/HeaderCanvas.vue    |  2 +-
 .../src/services/Apis/Unauth.ts               | 23 ++++++
 front/MyINPulse-front/src/views/AdminMain.vue |  4 +-
 .../MyINPulse-front/src/views/CanvasView.vue  |  2 +-
 6 files changed, 165 insertions(+), 4 deletions(-)
 create mode 100644 front/MyINPulse-front/src/components/AllEntrep.vue

diff --git a/front/MyINPulse-front/src/components/AllEntrep.vue b/front/MyINPulse-front/src/components/AllEntrep.vue
new file mode 100644
index 0000000..b8e2df8
--- /dev/null
+++ b/front/MyINPulse-front/src/components/AllEntrep.vue
@@ -0,0 +1,77 @@
+<template>
+    <div class="entrepreneur-list">
+        <button @click="fetchEntrepreneurs">Afficher les entrepreneurs</button>
+
+        <ul v-if="entrepreneurs.length">
+            <li
+                v-for="entrepreneur in entrepreneurs"
+                :key="entrepreneur.idUser"
+            >
+                {{ entrepreneur.userName }} {{ entrepreneur.userSurname }} -
+                {{ entrepreneur.primaryMail }}
+            </li>
+        </ul>
+
+        <p v-else-if="loading">Chargement...</p>
+        <p v-else-if="errorMessage">{{ errorMessage }}</p>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import type { AxiosResponse, AxiosError } from "axios";
+import { getAllEntrepreneurs } from "@/services/Apis/Unauth"; // ajuste ce chemin selon ton projet
+
+// Types
+interface Entrepreneur {
+    idUser: number;
+    userName: string;
+    userSurname: string;
+    primaryMail: string;
+}
+
+// Refs
+const entrepreneurs = ref<Entrepreneur[]>([]);
+const loading = ref(false);
+const errorMessage = ref("");
+
+// Méthode
+function fetchEntrepreneurs() {
+    loading.value = true;
+    errorMessage.value = "";
+    getAllEntrepreneurs(
+        (response: AxiosResponse) => {
+            if (Array.isArray(response.data)) {
+                entrepreneurs.value = response.data;
+            } else {
+                console.error("Format inattendu :", response.data);
+                errorMessage.value = "Réponse inattendue du serveur.";
+            }
+            loading.value = false;
+        },
+        (error: AxiosError) => {
+            errorMessage.value = "Erreur lors du chargement des entrepreneurs.";
+            console.error(error);
+            loading.value = false;
+        }
+    );
+}
+</script>
+
+<style scoped>
+button {
+    margin-bottom: 1rem;
+    padding: 0.5rem 1rem;
+    font-size: 1rem;
+    cursor: pointer;
+}
+
+ul {
+    list-style-type: none;
+    padding: 0;
+}
+
+li {
+    margin-bottom: 0.5rem;
+}
+</style>
diff --git a/front/MyINPulse-front/src/components/canvas/CanvasItem.vue b/front/MyINPulse-front/src/components/canvas/CanvasItem.vue
index 5c04b62..8caa3ce 100755
--- a/front/MyINPulse-front/src/components/canvas/CanvasItem.vue
+++ b/front/MyINPulse-front/src/components/canvas/CanvasItem.vue
@@ -30,6 +30,18 @@
                 <template v-else>
                     <!-- Mode affichage -->
                     <template v-if="!isEditing[index]">
+                        <template v-if="expanded">
+                            <button
+                                class="delete-button"
+                                title="Supprimer"
+                                @click.stop="
+                                    deleteSectionCell(desc.idSectionCell, index)
+                                "
+                            >
+                                ✕
+                            </button>
+                        </template>
+
                         <div class="description">
                             <p class="m-0">{{ desc.contentSectionCell }}</p>
                         </div>
@@ -87,7 +99,7 @@ import { ref, defineProps, onMounted } from "vue";
 import { getSectionCellsByDate } from "@/services/Apis/Shared.ts";
 import { addSectionCell } from "@/services/Apis/Entrepreneurs.ts";
 import SectionCell from "@/ApiClasses/SectionCell";
-
+import { removeSectionCell } from "@/services/Apis/Entrepreneurs.ts";
 import type { AxiosResponse, AxiosError } from "axios";
 
 const props = defineProps<{
@@ -137,6 +149,37 @@ const saveEdit = (index: number) => {
     }
 };
 
+const deleteSectionCell = (id: number | undefined, index: number): void => {
+    if (id === -1) {
+        window.confirm("Êtes-vous sûr de vouloir supprimer cet élément ?");
+        console.error("Delete ignored");
+        return;
+    }
+
+    const confirmed = window.confirm(
+        "Êtes-vous sûr de vouloir supprimer cet élément ?"
+    );
+
+    if (!confirmed) return;
+
+    if (id === undefined) {
+        console.error("ID de la cellule non défini");
+        return;
+    }
+
+    removeSectionCell(
+        id,
+        () => {
+            currentDescriptions.value.splice(index, 1);
+            editedDescriptions.value.splice(index, 1);
+            isEditing.value.splice(index, 1);
+        },
+        (error: AxiosError) => {
+            console.error("Erreur lors de la suppression :", error);
+        }
+    );
+};
+
 const handleClick = () => {
     if (expanded.value) {
         const editingInProgress = isEditing.value.some((edit) => edit);
@@ -625,4 +668,20 @@ onMounted(() => {
     line-height: 1.6;
     font-family: "Segoe UI", sans-serif;
 }
+
+.delete-button {
+    position: absolute;
+    top: 5px;
+    right: 10px;
+    background: transparent;
+    border: none;
+    color: #a00;
+    font-size: 1.2rem;
+    cursor: pointer;
+    z-index: 10;
+}
+
+.section-bloc {
+    position: relative;
+}
 </style>
diff --git a/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue b/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue
index fea3d4c..731a96b 100644
--- a/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue
+++ b/front/MyINPulse-front/src/components/canvas/HeaderCanvas.vue
@@ -169,7 +169,7 @@ onBeforeUnmount(() => {
     display: flex;
     justify-content: space-between;
     align-items: center;
-    padding: 15px 30px;
+    padding: 10px 20px;
     background-color: #f9f9f9;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
 }
diff --git a/front/MyINPulse-front/src/services/Apis/Unauth.ts b/front/MyINPulse-front/src/services/Apis/Unauth.ts
index 032502d..2e5f7f1 100644
--- a/front/MyINPulse-front/src/services/Apis/Unauth.ts
+++ b/front/MyINPulse-front/src/services/Apis/Unauth.ts
@@ -52,7 +52,30 @@ function finalizeAccount(
 //         });
 // }
 
+function getAllEntrepreneurs(
+    onSuccessHandler?: (response: AxiosResponse) => void,
+    onErrorHandler?: (error: AxiosError) => void
+): void {
+    axiosInstance
+        .get("/unauth/getAllEntrepreneurs")
+        .then((response) => {
+            if (onSuccessHandler) {
+                onSuccessHandler(response);
+            } else {
+                defaultApiSuccessHandler(response);
+            }
+        })
+        .catch((error: AxiosError) => {
+            if (onErrorHandler) {
+                onErrorHandler(error);
+            } else {
+                defaultApiErrorHandler(error);
+            }
+        });
+}
+
 export {
     finalizeAccount,
+    getAllEntrepreneurs,
     // requestJoinProject, // Not yet implemented [cite: 4]
 };
diff --git a/front/MyINPulse-front/src/views/AdminMain.vue b/front/MyINPulse-front/src/views/AdminMain.vue
index 1ce1af5..5a261f9 100644
--- a/front/MyINPulse-front/src/views/AdminMain.vue
+++ b/front/MyINPulse-front/src/views/AdminMain.vue
@@ -13,6 +13,8 @@
                 :project-id="0"
             />
 
+            <!-- <AllEntrep /> -->
+
             <div id="main">
                 <h3>Projet en attente</h3>
 
@@ -45,7 +47,7 @@ import { getProjectEntrepreneurs } from "@/services/Apis/Shared";
 import { type AxiosError, type AxiosResponse } from "axios";
 import Project from "@/ApiClasses/Project";
 import UserEntrepreneur from "@/ApiClasses/UserEntrepreneur";
-
+//import AllEntrep from "../components/AllEntrep.vue";
 const projects = ref<
     {
         name: string;
diff --git a/front/MyINPulse-front/src/views/CanvasView.vue b/front/MyINPulse-front/src/views/CanvasView.vue
index 681b3e2..d8174d4 100644
--- a/front/MyINPulse-front/src/views/CanvasView.vue
+++ b/front/MyINPulse-front/src/views/CanvasView.vue
@@ -112,7 +112,7 @@ const fetchAdminData = (projectId: number, useMock = IS_MOCK_MODE) => {
                 "Erreur lors de la récupération des données de l'administrateur :",
                 error
             );
-            
+
             admin.value = new UserAdmin({
                 idUser: 0,
                 userSurname: "Erreur",