diff --git a/src/API/test/database.php b/src/API/test/database.php
index 373e0dd..8d4384e 100644
--- a/src/API/test/database.php
+++ b/src/API/test/database.php
@@ -64,7 +64,7 @@ function dbRequestRdvPatient($pdo, $id){
 }
 
 function getPastRdvByPatient($pdo, $id){
-    $statement = $pdo->prepare("SELECT rdv_date, rdv_time, concat(m_name, ' ', m_surname) as medecin, medecin.m_specialty, medecin.m_id, concat(p_name, ' ', p_surname) as patient, l_adress as adresse, concat(l_postal, ' ', l_city) as ville
+    $statement = $pdo->prepare("SELECT rdv_date, rdv_time, concat(m_name, ' ', m_surname) as medecin, medecin.m_specialty as med_spe, medecin.m_id as med_id, concat(p_name, ' ', p_surname) as patient, l_adress as adresse, concat(l_postal, ' ', l_city) as ville
     FROM rendez_vous
     INNER JOIN patient ON rendez_vous.p_id = patient.p_id
     INNER JOIN propose ON rendez_vous.rdv_id = propose.rdv_id
diff --git a/src/js/AJAX/index.js b/src/js/AJAX/index.js
index 8a733f8..091a053 100644
--- a/src/js/AJAX/index.js
+++ b/src/js/AJAX/index.js
@@ -3,6 +3,7 @@ import {attachLoginUserDisplayEventListener, attachLoginPraticienDisplayEventLis
 //import {TokenDecode} from "./lib.js";
 import {displayHome, displayHomeTopBar, attachReturnHomeEventListener} from "./home.js";
 import {ButtonShowRdvPraticient} from "./rdv-praticien.js";
+import {ButtonShowRdvPatient} from "./rdv-patient.js";
 
 console.log("index.js loaded");
 
diff --git a/src/js/AJAX/rdv-patient.js b/src/js/AJAX/rdv-patient.js
index 465256c..8e1a529 100644
--- a/src/js/AJAX/rdv-patient.js
+++ b/src/js/AJAX/rdv-patient.js
@@ -1,33 +1,27 @@
-import {TokenDecode} from "./lib";
+import {TokenDecode} from "./lib.js";
+import {displayCalendar} from "./take-rdv.js";
 
 function ButtonShowRdvPatient() {
     try {
         document.getElementById("user-calendar").addEventListener("click", function () {
-
             let content = document.getElementById("content");
-            content.innerHTML = "";
-            content.innerHTML += '<div class="h-100"> <div class="row"> <div class="col-3 border-end border-dark border-3 h-100 mt-2 text-center d-flex flex-column justify-content-center"> <div class="d-flex flex-column"> <div id="next-rdv" class="border-bottom pb-3 border-dark border-3 align-self-center">';
-
             let nextRDV;
-
             let user = TokenDecode(sessionStorage.getItem("token"));
             ajaxRequest('GET', "src/API/requests.php/api/next-rdv-patient?id=" + user.id, function (data) {
-                nextRDV = data;
+                nextRDV = data
+                content.innerHTML = "";
+                content.innerHTML += '<div class="h-100"> <div class="row"> <div class="col-3 border-end border-dark border-3 h-100 mt-2 text-center d-flex flex-column justify-content-center"> <div class="d-flex flex-column"> <div id="next-rdv" class="border-bottom pb-3 border-dark border-3 align-self-center">';
+
                 DisplayNextRDVPatient(data);
-                console.log(data);
+                content.innerHTML += "</div> <div id='past-rdv' class=\'mt-3 align-self-center d-flex flex-column gap-2\'>";
+
+                ajaxRequest('GET', "src/API/requests.php/api/past-rdv-patient?id=" + user.id, function (data) {
+                    DisplayPastRDVPatient(data);
+                    content.innerHTML += "</div> </div> </div> <div id='zoom' class=\"col border-end border-dark border-3 h-100 mt-2 text-center d-flex flex-column justify-content-center\">";
+                    DisplayRDV(nextRDV);
+                    content.innerHTML += "</div> <div class=\"col h-100\"></div>";
+                });
             });
-
-            content.innerHTML += "</div> <div id='past-rdv' class=\'mt-3 align-self-center d-flex flex-column gap-2\'>";
-
-            ajaxRequest('GET', "src/API/requests.php/api/past-rdv-patient?id=" + user.id, function (data) {
-                DisplayPastRDVPatient(data);
-                console.log(data);
-            });
-
-            content.innerHTML += "</div> </div> </div> <div class=\"col border-end border-dark border-3 h-100 mt-2 text-center d-flex flex-column justify-content-center\">";
-
-            DisplayRDV(nextRDV);
-
         });
     }
     catch (e) {
@@ -59,6 +53,18 @@ function DisplayNextRDVPatient(rdv){
 }
 
 
+function attachEventListener(i, rdv) {
+    document.getElementById("retake-rdv-" + i + "-" + rdv[i].med_id).addEventListener("click", function () {
+        let id = rdv[i].med_id;
+        let today = new Date();
+        let date = today.getFullYear() + "-" + (today.getMonth() + 1).toString().padStart(2, "0") + "-" + today.getDate().toString().padStart(2, "0");
+        ajaxRequest('GET', "src/API/requests.php/api/rdv-date?date=" + date + "&id=" + id, function (data) {
+            displayCalendar(data);
+        });
+    });
+}
+
+
 function DisplayPastRDVPatient(rdv) {
     let content = document.getElementById("past-rdv");
     content.innerHTML = "";
@@ -77,16 +83,87 @@ function DisplayPastRDVPatient(rdv) {
                 "<h5 class='card-title'>" + rdv[i].medecin + "</h5>" +
                 "<h6 class='card-subtitle mb-2 text-body-secondary'>" + rdv[i].med_spe + "</h6>" +
                 "</div> <div class=\"card-footer\"> " +
-                "<button id='retake-rdv" + i + "'>Preparer la consulation</button> " +
+                "<button id='retake-rdv-" + i + "-" + rdv[i].med_id + "'>Reprendre rendez-vous</button> " +
                 "</div> </div>";
-
-            document.getElementById("retake-rdv" + i).addEventListener("click", function () {
-                console.log("Retake RDV");
-
-            }
+            attachEventListener(i, rdv);
         }
+
     }
 }
 
 
-function DisplayRDV(rdv){}
\ No newline at end of file
+function attachEventListenerDeplacer(rdv){
+    document.getElementById("deplacer_button").addEventListener("click", function () {
+        let id = rdv[i].med_id;
+        let today = new Date();
+        let date = today.getFullYear() + "-" + (today.getMonth() + 1).toString().padStart(2, "0") + "-" + today.getDate().toString().padStart(2, "0");
+        ajaxRequest('GET', "src/API/requests.php/api/rdv-date?date=" + date + "&id=" + id, function (data) {
+            displayCalendar(data);
+        });
+    });
+}
+
+function attachEventListenerAnnuler(rdv){
+    document.getElementById("cancel_button").addEventListener("click", function () {
+        let id = rdv.rdv_id;
+        ajaxRequest('POST', "src/API/requests.php/api/cancel-rdv", function (data) {
+        });
+    });
+
+}
+
+
+function DisplayRDV(rdv){
+    let content = document.getElementById("zoom");
+    content.innerHTML = ""
+    if(rdv.length === 0){
+        content.innerHTML += "<div class=\"card rounded-4 mx-2 pointer\"> <div class=\"card-header bg-danger\"> <div class=\"d-flex flex-row justify-content-between text-white\"> <p>Vous n'avez pas de rendez-vous à venir</p> </div> </div> </div>"
+    }
+    else{
+        content.innerHTML += "<div class=\"card rounded-4 mx-2\">" +
+            "<div class=\"card-header bg-danger\">" +
+            "<div class=\"d-flex flex-row justify-content-between text-white\">" +
+            "<p>" + rdv[0].rdv_date + "</p>" +
+            "<p>" + rdv[0].rdv_time + "</p>" +
+            "</div>" +
+            "</div>" +
+            "<div class=\"card-body\">" +
+            "<h5 class='card-title'>" + rdv[0].medecin + "</h5>" +
+            "<h6 class='card-subtitle mb-2 text-body-secondary'>" + rdv[0].med_spe + "</h6>" +
+            "<h6 id='deplacer_button'> Déplacer le rendez-vous </h6>" +
+            "<h6 id='cancel_button'> Annuler le rendez-vous" +
+            "</div>" +
+            "</div>" +
+            "<div class=\"card rounded-4 mx-2 mt-3\">" +
+            "<div class=\"card-body\">" +
+            "<h5 class=\"card-title\">Préparer la consulation</h5>" +
+            "<h6 class=\"card-subtitle mb-2 text-body-secondary\">Pour gagner du temps et améliorer votre prise en charge.</h6>" +
+            "<form action=\"src/php/db/scripts/uploadFile.php\" method=\"post\" enctype=\"multipart/form-data\">" +
+            "<label for=\"file\">Sélectionner un fichier :</label>" +
+            "<input type=\"hidden\" name=\"rdv_id\" value=" + rdv[0].rdv_id + ">" +
+            "<input type=\"file\" class=\"form-control\" name=\"file\" id=\"file\" accept=\".pdf, .jpeg, .jpg, .png\" disabled>" +
+            "<br><br>" +
+            "<input type=\"submit\" class=\"btn border-black border-1 disabled\" name=\"submit\" value=\"Envoyer le fichier\">" +
+            "<h6 class=\"card-subtitle text-danger\">Maintenance en cours.</h6>" +
+            "</form>" +
+            "</div>" +
+            "</div>" +
+            "<div class=\"card rounded-4 mx-2 mt-3\">" +
+            "<div class=\"card-body\">" +
+            "<h5 class=\"card-title\">Patient</h5>" +
+            "<h6 class='card-subtitle mb-2 text-body-secondary'>" + rdv[0].patient + "</h6>" +
+            "</div>" +
+            "</div>" +
+            "<div class=\"card rounded-4 mx-2 mt-3\">" +
+            "<div class=\"card-body\">" +
+            "<h5 class=\"card-title\">Lieu de la consulation</h5>" +
+            "<h6 class='card-subtitle mb-2 text-body-secondary'>" + rdv[0].adresse + "<br>" +
+            rdv[0].ville + "</br></h6>" +
+            "</div>" +
+            "</div>"
+        attachEventListenerDeplacer(rdv);
+        attachEventListenerAnnuler(rdv);
+    }
+}
+
+export {ButtonShowRdvPatient};
\ No newline at end of file
diff --git a/src/js/AJAX/take-rdv.js b/src/js/AJAX/take-rdv.js
index 092db49..0caee0b 100644
--- a/src/js/AJAX/take-rdv.js
+++ b/src/js/AJAX/take-rdv.js
@@ -156,4 +156,4 @@ function attachPrendreRDVEventListener() {
     });
 }
 
-export {attachRDVEventListener};
\ No newline at end of file
+export {attachRDVEventListener, displayCalendar};
\ No newline at end of file