fix:model table singleStat图表报错修复

nezha-fronted/src/assets/stylus/main.scss

@@ -1058,7 +1058,7 @@ li{
   position: absolute;
   right: 0;
 }
-.config-dropdown, .chart-box-dropdown, .chart-box-dropdown-mini, .metric-dropdown {
+.config-dropdown, .chart-box-dropdown, .chart-box-dropdown-mini,.chart-box-dropdown-small, .metric-dropdown {
   z-index: 2950 !important;
 }
 .dc-dropdown {
@@ -1105,6 +1105,9 @@ li{
 .chart-box-dropdown-mini{
   width: 110px;
 }
+.chart-box-dropdown-small{
+  width: 200px;
+}
 .config-dropdown-btn i {
   font-size: 12px;
 }

nezha-fronted/src/components/charts/chart-list.vue

@@ -1124,26 +1124,30 @@ export default {
     },
     modelStaticData(chartInfo, filterType) {
       let series = [];
+      let legend = [];
+      let tableData = [];
+      let singleStatRlt = 999;
+      if (chartInfo.type === 'singleStat') {
+          let statistics = chartInfo.param.statistics;
+      } else {
         let seriesItem = {
           theData: {
             name: '',
-          symbol:'emptyCircle',  //去掉点
-          symbolSize:[2,2],
-          smooth:0.2,  //曲线变平滑
-          showSymbol:false,
+            symbol: 'emptyCircle',  //去掉点
+            symbolSize: [2, 2],
+            smooth: 0.2,  //曲线变平滑
+            showSymbol: false,
             data: [],
-          type:chartInfo.type,
+            type: chartInfo.type,
           },
           //visible: true,
           //threshold: null,
           metric_name: '',
         };
-      let legend = [];
-      let tableData = [];
-      if(chartInfo.type === 'stackArea'){
-        seriesItem.theData.type='line';
-        seriesItem.theData.stack=chartInfo.title;
-        seriesItem.theData.areaStyle={"opacity": 0.3};
+        if (chartInfo.type === 'stackArea') {
+          seriesItem.theData.type = 'line';
+          seriesItem.theData.stack = chartInfo.title;
+          seriesItem.theData.areaStyle = {"opacity": 0.3};
         }
         // 图表中每条线的名字,后半部分
         let host = 'host';//up,
@@ -1152,28 +1156,29 @@ export default {
         // 设置时间-数据格式对
         let tempArr = [];
         let dpsArr = [];
-      let timeStamp = Math.floor(new Date().getTime()/1000);
+        let timeStamp = Math.floor(new Date().getTime() / 1000);
         for (let i = 0; i < 20; i++) {
-        tempArr.push([timeStamp - (20-i)*15, Math.floor(Math.random()*10) + ""]);
+          tempArr.push([timeStamp - (20 - i) * 15, Math.floor(Math.random() * 10) + ""]);
           queryItem.values.push(tempArr[i])
-        dpsArr.push([i+"", tempArr[i]]);
+          dpsArr.push([i + "", tempArr[i]]);
         }
         // 判断是否有数据, && tagsArr.length > 0
-      if (dpsArr.length > 0 && this.$refs['editChart'+chartInfo.id]  && this.$refs['editChart'+chartInfo.id].length>0) {
+        if (dpsArr.length > 0 && this.$refs['editChart' + chartInfo.id] && this.$refs['editChart' + chartInfo.id].length > 0) {
           tagsArr.forEach((tag, i) => {
             if (tag !== '__name__') {
               host += `${tag}="${queryItem.metric[tag]}",`;
             }
           });
-        if(queryItem.metric.__name__){
-          host +="}";
+          if (queryItem.metric.__name__) {
+            host += "}";
           }
           //处理legend别名
-        let alias=this.$refs['editChart'+chartInfo.id][0].dealLegendAlias(host,chartInfo.elements[0].legend);
-        if(!alias || alias===''){
+          console.log(this.$refs['editChart' + chartInfo.id])
+          let alias = this.$refs['editChart' + chartInfo.id][0].dealLegendAlias(host, chartInfo.elements[0].legend);
+          if (!alias || alias === '') {
             alias = host;
           }
-        legend.push({name:host, alias:alias});
+          legend.push({name: host, alias: alias});
           // 图表中每条线的名字,去掉最后的逗号与空格:metric名称,  标签1=a,标签2=c
           seriesItem.theData.name = host;
           //alert(seriesItem.theData.name);
@@ -1194,7 +1199,7 @@ export default {
             tableData.push({//表格数据
               // label: host.slice(host.indexOf('{') + 1,host.indexOf('}')),//label
               // metric: queryItem.metric.__name__?queryItem.metric.__name__:'',//metric列
-            element:{element:host,alias:alias},
+              element: {element: host, alias: alias},
               time: timeTmp,//采集时间
               value: dpsItem[1],//数值
             });
@@ -1214,7 +1219,7 @@ export default {
         });
         */
         }
-      let singleStatRlt = 999;
+      }
       if (this.$refs['editChart' + chartInfo.id] && this.$refs['editChart' + chartInfo.id].length > 0) {
         let errorMsg = '';
         let chartData = {
@@ -1234,7 +1239,7 @@ export default {
             this.$refs['editChart' + chartInfo.id][0].setData(chartInfo, tableData,
               this.filter.panelId, this.filter, filterType, '');
           } else {
-            this.$refs['editChart' + chartItem.id][0].setData(chartInfo, tableData,
+            this.$refs['editChart' + chartInfo.id][0].setData(chartInfo, tableData,
               this.filter.panelId, this.filter, '', '');
           }
         } else if (chartInfo.type === 'line' || chartInfo.type === 'bar' || chartInfo.type === 'stackArea' || chartInfo.type === 4) {

nezha-fronted/src/components/common/language/cn.js

@@ -155,6 +155,12 @@ const cn = {
         legend: "图例",
         legendTip: "使用名称或表达式控制时间序列的名称。例如{{hostname}将替换为标签主机名的标签值。",
         option: "操作",
+        alertParam:{
+          select:'选择',
+          alertRule:'告警规则',
+          level:'级别',
+          state:'状态'
+        }
       },
       chartTableColumn: {
         metric: "指标",

nezha-fronted/src/components/common/language/en.js

@@ -146,6 +146,9 @@ const en = {
           },
           singleStat:{
             label:"SingleStat"
+          },
+          alertInfo:{
+            label:"Alert information"
           }
         },
         statisticsVal:{
@@ -163,6 +166,13 @@ const en = {
         metric:'Metric', //"指标"
         option:'Option',
         addMetric:'Add metric', //"添加指标"
+        alertParam:{
+          param:'Parameters',
+          select:'Select',
+          alertRule:'Alert rule',
+          level:'Level',
+          state:'State'
+        }
       },
       chartTableColumn:{
         metric:'Metric', //'指标'