From e948efeb0c63cc441592c31db310cd2a0b0470be Mon Sep 17 00:00:00 2001
From: fit2cloud-chenyw <yawen.chen@fit2cloud.com>
Date: Wed, 10 Aug 2022 03:00:25 -0400
Subject: [PATCH] =?UTF-8?q?perf(=E8=A7=86=E5=9B=BE-=E5=9C=B0=E5=9B=BE):=20?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=9C=B0=E5=9B=BE=E7=BC=A9=E6=94=BE=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/chart/components/ChartComponent.vue  | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/frontend/src/views/chart/components/ChartComponent.vue b/frontend/src/views/chart/components/ChartComponent.vue
index 4c60e80017..e538d3abd0 100644
--- a/frontend/src/views/chart/components/ChartComponent.vue
+++ b/frontend/src/views/chart/components/ChartComponent.vue
@@ -10,15 +10,15 @@
     <div :id="chartId" style="width: 100%;height: 100%;overflow: hidden;" :style="{ borderRadius: borderRadius}" />
     <div v-if="chart.type === 'map'" class="map-zoom-box">
       <div style="margin-bottom: 0.5em;">
-        <el-button size="mini" icon="el-icon-plus" circle @click="roamMap(true)" />
+        <el-button :style="{'background': buttonTextColor ? 'none' : '', 'opacity': buttonTextColor ? '0.75': '', 'color': buttonTextColor, 'borderColor': buttonTextColor}" size="mini" icon="el-icon-plus" circle @click="roamMap(true)" />
       </div>
 
       <div style="margin-bottom: 0.5em;">
-        <el-button size="mini" icon="el-icon-refresh" circle @click="resetZoom()" />
+        <el-button :style="{'background': buttonTextColor ? 'none' : '', 'opacity': buttonTextColor ? '0.75': '', 'color': buttonTextColor, 'borderColor': buttonTextColor}" size="mini" icon="el-icon-refresh" circle @click="resetZoom()" />
       </div>
 
       <div>
-        <el-button size="mini" icon="el-icon-minus" circle @click="roamMap(false)" />
+        <el-button :style="{'background': buttonTextColor ? 'none' : '', 'opacity': buttonTextColor ? '0.75': '', 'color': buttonTextColor, 'borderColor': buttonTextColor}" size="mini" icon="el-icon-minus" circle @click="roamMap(false)" />
       </div>
 
     </div>
@@ -81,7 +81,7 @@ import {
   geoJson
 } from '@/api/map/map'
 import ViewTrackBar from '@/components/canvas/components/Editor/ViewTrackBar'
-
+import { reverseColor } from '../chart/common/common'
 export default {
   name: 'ChartComponent',
   components: {
@@ -140,7 +140,8 @@ export default {
       dynamicAreaCode: null,
       borderRadius: '0px',
       mapCenter: null,
-      linkageActiveParam: null
+      linkageActiveParam: null,
+      buttonTextColor: null
     }
   },
 
@@ -291,6 +292,13 @@ export default {
       let themeStyle = null
       if (this.themeStyle) {
         themeStyle = JSON.parse(JSON.stringify(this.themeStyle))
+        if (themeStyle && themeStyle.backgroundColorSelect) {
+          const panelColor = themeStyle.color
+          if (panelColor !== '#FFFFFF') {
+            const reverseValue = reverseColor(panelColor)
+            this.buttonTextColor = reverseValue
+          }
+        }
       }
       const chart_option = baseMapOption(base_json, chart, themeStyle, curAreaCode)
       this.myEcharts(chart_option)