diff options
| author | Sapan Zaveri <sza@odoo.com> | 2020-01-08 18:39:30 +0000 |
|---|---|---|
| committer | Aaron Bohy <aab@odoo.com> | 2020-01-16 13:38:02 +0000 |
| commit | 4946739c17488d32d3e61b1258ab48b5aec701a4 (patch) | |
| tree | 191bab373f8fe59e48ead2c5e7d77b73be1f521e /addons/base_import/static | |
| parent | 4734315aaddb79507ebe5def232806a377e02f5c (diff) | |
[IMP] base_import: improve preview table UI
Task 1919628
closes odoo/odoo#30430
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
Diffstat (limited to 'addons/base_import/static')
| -rw-r--r-- | addons/base_import/static/src/scss/base_import.scss | 14 | ||||
| -rw-r--r-- | addons/base_import/static/src/xml/base_import.xml | 15 |
2 files changed, 24 insertions, 5 deletions
diff --git a/addons/base_import/static/src/scss/base_import.scss b/addons/base_import/static/src/scss/base_import.scss index bed08873898..7e737a71112 100644 --- a/addons/base_import/static/src/scss/base_import.scss +++ b/addons/base_import/static/src/scss/base_import.scss @@ -115,15 +115,25 @@ } /* ------------- THE CSV TABLE ------------ */ + + $cell-max-width: 350px; + $cell-padding: 4px; .oe_import_grid { tr { &.oe_import_grid-header:first-child { line-height: 24px; font-weight: normal; } - td { - padding: 4px; + .oe_import_grid-cell { + max-width: $cell-max-width; + padding: $cell-padding; vertical-align: top; + .o_multi_line_text { + word-break: break-word; + } + .o_single_line_text { + @include o-text-overflow($display: table-cell, $max-width: $cell-max-width - $cell-padding); + } } } } diff --git a/addons/base_import/static/src/xml/base_import.xml b/addons/base_import/static/src/xml/base_import.xml index c50475533be..d0dd6657a79 100644 --- a/addons/base_import/static/src/xml/base_import.xml +++ b/addons/base_import/static/src/xml/base_import.xml @@ -90,6 +90,7 @@ <div class="table-responsive"> <table class="table-striped table-bordered oe_import_grid bg-white" /> </div> + <h6 class="oe_padding">This is a preview of the first 10 rows of your file</h6> </div> <div class="o_view_nocontent"> <div class="o_nocontent_help"> @@ -133,7 +134,7 @@ <thead> <tr t-if="headers" class="oe_import_grid-header"> <td t-foreach="headers" t-as="header" class="oe_import_grid-cell" - ><span class="o_import_header_name"><t t-esc="header"/></span></td> + ><span class="o_import_header_name o_single_line_text" t-att-title="header"><t t-esc="header"/></span></td> </tr> <tr class="oe_import_fields"> <!-- Iterate on first row to ensure we have all columns --> @@ -144,8 +145,16 @@ </thead> <tbody> <tr t-foreach="preview" t-as="row" class="oe_import_grid-row"> - <td t-foreach="row" t-as="cell" class="oe_import_grid-cell" - ><t t-esc="cell"/></td> + <td t-foreach="row" t-as="cell" class="oe_import_grid-cell"> + <!-- content can be displayed on several lines if it contains whitespaces --> + <!-- in that case, we only display the 120 first characters --> + <!-- otherwise, we let the text-overflow: ellipsis do the job --> + <t t-set="multiline" t-value="cell.includes(' ')"/> + <t t-set="content" t-value="(multiline && cell.length > 120) ? (cell.substring(0, 120) + '...') : cell"/> + <span t-attf-class="#{multiline ? 'o_multi_line_text' : 'o_single_line_text'}"> + <t t-esc="content"/> + </span> + </td> </tr> </tbody> </t> |