From 10b0e87f62b1d4449c88ed3db3c068473d315004 Mon Sep 17 00:00:00 2001
From: junjie <junjie.xia@fit2cloud.com>
Date: Mon, 31 May 2021 16:46:23 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E8=A7=86=E5=9B=BE):=E5=9B=BE=E8=A1=A8?=
 =?UTF-8?q?=E7=B1=BB=E5=9E=8B=E9=BC=A0=E6=A0=87=E6=94=BE=E4=B8=8A=E5=90=8E?=
 =?UTF-8?q?=EF=BC=8C=E6=98=BE=E7=A4=BA=E6=8F=90=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/en.js                     | 15 +++++-
 frontend/src/lang/tw.js                     | 15 +++++-
 frontend/src/lang/zh.js                     | 15 +++++-
 frontend/src/views/chart/view/ChartEdit.vue | 53 +++++++++++++++------
 4 files changed, 81 insertions(+), 17 deletions(-)

diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js
index a370514f5a..3aab9b858e 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -679,7 +679,20 @@ export default {
     title_limit: 'Title cannot be greater than 50 characters',
     filter_condition: 'Filter Condition',
     filter_field_can_null: 'Filter field must choose',
-    preview_100_data: 'Preview 100 rows'
+    preview_100_data: 'Preview 100 rows',
+    chart_table_normal: 'Detail Table',
+    chart_card: 'KPI Card',
+    chart_bar: 'Base Bar',
+    chart_bar_stack: 'Stack Bar',
+    chart_bar_horizontal: 'Horizontal Bar',
+    chart_bar_stack_horizontal: 'Stack Horizontal Bar',
+    chart_line: 'Base Line',
+    chart_line_stack: 'Stack Line',
+    chart_pie: 'Pie',
+    chart_pie_rose: 'Rose Pie',
+    chart_funnel: 'Funnel',
+    chart_radar: 'Radar',
+    chart_gauge: 'Gauge'
   },
   dataset: {
     sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default',
diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js
index 2211e4a45a..38de7d1eeb 100644
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@@ -679,7 +679,20 @@ export default {
     title_limit: '標題不能大於50個字符',
     filter_condition: '過濾條件',
     filter_field_can_null: '過濾字段必填',
-    preview_100_data: '預覽前100條記錄'
+    preview_100_data: '預覽前100條記錄',
+    chart_table_normal: '明細表',
+    chart_card: '指標卡',
+    chart_bar: '基礎柱狀圖',
+    chart_bar_stack: '堆疊柱狀圖',
+    chart_bar_horizontal: '橫向柱狀圖',
+    chart_bar_stack_horizontal: '橫向堆疊柱狀圖',
+    chart_line: '基礎折線圖',
+    chart_line_stack: '堆疊折線圖',
+    chart_pie: '餅圖',
+    chart_pie_rose: '南丁格爾玫瑰圖',
+    chart_funnel: '漏鬥圖',
+    chart_radar: '雷達圖',
+    chart_gauge: '儀表盤'
   },
   dataset: {
     sheet_warn: '有多個sheet頁面，默認抽取第一個',
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index 348bf41e5e..f62c8a8e35 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -679,7 +679,20 @@ export default {
     title_limit: '标题不能大于50个字符',
     filter_condition: '过滤条件',
     filter_field_can_null: '过滤字段必填',
-    preview_100_data: '预览前100条记录'
+    preview_100_data: '预览前100条记录',
+    chart_table_normal: '明细表',
+    chart_card: '指标卡',
+    chart_bar: '基础柱状图',
+    chart_bar_stack: '堆叠柱状图',
+    chart_bar_horizontal: '横向柱状图',
+    chart_bar_stack_horizontal: '横向堆叠柱状图',
+    chart_line: '基础折线图',
+    chart_line_stack: '堆叠折线图',
+    chart_pie: '饼图',
+    chart_pie_rose: '南丁格尔玫瑰图',
+    chart_funnel: '漏斗图',
+    chart_radar: '雷达图',
+    chart_gauge: '仪表盘'
   },
   dataset: {
     sheet_warn: '有多个Sheet页，默认抽取第一个',
diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue
index 5ae3dced7d..200c90dae6 100644
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@@ -101,24 +101,49 @@
                 @change="save(true,'chart')"
               >
                 <div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
-                  <el-radio value="table-normal" label="table-normal"><svg-icon icon-class="table-normal" class="chart-icon" /></el-radio>
-                  <el-radio value="text" label="text"><svg-icon icon-class="text" class="chart-icon" /></el-radio>
-                  <el-radio value="bar" label="bar"><svg-icon icon-class="bar" class="chart-icon" /></el-radio>
-                  <el-radio value="bar-stack" label="bar-stack"><svg-icon icon-class="bar-stack" class="chart-icon" /></el-radio>
-                  <el-radio value="bar-horizontal" label="bar-horizontal"><svg-icon icon-class="bar-horizontal" class="chart-icon" /></el-radio>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_table_normal')" placement="bottom">
+                    <el-radio value="table-normal" label="table-normal"><svg-icon icon-class="table-normal" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_card')" placement="bottom">
+                    <el-radio value="text" label="text"><svg-icon icon-class="text" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_bar')" placement="bottom">
+                    <el-radio value="bar" label="bar"><svg-icon icon-class="bar" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_bar_stack')" placement="bottom">
+                    <el-radio value="bar-stack" label="bar-stack"><svg-icon icon-class="bar-stack" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_bar_horizontal')" placement="bottom">
+                    <el-radio value="bar-horizontal" label="bar-horizontal"><svg-icon icon-class="bar-horizontal" class="chart-icon" /></el-radio>
+                  </el-tooltip>
                 </div>
                 <div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
-                  <el-radio value="bar-stack-horizontal" label="bar-stack-horizontal"><svg-icon icon-class="bar-stack-horizontal" class="chart-icon" /></el-radio>
-                  <el-radio value="line" label="line"><svg-icon icon-class="line" class="chart-icon" /></el-radio>
-                  <el-radio value="line-stack" label="line-stack"><svg-icon icon-class="line-stack" class="chart-icon" /></el-radio>
-                  <el-radio value="pie" label="pie"><svg-icon icon-class="pie" class="chart-icon" /></el-radio>
-                  <el-radio value="pie-rose" label="pie-rose"><svg-icon icon-class="pie-rose" class="chart-icon" /></el-radio>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_bar_stack_horizontal')" placement="bottom">
+                    <el-radio value="bar-stack-horizontal" label="bar-stack-horizontal"><svg-icon icon-class="bar-stack-horizontal" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_line')" placement="bottom">
+                    <el-radio value="line" label="line"><svg-icon icon-class="line" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_line_stack')" placement="bottom">
+                    <el-radio value="line-stack" label="line-stack"><svg-icon icon-class="line-stack" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_pie')" placement="bottom">
+                    <el-radio value="pie" label="pie"><svg-icon icon-class="pie" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_pie_rose')" placement="bottom">
+                    <el-radio value="pie-rose" label="pie-rose"><svg-icon icon-class="pie-rose" class="chart-icon" /></el-radio>
+                  </el-tooltip>
                 </div>
                 <div style="width: 100%;display: flex;display: -webkit-flex;justify-content: space-between;flex-direction: row;flex-wrap: wrap;">
-                  <el-radio value="funnel" label="funnel"><svg-icon icon-class="funnel" class="chart-icon" /></el-radio>
-                  <el-radio value="radar" label="radar"><svg-icon icon-class="radar" class="chart-icon" /></el-radio>
-                  <el-radio value="gauge" label="gauge"><svg-icon icon-class="gauge" class="chart-icon" /></el-radio>
-                  <!--                  <el-radio value="scatter" label="scatter"><svg-icon icon-class="scatter" class="chart-icon" /></el-radio>-->
+                  <el-tooltip effect="dark" :content="$t('chart.chart_funnel')" placement="bottom">
+                    <el-radio value="funnel" label="funnel"><svg-icon icon-class="funnel" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_radar')" placement="bottom">
+                    <el-radio value="radar" label="radar"><svg-icon icon-class="radar" class="chart-icon" /></el-radio>
+                  </el-tooltip>
+                  <el-tooltip effect="dark" :content="$t('chart.chart_gauge')" placement="bottom">
+                    <el-radio value="gauge" label="gauge"><svg-icon icon-class="gauge" class="chart-icon" /></el-radio>
+                  </el-tooltip>
                   <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
                   <el-radio value="" label="" disabled class="disabled-none-cursor"><svg-icon icon-class="" class="chart-icon" /></el-radio>
                 </div>