utilisation des fonctions Apis/admin.ts pour mettre un raport a un appointmentid

front/MyINPulse-front/src/components/AdminAppointments.vue

@@ -5,14 +5,14 @@
       <form @submit.prevent="submitReport">
         <div>
           <label for="appointmentId">ID du rendez-vous :</label>
-                <div style="display: flex; align-items: center; gap: 0.5rem">
+          <div style="display: flex; align-items: center; gap: 0.5rem;">
             <button type="button" @click="decrementId">-</button>
             <input
               id="appointmentId"
               v-model.number="appointmentId"
               type="number"
               min="1"
-                        style="width: 60px; text-align: center"
+              style="width: 60px; text-align: center;"
             />
             <button type="button" @click="incrementId">+</button>
           </div>
@@ -27,9 +27,7 @@
           ></textarea>
         </div>
   
-            <button type="submit">
-                {{ isUpdate ? "Mettre à jour" : "Créer" }} le rapport
-            </button>
+        <button type="submit">{{ isUpdate ? "Mettre à jour" : "Créer" }} le rapport</button>
       </form>
   
       <p v-if="responseMessage">{{ responseMessage }}</p>
@@ -37,6 +35,11 @@
 </template>
 
 <script>
+import {
+  createAppointmentReport,
+  updateAppointmentReport,
+} from "@/services/Apis/Admin";
+
 export default {
   name: "AdminAppointmentsComponent",
   data() {
@@ -63,38 +66,31 @@ export default {
         this.appointmentId--;
       }
     },
-        async submitReport() {
-            const reportData = {
-                reportContent: this.reportContent,
-            };
-
-            const url = `/admin/appointments/report/${this.appointmentId}`;
-            const method = this.isUpdate ? "PUT" : "POST";
-
-            try {
-                const response = await this.$axios({
-                    method,
-                    url,
-                    data: reportData,
-                });
-
+    submitReport() {
+      const reportData = { content: this.reportContent };
+      const onSuccess = (response) => {
         if (response.status === 201 || response.status === 200) {
           this.responseMessage =
             "Rapport " +
             (this.isUpdate ? "mis à jour" : "créé") +
             " avec succès.";
         }
-            } catch (error) {
+      };
+      const onError = (error) => {
+        console.error("Erreur lors de l'envoi du rapport :", error.response || error.message);
         if (error.response && error.response.status === 400) {
-                    this.responseMessage =
-                        "Requête invalide. Vérifiez les informations.";
+          this.responseMessage = "Requête invalide. Vérifiez les informations.";
         } else if (error.response && error.response.status === 401) {
-                    this.responseMessage =
-                        "Vous n'êtes pas autorisé à effectuer cette action.";
+          this.responseMessage = "Vous n'êtes pas autorisé à effectuer cette action.";
         } else {
-                    this.responseMessage =
-                        "Une erreur est survenue. Veuillez réessayer.";
+          this.responseMessage = "Une erreur est survenue. Veuillez réessayer.";
         }
+      };
+
+      if (this.isUpdate) {
+        updateAppointmentReport(this.appointmentId, reportData, onSuccess, onError);
+      } else {
+        createAppointmentReport(this.appointmentId, reportData, onSuccess, onError);
       }
     },
   },