[FIX] kpi_dashboard: Meter widget supports customization using parameters

Meter widget is implemented with GaugeMeter (https://github.com/Mictronics/GaugeMeter). GaugeMeter provides a number of parameters to customize its display.  See https://github.com/Mictronics/GaugeMeter#parameter-definitions for details.

Allow user to customize GaugeMeter by setting the customization parameters in the result.
This mechanism can be used to show actual values instead of percentages by setting total, used & showvalue parameter in the result.
Fixes #428
This commit is contained in:
Lijo Antony
2022-07-26 16:43:51 +04:00
committed by Brian McMaster
parent 0842a5f26f
commit 7d8dd8877c
6 changed files with 47 additions and 39 deletions

View File

@@ -2,10 +2,13 @@
Kpi Dashboard
=============
.. !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
..
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:3f7c1c23f7a3a6d0be24a8c1fdfd24dbca96ce6215e852d52674f9cf90f6c96f
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
.. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png
:target: https://odoo-community.org/page/development-status
@@ -19,11 +22,11 @@ Kpi Dashboard
.. |badge4| image:: https://img.shields.io/badge/weblate-Translate%20me-F47D42.png
:target: https://translation.odoo-community.org/projects/reporting-engine-14-0/reporting-engine-14-0-kpi_dashboard
:alt: Translate me on Weblate
.. |badge5| image:: https://img.shields.io/badge/runbot-Try%20me-875A7B.png
:target: https://runbot.odoo-community.org/runbot/143/14.0
:alt: Try me on Runbot
.. |badge5| image:: https://img.shields.io/badge/runboat-Try%20me-875A7B.png
:target: https://runboat.odoo-community.org/builds?repo=OCA/reporting-engine&target_branch=14.0
:alt: Try me on Runboat
|badge1| |badge2| |badge3| |badge4| |badge5|
|badge1| |badge2| |badge3| |badge4| |badge5|
This module adds new kinds of dashboards on a specific new type of view.
@@ -42,7 +45,7 @@ Configure KPIs
#. Create a new KPI specifying the computation method and the kpi type
#. Number: result must contain a `value` and, if needed, a `previous`
#. Meter: result must contain `value`, `min` and `max`
#. Meter: To show a percentage value, result must contain `value`. `value` must be a positive integer between 0 to 100. Meter is implemented with GaugeMeter (https://github.com/Mictronics/GaugeMeter). It can be customized by setting parameters for GaugeMeter in result. See https://github.com/Mictronics/GaugeMeter#parameter-definitions for details.
#. Graph: result must contain a list on `graphs` containing `values`, `title` and `key`
#. In order to compute the KPI you can use a predefined function from a model or
@@ -74,7 +77,7 @@ Bug Tracker
Bugs are tracked on `GitHub Issues <https://github.com/OCA/reporting-engine/issues>`_.
In case of trouble, please check there if your issue has already been reported.
If you spotted it first, help us smashing it by providing a detailed and welcomed
If you spotted it first, help us to smash it by providing a detailed and welcomed
`feedback <https://github.com/OCA/reporting-engine/issues/new?body=module:%20kpi_dashboard%0Aversion:%2014.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**>`_.
Do not contact contributors directly about support or help with technical issues.

View File

@@ -5,7 +5,7 @@
"name": "Kpi Dashboard",
"summary": """
Create Dashboards using kpis""",
"version": "14.0.1.2.0",
"version": "14.0.1.2.1",
"license": "AGPL-3",
"author": "Creu Blanca,Odoo Community Association (OCA)",
"website": "https://github.com/OCA/reporting-engine",

View File

@@ -29,17 +29,19 @@
/>
<record id="widget_meter_01" model="kpi.kpi">
<field name="name">Meter 01</field>
<field name="suffix"></field>
<field name="suffix">%</field>
<field name="computation_method">code</field>
<field name="widget">meter</field>
<field name="code">result = {"min": 0, "max": 100, "value": 90}</field>
<field name="code">result = {"value": 90}</field>
</record>
<record id="widget_meter_02" model="kpi.kpi">
<field name="name">Meter 02</field>
<field name="prefix">$</field>
<field name="computation_method">code</field>
<field name="widget">meter</field>
<field name="code">result = {"min": 0, "max": 100, "value": 40}</field>
<field
name="code"
>result = {"min": 0, "total": 200, "used": 90, showvalue: True}</field>
</record>
<function
model="kpi.kpi"

View File

@@ -5,7 +5,7 @@ Configure KPIs
#. Create a new KPI specifying the computation method and the kpi type
#. Number: result must contain a `value` and, if needed, a `previous`
#. Meter: result must contain `value`, `min` and `max`
#. Meter: To show a percentage value, result must contain `value`. `value` must be a positive integer between 0 to 100. Meter is implemented with GaugeMeter (https://github.com/Mictronics/GaugeMeter). It can be customized by setting parameters for GaugeMeter in result. See https://github.com/Mictronics/GaugeMeter#parameter-definitions for details.
#. Graph: result must contain a list on `graphs` containing `values`, `title` and `key`
#. In order to compute the KPI you can use a predefined function from a model or

View File

@@ -1,20 +1,20 @@
<?xml version="1.0" encoding="utf-8" ?>
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="Docutils 0.15.1: http://docutils.sourceforge.net/" />
<meta name="generator" content="Docutils: https://docutils.sourceforge.io/" />
<title>Kpi Dashboard</title>
<style type="text/css">
/*
:Author: David Goodger (goodger@python.org)
:Id: $Id: html4css1.css 7952 2016-07-26 18:15:59Z milde $
:Id: $Id: html4css1.css 8954 2022-01-20 10:10:25Z milde $
:Copyright: This stylesheet has been placed in the public domain.
Default cascading style sheet for the HTML output of Docutils.
See http://docutils.sf.net/docs/howto/html-stylesheets.html for how to
See https://docutils.sourceforge.io/docs/howto/html-stylesheets.html for how to
customize this style sheet.
*/
@@ -366,36 +366,38 @@ ul.auto-toc {
<!-- !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! This file is generated by oca-gen-addon-readme !!
!! changes will be overwritten. !!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
!! source digest: sha256:3f7c1c23f7a3a6d0be24a8c1fdfd24dbca96ce6215e852d52674f9cf90f6c96f
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
<p><a class="reference external" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external" href="https://github.com/OCA/reporting-engine/tree/14.0/kpi_dashboard"><img alt="OCA/reporting-engine" src="https://img.shields.io/badge/github-OCA%2Freporting--engine-lightgray.png?logo=github" /></a> <a class="reference external" href="https://translation.odoo-community.org/projects/reporting-engine-14-0/reporting-engine-14-0-kpi_dashboard"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external" href="https://runbot.odoo-community.org/runbot/143/14.0"><img alt="Try me on Runbot" src="https://img.shields.io/badge/runbot-Try%20me-875A7B.png" /></a></p>
<p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/agpl-3.0-standalone.html"><img alt="License: AGPL-3" src="https://img.shields.io/badge/licence-AGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/reporting-engine/tree/14.0/kpi_dashboard"><img alt="OCA/reporting-engine" src="https://img.shields.io/badge/github-OCA%2Freporting--engine-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/reporting-engine-14-0/reporting-engine-14-0-kpi_dashboard"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/reporting-engine&amp;target_branch=14.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
<p>This module adds new kinds of dashboards on a specific new type of view.</p>
<p><strong>Table of contents</strong></p>
<div class="contents local topic" id="contents">
<ul class="simple">
<li><a class="reference internal" href="#configuration" id="id1">Configuration</a><ul>
<li><a class="reference internal" href="#configure-kpis" id="id2">Configure KPIs</a></li>
<li><a class="reference internal" href="#using-kpi-with-code" id="id3">Using KPI with code</a></li>
<li><a class="reference internal" href="#configure-dashboards" id="id4">Configure dashboards</a></li>
<li><a class="reference internal" href="#configuration" id="toc-entry-1">Configuration</a><ul>
<li><a class="reference internal" href="#configure-kpis" id="toc-entry-2">Configure KPIs</a></li>
<li><a class="reference internal" href="#using-kpi-with-code" id="toc-entry-3">Using KPI with code</a></li>
<li><a class="reference internal" href="#configure-dashboards" id="toc-entry-4">Configure dashboards</a></li>
</ul>
</li>
<li><a class="reference internal" href="#bug-tracker" id="id5">Bug Tracker</a></li>
<li><a class="reference internal" href="#credits" id="id6">Credits</a><ul>
<li><a class="reference internal" href="#authors" id="id7">Authors</a></li>
<li><a class="reference internal" href="#contributors" id="id8">Contributors</a></li>
<li><a class="reference internal" href="#maintainers" id="id9">Maintainers</a></li>
<li><a class="reference internal" href="#bug-tracker" id="toc-entry-5">Bug Tracker</a></li>
<li><a class="reference internal" href="#credits" id="toc-entry-6">Credits</a><ul>
<li><a class="reference internal" href="#authors" id="toc-entry-7">Authors</a></li>
<li><a class="reference internal" href="#contributors" id="toc-entry-8">Contributors</a></li>
<li><a class="reference internal" href="#maintainers" id="toc-entry-9">Maintainers</a></li>
</ul>
</li>
</ul>
</div>
<div class="section" id="configuration">
<h1><a class="toc-backref" href="#id1">Configuration</a></h1>
<h1><a class="toc-backref" href="#toc-entry-1">Configuration</a></h1>
<div class="section" id="configure-kpis">
<h2><a class="toc-backref" href="#id2">Configure KPIs</a></h2>
<h2><a class="toc-backref" href="#toc-entry-2">Configure KPIs</a></h2>
<ol class="arabic simple">
<li>Access <cite>Dashboards &gt; Configuration &gt; KPI Dashboards &gt; Configure KPI</cite></li>
<li>Create a new KPI specifying the computation method and the kpi type<ol class="arabic">
<li>Number: result must contain a <cite>value</cite> and, if needed, a <cite>previous</cite></li>
<li>Meter: result must contain <cite>value</cite>, <cite>min</cite> and <cite>max</cite></li>
<li>Meter: To show a percentage value, result must contain <cite>value</cite>. <cite>value</cite> must be a positive integer between 0 to 100. Meter is implemented with GaugeMeter (<a class="reference external" href="https://github.com/Mictronics/GaugeMeter">https://github.com/Mictronics/GaugeMeter</a>). It can be customized by setting parameters for GaugeMeter in result. See <a class="reference external" href="https://github.com/Mictronics/GaugeMeter#parameter-definitions">https://github.com/Mictronics/GaugeMeter#parameter-definitions</a> for details.</li>
<li>Graph: result must contain a list on <cite>graphs</cite> containing <cite>values</cite>, <cite>title</cite> and <cite>key</cite></li>
</ol>
</li>
@@ -404,7 +406,7 @@ use the code to directly compute it.</li>
</ol>
</div>
<div class="section" id="using-kpi-with-code">
<h2><a class="toc-backref" href="#id3">Using KPI with code</a></h2>
<h2><a class="toc-backref" href="#toc-entry-3">Using KPI with code</a></h2>
<p>Define the code directly on the code field. You can use <cite>self</cite> and <cite>model</cite> as the kpi element
The script should create a variable called <cite>result</cite> as a dictionary that
will be stored as the value.
@@ -416,7 +418,7 @@ result['previous'] = len(model.search([('id', '!=', %s)]))
</pre>
</div>
<div class="section" id="configure-dashboards">
<h2><a class="toc-backref" href="#id4">Configure dashboards</a></h2>
<h2><a class="toc-backref" href="#toc-entry-4">Configure dashboards</a></h2>
<ol class="arabic simple">
<li>Access <cite>Dashboards &gt; Configuration &gt; KPI Dashboards &gt; Configure Dashboards</cite></li>
<li>Create a new dashboard and specify all the standard parameters on <cite>Widget configuration</cite></li>
@@ -427,36 +429,36 @@ result['previous'] = len(model.search([('id', '!=', %s)]))
</div>
</div>
<div class="section" id="bug-tracker">
<h1><a class="toc-backref" href="#id5">Bug Tracker</a></h1>
<h1><a class="toc-backref" href="#toc-entry-5">Bug Tracker</a></h1>
<p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/reporting-engine/issues">GitHub Issues</a>.
In case of trouble, please check there if your issue has already been reported.
If you spotted it first, help us smashing it by providing a detailed and welcomed
If you spotted it first, help us to smash it by providing a detailed and welcomed
<a class="reference external" href="https://github.com/OCA/reporting-engine/issues/new?body=module:%20kpi_dashboard%0Aversion:%2014.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**">feedback</a>.</p>
<p>Do not contact contributors directly about support or help with technical issues.</p>
</div>
<div class="section" id="credits">
<h1><a class="toc-backref" href="#id6">Credits</a></h1>
<h1><a class="toc-backref" href="#toc-entry-6">Credits</a></h1>
<div class="section" id="authors">
<h2><a class="toc-backref" href="#id7">Authors</a></h2>
<h2><a class="toc-backref" href="#toc-entry-7">Authors</a></h2>
<ul class="simple">
<li>Creu Blanca</li>
</ul>
</div>
<div class="section" id="contributors">
<h2><a class="toc-backref" href="#id8">Contributors</a></h2>
<h2><a class="toc-backref" href="#toc-entry-8">Contributors</a></h2>
<ul class="simple">
<li>Enric Tobella &lt;<a class="reference external" href="mailto:etobella&#64;creublanca.es">etobella&#64;creublanca.es</a>&gt;</li>
</ul>
</div>
<div class="section" id="maintainers">
<h2><a class="toc-backref" href="#id9">Maintainers</a></h2>
<h2><a class="toc-backref" href="#toc-entry-9">Maintainers</a></h2>
<p>This module is maintained by the OCA.</p>
<a class="reference external image-reference" href="https://odoo-community.org"><img alt="Odoo Community Association" src="https://odoo-community.org/logo.png" /></a>
<p>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.</p>
<p>Current <a class="reference external" href="https://odoo-community.org/page/maintainer-role">maintainer</a>:</p>
<p><a class="reference external" href="https://github.com/etobella"><img alt="etobella" src="https://github.com/etobella.png?size=40px" /></a></p>
<p><a class="reference external image-reference" href="https://github.com/etobella"><img alt="etobella" src="https://github.com/etobella.png?size=40px" /></a></p>
<p>This module is part of the <a class="reference external" href="https://github.com/OCA/reporting-engine/tree/14.0/kpi_dashboard">OCA/reporting-engine</a> project on GitHub.</p>
<p>You are welcome to contribute. To learn how please visit <a class="reference external" href="https://odoo-community.org/page/Contribute">https://odoo-community.org/page/Contribute</a>.</p>
</div>

View File

@@ -17,7 +17,6 @@ odoo.define("kpi_dashboard.MeterWidget", function (require) {
_getMeterOptions: function (values) {
var size = Math.min(this.widget_size_x, this.widget_size_y - 40) - 10;
return {
percent: values.value.value,
style: "Arch",
width: 10,
size: size,
@@ -25,6 +24,8 @@ odoo.define("kpi_dashboard.MeterWidget", function (require) {
append: values.suffix === undefined ? "" : values.suffix,
color: values.font_color,
animate_text_colors: true,
...(values.value.value && {percent: values.value.value}),
...values.value,
};
},
});