From: soufiane Date: Mon, 26 Jan 2026 19:11:34 +0000 (+0100) Subject: wip #7957 @3:00 X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=ad1de9c6f5975acc796b141a1e79bc8bfc8e3546;p=fluidbook-html5.git wip #7957 @3:00 --- diff --git a/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js b/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js index d0aad3cc..b422bd91 100644 --- a/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js +++ b/js/libs/fluidbook/cart/fluidbook.cart.newheidi.js @@ -12,7 +12,7 @@ FluidbookCartNewHeidi.prototype = { var $this = this; this.items = this.fluidbook.cache.get('cart', {}); - $(document).on(this.fluidbook.input.changeEvent, '#kimplaycart input[name=qty]', function() { + $(document).on(this.fluidbook.input.changeEvent, '#newheidicart input[name=qty]', function() { let ref = $(this).data('ref') $this.items['' + ref]['quantity'] = $(this).val(); $this.save(); @@ -27,19 +27,6 @@ FluidbookCartNewHeidi.prototype = { $(document).on(this.fluidbook.input.clickEvent, '#send-request', function() { $this.sendRequest(); }) - - $(document).on(this.fluidbook.input.clickEvent, '#kimplay-additem button', function () { - let form = $(this).closest('#kimplay-additem'); - $this.items[''+$(this).data('ref')] = { - name: $(form).find('h3').text(), - quantity: $(form).find('[name=qty]').val(), - comment: $(form).find('[name=comment]').val() - }; - - $this.fluidbook.tooltip.displayTooltipDuring($this.fluidbook.l10n.__("the item has been added to your cart"), 2500); - $this.fluidbook.menu.closeView(); - $this.save(); - }); }, emptyCart: function () { @@ -60,23 +47,19 @@ FluidbookCartNewHeidi.prototype = { comment = this.items[ref].comment; } - let view = `
- ${this.fluidbook.menu.getCaption("", 'small')} -
-
-
-

${this.data[ref].name}

-
(réf. ${ref})
-
- -


- -


