fix：修改 legend 显示的问题 以及 map显示的问题

nezha-fronted/src/components/chart/chart/chartMap.vue

@@ -33,7 +33,8 @@ export default {
         x: 0,
         y: 0
       },
-      theme: localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`)
+      theme: localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`),
+      timer: null
     }
   },
   mounted () {
@@ -41,6 +42,11 @@ export default {
   },
   methods: {
     initMap () {
+      if (this.timer) {
+        clearTimeout(this.timer)
+        this.timer = null
+      }
+      this.timer = setTimeout(() => {
         let loadPromise
         this.loadMapConfig().then((mapConfig) => {
           if (mapConfig && this.map) {
@@ -48,6 +54,7 @@ export default {
           }
         })
         return loadPromise
+      }, 500)
     },
     loadMapConfig () {
       const vm = this
@@ -65,7 +72,8 @@ export default {
               this.map.remove()
               this.map = null
             }
-            const mapId = 'map' + this.chartInfo.id
+            console.log(1212)
+            const mapId = document.getElementById('map' + this.chartInfo.id)
             const map = L.map(mapId, {
               minZoom: mapConfig.minZoom,
               maxZoom: mapConfig.maxZoom,
@@ -223,7 +231,11 @@ export default {
     }
   },
   beforeDestroy () {
-    // this.map.remove()
+    if (this.timer) {
+      clearTimeout(this.timer)
+      this.timer = null
+    }
+    this.map && this.map.remove()
     this.map = null
   }
 }

nezha-fronted/src/components/chart/chartMixin.js

@@ -82,10 +82,10 @@ export default {
         if (legend.endsWith(',')) {
           legend = legend.substr(0, legend.length - 1)
         }
+      })
       if (data.metric.__name__) {
         legend += '}'
       }
-      })
       if (!legend) {
         legend = chartInfo.elements[expressionIndex].expression
       }

nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue

@@ -770,8 +770,8 @@ export default {
             thresholds: [],
             enable: {
               legend: true,
-              valueMapping: true,
-              thresholds: true
+              valueMapping: false,
+              thresholds: false
             },
           }
           this.$nextTick(() => {
@@ -793,8 +793,8 @@ export default {
             valueMapping: [],
             enable: {
               legend: true,
-              valueMapping: true,
-              thresholds: true
+              valueMapping: false,
+              thresholds: false
             }
           }
           break
@@ -811,8 +811,8 @@ export default {
             valueMapping: [],
             enable: {
               legend: true,
-              valueMapping: true,
-              thresholds: true
+              valueMapping: false,
+              thresholds: false
             }
           }
           break

nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue

@@ -246,9 +246,9 @@ export default {
             nullType: 'null',
             legend: { placement: 'bottom', values: [] },
             enable: {
-              thresholds: true,
+              thresholds: false,
               legend: true,
-              valueMapping: true
+              valueMapping: false
             },
             thresholds: [{ value: undefined, color: '#eeeeeeff' }]
           }
@@ -262,9 +262,9 @@ export default {
           unit: 2,
           type: 'log',
           enable: {
-            thresholds: true,
+            thresholds: false,
             legend: true,
-            valueMapping: true
+            valueMapping: false
           },
           elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A' }],
           param: {
@@ -284,9 +284,9 @@ export default {
             nullType: 'null',
             statistics: 'last',
             enable: {
-              thresholds: true,
+              thresholds: false,
               legend: true,
-              valueMapping: true
+              valueMapping: false
             },
             datasource: [{
               name: 'System',
@@ -311,9 +311,9 @@ export default {
           height: 4,
           type: 'url',
           enable: {
-            thresholds: true,
+            thresholds: false,
             legend: true,
-            valueMapping: true
+            valueMapping: false
           },
           param: {
             url: ''

nezha-fronted/src/components/common/rightBox/chart/systemChartConfig.vue

@@ -8,7 +8,22 @@
       label-width="120px"
     >
       <div class="chart-title chart-title-config">
-        System
+       <span class="chart-title-content el-form-item" :class="{
+              'is-error' : systemNameShow[0].error,
+              'hide-input': systemNameShow[0].hideInput
+            }">
+              <i class="nz-icon nz-icon-arrow-down" :class="systemNameShow[0].show?'':'is-active'" @click.stop="showSystemNameShow(0)"></i>
+              <el-input
+                @mousedown.stop
+                v-model="chartConfig.param.datasource[0].name"
+                size="small"
+                @input="(val)=>{systemNameInput(val,0)}"
+                @change="systemNameChange(0)" style="width: 120px"
+                @focus.stop="showsystemInput(0,false)"
+                @blur="showsystemInput(0,true)"
+              />
+              <div v-if="systemNameShow[0].error"  class="el-form-item__error" style="top: 10px;left: 164px"> {{systemNameShow[0].error}}</div>
+        </span>
       </div>
       <div class="system-chart-config" v-loading="loading" v-for="(item, index) in chartConfig.param.datasource " :key="index">
         <div class="system-chart-config-left">
@@ -427,6 +442,12 @@ export default {
       systemData: [],
       loading: false,
       rules: {},
+      systemNameShow: [{
+        error: false,
+        hideInput: true,
+        show: true,
+        oldName: ''
+      }],
       groupList: [],
       selectList: [],
       oldType: '',
@@ -513,8 +534,8 @@ export default {
             valueMapping: [],
             enable: {
               legend: true,
-              valueMapping: true,
-              thresholds: true
+              valueMapping: false,
+              thresholds: false
             },
             datasource: [{
               name: 'System',
@@ -541,8 +562,8 @@ export default {
             valueMapping: [],
             enable: {
               legend: true,
-              valueMapping: true,
-              thresholds: true
+              valueMapping: false,
+              thresholds: false
             },
             datasource: [{
               name: 'System',
@@ -562,6 +583,12 @@ export default {
       this.groupList = this.systemData[0].group
       this.selectList = this.systemData[0].select
       this.oldType = type
+      this.systemNameShow = [{
+        error: false,
+        hideInput: true,
+        show: true,
+        oldName: this.chartConfig.param.datasource[0].name
+      }]
       this.change()
     },
     changeSystem (item) {
@@ -583,12 +610,47 @@ export default {
     systemSelectChange (index) {
       this.chartConfig.param.datasource[index].select = this.selectList.find(item => item.name === this.chartConfig.param.datasource[index].systemSelect)
       this.change()
+    },
+    showSystemNameShow (index) {
+      this.systemNameShow[index].show = !this.systemNameShow[index].show
+      this.$set(this.systemNameShow, index, this.systemNameShow[index])
+    },
+    systemNameInput (val, index) {
+      const findIndex = this.systemNameShow.indexOf(val)
+      const lastIndex = this.systemNameShow.lastIndexOf(val)
+      if (findIndex !== -1 && lastIndex != -1 && lastIndex !== findIndex) {
+        this.systemNameShow[index].error = this.$t('error.nameDuplicate')
+      } else if (!val) {
+        this.systemNameShow[index].error = this.$t('validate.required')
+      } else {
+        this.systemNameShow[index].error = ''
+      }
+    },
+    systemNameChange (index) {
+      if (this.systemNameShow[index].error) {
+        this.expressionName[index] = this.systemNameShow[index].oldName
+        this.systemNameShow[index].error = ''
+      } else if (!this.expressionName[index]) {
+        this.expressionName[index] = this.systemNameShow[index].oldName
+      } else {
+        this.systemNameShow[index].oldName = this.expressionName[index]
+      }
+      this.change()
+    },
+    showsystemInput (index, flag) {
+      this.systemNameShow[index].hideInput = flag
     }
   },
   created () {
     this.init()
   },
   mounted () {
+    this.systemNameShow = [{
+      error: false,
+      hideInput: true,
+      show: true,
+      oldName: this.chartConfig.param.datasource[0].name
+    }]
     this.getSystemData()
   }
 }

nezha-fronted/src/components/page/dashboard/panel.vue

@@ -205,8 +205,8 @@ export default {
           legend: { placement: 'bottom', values: [], show: true },
           enable: {
             legend: true,
-            valueMapping: true,
-            thresholds: true
+            valueMapping: false,
+            thresholds: false
           },
           thresholdShow: true,
           thresholds: [{ value: undefined, color: randomcolor() }]