From 39ea49edce74ae063ca0afd9b2966f861e256a3e Mon Sep 17 00:00:00 2001 From: fengxiang <110431245@qq.com> Date: Tue, 17 Apr 2018 13:18:36 +0800 Subject: [PATCH] ts fix,组织报警间隔时间设置 --- src/app/routes/report/report.component.ts | 170 ++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 132 insertions(+), 38 deletions(-) diff --git a/src/app/routes/report/report.component.ts b/src/app/routes/report/report.component.ts index 32699da..ac0270b 100644 --- a/src/app/routes/report/report.component.ts +++ b/src/app/routes/report/report.component.ts @@ -2,7 +2,6 @@ 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'; @@ -13,22 +12,11 @@ }) export class ReportComponent implements OnInit { - constructor( - public injector: Injector, - public http: HttpClient, - public activeRoute: ActivatedRoute, - public msgSrv: NzMessageService - ) { - for (let index = 0; index < 30; index++) { - this.sensorArr.push(index); - } - } - [x: string]: any; - public spinning: boolean = true; + public spinning = true; - public echartOption = { + private echartOption = { backgroundColor: '', title: { text: '', @@ -72,30 +60,125 @@ series: [] }; - sensorArr: any = []; - items: any = []; - timeType: any = {}; - title: string; - timeArr = ['���', '���', '���', '���', '���']; - ngOnInit() { + public sensorArr: any = []; + public items: any = []; + public title: string; + private timeArr = ['���', '���', '���', '���', '���']; + public typeArr = ['year', 'month', 'day', 'hour']; + constructor( + public injector: Injector, + public http: HttpClient, + public msgSrv: NzMessageService + ) { + for (let index = 0; index < 30; index++) { + this.sensorArr.push(index); + } + } - this.activeRoute.queryParams.subscribe(params => { + private pieCharOption: any = { + title: { + text: 'AQI������������������������', + x: 'center' + }, + tooltip: { + trigger: 'item', + formatter: '{a} <br/>{b}: {c} ({d}%)' + }, + legend: { + // x : 'center', + top: '10%', + data: ['PM 2.5', 'PM 10', '���������������CO���', '���������������SO������', '���������O������', '���������������NO������'] + }, + graphic: [{ + type: 'text', + left: '24%', + top: '49%', + style: { + text: '������������' + } + }, { + type: 'text', + left: '74%', + top: '49%', + style: { + text: '{b}' + } + } + ], + series: [ + { + name: '������������', + type: 'pie', + radius: ['30%', '50%'], + center: ['25%', '50%'], + label: { + normal: { + formatter: '{b}:{d}%' + } + }, + labelLine: { + normal: { + show: true + } + }, + data: [ + {value: 100, name: 'PM 2.5'}, + {value: 100, name: 'PM 10'}, + {value: 200, name: '���������������CO���'}, + {value: 200, name: '���������������SO������'}, + {value: 100, name: '���������O������'}, + {value: 100, name: '���������������NO������'} + ] + }, + { + name: '������������', + type: 'pie', + radius: ['30%', '50%'], + center: ['75%', '50%'], + label: { + normal: { + formatter: '{b}:{d}%', + } + }, + labelLine: { + normal: { + show: true, + } + }, + data: [ + {value: 0, name: 'PM 2.5'}, + {value: 0, name: 'PM 10'}, + {value: 100, name: '���������������CO���'}, + {value: 100, name: '���������������SO������'}, + {value: 100, name: '���������O������'}, + {value: 100, name: '���������������NO������'} + + ] + } + ] + }; + + ngOnInit() { + const params = JSON.parse(sessionStorage.getItem('queryParams')); + if (!!params) { + localStorage.removeItem('queryParams'); const items = this.items = JSON.parse(params.items); - const timeType = this.timeType = JSON.parse(params.timeType); + 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 = timeType.xAxisName; + 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++) { const sensorKey = sensors[index]; const split = sensorKey.split('-'); - option.title.text = split[1] + timeType.label + '������������'; + option.title.text = split[1] + label + '������������'; option.yAxis.name = split[2] && split[2] !== 'null' ? '������:' + split[2] : ''; option.series = []; option.legend.data = []; @@ -106,14 +189,17 @@ } for (let i = 0; i < items.length; i++) { this.title = items[i].formatTime; - const legendName = items[i].formatTime + timeType.label + (items[i].mac ? items[i].deviceName : items[i].monitorPointName); + items[i].deviceCount = deviceCounts[i]; + if (!items[i].monitorPointid) { + items[i].monitorPointName = items[i].areaName; + } + const legendName = items[i].formatTime + label + (items[i].mac ? '������:' + items[i].deviceName : (items[i].monitorPointid ? '���������:' + items[i].monitorPointName : items[i].areaName)); option.legend.data[i] = legendName; - const seriesData = datas[i]['data' + i][0][sensorKey]; option.series.push({ - data: seriesData, - smooth: true, - type: params.reportType, name: legendName, + data: res.data.datas[i][sensorKey], + type: params.reportType, + smooth: true, itemStyle: { normal: { barBorderRadius: [10, 10, 10, 10] @@ -130,17 +216,25 @@ $('#mydiv' + i).remove(); } }); - $('#content').attr({style: "display: inline;"}); this.spinning = false; - const title = this.title.replace(' ', '-').split('-'); + const title: any[] = this.title.replace(' ', '-').split('-'); this.title = ''; for (let i = 0; i < title.length; i++) { - if (i < 3) { - this.title = this.title + title[i] + this.timeArr[i]; - } + this.title += title[i] + timeArr[i]; } + 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; } }); - }); + } else { + this.msgSrv.error('������������������������������������'); + setTimeout('window.close();', 1000); + } } } -- Gitblit v1.8.0