From 944b1bbfec1eebe572585f6caf025066c116f8e8 Mon Sep 17 00:00:00 2001
From: junjie <junjie.xia@fit2cloud.com>
Date: Mon, 17 May 2021 12:47:45 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E8=A7=86=E5=9B=BE):=E5=9B=BE=E8=A1=A8->la?=
 =?UTF-8?q?bel=E7=B1=BB=E5=9E=8Bfix?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/zh.js                            |  4 +++-
 frontend/src/views/chart/chart/chart.js            |  4 +++-
 .../views/chart/components/normal/LabelNormal.vue  | 14 +++++++++++---
 .../chart/components/shape-attr/SizeSelector.vue   |  6 ++++++
 4 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 3dc4940574..c0a16fefd1 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -717,7 +717,9 @@ export default {
     quota_font_size: '指标字体大小',
     space_split: '维度/指标间隔',
     only_one_quota: '仅支持1个指标',
-    only_one_result: '仅显示第1个计算结果'
+    only_one_result: '仅显示第1个计算结果',
+    dimension_show: '维度显示',
+    quota_show: '指标显示'
   },
   dataset: {
     datalist: '数据集',
diff --git a/frontend/src/views/chart/chart/chart.js b/frontend/src/views/chart/chart/chart.js
index e05cb07601..819d0c471c 100644
--- a/frontend/src/views/chart/chart/chart.js
+++ b/frontend/src/views/chart/chart/chart.js
@@ -33,7 +33,9 @@ export const DEFAULT_SIZE = {
   gaugeEndAngle: -45,
   dimensionFontSize: 18,
   quotaFontSize: 18,
-  spaceSplit: 10
+  spaceSplit: 10,
+  dimensionShow: true,
+  quotaShow: true
 }
 export const DEFAULT_LABEL = {
   show: false,
diff --git a/frontend/src/views/chart/components/normal/LabelNormal.vue b/frontend/src/views/chart/components/normal/LabelNormal.vue
index 5d86054ee7..1835e26941 100644
--- a/frontend/src/views/chart/components/normal/LabelNormal.vue
+++ b/frontend/src/views/chart/components/normal/LabelNormal.vue
@@ -6,10 +6,10 @@
       id="label-content"
       :style="content_class"
     >
-      <p :style="label_class">
+      <p v-if="dimensionShow" :style="label_class">
         {{ chart.data.x[0] }}
       </p>
-      <span :style="label_space">
+      <span v-if="quotaShow" :style="label_space">
         <p v-for="item in chart.data.series" :key="item.name" :style="label_content_class">
           {{ item.data[0] }}
         </p>
@@ -40,6 +40,8 @@ export default {
     return {
       height: 'auto',
       splitHeight: '10px',
+      dimensionShow: true,
+      quotaShow: true,
       title_class: {
         margin: '0 0',
         width: '100%',
@@ -109,9 +111,15 @@ export default {
           this.label_content_class.color = customAttr.color.quotaColor
         }
         if (customAttr.size) {
+          this.dimensionShow = customAttr.size.dimensionShow
+          this.quotaShow = customAttr.size.quotaShow
           this.label_class.fontSize = customAttr.size.dimensionFontSize + 'px'
           this.label_content_class.fontSize = customAttr.size.quotaFontSize + 'px'
-          this.label_space.marginTop = customAttr.size.spaceSplit + 'px'
+          if (!this.dimensionShow) {
+            this.label_space.marginTop = '0px'
+          } else {
+            this.label_space.marginTop = customAttr.size.spaceSplit + 'px'
+          }
         }
       }
       if (this.chart.customStyle) {
diff --git a/frontend/src/views/chart/components/shape-attr/SizeSelector.vue b/frontend/src/views/chart/components/shape-attr/SizeSelector.vue
index 4a1115f356..2b7a2df6b4 100644
--- a/frontend/src/views/chart/components/shape-attr/SizeSelector.vue
+++ b/frontend/src/views/chart/components/shape-attr/SizeSelector.vue
@@ -115,11 +115,17 @@
           </el-form>
 
           <el-form v-show="chart.type && chart.type.includes('text')" ref="sizeFormPie" :model="sizeForm" label-width="100px" size="mini">
+            <el-form-item :label="$t('chart.dimension_show')" class="form-item">
+              <el-checkbox v-model="sizeForm.dimensionShow" @change="changeBarSizeCase">{{ $t('chart.show') }}</el-checkbox>
+            </el-form-item>
             <el-form-item :label="$t('chart.dimension_font_size')" class="form-item">
               <el-select v-model="sizeForm.dimensionFontSize" :placeholder="$t('chart.dimension_font_size')" @change="changeBarSizeCase">
                 <el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />
               </el-select>
             </el-form-item>
+            <el-form-item :label="$t('chart.quota_show')" class="form-item">
+              <el-checkbox v-model="sizeForm.quotaShow" @change="changeBarSizeCase">{{ $t('chart.show') }}</el-checkbox>
+            </el-form-item>
             <el-form-item :label="$t('chart.quota_font_size')" class="form-item">
               <el-select v-model="sizeForm.quotaFontSize" :placeholder="$t('chart.quota_font_size')" @change="changeBarSizeCase">
                 <el-option v-for="option in fontSize" :key="option.value" :label="option.name" :value="option.value" />