From e35c5e044e8280616d9dc0255f79ba2bba46c2eb Mon Sep 17 00:00:00 2001
From: Aaron Bohy <aab@odoo.com>
Date: Thu, 22 Aug 2019 07:06:18 +0000
Subject: [FIX] web: editable list: force min-width to some columns

Columns with an absolute width (e.g. '120px') must always have a
width of at least that value. When there are records in the list
the column's widths are computed by the browser according to the
content (in readonly). However, for some field types, the rendering
in edition is a bit wider (e.g. date(time) fields because of the
caret).

This rev. sets a min-width to those fields such that the rendering
is also correct in edition.
---
 .../src/js/views/list/list_editable_renderer.js    | 45 ++++++++++++++--------
 1 file changed, 28 insertions(+), 17 deletions(-)

(limited to 'addons/web/static/src')

diff --git a/addons/web/static/src/js/views/list/list_editable_renderer.js b/addons/web/static/src/js/views/list/list_editable_renderer.js
index 2ff25108795..73f59e5d13c 100644
--- a/addons/web/static/src/js/views/list/list_editable_renderer.js
+++ b/addons/web/static/src/js/views/list/list_editable_renderer.js
@@ -933,23 +933,34 @@ ListRenderer.include({
     _renderHeader: function () {
         var $thead = this._super.apply(this, arguments);
 
-        if (this.editable && !this._hasVisibleRecords(this.state) && !this.columnWidths) {
-            // we compute the sum of the weights for each columns, excluding
-            // those with an absolute width.
-            var totalWidth = this.columns.reduce(function (acc, column) {
-                return acc + (column.attrs.relativeWidth || 0);
-            }, 0);
-            this.columns.forEach(function (column) {
-                let width;
-                if (column.attrs.absoluteWidth) {
-                    width = column.attrs.absoluteWidth;
-                } else if (column.attrs.relativeWidth) {
-                    width = ((column.attrs.relativeWidth / totalWidth * 100) + '%');
-                }
-                if (width) {
-                    $thead.find('th[data-name=' + column.attrs.name + ']').css('width', width);
-                }
-            });
+        if (this.editable && !this.columnWidths) {
+            if (!this._hasVisibleRecords(this.state)) {
+                // we compute the sum of the weights for each columns, excluding
+                // those with an absolute width.
+                var totalWidth = this.columns.reduce(function (acc, column) {
+                    return acc + (column.attrs.relativeWidth || 0);
+                }, 0);
+                this.columns.forEach(function (column) {
+                    let width;
+                    if (column.attrs.absoluteWidth) {
+                        width = column.attrs.absoluteWidth;
+                    } else if (column.attrs.relativeWidth) {
+                        width = ((column.attrs.relativeWidth / totalWidth * 100) + '%');
+                    }
+                    if (width) {
+                        $thead.find('th[data-name=' + column.attrs.name + ']').css('width', width);
+                    }
+                });
+            } else {
+                // if there are records, we force a min-width for fields with an
+                // absolute width to ensure a correct rendering in edition
+                this.columns.forEach(function (column) {
+                    if (column.attrs.absoluteWidth) {
+                        let width = column.attrs.absoluteWidth;
+                        $thead.find('th[data-name=' + column.attrs.name + ']').css('min-width', width);
+                    }
+                });
+            }
         }
 
         if (this.addTrashIcon) {
-- 
cgit v1.2.3