[FIX] website_sale: BS4, restore UI for customize dropdown

closes odoo/odoo#28009
This commit is contained in:
Kishan Gajjar
2018-10-22 05:48:17 +00:00
parent e63d319656
commit 3a28e507da
3 changed files with 31 additions and 35 deletions
@@ -74,7 +74,7 @@ options.registry.website_sale = options.Class.extend({
var size_x = parseInt(this.$target.attr("colspan") || 1);
var size_y = parseInt(this.$target.attr("rowspan") || 1);
var $size = this.$el.find('ul[name="size"]');
var $size = this.$el.find('div[name="size"]');
var $select = $size.find('tr:eq(0) td:lt('+size_x+')');
if (size_y >= 2) $select = $select.add($size.find('tr:eq(1) td:lt('+size_x+')'));
if (size_y >= 3) $select = $select.add($size.find('tr:eq(2) td:lt('+size_x+')'));
@@ -85,11 +85,11 @@ options.registry.website_sale = options.Class.extend({
model: 'product.style',
method: 'search_read',
}).then(function (data) {
var $ul = self.$el.find('ul[name="style"]');
var $ul = self.$el.find('div[name="style"]');
for (var k in data) {
$ul.append(
$('<li data-style="'+data[k]['id']+'" data-toggle-class="'+data[k]['html_class']+'" data-no-preview="true"/>')
.append( $('<a/>').text(data[k]['name']) ));
$('<a class="dropdown-item" role="menuitem" data-style="'+data[k]['id']+'" data-toggle-class="'+data[k]['html_class']+'" data-no-preview="true"/>')
.append(data[k]['name']));
}
self._setActive();
});
@@ -105,13 +105,13 @@ options.registry.website_sale = options.Class.extend({
},
bind_resize: function () {
var self = this;
this.$el.on('mouseenter', 'ul[name="size"] table', function (event) {
this.$el.on('mouseenter', 'div[name="size"] table', function (event) {
$(event.currentTarget).addClass("oe_hover");
});
this.$el.on('mouseleave', 'ul[name="size"] table', function (event) {
this.$el.on('mouseleave', 'div[name="size"] table', function (event) {
$(event.currentTarget).removeClass("oe_hover");
});
this.$el.on('mouseover', 'ul[name="size"] td', function (event) {
this.$el.on('mouseover', 'div[name="size"] td', function (event) {
var $td = $(event.currentTarget);
var $table = $td.closest("table");
var x = $td.index()+1;
@@ -127,7 +127,7 @@ options.registry.website_sale = options.Class.extend({
$table.find("td").removeClass("select");
$select_td.addClass("select");
});
this.$el.on('click', 'ul[name="size"] td', function (event) {
this.$el.on('click', 'div[name="size"] td', function (event) {
var $td = $(event.currentTarget);
var x = $td.index()+1;
var y = $td.parent().index()+1;
@@ -457,7 +457,7 @@ div#payment_method {
.oe_overlay_options {
.dropdown {
ul[name="size"] {
div[name="size"] {
table {
margin-left: 20px;
}
+22 -26
View File
@@ -6,34 +6,30 @@
<div data-js='website_sale'
data-selector=".oe_product.oe_grid"
data-no-check="true">
<li class='dropdown-submenu'>
<a tabindex="-1" href="#">Size</a>
<div class="dropdown-menu" role="menu" name="size">
<a href="#" role="menuitem" class="dropdown-item">
<table>
<tr><td class="selected"></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
</table>
</a>
<div class="dropdown-submenu">
<a tabindex="-1" href="#" class="dropdown-item">Size</a>
<div class="dropdown-menu" role="menu" name="size">
<table>
<tr><td class="selected"></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td><td></td></tr>
</table>
</div>
</div>
</li>
<li class='dropdown-submenu' role="menuitem" aria-haspopup="true">
<a tabindex="-1" href="#">Styles</a>
<div class="dropdown-menu" role="menu" name="style">
<div class='dropdown-submenu' role="menuitem" aria-haspopup="true">
<a tabindex="-1" href="#" class="dropdown-item">Styles</a>
<div class="dropdown-menu" role="menu" name="style"/>
</div>
<div class='dropdown-submenu' role="menuitem" aria-haspopup="true">
<a tabindex="-1" href="#" class="dropdown-item">Promote</a>
<div class="dropdown-menu" role="menu" data-no-preview="true">
<a href="#" class="dropdown-item" role="menuitem" data-go_to="top">Push to top</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="up">Push up</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="down">Push down</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="bottom">Push to bottom</a>
</div>
</div>
</li>
<li class='dropdown-submenu' role="menuitem" aria-haspopup="true">
<a tabindex="-1" href="#">Promote</a>
<div class="dropdown-menu" role="menu" data-no-preview="true">
<a href="#" class="dropdown-item" role="menuitem" data-go_to="top">Push to top</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="up">Push up</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="down">Push down</a>
<a href="#" class="dropdown-item" role="menuitem" data-go_to="bottom">Push to bottom</a>
</div>
</li>
</div>
</xpath>