diff --git a/addons/web/static/src/js/views/kanban/kanban_renderer_mobile.js b/addons/web/static/src/js/views/kanban/kanban_renderer_mobile.js index 3961805c41e..7160cca12fb 100644 --- a/addons/web/static/src/js/views/kanban/kanban_renderer_mobile.js +++ b/addons/web/static/src/js/views/kanban/kanban_renderer_mobile.js @@ -90,10 +90,15 @@ KanbanRenderer.include({ var index = _.findIndex(this.widgets, {db_id: localID}); var $column = this.widgets[index].$el; var left = $column.css('left'); + var right = $column.css('right'); var scrollTop = $column.scrollTop(); return this._super.apply(this, arguments).then(function () { $column = self.widgets[index].$el; - $column.css({left: left}); + if (_t.database.parameters.direction === 'rtl') { + $column.css({right: right}); + } else { + $column.css({left: left}); + } $column.scrollTop(scrollTop); // required when clicking on 'Load More' self._enableSwipe(); }); @@ -149,22 +154,32 @@ KanbanRenderer.include({ var columnID = column.id || column.db_id; var $column = self.$('.o_kanban_group[data-id="' + columnID + '"]'); var $tab = self.$('.o_kanban_mobile_tab[data-id="' + columnID + '"]'); + var colPosition, tabPosition; if (index === moveToIndex - 1) { - $column[updateFunc]({left: '-100%'}); - $tab[updateFunc]({left: '0%'}); + colPosition = '-100%'; + tabPosition = '0%'; } else if (index === moveToIndex + 1) { - $column[updateFunc]({left: '100%'}); - $tab[updateFunc]({left: '100%'}); + colPosition = '100%'; + tabPosition = '100%'; } else if (index === moveToIndex) { - $column[updateFunc]({left: '0%'}); - $tab[updateFunc]({left: '50%'}); + colPosition = '0%'; + tabPosition = '50%'; $tab.addClass('o_current'); } else if (index < moveToIndex) { - $column.css({left: '-100%'}); - $tab[updateFunc]({left: '-100%'}); + colPosition = '-100%'; + tabPosition = '-100%'; } else if (index > moveToIndex) { - $column.css({left: '100%'}); - $tab[updateFunc]({left: '200%'}); + colPosition = '100%'; + tabPosition = '200%'; + } else { + return; + } + if (_t.database.parameters.direction === 'rtl') { + $column[updateFunc]({right: colPosition}); + $tab[updateFunc]({right: tabPosition}); + } else { + $column[updateFunc]({left: colPosition}); + $tab[updateFunc]({left: tabPosition}); } }); def.resolve(); diff --git a/addons/web/static/tests/views/kanban_mobile_tests.js b/addons/web/static/tests/views/kanban_mobile_tests.js index 0ee35c2c9c3..25d700b0d61 100644 --- a/addons/web/static/tests/views/kanban_mobile_tests.js +++ b/addons/web/static/tests/views/kanban_mobile_tests.js @@ -1,10 +1,12 @@ odoo.define('web.kanban_mobile_tests', function (require) { "use strict"; +var core = require('web.core'); var KanbanView = require('web.KanbanView'); var testUtils = require('web.test_utils'); var createView = testUtils.createView; +var _t = core._t; QUnit.module('Views', { beforeEach: function () { @@ -104,6 +106,35 @@ QUnit.module('Views', { kanban.destroy(); }); + + QUnit.test('mobile grouped rendering in rtl direction', function (assert) { + assert.expect(2); + + var direction = _t.database.parameters.direction; + _t.database.parameters.direction = 'rtl'; + + var kanban = createView({ + View: KanbanView, + model: 'partner', + data: this.data, + arch: '' + + '' + + '
' + + '
' + + '
', + domain: [['product_id', '!=', false]], + groupBy: ['product_id'], + }); + + assert.strictEqual(kanban.$('.o_kanban_group:first')[0].style.right, '0%', + "first tab should have 50% right"); + assert.strictEqual(kanban.$('.o_kanban_group:nth(1)')[0].style.right, '100%', + "second tab should have 100% right"); + + kanban.destroy(); + _t.database.parameters.direction = direction; + }); + QUnit.test('mobile grouped with undefined column', function (assert) { assert.expect(3);