From 9a57330d065b8c79996078fccfa84aca151f510f Mon Sep 17 00:00:00 2001 From: Barad Mahendra Date: Mon, 22 Mar 2021 08:39:29 +0000 Subject: [PATCH] [IMP] web: display the default label next to the icon in state_selection Purpose of the commit is to display the default label next to the icon for state_selection widget in list view. also that widget support the hide_label option to hide the label in state_selection widget of the list view. Related Ent PR: odoo/enterprise#16559 closes odoo/odoo#66589 Taskid: 2451287 Related: odoo/upgrade#2195 Signed-off-by: Yannick Tivisse (yti) --- .../web/static/src/js/fields/basic_fields.js | 27 +++++++++++++ .../static/src/js/fields/field_registry.js | 1 + .../static/tests/fields/basic_fields_tests.js | 40 +++++++++++++++++++ doc/reference/javascript_reference.rst | 13 ++++++ 4 files changed, 81 insertions(+) diff --git a/addons/web/static/src/js/fields/basic_fields.js b/addons/web/static/src/js/fields/basic_fields.js index b31a18eba45..227dcbb6bf6 100644 --- a/addons/web/static/src/js/fields/basic_fields.js +++ b/addons/web/static/src/js/fields/basic_fields.js @@ -2636,6 +2636,32 @@ var StateSelectionWidget = AbstractField.extend({ }, }); +const ListStateSelectionWidget = StateSelectionWidget.extend({ + /** + * display the label next to the icon + * @override + */ + _render() { + this._super.apply(this, arguments); + + const hideLabel = utils.toBoolElse(this.nodeOptions.hide_label || '', false); + if (!hideLabel) { + const states = this._prepareDropdownValues(); + const currentState = states.find(state => state.name === this.value) || states[0]; + const statusEL = this.el.querySelector('.o_status_label'); + if (statusEL) { + statusEL.innerText = currentState.state_name; + } else { + const labelEL = Object.assign(document.createElement('span'), { + innerText: currentState.state_name, + className: 'o_status_label align-middle', + }); + this.el.appendChild(labelEL); + } + } + }, +}); + var FavoriteWidget = AbstractField.extend({ className: 'o_favorite', events: { @@ -3817,6 +3843,7 @@ return { AttachmentImage: AttachmentImage, LabelSelection: LabelSelection, StateSelectionWidget: StateSelectionWidget, + ListStateSelectionWidget: ListStateSelectionWidget, FavoriteWidget: FavoriteWidget, PriorityWidget: PriorityWidget, StatInfo: StatInfo, diff --git a/addons/web/static/src/js/fields/field_registry.js b/addons/web/static/src/js/fields/field_registry.js index 9822537129f..5331f6feb00 100644 --- a/addons/web/static/src/js/fields/field_registry.js +++ b/addons/web/static/src/js/fields/field_registry.js @@ -56,6 +56,7 @@ registry .add('label_selection', basic_fields.LabelSelection) .add('kanban_label_selection', basic_fields.LabelSelection) // deprecated, use label_selection .add('state_selection', basic_fields.StateSelectionWidget) + .add('list.state_selection', basic_fields.ListStateSelectionWidget) .add('kanban_state_selection', basic_fields.StateSelectionWidget) // deprecated, use state_selection .add('boolean_favorite', basic_fields.FavoriteWidget) .add('boolean_toggle', basic_fields.BooleanToggle) diff --git a/addons/web/static/tests/fields/basic_fields_tests.js b/addons/web/static/tests/fields/basic_fields_tests.js index 7a9876c41da..e8302e87889 100644 --- a/addons/web/static/tests/fields/basic_fields_tests.js +++ b/addons/web/static/tests/fields/basic_fields_tests.js @@ -6232,6 +6232,46 @@ QUnit.module('basic_fields', { form.destroy(); }); + QUnit.test('state_selection widget for list view with hide_label option', async function (assert) { + assert.expect(6); + + Object.assign(this.data.partner.fields, { + graph_type: { + string: "Graph Type", + type: "selection", + selection: [['line', 'Line'], ['bar', 'Bar']] + }, + }); + this.data.partner.records[0].graph_type = "bar"; + this.data.partner.records[1].graph_type = "line"; + + const list = await createView({ + View: ListView, + model: 'partner', + data: this.data, + arch:` + + + + `, + }); + + assert.containsN(list, '.o_state_selection_cell .o_selection > a span.o_status', 10, + "should have ten status selection widgets"); + assert.containsN(list, '.o_state_selection_cell .o_selection[name=selection] > span.align-middle', 5, + "should have five label on selection widgets"); + assert.containsOnce(list, '.o_state_selection_cell .o_selection[name=selection] > span.align-middle:contains(Done)', + "should have one Done status label"); + assert.containsN(list, '.o_state_selection_cell .o_selection[name=selection] > span.align-middle:contains(Normal)', 3, + "should have three Normal status label"); + assert.containsN(list, '.o_state_selection_cell .o_selection[name=graph_type] > a span.o_status', 5, + "should have five status selection widgets"); + assert.containsNone(list, '.o_state_selection_cell .o_selection[name=graph_type] > span.align-middle', + "should not have status label in selection widgets"); + + list.destroy(); + }); + QUnit.test('state_selection widget in editable list view', async function (assert) { assert.expect(32); diff --git a/doc/reference/javascript_reference.rst b/doc/reference/javascript_reference.rst index c0d69668ca1..35932910c26 100644 --- a/doc/reference/javascript_reference.rst +++ b/doc/reference/javascript_reference.rst @@ -2149,6 +2149,19 @@ kanban_state_selection (StateSelectionWidget) - Supported field types: *selection* +list.state_selection (ListStateSelectionWidget) + In list views, the state_selection widget displays by default the label next to the icon. + + - Supported field types: *selection* + + Options: + + - hide_label: hide the label next to the icon + + .. code-block:: xml + + + boolean_favorite (FavoriteWidget) This widget is displayed as an empty (or not) star, depending on a boolean value. Note that it also can be edited in readonly mode.