From 25855392911b7cb3511b09b065556c47b4c69a4c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=A0=D0=B0=D1=83=D1=84=20=D0=9B=D0=B0=D1=82=D1=8B=D0=BF?=
 =?UTF-8?q?=D0=BE=D0=B2?= <latypov@micord.ru>
Date: Mon, 9 Jun 2025 09:52:30 +0300
Subject: [PATCH] SUPPORT-9217: add tooltip creation function

---
 .../component/chart/ErvuChartV2.ts            | 25 +++++++++++++------
 .../component/chart/tooltip/DataTooltip.ts    |  3 +++
 .../chart/tooltip/ValueBeforeDataTooltip.ts   |  7 ++++++
 3 files changed, 28 insertions(+), 7 deletions(-)
 create mode 100644 frontend/src/ts/ervu_business_metrics/component/chart/tooltip/DataTooltip.ts
 create mode 100644 frontend/src/ts/ervu_business_metrics/component/chart/tooltip/ValueBeforeDataTooltip.ts

diff --git a/frontend/src/ts/ervu_business_metrics/component/chart/ErvuChartV2.ts b/frontend/src/ts/ervu_business_metrics/component/chart/ErvuChartV2.ts
index ad790a5..31d0d39 100644
--- a/frontend/src/ts/ervu_business_metrics/component/chart/ErvuChartV2.ts
+++ b/frontend/src/ts/ervu_business_metrics/component/chart/ErvuChartV2.ts
@@ -23,6 +23,7 @@ import {ChartBarSettings} from "./model/ChartBarSettings";
 import {ChartLegendSettings} from "./model/ChartLegendSettings";
 import {Options} from "./model/Options";
 import {ChartPlugin} from "./plugin/ChartPlugin";
+import {DataTooltip} from "./tooltip/DataTooltip";
 import {ChartUtils} from "./ChartUtils";
 import {ErvuChartTooltip} from "./ErvuChartTooltip";
 
@@ -97,6 +98,8 @@ export class ErvuChartV2 extends Control implements Filterable {
   public tooltipPosition: any;
   @Visible("false")
   public tooltipModel: TooltipModel<any>;
+  @AdvancedProperty()
+  public dataTooltip: DataTooltip;
 
   private chartRpcService: ChartV2RpcService;
   private filterMap: { [key: string]: Filter } = {};
@@ -259,19 +262,27 @@ export class ErvuChartV2 extends Control implements Filterable {
       }
     };
 
+    chartConfig.dataTooltip = this.dataTooltip
+                              ? this.dataTooltip.tooltip
+                              : ((dataLabel, value) => dataLabel + ' : ' + value) ;
     chartOptions.plugins.tooltip.callbacks = {
       label: function (tooltipItem) {
         const dataset = tooltipItem.dataset;
+        let dataLabel: string;
+        let value;
         if (dataset.type == 'bar' || dataset.type == 'line') {
-          return dataset.label + ' : ' + dataset.data[tooltipItem.dataIndex].x.toLocaleString();
+          dataLabel = dataset.label;
+          value = dataset.data[tooltipItem.dataIndex].x.toLocaleString();
         }
-        let dataLabel;
-        const dataLabels = tooltipItem.chart.config.data.dataLabels;
-        if (dataLabels) {
-          dataLabel = dataLabels[tooltipItem.datasetIndex][tooltipItem.dataIndex];
+        else {
+          const dataLabels = tooltipItem.chart.config.data.dataLabels;
+          if (dataLabels) {
+            dataLabel = dataLabels[tooltipItem.datasetIndex][tooltipItem.dataIndex];
+          }
+          dataLabel = dataLabel ? dataLabel : tooltipItem.label;
+          value = dataset.data[tooltipItem.dataIndex].toLocaleString();
         }
-        return dataLabel ? dataLabel : tooltipItem.label + ' : ' +
-                                       dataset.data[tooltipItem.dataIndex].toLocaleString();
+        return tooltipItem.chart.config.dataTooltip(dataLabel, value);
       }
     };
 
diff --git a/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/DataTooltip.ts b/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/DataTooltip.ts
new file mode 100644
index 0000000..8fdbdc2
--- /dev/null
+++ b/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/DataTooltip.ts
@@ -0,0 +1,3 @@
+export interface DataTooltip {
+  tooltip(dataLabel, value): string;
+}
diff --git a/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/ValueBeforeDataTooltip.ts b/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/ValueBeforeDataTooltip.ts
new file mode 100644
index 0000000..0267738
--- /dev/null
+++ b/frontend/src/ts/ervu_business_metrics/component/chart/tooltip/ValueBeforeDataTooltip.ts
@@ -0,0 +1,7 @@
+import {DataTooltip} from "./DataTooltip";
+
+export class ValueBeforeDataTooltip implements DataTooltip {
+  tooltip(dataLabel, value): string {
+    return "" + value + " " + dataLabel;
+  }
+}