主题切换相关优化 (#331)

* angel-kanade模版增加主题切换功能

* Add files via upload

* 调整legend图例间距

* 渲染方式调整会canvas

* Update home.html

* Add files via upload

* Add files via upload

* Update footer.html

* Add files via upload

* Add files via upload

* 消除echarts折线上无效的0值

* 消除echarts折线的0值,替换为平均值

* 消除echarts折线图上的0值

* 修复MaxTCPPingValue取值错误

resource/template/theme-default/home.html

@@ -185,7 +185,7 @@
       },
       renderCharts(id) {
         if (!this.chartDataList[id - 1]) return;
-        const MaxTCPPingValue = {{.MaxTCPPingValue}} ? {{.MaxTCPPingValue}} : 300;
+        const MaxTCPPingValue = {{.Conf.MaxTCPPingValue}} ? {{.Conf.MaxTCPPingValue}} : 300;
         const isMobile = this.checkIsMobile();
         const fontSize = isMobile ? 10 : 9;
         const itemGap = isMobile ? 6 : 6;
@@ -207,11 +207,13 @@
         const xAxisData = chartData[0].created_at.map(time => new Date(time).toLocaleString());
         const seriesData = chartData.map(item => {
           let loss = 0;
-          const data = item.avg_delay.map((avgDelay, index) => {
-            if (avgDelay > 0.9 * MaxTCPPingValue) {
+          const data = item.avg_delay.map((avgDelay, index) => {                        
+            if(avgDelay > 0 && avgDelay < MaxTCPPingValue){
+              loss += avgDelay > 0.9 * MaxTCPPingValue ? 1 : 0;
+              return [item.created_at[index], avgDelay];
+            }else{
               loss += 1;
             }
-            return [item.created_at[index], avgDelay];
           });
           const lossRate = ((loss / item.created_at.length) * 100).toFixed(1);
           item.monitor_name = item.monitor_name.includes("%") ? item.monitor_name : `${item.monitor_name} ${lossRate}%`;
@@ -220,7 +222,8 @@
             type: 'line',
             smooth: true,
             symbol: 'none',
-            data: data
+            data: data,
+            connectNulls: true
           };
         });
         const option = {