From fdde9a5cb356933bac26b64b67b53167ce2f41bd Mon Sep 17 00:00:00 2001
From: xufenglei <xufenglei>
Date: Thu, 17 May 2018 10:03:29 +0800
Subject: [PATCH] 行业 优化

---
 src/app/routes/report/report.component.ts |  254 ++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 191 insertions(+), 63 deletions(-)

diff --git a/src/app/routes/report/report.component.ts b/src/app/routes/report/report.component.ts
index 25e5f9c..85643f5 100644
--- a/src/app/routes/report/report.component.ts
+++ b/src/app/routes/report/report.component.ts
@@ -2,23 +2,19 @@
 import {NzMessageService, NzModalService} from 'ng-zorro-antd';
 import {Component, OnInit, Injector} from '@angular/core';
 import {HttpClient} from '@angular/common/http';
-import {ActivatedRoute} from '@angular/router';
 import * as echarts from 'echarts';
 import * as $ from 'jquery';
 
 @Component({
   selector: 'app-report',
   templateUrl: './report.component.html',
-  styles: []
+  styleUrls: ['./report.component.css']
+
 })
 export class ReportComponent implements OnInit {
-  [x: string]: any;
-
-  spinning: boolean = true;
   constructor(
     public injector: Injector,
     public http: HttpClient,
-    public activeRoute: ActivatedRoute,
     public msgSrv: NzMessageService
   ) {
     for (let index = 0; index < 30; index++) {
@@ -26,7 +22,12 @@
     }
   }
 
-  public echartOption = {
+  [x: string]: any;
+
+  public spinning = true;
+
+  private echartOption = {
+    backgroundColor: '',
     title: {
       text: '',
       // subtext: '12������',
@@ -38,21 +39,10 @@
     legend: {
       data: [],
       orient: 'vertical',
-      right: 40,
+      right: 30,
       top: 5,
-      bottom: 20
-    },
-    toolbox: {
-      show: false,
-      feature: {
-        dataZoom: {
-          yAxisIndex: 'none'
-        },
-        dataView: {readOnly: false},
-        magicType: {type: ['line', 'bar']},
-        restore: {},
-        saveAsImage: {}
-      }
+      bottom: 20,
+      type: 'scroll'
     },
     xAxis: {
       type: 'category',
@@ -65,70 +55,208 @@
       name: ''
 
     },
-    series: [
-      //      {
-      //        smooth: true,
-      //        type: 'line',
-      //        data: [],
-      //        name: '',
-      //        itemStyle: {
-      //          normal: {
-      //            barBorderRadius: [10, 10, 10, 10]
-      //          }
-      //        }
-      //      }
-    ]
+    series: []
   };
 
-  sensorArr: any = [];
-  
+  public sensorArr: any = [];
+  public resultArr: any = [];
+  public items: any = [];
+  public title: string;
+  private timeArr = ['���', '���', '���', '���', '���'];
+  public typeArr = ['year', 'month', 'day', 'hour'];
+  public sensorKeys: any = [
+    {key: 'e1', name: 'PM 2.5', effect: 'PM2.5������������������������������������������������������������������������������������', measures: '������������������������������������������������������������������������������������'},
+    {key: 'e2', name: 'PM 10', effect: '���������PM10������������������������������������������������������������������������������������', measures: '���������������������������������������������������������������������������������������'},
+    {key: 'e10', name: '���������������CO���', effect: '���������������������������������������������������������������������������������������', measures: '������������������������������������������'},
+    {key: 'e11', name: '���������������SO������', effect: '������������������������������������������������������������������������������������', measures: '������������������������������������������������������������������������������������������������������������������SO2'},
+    {key: 'e15', name: '���������O������', effect: '������������������������ ������������������������������������������������������������������������������', measures: '������������������������������������'},
+    {key: 'e16', name: '���������������NO������', effect: '���������������������������������������������������������������������������������������', measures: '���������������������������������(���������)������������������������������������������'}
+  ];
+
+  private pieCharOption: any = {
+    title: {
+      text: 'AQI������������������������',
+      x: 'center'
+    },
+    tooltip: {
+      trigger: 'item',
+      formatter: '{a} <br/>{b}: {c} ({d}%)'
+    },
+    legend: {
+      // x : 'center',
+      top: '10%',
+      data: []
+    },
+    graphic: [],
+    series: []
+  };
+  public isShow = true;
   ngOnInit() {
-    
-    this.activeRoute.queryParams.subscribe(params => {
-      const items = JSON.parse(params.items);
-      const query = params;
-      this.http.get(environment.SERVER_BASH_URL + 'report/compare', {params: query}).subscribe((res: any) => {
+    const params = JSON.parse(sessionStorage.getItem('queryParams'));
+    if (!!params) {
+      localStorage.removeItem('queryParams');
+      const items = this.items = JSON.parse(params.items);
+      const timeType = params.type;
+      this.http.get(environment.SERVER_BASH_URL + 'report/compare', {params: params}).subscribe((res: any) => {
         if (res.code === 0) {
           this.msgSrv.error(res.message);
         } else {
           const option = this.echartOption;
-          const datas = res.data.datas;
-          const times = res.data.times
-          const sensors = res.data.sensors
-          option.xAxis.data = times;
-          option.xAxis.name = query.xAxisName;
+          const sensors = res.data.sensors;
+          const deviceCounts = res.data.deviceCounts;
+          const timeArr = this.timeArr;
+          const label = timeArr[this.typeArr.indexOf(timeType)];
+          option.xAxis.data = res.data.times;
+          option.xAxis.name = timeArr[timeArr.indexOf(label) + 1];
           for (let index = 0; index < sensors.length; index++) {
-            let sensorKey = sensors[index];
-            let split = sensorKey.split('-');
-            option.title.text = split[1] + query.label + '������������';
-            option.yAxis.name = split[2] && split[2] != 'null' ? split[2] : '';
+            const sensorKey = sensors[index];
+            const split = sensorKey.split('-');
+            option.title.text = split[1] + label + '������������';
+            option.yAxis.name = split[2] && split[2] !== 'null' ? '������:' + split[2] : '';
             option.series = [];
             option.legend.data = [];
-
+            if (index % 2 === 0) {
+              option.backgroundColor = 'rgba(0,0,0,0)';
+            } else {
+              option.backgroundColor = 'rgba(23,133,23,0.06)';
+            }
             for (let i = 0; i < items.length; i++) {
-              const legendName = items[i].formatTime + query.label + (items[i].mac ? items[i].deviceName : items[i].monitorPointName);
-              option.legend.data[i] = legendName;
-              const seriesData = datas[i]['data' + i][0][sensorKey];
-              option.series.push({
-                data: seriesData,
-                smooth: true,
-                type: 'line',
-                name: legendName
-              });
+              this.title = items[i].formatTime;
+              items[i].deviceCount = deviceCounts[i];
+              /* if (!(items[i].monitorPointId)) {
+                items[i].monitorPointName = items[i].areaName;
+              } */
+              const showName = this.items[i].showName = 
+                items[i].mac ? ('������:' + items[i].deviceName) : 
+                  ((items[i].monitorPointId ? '���������:' + items[i].monitorPointName : items[i].areaName) + (items[i].professionName ? items[i].professionName : ''));
+              const legendName = items[i].formatTime + label + showName;
+              items[i].legendName = option.legend.data[i] = legendName;
+              if (res.data.datas[i][sensorKey]) {
+                option.series.push({
+                  name: legendName,
+                  data: res.data.datas[i][sensorKey],
+                  type: params.reportType,
+                  smooth: true,
+                  itemStyle: {
+                    normal: {
+                      barBorderRadius: [10, 10, 10, 10]
+                    }
+                  }
+                });
+              }
             }
             const myChart = echarts.init(document.getElementById('mydiv' + index));
             myChart.setOption(option, true);
             window.onresize = myChart.resize;
+            if (option.series.length < 1) {
+              $('#mydiv' + index).remove();
+            }
           }
           this.sensorArr.forEach(i => {
             if (i >= sensors.length) {
               $('#mydiv' + i).remove();
             }
           });
-          $('#content').attr({style:"display: inline;"});
+          this.spinning = false;
+          if (!this.title) {
+            this.title = items[0].formatTime;
+          }
+          const title: any[] = this.title.replace(' ', '-').split('-');
+          this.title = '';
+          for (let i = 0; i < title.length; i++) {
+            this.title += title[i] + timeArr[i];
+          }
+
+          if ((params.type === 'month' || params.type === 'year') && res.data.sortList.length > 0) {
+            let center = ['50%', '50%'];
+            let left = '40%';
+            const length = items.length;
+            const alarmDatas = res.data.alarmDatas;
+            for (let i = 0; i < length; i++) {
+              this.pieCharOption.legend.data = [];
+              const data = [];
+              this.sensorKeys.forEach(sensorKey => {
+                this.pieCharOption.legend.data.push(sensorKey.name);
+                if (alarmDatas[i]) {
+                  data.push({
+                    name: sensorKey.name,
+                    value: alarmDatas[i][sensorKey.key]
+                  });
+                }
+              });
+              if (length === 2) {
+                if (i === 0) {
+                  center = ['25%', '50%'];
+                  left = '15%';
+                } else {
+                  center = ['75%', '50%'];
+                  left = '65%';
+                }
+              }
+              this.pieCharOption.series.push({
+                name: items[i].monitorPointName,
+                type: 'pie',
+                radius: ['20%', '40%'],
+                center: center,
+                label: {
+                  normal: {
+                    formatter: '{b}:{d}%'
+                  }
+                },
+                labelLine: {
+                  normal: {
+                    show: true
+                  }
+                },
+                data: data
+              });
+              this.pieCharOption.graphic.push({
+                type: 'text',
+                left: left,
+                top: '20%',
+                style: {
+                  text: items[i].legendName
+                }
+              });
+            }
+
+            if (sensors.length % 2 === 0) {
+              this.pieCharOption.backgroundColor = 'rgba(0,0,0,0)';
+            } else {
+              this.pieCharOption.backgroundColor = 'rgba(23,133,23,0.06)';
+            }
+            const myChart = echarts.init(document.getElementById('pieChar'));
+            myChart.setOption(this.pieCharOption, true);
+            window.onresize = myChart.resize;
+
+            for (let i = 0, j = res.data.sortList.length; i < j; i++) {
+              if (i < 5) {
+                for (const key in res.data.sortList[i]) {
+                  const split = key.split('-');
+                  this.sensorKeys.forEach(sensor => {
+                    if (sensor.key === split[0] && res.data.sortList[i][key] != 0) {
+                      this.resultArr.push({
+                        sensorName: sensor.name,
+                        monitorPointName: this.items[split[1]].showName,
+                        result: res.data.sortList[i][key] + '%',
+                        effect: sensor.effect,
+                        measures: sensor.measures
+                      });
+                    }
+
+                  });
+                }
+              }
+            }
+          } else {
+            $('#pieChar').remove();
+            this.isShow = false;
+          }
         }
-        this.spinning = false;
       });
-    });
+    } else {
+      this.msgSrv.error('������������������������������������');
+      setTimeout('window.close();', 1000);
+    }
   }
 }

--
Gitblit v1.8.0