KPI widget for Panorama #427

Rello · Jan 8, 2025 · 15c4ace · 15c4ace
1 parent 1494e1b
commit 15c4ace
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 3 deletions.
diff --git a/css/style.css b/css/style.css
@@ -989,12 +989,12 @@ div.dt-container .dt-paging .dt-paging-button {
 }
 
 .kpiWidgetTitel {
-    font-size: 1.2rem;
+    font-size: 1.5rem;
     font-weight: 600;
     margin-bottom: 0.5rem;
 }
 
 .kpiWidgetValue {
     font-size: 3.5rem;
-    font-weight: 500;
+    font-weight: 400;
 }
diff --git a/js/visualization.js b/js/visualization.js
@@ -393,7 +393,18 @@ OCA.Analytics.Visualization = {
     buildKpiDisplay: function (domTarget, jsondata, ordering = true, uniqueId) {
         domTarget.innerHTML = '';
         let kpi = jsondata.data[0][0];
-        let value = jsondata.data[0][1];
+
+        let rawValue = parseFloat(jsondata.data[0][1]);
+        let value;
+
+        if (rawValue % 1 === 0) {
+            // If the number is an integer, format without decimals
+            value = rawValue.toLocaleString();
+        } else {
+            // Otherwise, format with decimals
+            value = rawValue.toLocaleString(undefined, { minimumFractionDigits: 2 });
+        }
+
         let thresholdColor = OCA.Analytics.Visualization.validateThreshold(kpi, value, jsondata.thresholds);
 
         // Create the KPI content dynamically