NEZ-1390 feat: endpoint metric info 图标 hover 显示 metadata

nezha-fronted/src/components/common/metaData.vue

@@ -1,12 +1,10 @@
 <template>
  <div>
    <ul>
-     <li><span class="metric-tip-list">metric&nbsp;:&nbsp;</span><span>{{metricTip ? metricTip : '--'}}</span></li>
-   </ul>
-   <ul v-for="(item,index) in metaDataList" :key="index">
-     <li><span class="metric-tip-list">type&nbsp;:&nbsp;</span><span>{{item.type ? item.type : 'unknown'}}</span></li>
-     <li><span class="metric-tip-list">help&nbsp;:&nbsp;</span><span>{{item.help ? item.help : '--'}}</span></li>
-     <li><span class="metric-tip-list">unit&nbsp;:&nbsp;</span><span>{{item.unit ? item.unit : '--'}}</span></li>
+     <li><span class="metric-tip-list">metric&nbsp;:&nbsp;</span><span>{{metaName ? metaName : '--'}}</span></li>
+     <li><span class="metric-tip-list">help&nbsp;:&nbsp;</span><span>{{metricList.help}}</span></li>
+     <li><span class="metric-tip-list">type&nbsp;:&nbsp;</span><span>{{metricList.type}}</span></li>
+     <li><span class="metric-tip-list">unit&nbsp;:&nbsp;</span><span>{{metricList.unit}}</span></li>
    </ul>
  </div>
 </template>
@@ -16,10 +14,22 @@ export default {
   name: 'metaData',
   props: {
     metaDataList: Array,
-    metricTip: String
+    metaName: String
   },
   data () {
-    return {}
+    return {
+      metricList: {}
+    }
+  },
+  watch: {
+    metaDataList: {
+      deep: true,
+      handler (n) {
+        if (n) {
+          this.metricList = n[0]
+        }
+      }
+    }
   }
 }
 </script>

nezha-fronted/src/components/common/table/special/endpointQueryTab.vue

@@ -25,7 +25,7 @@
         :label="$t('project.endpoint.element')">
         <template v-slot="scope">
           <el-popover trigger="hover" placement="right">
-            <meta-data :metaDataList="metaDataList" :metricTip="scope.row.metricTip.metric" />
+            <meta-data :metaDataList="metaDataList" :metaName="scope.row.metricTip.metric" />
             <span slot="reference"><i @mouseover="metricMetaData(scope.row)" class="nz-icon nz-icon-info-normal metric-tip-icon"></i></span>
           </el-popover>
           <span style="word-break: break-all;" v-html="hideSameLabels?scope.row.colorSimpleElement: scope.row.colorElement"></span>
@@ -149,8 +149,7 @@ export default {
         pageNo: 1,
         total: 0
       },
-      metaDataList: [],
-      metaName: ''
+      metaDataList: []
     }
   },
   methods: {
@@ -552,7 +551,9 @@ export default {
     },
     metricMetaData (data) {
       this.$get('/prom/api/v1/metadata?' + 'metric=' + data.metricTip.metric + '&limit=' + 1).then(res => {
-        this.metaDataList = res.data.jvm_gc_live_data_size_bytes
+        if (res.code === 200) {
+          this.metaDataList = res.data[data.metricTip.metric]
+        }
       })
     }
   },