From 43ac027de6dc79db260290fa3efcd50d4e5629c9 Mon Sep 17 00:00:00 2001
From: junjun <junjie.xia@fit2cloud.com>
Date: Sat, 25 Jun 2022 20:46:05 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=8C=87=E6=A0=87=E5=8D=A1=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E6=95=B0=E5=80=BC=E6=A0=BC=E5=BC=8F=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/drag-item/QuotaExtItem.vue     |  3 +--
 .../chart/components/drag-item/QuotaItem.vue  |  2 +-
 .../chart/components/normal/LabelNormal.vue   | 27 ++++++++++++++++---
 3 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue b/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
index bc97a9ca1b..e96f4cb582 100644
--- a/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
+++ b/frontend/src/views/chart/components/drag-item/QuotaExtItem.vue
@@ -100,7 +100,7 @@
           <el-dropdown-item icon="el-icon-files" :command="beforeClickItem('filter')">
             <span>{{ $t('chart.filter') }}...</span>
           </el-dropdown-item>
-          <el-dropdown-item v-if="chart.render === 'antv' && chart.type.includes('table')" icon="el-icon-notebook-2" divided :command="beforeClickItem('formatter')">
+          <el-dropdown-item v-if="chart.render === 'antv' && (chart.type.includes('table') || chart.type === 'text')" icon="el-icon-notebook-2" divided :command="beforeClickItem('formatter')">
             <span>{{ $t('chart.value_formatter') }}...</span>
           </el-dropdown-item>
           <el-dropdown-item icon="el-icon-edit-outline" divided :command="beforeClickItem('rename')">
@@ -177,7 +177,6 @@ export default {
     this.init()
     this.isEnableCompare()
     bus.$on('reset-change-table', () => this.getItemTagType())
-
   },
   methods: {
     init() {
diff --git a/frontend/src/views/chart/components/drag-item/QuotaItem.vue b/frontend/src/views/chart/components/drag-item/QuotaItem.vue
index 5d5d9cba24..33faf2238a 100644
--- a/frontend/src/views/chart/components/drag-item/QuotaItem.vue
+++ b/frontend/src/views/chart/components/drag-item/QuotaItem.vue
@@ -100,7 +100,7 @@
           <el-dropdown-item icon="el-icon-files" :command="beforeClickItem('filter')">
             <span>{{ $t('chart.filter') }}...</span>
           </el-dropdown-item>
-          <el-dropdown-item v-if="chart.render === 'antv' && chart.type.includes('table')" icon="el-icon-notebook-2" divided :command="beforeClickItem('formatter')">
+          <el-dropdown-item v-if="chart.render === 'antv' && (chart.type.includes('table') || chart.type === 'text')" icon="el-icon-notebook-2" divided :command="beforeClickItem('formatter')">
             <span>{{ $t('chart.value_formatter') }}...</span>
           </el-dropdown-item>
           <el-dropdown-item icon="el-icon-edit-outline" divided :command="beforeClickItem('rename')">
diff --git a/frontend/src/views/chart/components/normal/LabelNormal.vue b/frontend/src/views/chart/components/normal/LabelNormal.vue
index 2b92b247f5..a2e0007652 100644
--- a/frontend/src/views/chart/components/normal/LabelNormal.vue
+++ b/frontend/src/views/chart/components/normal/LabelNormal.vue
@@ -7,8 +7,8 @@
       :style="content_class"
     >
       <span :style="label_class">
-        <p v-for="item in chart.data.series" :key="item.name" :style="label_content_class">
-          {{ item.data[0] }}
+        <p :style="label_content_class">
+          {{ result }}
         </p>
       </span>
       <span v-if="dimensionShow" :style="label_space">
@@ -23,6 +23,7 @@
 <script>
 import { hexColorToRGBA } from '../../chart/util'
 import eventBus from '@/components/canvas/utils/eventBus'
+import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
 
 export default {
   name: 'LabelNormal',
@@ -76,7 +77,8 @@ export default {
         background: hexColorToRGBA('#ffffff', 0)
       },
       title_show: true,
-      borderRadius: '0px'
+      borderRadius: '0px',
+      result: ''
     }
   },
   computed: {
@@ -105,6 +107,7 @@ export default {
     init() {
       const that = this
       this.initStyle()
+      this.resultFormat()
       window.onresize = function() {
         that.calcHeight()
       }
@@ -220,6 +223,24 @@ export default {
           this.label_content_class.color = valueColor
         }
       }
+    },
+
+    resultFormat() {
+      const value = this.chart.data.series[0].data[0]
+      let yAxis = []
+      try {
+        yAxis = JSON.parse(this.chart.yaxis)
+      } catch (err) {
+        yAxis = JSON.parse(JSON.stringify(this.chart.yaxis))
+      }
+      const f = yAxis[0]
+      if (f && f.formatterCfg) {
+        const v = valueFormatter(value, f.formatterCfg)
+        this.result = v.includes('NaN') ? value : v
+      } else {
+        const v = valueFormatter(value, formatterItem)
+        this.result = v.includes('NaN') ? value : v
+      }
     }
   }
 }