display delay end date

members_space/static/css/members-space.css

@@ -102,6 +102,8 @@ body {
 }
 #home_choose_makeups {
     display: none;
+    font-size: 1.8rem;;
+
 }
 
 .member_status_up_to_date,
@@ -130,3 +132,10 @@ body {
         align-items: center;
     }
 }
+
+#home_delay_date_stop_container {
+    color: #f0ad4e;
+    margin-top: -1rem;
+    margin-bottom: 1rem;
+    display: none;
+}
\ No newline at end of file

members_space/static/js/members-space-home.js

@@ -75,11 +75,20 @@ function init_my_shifts_tile() {
 function init_my_info_tile() {
     $("#home_choose_makeups").off();
 
+    
     // Status related
     $("#home_tile_my_info #home_member_status")
         .text(possible_cooperative_state[partner_data.cooperative_state])
         .addClass("member_status_" + partner_data.cooperative_state);
 
+    if (partner_data.cooperative_state === 'delay' && partner_data.date_delay_stop !== 'False') {
+        const d = new Date (Date.parse(partner_data.date_delay_stop));
+        const f_date_delay_stop = d.getDate()+'/'+("0" + (d.getMonth() + 1)).slice(-2)+'/'+d.getFullYear();
+
+        $("#home_delay_date_stop").text(f_date_delay_stop);
+        $("#home_delay_date_stop_container").show();
+    }
+    
     if (partner_data.makeups_to_do > 0) {
         $("#home_choose_makeups").show();
         

templates/members_space/home.html

@@ -10,6 +10,9 @@
       </div>
       <div class="tile_content">
         <p>Mon statut : <span id="home_member_status" class="home_member_info"></span></p>
+        <div id="home_delay_date_stop_container">
+          ( jusqu'au <span id="home_delay_date_stop"></span> )
+        </div>
         <div id="home_member_status_extra_info_area">
           <button type="button" class="btn--danger" id="home_choose_makeups">
             Je sélectionne mes rattrapages