feat: all Canvas endpoints implemented, just waiting for projectId to test

front/MyINPulse-front/src/views/CanvasView.vue

@@ -1,7 +1,10 @@
 <template>
     <div>
         <header>
-            <HeaderCanvas :project-id="1" />
+            <HeaderCanvas
+                :project-id="1"
+                :is-admin="isAdmin_"
+            />
         </header>
     </div>
     <div>
@@ -10,22 +13,22 @@
             Cliquez sur un champ du tableau pour afficher son contenu en détail
             ci-dessous.
         </p>
-        <LeanCanvas :is-admin="isAdmin_" />
+        <LeanCanvas
+            :project-id="1"
+            :is-admin="isAdmin_"
+        />
         <div class="info-box">
-            <p>
+            <p v-if="admin">
                 Responsable :
-                <strong>{{ admin.userName }} {{ admin.userSurname }}</strong
-                ><br />
+                <strong>{{ admin.userName }} {{ admin.userSurname }}</strong><br />
                 Contact :
-                <a href="mailto:{{ admin.primaryMail }}">{{
-                    admin.primaryMail
-                }}</a>
+                <a :href="`mailto:${admin.primaryMail}`">{{ admin.primaryMail }}</a>
                 |
-                <a href="tel:{{ admin.phoneNumber }}">{{
-                    admin.phoneNumber
-                }}</a>
+                <a :href="`tel:${admin.phoneNumber}`">{{ admin.phoneNumber }}</a>
+            </p>
+            <p v-else>
+                Chargement des informations du responsable...
             </p>
-            <div class="main"></div>
         </div>
     </div>
 </template>
@@ -33,10 +36,11 @@
 <script setup lang="ts">
 import HeaderCanvas from "../components/canvas/HeaderCanvas.vue";
 import LeanCanvas from "../components/canvas/LeanCanvas.vue";
-import { ref, onMounted /*, defineProps*/ } from "vue";
+import { ref, onMounted } from "vue";
 import { axiosInstance } from "@/services/api.ts";
 import { isAdmin } from "@/services/tools.ts";
-const IS_MOCK_MODE = true;
+import { getProjectAdmin } from "@/services/Apis/Shared.ts";
+import UserAdmin from "@/ApiClasses/UserAdmin.ts";
 
 /*
 const props = defineProps<{
@@ -46,51 +50,35 @@ const props = defineProps<{
 const projectId = props.projectId;
 */
 
-const isAdmin_: boolean = isAdmin();
+const IS_MOCK_MODE = false;
+const isAdmin_ = isAdmin();
+const admin = ref<UserAdmin | null>(null);
 
-// Variables pour les informations de l'administrateur
-const admin = ref({
-    idUser: 0,
-    userSurname: "",
-    userName: "",
-    primaryMail: "",
-    secondaryMail: "",
-    phoneNumber: "",
-});
 
-const mockAdminData = {
+const mockAdminData = new UserAdmin({
     idUser: 1,
     userSurname: "ALAMI",
     userName: "Adnane",
     primaryMail: "mock.admin@example.com",
     secondaryMail: "admin.backup@example.com",
     phoneNumber: "0600000000",
-};
+});
 
-// Fonction pour récupérer les données de l'administrateur
 const fetchAdminData = async (projectId: number, useMock = IS_MOCK_MODE) => {
-    try {
-        if (useMock) {
-            console.log(
-                "Utilisation des données mockées pour l'administrateur"
-            );
-            admin.value = mockAdminData;
-            return;
-        }
+    if (useMock) {
+        console.log("Utilisation des données mockées pour l'administrateur");
+        admin.value = mockAdminData;
+        return;
+    }
 
-        const response = await axiosInstance.get(
-            `/shared/projects/admin/${projectId}`
-        );
-        admin.value = response.data;
+    try {
+        const response = await axiosInstance.get(`/shared/projects/admin/${projectId}`);
+        admin.value = new UserAdmin(response.data);
     } catch (error) {
-        console.error(
-            "Erreur lors de la récupération des données de l'administrateur :",
-            error
-        );
+        console.error("Erreur lors de la récupération des données de l'administrateur :", error);
     }
 };
 
-// Appeler la fonction fetch au montage du composant
 onMounted(() => {
     const projectId = 1;
     fetchAdminData(projectId);