wip #7957

diff --git a/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js b/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js
index e7559fa792bb816f61402bbd1e635c5661e9665c..7dd8957298ada15f19ea6f85c2fb811255e64952 100644 (file)
--- a/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js
+++ b/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js
@@ -5,6 +5,7 @@ function FluidbookCartNewHeidi(cart) {
     this.showAddToCartTooltips = false;
     this.items = {};
     this.formDataStorage = {};
+    this.ps = null;
     this.totalHT = 0;
     this.tva = 0;
     this.totalTTC = 0;
@@ -27,6 +28,7 @@ FluidbookCartNewHeidi.prototype = {
         $(document).on(this.fluidbook.input.clickEvent, '#open-request', function () {
             $this.fluidbook.menu.quickCloseView();
             $this.getContactForm();
+            resize();
             return false;
         });
 
@@ -34,7 +36,7 @@ FluidbookCartNewHeidi.prototype = {
             $this.sendRequest();
         });
 
-        $(document).on(this.fluidbook.input.changeEvent, '#kimplay-sendcart-form input, #kimplay-sendcart-form textarea', function() {
+        $(document).on(this.fluidbook.input.changeEvent, '#newheidi-sendcart-form input, #newheidi-sendcart-form textarea', function() {
             $this.formDataStorage[$(this).attr('name')] = $(this).val()
             $this.fluidbook.cache.set('formData', $this.formDataStorage);
         });
@@ -94,6 +96,7 @@ FluidbookCartNewHeidi.prototype = {
             this.items.splice(key, 1);
         }
         this.save();
+        this.updateTotals()
     },
 
     save: function () {
@@ -196,9 +199,10 @@ FluidbookCartNewHeidi.prototype = {
     },
 
     openCart: function (p2, callback) {
-        this._endMenu(this.fluidbook.l10n.__('my selection'), this.getCartContent(), function () {
+        this._endMenu(this.fluidbook.l10n.__('mon panier'), this.getCartContent(), function () {
             callback();
         });
+        setTimeout(() => this.ps.update(), 500)
     },
 
     getCartContent: function () {
@@ -207,7 +211,7 @@ FluidbookCartNewHeidi.prototype = {
         }
 
         var $this = this;
-        var content = '<table id="newheidicarttable" class="cart-items" cellpadding="0" cellspacing="0">';
+        var content = '<div id="wrap-newheidicart"><table id="newheidicarttable" class="cart-items" cellpadding="0" cellspacing="0">';
         content += '<thead>';
         content += '<tr>';
         content += '<th class="col-ref">' + this.fluidbook.l10n.__('réf') + '</th>';
@@ -240,7 +244,7 @@ FluidbookCartNewHeidi.prototype = {
         });
 
         content += '</tbody>';
-        content += '</table>';
+        content += '</table></div>';
         content += '<div class="cart-footer">';
         content += '<div class="resume">';
         content += '<div class="shipping-text">';
@@ -255,7 +259,7 @@ FluidbookCartNewHeidi.prototype = {
         content += '</div>';
         content += '</div>';
         content += '<div class="fonctions">';
-        content += '<a href="#/closeview" class="completeSelection" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '">' + this.fluidbook.l10n.__('compléter ma sélection') + '</a>';
+        content += '<a href="#/closeview" class="completeSelection" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '">' + this.fluidbook.l10n.__('compléter mon panier') + '</a>';
         content += '<button class="sendRequest" id="open-request">' + this.fluidbook.l10n.__('envoyer ma demande') + '</button>';
         content += '</div>';
         content += '</div>';
@@ -271,6 +275,7 @@ FluidbookCartNewHeidi.prototype = {
         view += '</div>';
         view += '</div>';
         this.fluidbook.menu.viewWrap(view, 'cart');
+        this.ps = new PerfectScrollbar("#newheidicart .content");
         $("#wrap-newheidicart").perfectScrollbar();
         callback();
     },
@@ -311,13 +316,14 @@ FluidbookCartNewHeidi.prototype = {
                 'mail':'',
                 'phone':'',
                 'address':'',
+                'delivery_date':'',
             }
         }
 
-        let view = `<div id="kimplay-sendcart">
+        let view = `<div id="newheidi-sendcart">
         ${this.fluidbook.menu.getCaption("Mes coordonnées", 'small')}
             <div class="content">
-                <form id="kimplay-sendcart-form">
+                <form id="newheidi-sendcart-form">
                     <div class="form-group">
                         <label for="company">Nom de l'entreprise*</label>
                         <input type="text" id="company" name="company" value="${data.company ?? ''}">
@@ -344,6 +350,10 @@ FluidbookCartNewHeidi.prototype = {
                         <label for="address">Adresse</label>
                         <input type="text" name="address" value="${data.address ?? ''}">
                     </div><br>
+                    <div class="form-group">
+                        <label for="delivery_date">Date de livraison souhaitée</label>
+                        <input type="text" name="delivery_date" value="${data.delivery_date ?? ''}">
+                    </div><br> 
                     <div class="form-group textarea">
                         <label for="message">Message</label>
                         <textarea name="message">${data.message ?? ''}</textarea>
@@ -352,22 +362,22 @@ FluidbookCartNewHeidi.prototype = {
                 </form>
                 <div class="cart-footer">
                     <div class="fonctions">
-                      <a href="#/closeview" class="completeSelection" role="button" aria-label="${this.fluidbook.l10n.__('close')}">${this.fluidbook.l10n.__('compléter ma sélection')}</a>
+                      <a href="#/closeview" class="completeSelection" role="button" aria-label="${this.fluidbook.l10n.__('close')}">${this.fluidbook.l10n.__('compléter mon panier')}</a>
                       <button class="sendRequest" id="send-request">${this.fluidbook.l10n.__('envoyer ma demande')}</button>
                     </div>
                 </div>
             </div>
         </div>`;
-        this.fluidbook.menu.openCustomView(view, 'cart-kimplay-sendcart');
+        this.fluidbook.menu.openCustomView(view, 'cart-newheidi-sendcart');
         $(".mview .content").perfectScrollbar();
     },
 
     getConfirm: function () {
-        return `<p class="confirm-content">Votre demande a bien été transmise.
-            Une copie de votre sélection va vous être adressée par email par l'équipe commerciale.
+        return `<p class="confirm-content">Votre demande a bien été transmise. Une copie de votre sélection va vous être adressée par email.
+          Notre équipe commerciale reviendra vers vous dans les plus brefs délais.
             <br><br>
-            D’ici là nous restons joignables pour toute
-            question à l’adresse : <a href="mailto:info@cofalu.com">info@cofalu.com</a>
+            D’ici là nous restons joignables pour toute<br>
+            question à l’adresse : <a href="mailto:info@newheidi.com">info@newheidi.com</a>
         </p>`
     },
 
@@ -396,10 +406,11 @@ FluidbookCartNewHeidi.prototype = {
                 $this.emptyCart();
                 $this.updateTitle('Merci !')
                 $this.updateCartContent($this.getConfirm())
-                $this.fluidbook.resize.resize();
-                $("[data-menu=newheidi-sendcart], #newheidi-sendcart").addClass("confirm")
+                resize();
+                $("[data-menu=cart-newheidi-sendcart], #newheidi-sendcart").addClass("confirm")
             },
             error: function (xhr, status, error) {
+                console.log(xhr, error)
                 let errorsMessage = JSON.parse(xhr.responseText);
                 $this.displayErrors(errorsMessage)
             },

diff --git a/style/cart/newheidi.less b/style/cart/newheidi.less
index 9e230396ece60f8b195c8a324c6ac5b5e2ad9ea0..af9b2379769a26e14c7e715e9ff14a9db621eb94 100644 (file)
--- a/style/cart/newheidi.less
+++ b/style/cart/newheidi.less
@@ -23,6 +23,10 @@
   font-family: @font;
   width: 100% !important;
 
+  @media @breakpoint {
+    top: 0 !important;
+  }
+
   &[data-menu=cart-newheidi-qty] {
     max-width: 614px !important;
   }
@@ -32,20 +36,34 @@
   }
 
   &[data-menu=cart-newheidi-sendcart] {
-    max-width: 680px !important;
-    min-width: 680px !important;
+    max-width: 725px !important;
+    min-width: 725px !important;
 
     @media @breakpoint {
       max-width: 1024px !important;
+      min-width: 100% !important;
     }
 
     &.confirm {
       max-width: max-content !important;
       min-width: auto !important;
       padding: 41px 50px;
+
+      .caption {
+        padding-right: 0;
+        padding-left: 0;
+      }
+
+      .content {
+        padding: 0;
+      }
     }
   }
 
+  * {
+    letter-spacing: 1px;
+  }
+
   .caption {
     height: auto;
     padding: 30px 0;
@@ -74,6 +92,7 @@
   .fonctions {
     float: none;
     padding-top: 60px;
+    padding-bottom: 50px;
     padding-right: 0;
     font-size: 14px;
     font-weight: bold;
@@ -94,6 +113,10 @@
     .sendRequest {
       width: 250px;
       text-align: center;
+
+      @media @breakpoint {
+        width: 100%;
+      }
     }
   }
 
@@ -129,6 +152,9 @@
     border: 2px solid #000;
     background-color: #fff;
     color: #000;
+    text-align: center;
+    padding-right: 0;
+    padding-left : 0;
   }
 
   .sendRequest {
@@ -183,6 +209,10 @@
     table-layout: fixed;
     min-width: 800px;
 
+    @media @breakpoint {
+      min-width: 1023px;
+    }
+
     th {
       text-transform: uppercase;
       padding: 16px 13px;
@@ -269,7 +299,7 @@
           display: flex;
           justify-content: center;
           align-items: center;
-          margin: 0 auto;
+          margin: 0 12px 0 auto;
           left: 0;
         }
 
@@ -326,6 +356,7 @@
       font-size: 13px;
       margin: 0;
       width: auto;
+      padding: 0;
     }
   }
 
@@ -334,9 +365,18 @@
     justify-content: space-between;
     padding-right: 40px;
 
+    @media @breakpoint {
+      flex-direction: column;
+      padding-right: 0;
+    }
+
     .shipping-text {
       line-height: 18px;
 
+      @media @breakpoint {
+        margin-bottom: 30px;
+      }
+
       p {
         text-transform: initial;
       }
@@ -346,6 +386,10 @@
       line-height: 28px;
       width: 200px;
 
+      @media @breakpoint {
+        align-self: flex-end;
+      }
+
       p {
         display: flex;
         justify-content: space-between;
@@ -404,16 +448,20 @@
     }
 
     input, textarea {
-      width: 380px;
+      width: 395px;
       text-align: left;
       padding: 5px 10px;
-      font-size: 14px;
+      font-size: 13px;
 
       @media @breakpoint {
         width: 100%;
       }
     }
 
+    input {
+      height: 30px;
+    }
+
     textarea {
       height: 80px;
       resize: none;
@@ -467,7 +515,7 @@
   }
 
   [class^=ps__thumb] {
-    background-color: #fff;
+    background-color: #000;
   }
 
   .ps__thumb-y {