From 3fd6d8153f92b61eae66d396452325721c123f5b Mon Sep 17 00:00:00 2001
From: chenjinsong <523037378@qq.com>
Date: Tue, 6 Jul 2021 09:55:51 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=20npm=E5=BA=95=E9=83=A8tab?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/charts/Chart.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/charts/Chart.vue b/src/views/charts/Chart.vue
index 2fd10ed8..0d1bdf08 100644
--- a/src/views/charts/Chart.vue
+++ b/src/views/charts/Chart.vue
@@ -323,7 +323,7 @@ export default {
                 }
               })
             })
-          } else if (this.isEchartsWithStatistics) {
+          } else {
             const queryParams = { startTime: parseInt(this.startTime / 1000), endTime: parseInt(this.endTime / 1000) }
             get(replaceUrlPlaceholder(chartParams.url, queryParams)).then(response => {
               if (response.code === 200) {

From 630954eb845fe604e0ed499b43eeaedf2ea911fc Mon Sep 17 00:00:00 2001
From: chenjinsong <523037378@qq.com>
Date: Tue, 6 Jul 2021 10:55:09 +0800
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20chart=E9=A2=9C=E8=89=B2=E5=AE=9A?=
 =?UTF-8?q?=E4=B9=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/charts/chart-options.js |  9 ++++++++-
 src/views/charts/Chart.vue             | 25 ++++++++++++++++++++++++-
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/components/charts/chart-options.js b/src/components/charts/chart-options.js
index 7a33d9da..308adb58 100644
--- a/src/components/charts/chart-options.js
+++ b/src/components/charts/chart-options.js
@@ -5,7 +5,10 @@
 */
 import { format } from 'echarts'
 import _ from 'lodash'
-
+export const chartColor = ['#73A0FA', '#73DEB3', '#F7C739', '#EB7E65', '#FFAB67', '#A285D2', '#FFA8CB']
+export function getChartColor (index) {
+  return chartColor[index % chartColor.length]
+}
 const line = {
   xAxis: {
     type: 'time'
@@ -19,6 +22,7 @@ const line = {
     bottom: 45,
     top: 30
   },
+  color: chartColor,
   legend: {
     show: true,
     right: 30,
@@ -54,6 +58,7 @@ const lineWithStatistics = {
   yAxis: {
     type: 'value'
   },
+  color: chartColor,
   grid: {
     left: 55,
     bottom: 45,
@@ -79,6 +84,7 @@ const lineStack = {
   xAxis: {
     type: 'time'
   },
+  color: chartColor,
   yAxis: {
     type: 'value'
   },
@@ -120,6 +126,7 @@ const pieWithTable = {
   tooltip: {
     trigger: 'item'
   },
+  color: chartColor,
   animation: false,
   legend: {
     orient: 'vertical',
diff --git a/src/views/charts/Chart.vue b/src/views/charts/Chart.vue
index 0d1bdf08..d379e19b 100644
--- a/src/views/charts/Chart.vue
+++ b/src/views/charts/Chart.vue
@@ -141,7 +141,8 @@ import {
   isEchartsWithTable,
   isEchartsWithStatistics,
   isMapLine,
-  isTabs
+  isTabs,
+  getChartColor
 } from '@/components/charts/chart-options'
 import EchartsFrame from '@/components/charts/EchartsFrame'
 import SingleValue from '@/components/charts/ChartSingleValue'
@@ -323,6 +324,28 @@ export default {
                 }
               })
             })
+          } else if (this.isEchartsWithStatistics) {
+            const queryParams = { startTime: parseInt(this.startTime / 1000), endTime: parseInt(this.endTime / 1000) }
+            get(replaceUrlPlaceholder(chartParams.url, queryParams)).then(response => {
+              if (response.code === 200) {
+                this.statisticsData = response.data.result
+                const seriesTemplate = this.chartOption.series[0]
+                this.chartOption.series = response.data.result.map((r, i) => {
+                  return {
+                    ...seriesTemplate,
+                    name: r.legend,
+                    data: r.values.map(v => [Number(v[0]) * 1000, Number(v[1])]),
+                    lineStyle: {
+                      color: getChartColor[i]
+                    }
+                  }
+                })
+              }
+              this.myChart.setOption(this.chartOption)
+              this.$nextTick(() => {
+                this.myChart.resize()
+              })
+            })
           } else {
             const queryParams = { startTime: parseInt(this.startTime / 1000), endTime: parseInt(this.endTime / 1000) }
             get(replaceUrlPlaceholder(chartParams.url, queryParams)).then(response => {