diff --git a/addons/web/static/src/views/fields/percent_pie/percent_pie_field.js b/addons/web/static/src/views/fields/percent_pie/percent_pie_field.js
index 7c6a747ea63..1b904f4af34 100644
--- a/addons/web/static/src/views/fields/percent_pie/percent_pie_field.js
+++ b/addons/web/static/src/views/fields/percent_pie/percent_pie_field.js
@@ -2,6 +2,7 @@
import { registry } from "@web/core/registry";
import { _t } from "@web/core/l10n/translation";
+import { formatFloat } from "../formatters";
import { standardFieldProps } from "../standard_field_props";
import { Component } from "@odoo/owl";
@@ -12,6 +13,15 @@ export class PercentPieField extends Component {
...standardFieldProps,
string: { type: String, optional: true },
};
+
+ /**
+ * Format to 2 decimals without trailing zeros.
+ */
+ get formattedValue() {
+ return formatFloat(this.props.record.data[this.props.name], {
+ trailingZeros: false,
+ });
+ }
}
export const percentPieField = {
diff --git a/addons/web/static/src/views/fields/percent_pie/percent_pie_field.xml b/addons/web/static/src/views/fields/percent_pie/percent_pie_field.xml
index 90f71e07bf7..5bc2fe5b0ab 100644
--- a/addons/web/static/src/views/fields/percent_pie/percent_pie_field.xml
+++ b/addons/web/static/src/views/fields/percent_pie/percent_pie_field.xml
@@ -10,7 +10,7 @@
/>
-
+
diff --git a/addons/web/static/tests/views/fields/percent_pie_field_tests.js b/addons/web/static/tests/views/fields/percent_pie_field_tests.js
index 5514ffee902..be4890d0965 100644
--- a/addons/web/static/tests/views/fields/percent_pie_field_tests.js
+++ b/addons/web/static/tests/views/fields/percent_pie_field_tests.js
@@ -26,10 +26,17 @@ QUnit.module("Fields", (hooks) => {
sortable: true,
searchable: true,
},
+ float_field: {
+ string: "float_field",
+ type: "float",
+ sortable: true,
+ searchable: true,
+ },
},
records: [
{ id: 1, foo: "yop", int_field: 10 },
{ id: 2, foo: "gnap", int_field: 80 },
+ { id: 3, foo: "blip", float_field: 33.3333 },
],
onchanges: {},
},
@@ -112,4 +119,40 @@ QUnit.module("Fields", (hooks) => {
"pie should have a background computed for its value of 80%"
);
});
+
+ QUnit.test("PercentPieField in form view with float value", async function (assert) {
+ await makeView({
+ serverData,
+ type: "form",
+ resModel: "partner",
+ arch: `
+ `,
+ resId: 3,
+ });
+
+ assert.containsOnce(
+ target,
+ ".o_field_percent_pie.o_field_widget .o_pie",
+ "should have a pie chart"
+ );
+ assert.strictEqual(
+ target.querySelector(".o_field_percent_pie.o_field_widget .o_pie_info .o_pie_value")
+ .textContent,
+ "33.33%",
+ "should have 33.33% as pie value since float_field=33.3333 and its value is rounded to 2 decimals"
+ );
+ assert.strictEqual(
+ target
+ .querySelector(".o_field_percent_pie.o_field_widget .o_pie")
+ .style.background.replaceAll(/\s+/g, " "),
+ "conic-gradient( var(--PercentPieField-color-active) 0% 33.3333%, var(--PercentPieField-color-static) 0% 100% )",
+ "pie should have a background computed for its value of 33.3333%"
+ );
+ });
});