perf: 优化endpoint-info小图

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

@@ -481,8 +481,6 @@ export default {
         immediate:true,
         handler(n,o){
           this.data=Object.assign({},n)
-          this.data.resizable=true;
-          this.data.editable=true;
         }
       },
       panelId:{

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

@@ -163,7 +163,7 @@
                         <div class="item-tip-hide item-tip-key el-popover" :class="itemTip(`key-${index}`, key, i, ready)">{{endpointKey[key]}}</div>
                       </div>
                       <div class="content-item-value item-tip" :id="`value-${index}-${i}`">
-                        <template v-if="key == 'state'"><div id="littleChart" style="cursor: pointer; height: 80px;" @click="preview"></div></template>
+                        <template v-if="key == 'state'"><div id="littleChart" style="cursor: pointer; height: 26px; width: 60px;" @click="preview"></div></template>
                         <template v-else-if="endpointKey[key]">
                           <span class="content-text">{{value ? value : "&nbsp;"}}</span>
                           <div class="item-tip-hide item-tip-value el-popover" :class="itemTip(`value-${index}`, key, i, ready)">{{value}}</div>
@@ -432,12 +432,16 @@
       initChart(series) {
         let option = {
           title: {show: false},
-          grid: {left: 40},
+          grid: {top: 20, bottom: 20},
           tooltip: {
             show: true,
             trigger: "axis",
             extraCssText: 'z-index:3100;',
-            position: [0, '50%'],
+            position: [100, 1],
+            textStyle: {
+              fontSize: 12,
+            },
+            padding: 3,
             formatter: function(param) {
               let time = param[0].data[0];
               time = bus.computeTimezone(time);
@@ -461,19 +465,23 @@
             show: false,
             type: 'time'
           },
-          /*visualMap: {
-            show: false,
-            dimension: 1,
-            pieces: [],
-            outOfRange: {
-              color: 'green'
-            }
-          },*/
           yAxis: {
             type: 'value',
             show: false
           },
           useUTC: false,//使用本地时间
+          visualMap: {
+            show: false,
+            pieces: [{
+              gt: -0.5,
+              lt: 0.5,
+              color: '#d64f40'
+            }, {
+              gt: 0.6,
+              lt: 1.5,
+              color: '#50d050'
+            }]
+          },
           series: series
         };
         let chart = echarts.init(document.querySelector("#littleChart"));

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

@@ -554,8 +554,8 @@
             id: -8,
             panelId: 0,
             title: this.$t("alert.alertList"),
-            span: 12,
-            height: 350,
+            span: 8,
+            height: 700,
             type: "alertList",
             prev: -9,
             next: -1,
@@ -606,7 +606,6 @@
           });
           return;
         }
-
         if (!param.query) delete param.query;
         //根据panelId获得panel下的所有图表
         this.$get('panel/'+ params.panelId+'/charts').then(response => {
@@ -650,6 +649,10 @@
                       this.$set(item, "draggable", true);
                       this.$set(item, "resizable", true);
                     }
+                  } else if (!param.from) {
+                    this.$set(item, "draggable", true);
+                    this.$set(item, "resizable", true);
+                    this.$set(item, "editable", true);
                   }
                   if(!item.isLoaded){
                     //获得当前显示在浏览器的图表，从后台获取数据
@@ -1210,16 +1213,15 @@
                   let series = {
                     name: '',
                     symbol: 'emptyCircle',  //去掉点
-                    symbolSize: 6,
+                    symbolSize: 4,
                     smooth: 0.2,  //曲线变平滑
-                    showSymbol: true,
+                    showSymbol: false,
                     data: [],
                     type: "line",
                     lineStyle: {
                       width: 1,
                       opacity: 0.9
                     },
-                    label: {show: true},
                     itemStyle: {
                       color: function(params) {
                         if (params.data[1] == "1") {
@@ -1420,12 +1422,12 @@
                 if (response.data.project && response.data.project.length > 0) {
                   detail.push({title: vm.$t("project.project.project"), data: convert(response.data.project)});
                 }
-                if (response.data.module && response.data.module.length > 0) {
+                /*if (response.data.module && response.data.module.length > 0) {
                   detail.push({title: vm.$t("project.module.module"), data: convert(response.data.module)});
                 }
                 if (response.data.endpoint && response.data.endpoint.length > 0) {
                   detail.push({title: vm.$t("project.endpoint.endpoint"), data: convert(response.data.endpoint)});
-                }
+                }*/
                 if (response.data.asset && response.data.asset.length > 0) {
                   detail.push({title: vm.$t("asset.asset"), data: convert(response.data.asset)});
                 }
@@ -1435,6 +1437,7 @@
           });
         });
         req.then(result => {
+          console.info(detail);
           this.$refs['editChart'+chartInfo.id][0].setData(chartInfo, detail);
         }, err => {});