From c6b3dac3d504c4ea7e20b9a5aa100279b52332c2 Mon Sep 17 00:00:00 2001
From: junjie <junjie.xia@fit2cloud.com>
Date: Tue, 29 Jun 2021 14:48:59 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E8=A7=86=E5=9B=BE):=20=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E8=A7=86=E5=9B=BE=E6=9B=B4=E6=8D=A2=E6=95=B0=E6=8D=AE=E9=9B=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/en.js                     |  4 +-
 frontend/src/lang/tw.js                     |  4 +-
 frontend/src/lang/zh.js                     |  4 +-
 frontend/src/views/chart/view/ChartEdit.vue | 50 ++++++++++++++++++++-
 4 files changed, 57 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js
index cb6ab14ba9..a01b75cc38 100644
--- a/frontend/src/lang/en.js
+++ b/frontend/src/lang/en.js
@@ -732,7 +732,9 @@ export default {
     axis_label_color: 'Label Color',
     axis_label_fontsize: 'Label Fontsize',
     text_style: 'Font Style',
-    bolder: 'Bolder'
+    bolder: 'Bolder',
+    change_ds: 'Change Dataset',
+    change_ds_tip: 'Tips：Change Dataset will change fields,you need rebuild chart'
   },
   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 690e937696..8401b867cb 100644
--- a/frontend/src/lang/tw.js
+++ b/frontend/src/lang/tw.js
@@ -774,7 +774,9 @@ export default {
     axis_label_color: '標簽顏色',
     axis_label_fontsize: '標簽大小',
     text_style: '字體樣式',
-    bolder: '加粗'
+    bolder: '加粗',
+    change_ds: '更換數據集',
+    change_ds_tip: '提示：更換數據集將導致字段發生變化，需重新製作視圖'
   },
   dataset: {
     sheet_warn: '有多個sheet頁面，默認抽取第一個',
diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js
index f30a9ef1d2..47ab5cef65 100644
--- a/frontend/src/lang/zh.js
+++ b/frontend/src/lang/zh.js
@@ -732,7 +732,9 @@ export default {
     axis_label_color: '标签颜色',
     axis_label_fontsize: '标签大小',
     text_style: '字体样式',
-    bolder: '加粗'
+    bolder: '加粗',
+    change_ds: '更换数据集',
+    change_ds_tip: '提示：更换数据集将导致字段发生变化，需重新制作视图'
   },
   dataset: {
     sheet_warn: '有多个 Sheet 页，默认抽取第一个',
diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue
index 24a82c98fd..fdd0e459d7 100644
--- a/frontend/src/views/chart/view/ChartEdit.vue
+++ b/frontend/src/views/chart/view/ChartEdit.vue
@@ -13,6 +13,9 @@
         <span slot="reference" style="line-height: 40px;cursor: pointer;">{{ view.name }}</span>
       </el-popover>
       <span style="float: right;line-height: 40px;">
+        <el-button size="mini" @click="changeDs">
+          {{ $t('chart.change_ds') }}
+        </el-button>
         <el-button size="mini" @click="closeEdit">
           {{ $t('commons.save') }}
         </el-button>
@@ -330,6 +333,24 @@
         <el-button type="primary" size="mini" @click="saveResultFilter">{{ $t('chart.confirm') }}</el-button>
       </div>
     </el-dialog>
+
+    <!--视图更换数据集-->
+    <el-dialog
+      v-dialogDrag
+      :title="$t('chart.change_ds')+'['+table.name+']'"
+      :visible="selectTableFlag"
+      :show-close="false"
+      width="70%"
+      class="dialog-css"
+      :destroy-on-close="true"
+    >
+      <table-selector @getTable="getTable" />
+      <span>{{ $t('chart.change_ds_tip') }}</span>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" @click="closeChangeChart">{{ $t('chart.cancel') }}</el-button>
+        <el-button type="primary" size="mini" :disabled="!table.id" @click="changeChart">{{ $t('chart.confirm') }}</el-button>
+      </div>
+    </el-dialog>
   </el-row>
 </template>
 
@@ -368,10 +389,11 @@ import DimensionFilterEditor from '../components/filter/DimensionFilterEditor'
 import TableNormal from '../components/table/TableNormal'
 import LabelNormal from '../components/normal/LabelNormal'
 import html2canvas from 'html2canvas'
+import TableSelector from './TableSelector'
 
 export default {
   name: 'ChartEdit',
-  components: { ResultFilterEditor, LabelNormal, DimensionFilterEditor, TableNormal, DatasetChartDetail, QuotaFilterEditor, BackgroundColorSelector, XAxisSelector, YAxisSelector, TooltipSelector, LabelSelector, LegendSelector, TitleSelector, SizeSelector, ColorSelector, ChartComponent, QuotaItem, DimensionItem, draggable },
+  components: { TableSelector, ResultFilterEditor, LabelNormal, DimensionFilterEditor, TableNormal, DatasetChartDetail, QuotaFilterEditor, BackgroundColorSelector, XAxisSelector, YAxisSelector, TooltipSelector, LabelSelector, LegendSelector, TitleSelector, SizeSelector, ColorSelector, ChartComponent, QuotaItem, DimensionItem, draggable },
   props: {
     param: {
       type: Object,
@@ -430,7 +452,9 @@ export default {
       httpRequest: {
         status: true,
         msg: ''
-      }
+      },
+      selectTableFlag: false,
+      changeTable: {}
     }
   },
   computed: {
@@ -556,6 +580,7 @@ export default {
         if (needRefreshGroup) {
           this.refreshGroup(view)
         }
+        this.closeChangeChart()
       })
     },
 
@@ -628,6 +653,7 @@ export default {
       // 从仪表板入口关闭
       bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' })
       // this.$emit('switchComponent', { name: '' })
+      this.$success(this.$t('commons.save_success'))
     },
     getData(id) {
       if (id) {
@@ -930,6 +956,26 @@ export default {
 
     refreshGroup(view) {
       this.$emit('saveSuccess', view)
+    },
+
+    getTable(table) {
+      this.changeTable = JSON.parse(JSON.stringify(table))
+    },
+
+    changeDs() {
+      this.selectTableFlag = true
+    },
+
+    closeChangeChart() {
+      this.selectTableFlag = false
+    },
+
+    changeChart() {
+      this.view.tableId = this.changeTable.id
+      this.view.xaxis = []
+      this.view.yaxis = []
+      this.view.customFilter = []
+      this.save(true, 'chart', false)
     }
   }
 }