Merge branch 'dev-3.7' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.8

nezha-fronted/src/components/common/mixin/mainMixinFun.js

@@ -111,6 +111,47 @@ export default {
 
         node.addEventListener('animationend', handleAnimationEnd, { once: true })
       })
+    },
+    handleLegendAlias (legend, aliasExpression, params) {
+      const self = this
+      const myParams = JSON.parse(JSON.stringify(params))
+      myParams.$labels = JSON.parse(JSON.stringify(params))
+      myParams.$value = myParams.value
+      if (/\{\{.+\}\}/.test(aliasExpression)) {
+        const labelValue = aliasExpression.replace(/(\{\{.+?\}\})/g, function (i) {
+          const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2)
+          if (!legend) {
+            return label
+          }
+          let value = null
+          if (params && self.$lodash.get(myParams, label)) {
+            value = self.$lodash.get(myParams, label)
+          }
+          if (label) {
+            const reg = new RegExp(label + '=".+?"', 'g')
+            if (reg.test(legend)) {
+              const ans = legend.match(reg)
+              let find = ''
+              ans.forEach(item => {
+                const index = legend.indexOf(item)
+                if (legend[index - 1] !== '_') {
+                  find = item
+                }
+              })
+              value = find.substr(find.indexOf('"') + 1, find.lastIndexOf('"') - find.indexOf('"') - 1)
+            }
+          }
+          return value || ''
+        })
+        return labelValue
+      } else {
+        if (!aliasExpression) {
+          return legend
+          // let result =legend.substr(legend.indexOf('"') + 1,legend.lastIndexOf('"') - legend.indexOf('"') - 1);
+          // return result
+        }
+        return aliasExpression
+      }
     }
   }
 }

nezha-fronted/src/components/common/project/meta2d/js/meta2dMainCalc.js

@@ -354,7 +354,9 @@ export default {
         this.chartParams = {
           ...pen.data.tooltip,
           unit: this.params.unit,
-          statistic: this.params.statistic
+          statistic: this.params.statistic,
+          legend: pen.data.legend,
+          parent: pen.data.parent
         }
         this.timer3 = setTimeout(() => {
           let ePosition = window.ePosition

nezha-fronted/src/components/common/project/meta2d/js/topoUtil.js

@@ -97,47 +97,6 @@ export default {
         })
       })
     },
