diff --git a/MyINPulse-back/src/main/java/enseirb/myinpulse/config/WebSecurityCustomConfiguration.java b/MyINPulse-back/src/main/java/enseirb/myinpulse/config/WebSecurityCustomConfiguration.java
index e83eaa7..2cbeccb 100644
--- a/MyINPulse-back/src/main/java/enseirb/myinpulse/config/WebSecurityCustomConfiguration.java
+++ b/MyINPulse-back/src/main/java/enseirb/myinpulse/config/WebSecurityCustomConfiguration.java
@@ -31,7 +31,7 @@ public class WebSecurityCustomConfiguration {
     public CorsConfigurationSource corsConfigurationSource() {
         CorsConfiguration configuration = new CorsConfiguration();
         configuration.setAllowedOrigins(List.of(frontendUrl));
-        configuration.setAllowedMethods(Arrays.asList("GET", "OPTIONS"));
+        configuration.setAllowedMethods(Arrays.asList("GET", "OPTIONS", "POST", "PUT", "DELETE"));
         configuration.setAllowedHeaders(
                 Arrays.asList("authorization", "content-type", "x-auth-token"));
         UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
diff --git a/front/MyINPulse-front/src/components/GetAppointments.vue b/front/MyINPulse-front/src/components/GetAppointments.vue
new file mode 100644
index 0000000..7d73432
--- /dev/null
+++ b/front/MyINPulse-front/src/components/GetAppointments.vue
@@ -0,0 +1,75 @@
+<template>
+  <div class="appointment-list">
+    <h2>Liste des rendez-vous</h2>
+
+    <ul v-if="appointments.length">
+      <li v-for="appt in appointments" :key="appt.idAppointment">
+        <strong>Sujet :</strong> {{ appt.appointmentSubject }}<br />
+        <strong>Date :</strong> {{ appt.appointmentDate }}<br />
+        <strong>Heure :</strong> {{ appt.appointmentTime }}<br />
+        <strong>Durée :</strong> {{ appt.appointmentDuration }}<br />
+        <strong>Lieu :</strong> {{ appt.appointmentPlace }}
+        <hr />
+      </li>
+    </ul>
+
+    <p v-else>Aucun rendez-vous trouvé.</p>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from "vue";
+import { callApi } from "@/services/api";
+import Appointment from "@/ApiClasses/Appointment";
+import { store } from "@/main.ts";
+
+const appointments = ref<Appointment[]>([]);
+
+function loadAppointments() {
+  if (!store.user) {
+    console.error("L'utilisateur n'est pas connecté ou les données utilisateur ne sont pas disponibles.");
+    return;
+  }
+  console.log("username :", store.user.username);
+  console.log("token  :", store.user.token);
+  callApi(
+    "/admin/appointments/upcoming",
+    (response) => {
+      appointments.value = response.data.map(
+        (item: any) => new Appointment(item)
+      );
+    },
+    (error) => {
+      console.error("Erreur lors de la récupération des rendez-vous :", error);
+    }
+  );
+}
+
+onMounted(() => {
+  loadAppointments();
+});
+</script>
+
+<style scoped>
+.appointment-list {
+  max-width: 600px;
+  margin: 0 auto;
+  padding: 20px;
+  background: #fdfdfd;
+  border-radius: 10px;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
+}
+
+h2 {
+  font-size: 1.8rem;
+  margin-bottom: 20px;
+  color: #333;
+  border-bottom: 2px solid #ddd;
+  padding-bottom: 10px;
+}
+
+li {
+  margin-bottom: 15px;
+  line-height: 1.6;
+}
+</style>
diff --git a/front/MyINPulse-front/src/services/api.ts b/front/MyINPulse-front/src/services/api.ts
index fe3295a..0210c23 100644
--- a/front/MyINPulse-front/src/services/api.ts
+++ b/front/MyINPulse-front/src/services/api.ts
@@ -10,6 +10,20 @@ const axiosInstance = axios.create({
     },
 });
 
+
+axiosInstance.interceptors.request.use(
+    (config) => {
+        const token = store.user?.token; // Récupérez le token depuis le store
+        if (token) {
+            config.headers["Authorization"] = `Bearer ${token}`; // Ajoutez le token dans l'en-tête
+        }
+        return config;
+    },
+    (error) => {
+        return Promise.reject(error);
+    }
+);
+
 axiosInstance.interceptors.response.use(
     (response) => response, // Directly return successful responses.
     async (error) => {
@@ -20,15 +34,13 @@ axiosInstance.interceptors.response.use(
             !originalRequest._retry &&
             store.authenticated
         ) {
-            originalRequest._retry = true; // Mark the request as retried to avoid infinite loops.
+            originalRequest._retry = true;
             try {
                 await store.refreshUserToken();
-                // Update the authorization header with the new access token.
                 axiosInstance.defaults.headers.common["Authorization"] =
                     `Bearer ${store.user.token}`;
-                return axiosInstance(originalRequest); // Retry the original request with the new access token.
+                return axiosInstance(originalRequest);
             } catch (refreshError) {
-                // Handle refresh token errors by clearing stored tokens and redirecting to the login page.
                 console.error("Token refresh failed:", refreshError);
                 localStorage.removeItem("accessToken");
                 localStorage.removeItem("refreshToken");