- -
-
-
`; - this.fluidbook.menu.openCustomView(view, 'cart-kimplay-qty'); + this.items[ref] = { + name: this.data[ref].name, + quantity: quantity, + batch: this.data[ref].batch ?? '', + price: this.data[ref].price ?? '', + }; + + this.fluidbook.menu.closeView(); + this.save(); + + this.fluidbook.menu.openView('cart'); + + return true }, removeFromCart: function (key) { @@ -127,8 +110,8 @@ FluidbookCartNewHeidi.prototype = { }, updateCart: function () { - if ($('#kimplaycart').length > 0) { - $('#kimplaycart .content').html(this.getCartContent()); + if ($('#newheidicart').length > 0) { + $('#newheidicart .content').html(this.getCartContent()); } }, @@ -154,7 +137,7 @@ FluidbookCartNewHeidi.prototype = { } var $this = this; - var content = ''; + var content = '
'; content += ''; content += ''; content += ''; @@ -175,13 +158,6 @@ FluidbookCartNewHeidi.prototype = { content += ''; - if (dataByRef.image) { - content += ''; - } - else { - content += ''; - } - content += ''; content += ''; content += ''; @@ -203,13 +179,14 @@ FluidbookCartNewHeidi.prototype = { _endMenu: function (title, content, callback) { - var view = '
'; + var view = '
'; view += this.fluidbook.menu.getCaption(title, 'small'); view += '
'; view += "" + content; view += '
'; view += '
'; this.fluidbook.menu.viewWrap(view, 'cart'); + $("#wrap-newheidicart").perfectScrollbar(); callback(); }, @@ -240,10 +217,10 @@ FluidbookCartNewHeidi.prototype = { }, getContactForm: function() { - let view = `
+ let view = `
${this.fluidbook.menu.getCaption("Mes coordonnées", 'small')}
-
+
@@ -284,7 +261,7 @@ FluidbookCartNewHeidi.prototype = {
`; - this.fluidbook.menu.openCustomView(view, 'cart-kimplay-sendcart'); + this.fluidbook.menu.openCustomView(view, 'cart-newheidi-sendcart'); }, getConfirm: function () { @@ -306,11 +283,11 @@ FluidbookCartNewHeidi.prototype = { sendRequest: function() { const $this = this; - const form = document.getElementById("kimplay-sendcart-form"); + const form = document.getElementById("newheidi-sendcart-form"); const formData = new FormData(form); formData.append('cart_items', JSON.stringify($this.getItems())) $.ajax({ - url: $this.fluidbook.service.getBaseURL(true) + 'kimplay', + url: $this.fluidbook.service.getBaseURL(true) + 'newheidi', cache: false, data: formData, processData: false, @@ -322,7 +299,7 @@ FluidbookCartNewHeidi.prototype = { $this.updateTitle('Merci !') $this.updateCartContent($this.getConfirm()) $this.fluidbook.resize.resize(); - $("[data-menu=kimplay-sendcart], #kimplay-sendcart").addClass("confirm") + $("[data-menu=newheidi-sendcart], #newheidi-sendcart").addClass("confirm") }, error: function (xhr, status, error) { let errorsMessage = JSON.parse(xhr.responseText); @@ -334,9 +311,9 @@ FluidbookCartNewHeidi.prototype = { displayErrors: function (errors) { $(".error").removeClass("error") for (let k in errors['errors']) { - $("#kimplay-sendcart input[name=" + k + "]").val("") - $("#kimplay-sendcart label[for=" + k + "]").addClass('error') - $("#kimplay-sendcart input[name=" + k + "]")[0].placeholder = `${errors['errors'][k][0]}` + $("#newheidi-sendcart input[name=" + k + "]").val("") + $("#newheidi-sendcart label[for=" + k + "]").addClass('error') + $("#newheidi-sendcart input[name=" + k + "]")[0].placeholder = `${errors['errors'][k][0]}` } }, }; \ No newline at end of file diff --git a/js/libs/fluidbook/fluidbook.cart.js b/js/libs/fluidbook/fluidbook.cart.js index c5f5291b..bd48237b 100644 --- a/js/libs/fluidbook/fluidbook.cart.js +++ b/js/libs/fluidbook/fluidbook.cart.js @@ -269,6 +269,8 @@ FluidbookCart.prototype = { return new FluidbookCartBastideResahGuest(this); case 'Kimplay': return new FluidbookCartKimplay(this); + case 'NewHeidi': + return new FluidbookCartNewHeidi(this); default: return null; } diff --git a/style/cart/newheidi.less b/style/cart/newheidi.less index ab56342d..d7573db0 100644 --- a/style/cart/newheidi.less +++ b/style/cart/newheidi.less @@ -1,17 +1,28 @@ +@breakpoint: ~"(max-width: 1024px)"; + +#menu_cart { + width: max-content; + + .menu-item-title { + margin-right: 0; + } +} + .link a.active[data-cart-ref] { background-color: rgba(0, 255, 0, 0.5); } -.mview { +.mview[data-menu="cart"], +.mview[data-menu="cart-newheidi-sendcart"] { font-size: 14px; background: #fff; color: #000; text-transform: uppercase; padding: 0 30px; - font-family: 'Metropolis', 'Open-Sans', sans-serif; + font-family: 'InstrumentSans', 'Open-Sans', sans-serif; width: 100% !important; - &[data-menu=cart-kimplay-qty] { + &[data-menu=cart-newheidi-qty] { max-width: 614px !important; } @@ -19,10 +30,17 @@ max-width: 1064px !important; } - &[data-menu=cart-kimplay-sendcart] { + &[data-menu=cart-newheidi-sendcart] { max-width: 680px !important; + min-width: 680px !important; + + @media @breakpoint { + max-width: 1024px !important; + } + &.confirm { max-width: max-content !important; + min-width: auto !important; padding: 41px 50px; } } @@ -63,6 +81,16 @@ font-weight: bold; display: flex; justify-content: flex-end; + gap: 10px; + + @media @breakpoint { + flex-direction: column; + padding-left: 0; + } + + a { + margin: 0 + } } input, textarea { @@ -80,7 +108,7 @@ button { border: 0; - background-color: #ad1057; + background-color: #000; color: #fff; text-transform: uppercase; text-align: center; @@ -93,9 +121,9 @@ } .fonctions a.completeSelection { - border: 2px solid #ad1057; + border: 2px solid #000; background-color: #fff; - color: #ad1057; + color: #000; } .sendRequest { @@ -103,7 +131,6 @@ width: auto; padding: 16px 25px; height: 45px; - margin-left: 10px; vertical-align: top; } @@ -113,19 +140,29 @@ text-transform: initial; line-height: 20px; max-width: 367px; + + @media @breakpoint { + max-width: 100%; + } } } -.mview[data-menu="cart-kimplay-qty"] { +[data-menu="cart"].fs .cart-footer { + position: initial; +} + +.mview[data-menu="cart-newheidi-qty"] { width: 605px; - height: 364px; + min-height: 364px; + height: max-content; + padding-bottom: 30px; .caption { height: 50px; padding: 0; position: initial; - a.back { + a.back.small { top: 18px; right: 4px; } @@ -133,6 +170,11 @@ .content { display: flex; + + @media @breakpoint { + flex-direction: column; + gap: 31px; + } } .image { @@ -140,9 +182,18 @@ vertical-align: middle; width: 245px; + @media @breakpoint { + width: 100%; + } + img { max-width: 250px; max-height: 300px; + + @media @breakpoint { + max-width: 150px; + max-height: 200px; + } } } @@ -154,6 +205,11 @@ text-transform: uppercase; padding: 0 0 0 50px; + @media @breakpoint { + width: 100%; + padding: 0; + } + h3 { font-size: 16px; } @@ -175,23 +231,37 @@ } } -#kimplaycart { - - .caption a.back.small { - right: -10px; +.mview[data-menu="cart"] { + #newheidicarttable { + margin-left: 0; } - &table { - margin-left: 0; + #wrap-newheidicart { + overflow-x: auto; + position: relative; + + .ps__rail-x { + opacity: 1; + + @media @breakpoint { + display: block; + } + } + + .ps__thumb-x { + height: 5px; + bottom: 0; + } } table { table-layout: fixed; + min-width: 800px; th { text-transform: uppercase; padding: 20px 0; - background-color: #ad1057; + background-color: #000; color: #fff; text-align: left; font-weight: 600; @@ -223,6 +293,8 @@ &.image { width: 130px; + padding-right: 20px; + padding-left: 20px; } &.reference, @@ -272,17 +344,23 @@ } } -#kimplay-sendcart { - width: 100%; - max-width: 680px; +#newheidi-sendcart { - .caption a.back { - right: -10px; + .caption { + + a.back.small { + right: 20px; + } } form { text-align: right; padding: 30px 0 0; + overflow: visible; + + @media @breakpoint { + text-align: left; + } label { @@ -300,6 +378,11 @@ justify-content: flex-end; gap: 10px; + @media @breakpoint { + align-items: flex-start; + flex-direction: column; + } + &.textarea { align-items: flex-start; @@ -311,10 +394,14 @@ } input, textarea { - width: 320px; + width: 380px; text-align: left; padding: 5px 10px; font-size: 14px; + + @media @breakpoint { + width: 100%; + } } textarea { @@ -336,13 +423,55 @@ } } +.mview[data-menu="cart"], +.mview[data-menu="cart-newheidi-sendcart"] { + padding: 0; + + .caption { + padding-right: 30px; + padding-left: 30px; + + a.back.small { + right: 25px; + } + } + + .content { + padding: 0 30px; + } + + .ps__rail-x { + display: none; + width: 5px; + height: 5px; + } + + .ps__rail-y, + .ps__thumb-y { + width: 5px; + opacity: 1; + } + + [class^=ps__rail] { + background-color: #bce9e9; + } + + [class^=ps__thumb] { + background-color: #7dd4e6; + } + + .ps__thumb-y { + right: 0; + } +} + div.link[data-action="basket"] { position: relative; span.number { position: absolute; - background-color: #e30613; - color: #fff; + background-color: #dee59a; + color: #000000; text-align: center; right: -10px; bottom: -10px;
' + i + '' + item.name + '