-    handleLegendAlias (legend, aliasExpression, params) {
-      const self = this
-      const myParams = JSON.parse(JSON.stringify(params))
-      myParams.$labels = JSON.parse(JSON.stringify(params))
-      myParams.$value = myParams.value
-      if (/\{\{.+\}\}/.test(aliasExpression)) {
-        const labelValue = aliasExpression.replace(/(\{\{.+?\}\})/g, function (i) {
-          const label = i.substr(i.indexOf('{{') + 2, i.indexOf('}}') - i.indexOf('{{') - 2)
-          if (!legend) {
-            return label
-          }
-          let value = null
-          if (params && self.$lodash.get(myParams, label)) {
-            value = self.$lodash.get(myParams, label)
-          }
-          if (label) {
-            const reg = new RegExp(label + '=".+?"', 'g')
-            if (reg.test(legend)) {
-              const ans = legend.match(reg)
-              let find = ''
-              ans.forEach(item => {
-                const index = legend.indexOf(item)
-                if (legend[index - 1] !== '_') {
-                  find = item
-                }
-              })
-              value = find.substr(find.indexOf('"') + 1, find.lastIndexOf('"') - find.indexOf('"') - 1)
-            }
-          }
-          return value || ''
-        })
-        return labelValue
-      } else {
-        if (!aliasExpression) {
-          return legend
-          // let result =legend.substr(legend.indexOf('"') + 1,legend.lastIndexOf('"') - legend.indexOf('"') - 1);
-          // return result
-        }
-        return aliasExpression
-      }
-    },
     clacTopoData (data, queryValues) { // 主要处理 属性为原始属性 处理动画属性对原始属性的影响
       return new Promise(resolve => { // 处理加载数据
         if (!data) {

nezha-fronted/src/components/common/project/meta2d/meta2dElement.vue

@@ -789,22 +789,11 @@
           </div>
         </div>
       </div>
-
+      <!--source-->
-      <!--         valueMapping -->
       <div class="form-row-title">
-        {{$t('dashboard.dashboard.chartForm.valueMapping')}}
+        {{$t('dashboard.dashboard.chartForm.datasource')}}
-        <span>
-              <el-switch
-                v-model="pen.data.enable.valueMapping"
-                :active-value="true"
-                :inactive-value="false"
-                @change="change('data.enable.valueMapping')"
-              ></el-switch>
-              <i class="nz-icon nz-icon-arrow-down" :class="elements.valueMapping&& pen.data.enable.valueMapping?'':'is-rotate'" @click="updateShow('valueMapping')"/>
-            </span>
       </div>
-      <transition name="el-zoom-in-top">
+      <div class="el-form">
-        <div class="el-form" v-show="elements.valueMapping && pen.data.enable.valueMapping">
         <div  class="form-row-content">
           <div class="form-row-item form-row-item-full">
             <div class="form-row-key">
@@ -823,6 +812,25 @@
               </div>
             </div>
           </div>
+        </div>
+      </div>
+
+      <!--         valueMapping -->
+      <div class="form-row-title">
+        {{$t('dashboard.dashboard.chartForm.valueMapping')}}
+        <span>
+              <el-switch
+                v-model="pen.data.enable.valueMapping"
+                :active-value="true"
+                :inactive-value="false"
+                @change="change('data.enable.valueMapping')"
+              ></el-switch>
+              <i class="nz-icon nz-icon-arrow-down" :class="elements.valueMapping&& pen.data.enable.valueMapping?'':'is-rotate'" @click="updateShow('valueMapping')"/>
+            </span>
+      </div>
+      <transition name="el-zoom-in-top">
+        <div class="el-form" v-show="elements.valueMapping && pen.data.enable.valueMapping">
+          <div  class="form-row-content">
             <div class="form-row-item form-row-item-full chart-config">
               <el-row class="el-form">
                 <draggable

nezha-fronted/src/components/common/project/meta2d/meta2dTooltip.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="tooltip-box" style="width: 400px;height: 300px;display: flex;flex-direction: column">
-    <div v-if="params.titleShow && params.title" style="margin-bottom: 5px" class="tooltip-box-title">{{params.title}}</div>
+    <div v-if="params.titleShow && params.title" style="margin-bottom: 5px" class="tooltip-box-title">{{ title || params.title}}</div>
 
     <div
       v-if="params.chartType === 'text'"
     >
-      {{params.content}}
+      {{content || params.content}}
     </div>
     <panelChart
       v-else
@@ -39,7 +39,10 @@ export default {
   },
   data () {
     return {
-      chartInfo: { ...defaultLineData, loaded: false }
+      chartInfo: { ...defaultLineData, loaded: false },
+      dataSource: {},
+      title: '',
+      content: ''
     }
   },
   mounted () {
@@ -56,7 +59,13 @@ export default {
         this.chartInfo.id = this.meta2dId + 'meta2DTooltip'
         const chartData = []
         const elements = []
-        const obj = {}
+        const source = this.queryValues.find(query => query.name === this.params.legend && query.parent === this.params.parent)
+        if (source) {
+          this.dataSource = source
+          console.log(this.params.title, this.dataSource.elements.expression, this.dataSource.metric)
+          this.title = this.handleLegendAlias(this.params.title, this.params.title, this.dataSource.metric) || this.params.title
+          this.content = this.handleLegendAlias(this.params.content, this.params.content, this.dataSource.metric) || this.params.content
+        }
         this.params.legends.forEach(item => {
           const findItem = this.queryValues.find(query => query.name === item.legend && query.parent === item.parent)
           // if (findItem) {
@@ -94,6 +103,8 @@ export default {
         }
       }
     }
+  },
+  methods: {
   }
 }
 </script>