diff --git a/setup/web_filter_header_button/odoo/addons/web_filter_header_button b/setup/web_filter_header_button/odoo/addons/web_filter_header_button new file mode 120000 index 000000000..ff6d74942 --- /dev/null +++ b/setup/web_filter_header_button/odoo/addons/web_filter_header_button @@ -0,0 +1 @@ +../../../../web_filter_header_button \ No newline at end of file diff --git a/setup/web_filter_header_button/setup.py b/setup/web_filter_header_button/setup.py new file mode 100644 index 000000000..28c57bb64 --- /dev/null +++ b/setup/web_filter_header_button/setup.py @@ -0,0 +1,6 @@ +import setuptools + +setuptools.setup( + setup_requires=['setuptools-odoo'], + odoo_addon=True, +) diff --git a/web_filter_header_button/README.rst b/web_filter_header_button/README.rst new file mode 100644 index 000000000..80879470a --- /dev/null +++ b/web_filter_header_button/README.rst @@ -0,0 +1,139 @@ +============= +Filter Button +============= + +.. + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! This file is generated by oca-gen-addon-readme !! + !! changes will be overwritten. !! + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + !! source digest: sha256:9da8b47931a94c1b0a4f43e7a450e88a87095f7d1d6aa5fdf36fc59efbb75fe4 + !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + +.. |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/licence-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/15.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-15-0/web-15-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=15.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 +===== + +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. + +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 + +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 000000000..e69de29bb diff --git a/web_filter_header_button/__manifest__.py b/web_filter_header_button/__manifest__.py new file mode 100644 index 000000000..1587328bc --- /dev/null +++ b/web_filter_header_button/__manifest__.py @@ -0,0 +1,20 @@ +# Copyright 2024 Tecnativa - David Vidal +# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl). +{ + "name": "Filter Button", + "version": "15.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/**/*.js"], + "web.assets_qweb": ["web_filter_header_button/static/src/**/*.xml"], + }, +} 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 000000000..77773bbe8 --- /dev/null +++ b/web_filter_header_button/demo/ir_module_module_view.xml @@ -0,0 +1,19 @@ + + + + ir.module.module + + + + {'shown_in_panel': {'icon': 'fa-toggle-on', 'hotkey': 'i'}} + + + {'shown_in_panel': {'icon': 'fa-toggle-off', 'hotkey': 'u'}} + + + + diff --git a/web_filter_header_button/readme/CONFIGURE.md b/web_filter_header_button/readme/CONFIGURE.md new file mode 100644 index 000000000..8f87f4e5b --- /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 000000000..2d9eb2fe0 --- /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 000000000..96d0c4c7f --- /dev/null +++ b/web_filter_header_button/readme/CONTRIBUTORS.md @@ -0,0 +1,2 @@ +- [Tecnativa](https://tecnativa.com) + - David Vidal diff --git a/web_filter_header_button/readme/DESCRIPTION.md b/web_filter_header_button/readme/DESCRIPTION.md new file mode 100644 index 000000000..064783469 --- /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 000000000..804bf5e48 --- /dev/null +++ b/web_filter_header_button/readme/ROADMAP.md @@ -0,0 +1,2 @@ +- 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. diff --git a/web_filter_header_button/readme/USAGE.md b/web_filter_header_button/readme/USAGE.md new file mode 100644 index 000000000..ad0e8190e --- /dev/null +++ b/web_filter_header_button/readme/USAGE.md @@ -0,0 +1,2 @@ +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/index.html b/web_filter_header_button/static/description/index.html new file mode 100644 index 000000000..f80e0c98e --- /dev/null +++ b/web_filter_header_button/static/description/index.html @@ -0,0 +1,479 @@ + + + + + + +Filter Button + + + +
+

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

+

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.
    • +
+
+
+

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.esm.js b/web_filter_header_button/static/src/control_panel/control_panel.esm.js new file mode 100644 index 000000000..75b54f56d --- /dev/null +++ b/web_filter_header_button/static/src/control_panel/control_panel.esm.js @@ -0,0 +1,11 @@ +/** @odoo-module **/ +import {FilterButton} from "../filter_button/filter_button.esm"; +import LegacyControlPanel from "web.ControlPanel"; +import {patch} from "web.utils"; + +patch(LegacyControlPanel, "filter_button.ControlPanel", { + components: { + ...LegacyControlPanel.components, + FilterButton, + }, +}); 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 000000000..7a11ebf55 --- /dev/null +++ b/web_filter_header_button/static/src/control_panel/control_panel.xml @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/web_filter_header_button/static/src/control_panel/control_panel_model_extension.esm.js b/web_filter_header_button/static/src/control_panel/control_panel_model_extension.esm.js new file mode 100644 index 000000000..57716199d --- /dev/null +++ b/web_filter_header_button/static/src/control_panel/control_panel_model_extension.esm.js @@ -0,0 +1,36 @@ +/** @odoo-module **/ +import LegacyControlPanelModelExtension from "web/static/src/js/control_panel/control_panel_model_extension.js"; +import {patch} from "web.utils"; + +patch( + LegacyControlPanelModelExtension.prototype, + "filter_button.ControlPanelModelExtension", + { + /** + * Clean the `show_in_panel` context to avoid showing it in the panel + * @private + * @override + * @param {Object} preFilter + * @returns {Promise} + */ + async _saveQuery() { + const preFilter = await this._super(...arguments); + if (preFilter && preFilter.context) { + delete preFilter.context.shown_in_panel; + } + return preFilter; + }, + /** + * Clear the `show_in_panel` context to prevent it being saved with this context + * @override + * @returns {Object} + */ + getIrFilterValues() { + const preFilter = this._super(...arguments); + if (preFilter && preFilter.context) { + delete preFilter.context.shown_in_panel; + } + return preFilter; + }, + } +); 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 000000000..a7499b571 --- /dev/null +++ b/web_filter_header_button/static/src/filter_button/filter_button.esm.js @@ -0,0 +1,50 @@ +/** @odoo-module **/ +const {Component} = owl; + +export class FilterButton extends Component { + setup() { + this.model = this.env.searchModel; + } + /** + * Filter flagged filters to be shown in the control panel. + * + * @param {Array} filters + * @returns {Array} + */ + shownFilters(filters) { + return filters.filter((filter) => { + return filter.context && filter.context.shown_in_panel; + }); + } + /** + * Return custom properties depending on the filter properties + * + * @param {Object} filter + * @returns {Object} + */ + mapFilterType(filter) { + const mapping = { + filter: { + color: "primary", + }, + favorite: { + color: "warning", + }, + }; + return mapping[filter.type]; + } + /** + * Clear filters + */ + onClickReset() { + this.model.dispatch("clearQuery"); + } + /** + * Set / unset filter + * @param {Object} filter + */ + onToggleFilter(filter) { + this.model.dispatch("toggleFilter", filter.id); + } +} +FilterButton.template = "filter_button.FilterButton"; 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 000000000..425bd508d --- /dev/null +++ b/web_filter_header_button/static/src/filter_button/filter_button.xml @@ -0,0 +1,38 @@ + + + + + +
+ + + + + + + + + + +
+ +