[FIX] website_sale, website_sale_wishlist: fix and unify warnings box
The two modules both implemented the cart update warnings box
incorrectly, and differently (though in part because of later
changes):
- `aria-hidden` has meant `display: none` for a while, so the dismiss
button would never show up
- the class is alert-dismiss*i*ble, not alert-dismiss*a*ble
- unnecessarily complicated dom manipulation on updating the warning
- wishlist would go and update the cart badge by hand, unnecessarily
Extracted the warnings stuff to its own helper, with a fixed DOM, and
a slightly modified structure so it's possible to update the message
without having to rewrite the entire box content.
Also modified wishlist to update the cart badge via the existing
helper, this way both modules just call
updateCartNavBar(data);
showWarning(data.warning);
the same way in the same order, and everything is clear.
Also updated `updateCartNavBar`:
- removed the iteration as jQuery should be able to work on the set
- added the warning message and an icon if the quantity is 0 (could
not add to cart) as the separate warning may not be available on all
pages e.g. "recently viewed" product widget can appear anywhere,
previously was only set through wishlist
- keep reveal of cart quantity ancestor as on some pages it's not
visible by default (see previous item for user-case)
closes odoo/odoo#96047
X-original-commit: 2ff55c5fd684ab701cf143d3b0d46979759a8e9f
Signed-off-by: Xavier Morel (xmo) <xmo@odoo.com>
Signed-off-by: William Braeckman (wbr) <wbr@odoo.com>
This commit is contained in:
Xavier Morel
committed by
William Braeckman
William Braeckman
parent
1918b61bc0
commit
8530d1233b
@@ -372,21 +372,11 @@ publicWidget.registry.WebsiteSale = publicWidget.Widget.extend(VariantMixin, car
|
||||
if (!data.cart_quantity) {
|
||||
return window.location = '/shop/cart';
|
||||
}
|
||||
wSaleUtils.updateCartNavBar(data);
|
||||
$input.val(data.quantity);
|
||||
$('.js_quantity[data-line-id='+line_id+']').val(data.quantity).text(data.quantity);
|
||||
|
||||
if (data.warning) {
|
||||
var cart_alert = $('.oe_cart').parent().find('#data_warning');
|
||||
if (cart_alert.length === 0) {
|
||||
$('.oe_cart').prepend('<div class="alert alert-danger alert-dismissable" role="alert" id="data_warning">'+
|
||||
'<button type="button" class="btn-close" data-bs-dismiss="alert" aria-hidden="true"></button> ' + data.warning + '</div>');
|
||||
}
|
||||
else {
|
||||
cart_alert.html('<button type="button" class="btn-close" data-bs-dismiss="alert" aria-hidden="true"></button> ' + data.warning);
|
||||
}
|
||||
$input.val(data.quantity);
|
||||
}
|
||||
wSaleUtils.updateCartNavBar(data);
|
||||
wSaleUtils.showWarning(data.warning);
|
||||
});
|
||||
},
|
||||
/**
|
||||
|
||||
@@ -95,22 +95,48 @@ function animateClone($cart, $elem, offsetTop, offsetLeft) {
|
||||
* @param {Object} data
|
||||
*/
|
||||
function updateCartNavBar(data) {
|
||||
var $qtyNavBar = $(".my_cart_quantity");
|
||||
_.each($qtyNavBar, function (qty) {
|
||||
var $qty = $(qty);
|
||||
$qty.parents('li:first').removeClass('d-none');
|
||||
$qty.addClass('o_mycart_zoom_animation').delay(300).queue(function () {
|
||||
$(this).text(data.cart_quantity);
|
||||
$(this).removeClass("o_mycart_zoom_animation").dequeue();
|
||||
$(".my_cart_quantity")
|
||||
.parents('li.o_wsale_my_cart').removeClass('d-none').end()
|
||||
.addClass('o_mycart_zoom_animation').delay(300)
|
||||
.queue(function () {
|
||||
$(this)
|
||||
.toggleClass('fa fa-warning', !data.cart_quantity)
|
||||
.attr('title', data.warning)
|
||||
.text(data.cart_quantity || '')
|
||||
.removeClass('o_mycart_zoom_animation')
|
||||
.dequeue();
|
||||
});
|
||||
});
|
||||
|
||||
$(".js_cart_lines").first().before(data['website_sale.cart_lines']).end().remove();
|
||||
$(".js_cart_summary").first().before(data['website_sale.short_cart_summary']).end().remove();
|
||||
}
|
||||
|
||||
/**
|
||||
* Displays `message` in an alert box at the top of the page if it's a
|
||||
* non-empty string.
|
||||
*
|
||||
* @param {string | null} message
|
||||
*/
|
||||
function showWarning(message) {
|
||||
if (!message) {
|
||||
return;
|
||||
}
|
||||
var $page = $('.oe_website_sale');
|
||||
var cart_alert = $page.children('#data_warning');
|
||||
if (!cart_alert.length) {
|
||||
cart_alert = $(
|
||||
'<div class="alert alert-danger alert-dismissible" role="alert" id="data_warning">' +
|
||||
'<button type="button" class="btn-close" data-bs-dismiss="alert">×</button> ' +
|
||||
'<span></span>' +
|
||||
'</div>').prependTo($page);
|
||||
}
|
||||
cart_alert.children('span:last-child').text(message);
|
||||
}
|
||||
|
||||
return {
|
||||
animateClone: animateClone,
|
||||
updateCartNavBar: updateCartNavBar,
|
||||
cartHandlerMixin: cartHandlerMixin,
|
||||
showWarning: showWarning,
|
||||
};
|
||||
});
|
||||
|
||||
@@ -188,16 +188,10 @@ publicWidget.registry.ProductWishlist = publicWidget.Widget.extend(VariantMixin,
|
||||
return this._rpc({
|
||||
route: "/shop/cart/update_json",
|
||||
params: this._getCartUpdateJsonParams(productID, qty),
|
||||
}).then(function (resp) {
|
||||
if (resp.warning) {
|
||||
if (! $('#data_warning').length) {
|
||||
$('.wishlist-section').prepend('<div class="mt16 alert alert-danger alert-dismissable" role="alert" id="data_warning"></div>');
|
||||
}
|
||||
var cart_alert = $('.wishlist-section').parent().find('#data_warning');
|
||||
cart_alert.html('<button type="button" class="btn-close" data-bs-dismiss="alert" aria-hidden="true">×</button> ' + resp.warning);
|
||||
}
|
||||
sessionStorage.setItem('website_sale_cart_quantity', resp.cart_quantity);
|
||||
$('.my_cart_quantity').html(resp.cart_quantity || '<i class="fa fa-warning" /> ');
|
||||
}).then(function (data) {
|
||||
sessionStorage.setItem('website_sale_cart_quantity', data.cart_quantity);
|
||||
wSaleUtils.updateCartNavBar(data);
|
||||
wSaleUtils.showWarning(data.warning);
|
||||
});
|
||||
},
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user