diff --git a/README.md b/README.md index 4a7380c95632..d0d53416a5e0 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,7 @@ addon | version | maintainers | summary [web_editor_class_selector](web_editor_class_selector/) | 19.0.1.0.0 | carlos-lopez-tecnativa | Web editor class selector [web_environment_ribbon](web_environment_ribbon/) | 19.0.1.0.0 | | Web Environment Ribbon [web_favicon](web_favicon/) | 19.0.1.0.1 | | Allows to set a custom shortcut icon (aka favicon) +[web_filter_header_button](web_filter_header_button/) | 19.0.1.0.0 | | Show selected filters as buttons in the control panel [web_form_banner](web_form_banner/) | 19.0.1.0.0 | yostashiro aungkokolin1997 | Show configurable, rule-based alert banners on backend form views [web_group_expand](web_group_expand/) | 19.0.1.0.0 | | Group Expand Buttons [web_ir_actions_act_multi](web_ir_actions_act_multi/) | 19.0.1.0.0 | | Enables triggering of more than one action on ActionManager @@ -54,6 +55,7 @@ addon | version | maintainers | summary [web_widget_dropdown_dynamic](web_widget_dropdown_dynamic/) | 19.0.1.0.0 | | This module adds support for dynamic dropdown widget [web_widget_numeric_step](web_widget_numeric_step/) | 19.0.1.0.0 | rafaelbn yajo | Web Widget Numeric Step [web_widget_one2many_tree_line_duplicate](web_widget_one2many_tree_line_duplicate/) | 19.0.1.0.1 | | Web Widget One2many Tree Line Duplicate +[web_widget_popover](web_widget_popover/) | 19.0.1.0.0 | ivantodorovich | Render an icon that displays the field content in a popover [web_widget_product_label_section_and_note_full_label](web_widget_product_label_section_and_note_full_label/) | 19.0.1.0.0 | | Display the full label in the product_label_section_and_note widget. [web_widget_product_label_section_and_note_name_visibility](web_widget_product_label_section_and_note_name_visibility/) | 19.0.1.0.0 | carlos-lopez-tecnativa | Alternate the visibility of the product and description. [web_widget_section_and_note_text_scrollable](web_widget_section_and_note_text_scrollable/) | 19.0.1.0.0 | ivantodorovich | Make the text field of Section and Note widget scrollable diff --git a/setup/_metapackage/pyproject.toml b/setup/_metapackage/pyproject.toml index 82ecbb17ce21..411476c54dfb 100644 --- a/setup/_metapackage/pyproject.toml +++ b/setup/_metapackage/pyproject.toml @@ -1,6 +1,6 @@ [project] name = "odoo-addons-oca-web" -version = "19.0.20261007.1" +version = "19.0.20261014.0" dependencies = [ "odoo-addon-web_calendar_slot_duration==19.0.*", "odoo-addon-web_chatter_position==19.0.*", @@ -12,6 +12,7 @@ dependencies = [ "odoo-addon-web_editor_class_selector==19.0.*", "odoo-addon-web_environment_ribbon==19.0.*", "odoo-addon-web_favicon==19.0.*", + "odoo-addon-web_filter_header_button==19.0.*", "odoo-addon-web_form_banner==19.0.*", "odoo-addon-web_group_expand==19.0.*", "odoo-addon-web_ir_actions_act_multi==19.0.*", @@ -35,6 +36,7 @@ dependencies = [ "odoo-addon-web_widget_dropdown_dynamic==19.0.*", "odoo-addon-web_widget_numeric_step==19.0.*", "odoo-addon-web_widget_one2many_tree_line_duplicate==19.0.*", + "odoo-addon-web_widget_popover==19.0.*", "odoo-addon-web_widget_product_label_section_and_note_full_label==19.0.*", "odoo-addon-web_widget_product_label_section_and_note_name_visibility==19.0.*", "odoo-addon-web_widget_section_and_note_text_scrollable==19.0.*", diff --git a/web_filter_header_button/README.rst b/web_filter_header_button/README.rst new file mode 100644 index 000000000000..35d44965a50a --- /dev/null +++ b/web_filter_header_button/README.rst @@ -0,0 +1,154 @@ +.. image:: https://odoo-community.org/readme-banner-image + :target: https://odoo-community.org/get-involved?utm_source=readme + :alt: Odoo Community Association + +============= +Filter Button +============= + +.. + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! This file is generated by oca-gen-addon-readme !! + !! changes will be overwritten. !! + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! source digest: sha256:95a495eb813ad3e0b9f4c7053f3b5c789c660fa514654bcccd5d8fd167dc884e + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + +.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png + :target: https://odoo-community.org/page/development-status + :alt: Beta +.. |badge2| image:: https://img.shields.io/badge/license-AGPL--3-blue.png + :target: http://www.gnu.org/licenses/agpl-3.0-standalone.html + :alt: License: AGPL-3 +.. |badge3| image:: https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github + :target: https://github.com/OCA/web/tree/19.0/web_filter_header_button + :alt: OCA/web +.. |badge4| image:: https://img.shields.io/badge/weblate-Translate%20me-F47D42.png + :target: https://translation.odoo-community.org/projects/web-19-0/web-19-0-web_filter_header_button + :alt: Translate me on Weblate +.. |badge5| image:: https://img.shields.io/badge/runboat-Try%20me-875A7B.png + :target: https://runboat.odoo-community.org/builds?repo=OCA/web&target_branch=19.0 + :alt: Try me on Runboat + +|badge1| |badge2| |badge3| |badge4| |badge5| + +This module allows to add some selected filters as buttons in the header +control panel. + +**Table of contents** + +.. contents:: + :local: + +Use Cases / Context +=================== + +This developement is aimed to ease the filter access for touch screens +users. + +Configuration +============= + +To show a filter in the header of the views, it should have the a +``context`` attribute with the key ``shown_in_panel``. + +.. code:: xml + + + +This will show the filter in the header with its name. You can customize +the button adding an icon or with a custom name passing an object to +that key: + +.. code:: python + + {'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': 'Ok'}} + +You might be interested in leaving just the icon. In that case, set an +empty string on the ``name`` property: + +.. code:: python + + {'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': ''}} + +You could also want to add a hotkey. In such case add the ``hotkey`` +property: + +.. code:: python + + {'shown_in_panel': {'icon': 'fa-thumbs-up', 'hotkey': 'F'}} + +You can show filter, groups or even favorites. + +Usage +===== + +In a search view with header filter buttons, you'll see a filter icon +(funnel). Use it to unfold the filters. + +There's a demo implementation in ``Apps`` and you can play around +following the *Configure* section. + +Known issues / Roadmap +====================== + +- Group filters by kind +- As we use the ``context`` attribute, the inheritance could be limiting + in some cases. Keep it in mind or use + ``base_view_inheritance_extension`` if you want to use proper context + inheritance. +- Another nice to have would be to be able to hide the filters in the + filter list to be able to show them just in the header, although + there's not a straigh forward way to do it and it could lead to side + effects. + +Bug Tracker +=========== + +Bugs are tracked on `GitHub Issues `_. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +`feedback `_. + +Do not contact contributors directly about support or help with technical issues. + +Credits +======= + +Authors +------- + +* Tecnativa + +Contributors +------------ + +- `Tecnativa `__ + + - David Vidal + +- `Heliconia Solutions Pvt. Ltd. `__ + + - Bhavesh Heliconia + +Maintainers +----------- + +This module is maintained by the OCA. + +.. image:: https://odoo-community.org/logo.png + :alt: Odoo Community Association + :target: https://odoo-community.org + +OCA, or the Odoo Community Association, is a nonprofit organization whose +mission is to support the collaborative development of Odoo features and +promote its widespread use. + +This module is part of the `OCA/web `_ project on GitHub. + +You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute. diff --git a/web_filter_header_button/__init__.py b/web_filter_header_button/__init__.py new file mode 100644 index 000000000000..e69de29bb2d1 diff --git a/web_filter_header_button/__manifest__.py b/web_filter_header_button/__manifest__.py new file mode 100644 index 000000000000..a8334970695a --- /dev/null +++ b/web_filter_header_button/__manifest__.py @@ -0,0 +1,19 @@ +# Copyright 2024 Tecnativa - David Vidal +# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). +{ + "name": "Filter Button", + "version": "19.0.1.0.0", + "summary": "Show selected filters as buttons in the control panel", + "author": "Tecnativa, Odoo Community Association (OCA)", + "license": "AGPL-3", + "category": "Server UX", + "website": "https://github.com/OCA/web", + "depends": ["web"], + "data": [], + "demo": [ + "demo/ir_module_module_view.xml", + ], + "assets": { + "web.assets_backend": ["web_filter_header_button/static/src/**/*"], + }, +} diff --git a/web_filter_header_button/demo/ir_module_module_view.xml b/web_filter_header_button/demo/ir_module_module_view.xml new file mode 100644 index 000000000000..1742e196d611 --- /dev/null +++ b/web_filter_header_button/demo/ir_module_module_view.xml @@ -0,0 +1,24 @@ + + + + ir.module.module + + + + {'shown_in_panel': {'icon': 'fa-toggle-on', 'hotkey': 'i'}} + + + {'shown_in_panel': {'icon': 'fa-toggle-off', 'hotkey': 'u'}} + + + {'group_by':'state', 'shown_in_panel': {'icon': 'fa-th-list', 'hotkey': 's'}} + + + + diff --git a/web_filter_header_button/i18n/it.po b/web_filter_header_button/i18n/it.po new file mode 100644 index 000000000000..c0d5085374bd --- /dev/null +++ b/web_filter_header_button/i18n/it.po @@ -0,0 +1,14 @@ +# Translation of Odoo Server. +# This file contains the translation of the following modules: +# +msgid "" +msgstr "" +"Project-Id-Version: Odoo Server 18.0\n" +"Report-Msgid-Bugs-To: \n" +"Last-Translator: Automatically generated\n" +"Language-Team: none\n" +"Language: it\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: \n" +"Plural-Forms: nplurals=2; plural=n != 1;\n" diff --git a/web_filter_header_button/i18n/web_filter_header_button.pot b/web_filter_header_button/i18n/web_filter_header_button.pot new file mode 100644 index 000000000000..73e76416e0ee --- /dev/null +++ b/web_filter_header_button/i18n/web_filter_header_button.pot @@ -0,0 +1 @@ +# No translations. diff --git a/web_filter_header_button/pyproject.toml b/web_filter_header_button/pyproject.toml new file mode 100644 index 000000000000..4231d0cccb3d --- /dev/null +++ b/web_filter_header_button/pyproject.toml @@ -0,0 +1,3 @@ +[build-system] +requires = ["whool"] +build-backend = "whool.buildapi" diff --git a/web_filter_header_button/readme/CONFIGURE.md b/web_filter_header_button/readme/CONFIGURE.md new file mode 100644 index 000000000000..8f87f4e5b8ed --- /dev/null +++ b/web_filter_header_button/readme/CONFIGURE.md @@ -0,0 +1,32 @@ +To show a filter in the header of the views, it should have the a `context` attribute with the key `shown_in_panel`. + +```xml + +``` + +This will show the filter in the header with its name. You can customize the button +adding an icon or with a custom name passing an object to that key: + +```python +{'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': 'Ok'}} +``` + +You might be interested in leaving just the icon. In that case, set an empty string on +the `name` property: + +```python +{'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': ''}} +``` + +You could also want to add a hotkey. In such case add the `hotkey` property: + +```python +{'shown_in_panel': {'icon': 'fa-thumbs-up', 'hotkey': 'F'}} +``` + +You can show filter, groups or even favorites. diff --git a/web_filter_header_button/readme/CONTEXT.md b/web_filter_header_button/readme/CONTEXT.md new file mode 100644 index 000000000000..2d9eb2fe08e7 --- /dev/null +++ b/web_filter_header_button/readme/CONTEXT.md @@ -0,0 +1 @@ +This developement is aimed to ease the filter access for touch screens users. diff --git a/web_filter_header_button/readme/CONTRIBUTORS.md b/web_filter_header_button/readme/CONTRIBUTORS.md new file mode 100644 index 000000000000..51c132f4475f --- /dev/null +++ b/web_filter_header_button/readme/CONTRIBUTORS.md @@ -0,0 +1,5 @@ +- [Tecnativa](https://tecnativa.com) + - David Vidal + +- [Heliconia Solutions Pvt. Ltd.](https://www.heliconia.io) + - Bhavesh Heliconia diff --git a/web_filter_header_button/readme/DESCRIPTION.md b/web_filter_header_button/readme/DESCRIPTION.md new file mode 100644 index 000000000000..0647834694a6 --- /dev/null +++ b/web_filter_header_button/readme/DESCRIPTION.md @@ -0,0 +1 @@ +This module allows to add some selected filters as buttons in the header control panel. diff --git a/web_filter_header_button/readme/ROADMAP.md b/web_filter_header_button/readme/ROADMAP.md new file mode 100644 index 000000000000..b91b7003b6bc --- /dev/null +++ b/web_filter_header_button/readme/ROADMAP.md @@ -0,0 +1,5 @@ +- Group filters by kind +- As we use the `context` attribute, the inheritance could be limiting in some cases. Keep it in mind or use `base_view_inheritance_extension` if you want to use proper context inheritance. +- Another nice to have would be to be able to hide the filters in the filter list to be + able to show them just in the header, although there's not a straigh forward way to + do it and it could lead to side effects. diff --git a/web_filter_header_button/readme/USAGE.md b/web_filter_header_button/readme/USAGE.md new file mode 100644 index 000000000000..16c1ab4e831d --- /dev/null +++ b/web_filter_header_button/readme/USAGE.md @@ -0,0 +1,5 @@ +In a search view with header filter buttons, you'll see a filter icon (funnel). Use it +to unfold the filters. + +There's a demo implementation in `Apps` and you can play around following the *Configure* +section. diff --git a/web_filter_header_button/static/description/icon.png b/web_filter_header_button/static/description/icon.png new file mode 100644 index 000000000000..3a0328b516c4 Binary files /dev/null and b/web_filter_header_button/static/description/icon.png differ diff --git a/web_filter_header_button/static/description/index.html b/web_filter_header_button/static/description/index.html new file mode 100644 index 000000000000..163f540f7385 --- /dev/null +++ b/web_filter_header_button/static/description/index.html @@ -0,0 +1,497 @@ + + + + + +Filter Button + + + +
+ + + +Odoo Community Association + +
+

Filter Button

+ +

Beta License: AGPL-3 OCA/web Translate me on Weblate Try me on Runboat

+

This module allows to add some selected filters as buttons in the header +control panel.

+

Table of contents

+ +
+

Use Cases / Context

+

This developement is aimed to ease the filter access for touch screens +users.

+
+
+

Configuration

+

To show a filter in the header of the views, it should have the a +context attribute with the key shown_in_panel.

+
+<filter
+    string="My filter"
+    name="my_filter"
+    domain="[('active', '!=', False)]"
+    context="{'shown_in_panel': True}"
+>
+
+

This will show the filter in the header with its name. You can customize +the button adding an icon or with a custom name passing an object to +that key:

+
+{'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': 'Ok'}}
+
+

You might be interested in leaving just the icon. In that case, set an +empty string on the name property:

+
+{'shown_in_panel': {'icon': 'fa-thumbs-up', 'name': ''}}
+
+

You could also want to add a hotkey. In such case add the hotkey +property:

+
+{'shown_in_panel': {'icon': 'fa-thumbs-up', 'hotkey': 'F'}}
+
+

You can show filter, groups or even favorites.

+
+
+

Usage

+

In a search view with header filter buttons, you’ll see a filter icon +(funnel). Use it to unfold the filters.

+

There’s a demo implementation in Apps and you can play around +following the Configure section.

+
+
+

Known issues / Roadmap

+
    +
  • Group filters by kind
  • +
  • As we use the context attribute, the inheritance could be limiting +in some cases. Keep it in mind or use +base_view_inheritance_extension if you want to use proper context +inheritance.
  • +
  • Another nice to have would be to be able to hide the filters in the +filter list to be able to show them just in the header, although +there’s not a straigh forward way to do it and it could lead to side +effects.
  • +
+
+
+

Bug Tracker

+

Bugs are tracked on GitHub Issues. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +feedback.

+

Do not contact contributors directly about support or help with technical issues.

+
+
+

Credits

+
+

Authors

+
    +
  • Tecnativa
  • +
+
+
+

Contributors

+ +
+
+

Maintainers

+

This module is maintained by the OCA.

+ +Odoo Community Association + +

OCA, or the Odoo Community Association, is a nonprofit organization whose +mission is to support the collaborative development of Odoo features and +promote its widespread use.

+

This module is part of the OCA/web project on GitHub.

+

You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute.

+
+
+
+
+ + diff --git a/web_filter_header_button/static/src/control_panel/control_panel.xml b/web_filter_header_button/static/src/control_panel/control_panel.xml new file mode 100644 index 000000000000..8913d8eb18c8 --- /dev/null +++ b/web_filter_header_button/static/src/control_panel/control_panel.xml @@ -0,0 +1,35 @@ + + + + + + +
+ +
+
+
+
+ + + + +
+
diff --git a/web_filter_header_button/static/src/control_panel/control_panel_patch.esm.js b/web_filter_header_button/static/src/control_panel/control_panel_patch.esm.js new file mode 100644 index 000000000000..f2ece582abf9 --- /dev/null +++ b/web_filter_header_button/static/src/control_panel/control_panel_patch.esm.js @@ -0,0 +1,37 @@ +import {ControlPanel} from "@web/search/control_panel/control_panel"; +import {FilterButton} from "../filter_button/filter_button.esm"; +import {browser} from "@web/core/browser/browser"; +import {patch} from "@web/core/utils/patch"; +import {useState} from "@odoo/owl"; +import {user} from "@web/core/user"; + +patch(ControlPanel, { + components: {...ControlPanel.components, FilterButton}, +}); + +patch(ControlPanel.prototype, { + setup() { + super.setup(...arguments); + this.buttonFiltersVisibilityKey = `visibleHeaderButtons${this.env.config.actionId}+${user.userId}`; + this.state = useState({ + ...this.state, + headerButtonFilters: this.env.searchModel?.headerButtonFilters, + showButtonFilters: + this.env.searchModel?.headerButtonFilters.length > 0 && + Boolean(this.env.config.actionId) && + Boolean( + JSON.parse( + browser.localStorage.getItem(this.buttonFiltersVisibilityKey) + ) + ), + }); + }, + onClickShowshowButtonFilters() { + if (this.state.showButtonFilters) { + browser.localStorage.removeItem(this.buttonFiltersVisibilityKey); + } else { + browser.localStorage.setItem(this.buttonFiltersVisibilityKey, true); + } + this.state.showButtonFilters = !this.state.showButtonFilters; + }, +}); diff --git a/web_filter_header_button/static/src/filter_button/filter_button.esm.js b/web_filter_header_button/static/src/filter_button/filter_button.esm.js new file mode 100644 index 000000000000..a62f20fc219d --- /dev/null +++ b/web_filter_header_button/static/src/filter_button/filter_button.esm.js @@ -0,0 +1,44 @@ +import {Component} from "@odoo/owl"; + +export class FilterButton extends Component { + static template = "filter_button.FilterButton"; + static props = { + filters: {type: Object, optional: false}, + }; + setup() { + this.model = this.env.searchModel; + } + /** + * Return custom properties depending on the filter properties + * + * @param {Object} filter + * @returns {Object} + */ + mapFilterType(filter) { + const mapping = { + filter: { + color: "primary", + }, + favorite: { + color: "warning", + }, + groupBy: { + color: "info", + }, + }; + return mapping[filter.type]; + } + /** + * Clear filters + */ + onClickReset() { + this.model.clearQuery(); + } + /** + * Set / unset filter + * @param {Object} filter + */ + onToggleFilter(filter) { + this.model.toggleSearchItem(filter.id); + } +} diff --git a/web_filter_header_button/static/src/filter_button/filter_button.xml b/web_filter_header_button/static/src/filter_button/filter_button.xml new file mode 100644 index 000000000000..51e78c9981df --- /dev/null +++ b/web_filter_header_button/static/src/filter_button/filter_button.xml @@ -0,0 +1,39 @@ + + + + +
+
+ + + + + + + + + + +
+
+
+
diff --git a/web_filter_header_button/static/src/search/search_arch_parser_patch.esm.js b/web_filter_header_button/static/src/search/search_arch_parser_patch.esm.js new file mode 100644 index 000000000000..51f78a40ddd8 --- /dev/null +++ b/web_filter_header_button/static/src/search/search_arch_parser_patch.esm.js @@ -0,0 +1,23 @@ +import {SearchArchParser} from "@web/search/search_arch_parser"; +import {patch} from "@web/core/utils/patch"; +import {makeContext} from "@web/core/context"; + +patch(SearchArchParser.prototype, { + /** + * Allow groupBy filters to show up as buttons + * @override + */ + visitFilter(node) { + var context_to_keep = false; + if (node.hasAttribute("context")) { + const context = makeContext([node.getAttribute("context")]); + if (context.group_by && context.shown_in_panel) { + context_to_keep = context; + } + } + super.visitFilter(...arguments); + if (context_to_keep) { + this.currentGroup.at(-1).context = context_to_keep; + } + }, +}); diff --git a/web_filter_header_button/static/src/search/search_model_patch.esm.js b/web_filter_header_button/static/src/search/search_model_patch.esm.js new file mode 100644 index 000000000000..50bf982fd1d8 --- /dev/null +++ b/web_filter_header_button/static/src/search/search_model_patch.esm.js @@ -0,0 +1,62 @@ +import {makeContext} from "@web/core/context"; +import {patch} from "@web/core/utils/patch"; +import {SearchModel} from "@web/search/search_model"; +import {useEffect} from "@odoo/owl"; + +patch(SearchModel.prototype, { + setup() { + super.setup(...arguments); + // Filter flagged filters to be shown in the control panel. + useEffect( + () => { + this.headerButtonFilters = this.getHeaderButtonFilters(); + }, + () => [this.searchItems] + ); + }, + async load() { + await super.load(...arguments); + this.headerButtonFilters = this.getHeaderButtonFilters(); + }, + /** + * Filter flagged filters to be shown in the control panel. + * + * @returns {Array} + */ + getHeaderButtonFilters() { + return Object.values(this.getSearchItems()) + .filter((f) => { + // Field-type filters are used to filter based on a search, so it + // doesn't make sense for them to be set as clickable buttons + // at the header level. + return ( + f.type !== "field" && + f.context && + makeContext([f.context]).shown_in_panel + ); + }) + .map((f) => { + return {...f, context: makeContext([f.context])}; + }); + }, + /** + * Clear the `show_in_panel` context to prevent it being saved with this context + * @override + * @returns {Object} + */ + _getIrFilterDescription() { + const {preFavorite, irFilter} = super._getIrFilterDescription(...arguments); + if (preFavorite?.context) { + delete preFavorite.context.shown_in_panel; + } + return {preFavorite, irFilter}; + }, + /** + * Update the header filters buttons state + * @override + */ + async _reloadSections() { + await super._reloadSections(); + this.headerButtonFilters = this.getHeaderButtonFilters(); + }, +}); diff --git a/web_widget_popover/README.rst b/web_widget_popover/README.rst new file mode 100644 index 000000000000..93f37c043b73 --- /dev/null +++ b/web_widget_popover/README.rst @@ -0,0 +1,107 @@ +.. image:: https://odoo-community.org/readme-banner-image + :target: https://odoo-community.org/get-involved?utm_source=readme + :alt: Odoo Community Association + +================== +Web Widget Popover +================== + +.. + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! This file is generated by oca-gen-addon-readme !! + !! changes will be overwritten. !! + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! source digest: sha256:9334068a739093f35d55c0c7fab9ad8faf13c927a6bd3c532ab82e567d74485b + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + +.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png + :target: https://odoo-community.org/page/development-status + :alt: Beta +.. |badge2| image:: https://img.shields.io/badge/license-AGPL--3-blue.png + :target: http://www.gnu.org/licenses/agpl-3.0-standalone.html + :alt: License: AGPL-3 +.. |badge3| image:: https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github + :target: https://github.com/OCA/web/tree/19.0/web_widget_popover + :alt: OCA/web +.. |badge4| image:: https://img.shields.io/badge/weblate-Translate%20me-F47D42.png + :target: https://translation.odoo-community.org/projects/web-19-0/web-19-0-web_widget_popover + :alt: Translate me on Weblate +.. |badge5| image:: https://img.shields.io/badge/runboat-Try%20me-875A7B.png + :target: https://runboat.odoo-community.org/builds?repo=OCA/web&target_branch=19.0 + :alt: Try me on Runboat + +|badge1| |badge2| |badge3| |badge4| |badge5| + +The field will be rendered as a simple icon, that when hovered will +display the field content as a tooltip. + +**Table of contents** + +.. contents:: + :local: + +Usage +===== + +Use the ``popover`` widget on ``Char`` or ``Text`` fields. + +.. code:: xml + + + +In list views, use ``nolabel="1"`` to hide the column header: the column +is then kept as narrow as the icon. + +Bug Tracker +=========== + +Bugs are tracked on `GitHub Issues `_. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +`feedback `_. + +Do not contact contributors directly about support or help with technical issues. + +Credits +======= + +Authors +------- + +* Camptocamp + +Contributors +------------ + +- Iván Todorovich + +Maintainers +----------- + +This module is maintained by the OCA. + +.. image:: https://odoo-community.org/logo.png + :alt: Odoo Community Association + :target: https://odoo-community.org + +OCA, or the Odoo Community Association, is a nonprofit organization whose +mission is to support the collaborative development of Odoo features and +promote its widespread use. + +.. |maintainer-ivantodorovich| image:: https://github.com/ivantodorovich.png?size=40px + :target: https://github.com/ivantodorovich + :alt: ivantodorovich + +Current `maintainer `__: + +|maintainer-ivantodorovich| + +This module is part of the `OCA/web `_ project on GitHub. + +You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute. diff --git a/web_widget_popover/__init__.py b/web_widget_popover/__init__.py new file mode 100644 index 000000000000..e69de29bb2d1 diff --git a/web_widget_popover/__manifest__.py b/web_widget_popover/__manifest__.py new file mode 100644 index 000000000000..a2aa9cf94b4b --- /dev/null +++ b/web_widget_popover/__manifest__.py @@ -0,0 +1,20 @@ +# Copyright 2025 Camptocamp SA (https://www.camptocamp.com). +# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). + +{ + "name": "Web Widget Popover", + "summary": "Render an icon that displays the field content in a popover", + "version": "19.0.1.0.0", + "author": "Camptocamp, Odoo Community Association (OCA)", + "maintainers": ["ivantodorovich"], + "website": "https://github.com/OCA/web", + "license": "AGPL-3", + "category": "Web", + "depends": ["web"], + "assets": { + "web.assets_backend": [ + "web_widget_popover/static/src/**/*.js", + "web_widget_popover/static/src/**/*.xml", + ], + }, +} diff --git a/web_widget_popover/i18n/it.po b/web_widget_popover/i18n/it.po new file mode 100644 index 000000000000..c8fe2b03e1fe --- /dev/null +++ b/web_widget_popover/i18n/it.po @@ -0,0 +1,35 @@ +# Translation of Odoo Server. +# This file contains the translation of the following modules: +# * web_widget_popover +# +msgid "" +msgstr "" +"Project-Id-Version: Odoo Server 18.0\n" +"Report-Msgid-Bugs-To: \n" +"PO-Revision-Date: 2025-11-11 11:23+0000\n" +"Last-Translator: mymage \n" +"Language-Team: none\n" +"Language: it\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: \n" +"Plural-Forms: nplurals=2; plural=n != 1;\n" +"X-Generator: Weblate 5.10.4\n" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "FontAwesome icon to display" +msgstr "Icona FontAwesome da visualizzare" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon" +msgstr "Icona" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon Popover" +msgstr "Icona Popover" diff --git a/web_widget_popover/i18n/sl.po b/web_widget_popover/i18n/sl.po new file mode 100644 index 000000000000..47d7d1a98956 --- /dev/null +++ b/web_widget_popover/i18n/sl.po @@ -0,0 +1,36 @@ +# Translation of Odoo Server. +# This file contains the translation of the following modules: +# * web_widget_popover +# +msgid "" +msgstr "" +"Project-Id-Version: Odoo Server 18.0\n" +"Report-Msgid-Bugs-To: \n" +"PO-Revision-Date: 2026-06-07 06:54+0000\n" +"Last-Translator: Matjaz Mozetic \n" +"Language-Team: none\n" +"Language: sl\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: \n" +"Plural-Forms: nplurals=4; plural=n%100==1 ? 0 : n%100==2 ? 1 : n%100==3 || " +"n%100==4 ? 2 : 3;\n" +"X-Generator: Weblate 5.15.2\n" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "FontAwesome icon to display" +msgstr "Ikona FontAwesome za prikaz" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon" +msgstr "Ikona" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon Popover" +msgstr "Pojavno okno z ikonami" diff --git a/web_widget_popover/i18n/web_widget_popover.pot b/web_widget_popover/i18n/web_widget_popover.pot new file mode 100644 index 000000000000..a5c04c1cc31e --- /dev/null +++ b/web_widget_popover/i18n/web_widget_popover.pot @@ -0,0 +1,32 @@ +# Translation of Odoo Server. +# This file contains the translation of the following modules: +# * web_widget_popover +# +msgid "" +msgstr "" +"Project-Id-Version: Odoo Server 19.0\n" +"Report-Msgid-Bugs-To: \n" +"Last-Translator: \n" +"Language-Team: \n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: \n" +"Plural-Forms: \n" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "FontAwesome icon to display" +msgstr "" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon" +msgstr "" + +#. module: web_widget_popover +#. odoo-javascript +#: code:addons/web_widget_popover/static/src/popover.esm.js:0 +msgid "Icon Popover" +msgstr "" diff --git a/web_widget_popover/pyproject.toml b/web_widget_popover/pyproject.toml new file mode 100644 index 000000000000..4231d0cccb3d --- /dev/null +++ b/web_widget_popover/pyproject.toml @@ -0,0 +1,3 @@ +[build-system] +requires = ["whool"] +build-backend = "whool.buildapi" diff --git a/web_widget_popover/readme/CONTRIBUTORS.md b/web_widget_popover/readme/CONTRIBUTORS.md new file mode 100644 index 000000000000..45388bedc364 --- /dev/null +++ b/web_widget_popover/readme/CONTRIBUTORS.md @@ -0,0 +1 @@ +- Iván Todorovich \<\> diff --git a/web_widget_popover/readme/DESCRIPTION.md b/web_widget_popover/readme/DESCRIPTION.md new file mode 100644 index 000000000000..b9de948365c0 --- /dev/null +++ b/web_widget_popover/readme/DESCRIPTION.md @@ -0,0 +1 @@ +The field will be rendered as a simple icon, that when hovered will display the field content as a tooltip. diff --git a/web_widget_popover/readme/USAGE.md b/web_widget_popover/readme/USAGE.md new file mode 100644 index 000000000000..282beb3c3ffd --- /dev/null +++ b/web_widget_popover/readme/USAGE.md @@ -0,0 +1,14 @@ +Use the `popover` widget on `Char` or `Text` fields. + +```xml + +``` + +In list views, use `nolabel="1"` to hide the column header: the column is then +kept as narrow as the icon. diff --git a/web_widget_popover/static/description/icon.png b/web_widget_popover/static/description/icon.png new file mode 100644 index 000000000000..1dcc49c24f36 Binary files /dev/null and b/web_widget_popover/static/description/icon.png differ diff --git a/web_widget_popover/static/description/index.html b/web_widget_popover/static/description/index.html new file mode 100644 index 000000000000..0904790d3a90 --- /dev/null +++ b/web_widget_popover/static/description/index.html @@ -0,0 +1,448 @@ + + + + + +Web Widget Popover + + + +
+ + + +Odoo Community Association + +
+

Web Widget Popover

+ +

Beta License: AGPL-3 OCA/web Translate me on Weblate Try me on Runboat

+

The field will be rendered as a simple icon, that when hovered will +display the field content as a tooltip.

+

Table of contents

+ +
+

Usage

+

Use the popover widget on Char or Text fields.

+
+<field
+    name="warning_message"
+    widget="popover"
+    icon="fa-warning"
+    class="text-danger"
+    nolabel="1"
+/>
+
+

In list views, use nolabel="1" to hide the column header: the column +is then kept as narrow as the icon.

+
+
+

Bug Tracker

+

Bugs are tracked on GitHub Issues. +In case of trouble, please check there if your issue has already been reported. +If you spotted it first, help us to smash it by providing a detailed and welcomed +feedback.

+

Do not contact contributors directly about support or help with technical issues.

+
+
+

Credits

+
+

Authors

+
    +
  • Camptocamp
  • +
+
+
+

Contributors

+ +
+
+

Maintainers

+

This module is maintained by the OCA.

+ +Odoo Community Association + +

OCA, or the Odoo Community Association, is a nonprofit organization whose +mission is to support the collaborative development of Odoo features and +promote its widespread use.

+

Current maintainer:

+

ivantodorovich

+

This module is part of the OCA/web project on GitHub.

+

You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute.

+
+
+
+
+ + diff --git a/web_widget_popover/static/src/popover.esm.js b/web_widget_popover/static/src/popover.esm.js new file mode 100644 index 000000000000..13dd88ff82a7 --- /dev/null +++ b/web_widget_popover/static/src/popover.esm.js @@ -0,0 +1,43 @@ +import {_t} from "@web/core/l10n/translation"; +import {Component} from "@odoo/owl"; +import {registry} from "@web/core/registry"; +import {standardFieldProps} from "@web/views/fields/standard_field_props"; + +export class IconPopoverField extends Component { + static template = "web_widget_popover.IconPopoverField"; + static props = { + ...standardFieldProps, + icon: {type: String, optional: true}, + }; + static defaultProps = { + icon: "fa-info-circle", + }; + get value() { + return this.props.record.data[this.props.name] || ""; + } + get tooltipInfo() { + return JSON.stringify({message: this.value}); + } +} + +export const iconPopoverField = { + component: IconPopoverField, + displayName: _t("Icon Popover"), + supportedTypes: ["char", "text"], + // In list views the column only holds an icon: keep it as narrow as the + // handle column, unless a header label is displayed. + listViewWidth: ({hasLabel}) => (hasLabel ? false : 20), + supportedOptions: [ + { + label: _t("Icon"), + name: "icon", + type: "string", + help: _t("FontAwesome icon to display"), + }, + ], + extractProps: ({attrs}) => ({ + icon: attrs.icon, + }), +}; + +registry.category("fields").add("popover", iconPopoverField); diff --git a/web_widget_popover/static/src/popover.xml b/web_widget_popover/static/src/popover.xml new file mode 100644 index 000000000000..498cb70340b9 --- /dev/null +++ b/web_widget_popover/static/src/popover.xml @@ -0,0 +1,21 @@ + + + + + + + + + +
+ +
+
+ +