From 79851e40e4da7fdbb14d0b729d01f710cf6d7fb0 Mon Sep 17 00:00:00 2001 From: xufenglei <xufenglei> Date: Wed, 07 Mar 2018 08:51:49 +0800 Subject: [PATCH] 报表 优化 --- src/app/routes/report/report.component.html | 2 src/app/routes/report/report.component.ts | 35 ++++++++--------- src/app/routes/reports/demo/demo.component.ts | 37 ++++++++---------- src/app/routes/routes-routing.module.ts | 3 + src/app/routes/reports/demo/demo.component.html | 2 5 files changed, 37 insertions(+), 42 deletions(-) diff --git a/src/app/routes/report/report.component.html b/src/app/routes/report/report.component.html index 3873886..c779396 100644 --- a/src/app/routes/report/report.component.html +++ b/src/app/routes/report/report.component.html @@ -1,5 +1,5 @@ <div *ngFor="let i of sensorArr"> - <div id ="mydiv{{i}}" style="height: 487px; width: 1000px"></div> + <div id ="mydiv{{i}}" style="height: 486px; width: 1000px"></div> </div> diff --git a/src/app/routes/report/report.component.ts b/src/app/routes/report/report.component.ts index 4ed6d86..f898999 100644 --- a/src/app/routes/report/report.component.ts +++ b/src/app/routes/report/report.component.ts @@ -20,7 +20,7 @@ public activeRoute: ActivatedRoute, public msgSrv: NzMessageService ) { - for (let index = 0; index < 19; index++) { + for (let index = 0; index < 30; index++) { this.sensorArr.push(index); } } @@ -36,7 +36,10 @@ }, legend: { data: [], - left: 'left' + orient: 'vertical', + right: 40, + top: 5, + bottom: 20 }, toolbox: { show: false, @@ -77,8 +80,7 @@ }; sensorArr: any = []; - arr = new Array(); - + ngOnInit() { this.activeRoute.queryParams.subscribe(params => { const items = JSON.parse(params.items); @@ -88,24 +90,23 @@ this.msgSrv.error(res.message); } else { const option = this.echartOption; - const data = res.data.data; - const time = res.data.time - let index = 0; - option.xAxis.data = time; + const datas = res.data.datas; + const times = res.data.times + const sensors = res.data.sensors + option.xAxis.data = times; option.xAxis.name = query.xAxisName; - - for (const key in data[0].data0[0]) { - this.arr.push(index); - let split = key.split('-'); + 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]; + option.yAxis.name = split[2] && split[2] != 'null' ? split[2] : ''; option.series = []; option.legend.data = []; for (let i = 0; i < items.length; i++) { - const legendName = (items[i].mac ? items[i].mac : items[i].monitorPoint) + items[i].formatTime + query.label; + const legendName = items[i].formatTime + query.label + (items[i].mac ? items[i].deviceName : items[i].monitorPointName); option.legend.data[i] = legendName; - const seriesData = data[i]['data' + i][0][key]; + const seriesData = datas[i]['data' + i][0][sensorKey]; option.series.push({ data: seriesData, smooth: true, @@ -116,11 +117,9 @@ const myChart = echarts.init(document.getElementById('mydiv' + index)); myChart.setOption(option, true); window.onresize = myChart.resize; - index++; } - this.sensorArr.forEach(i => { - if (this.arr.indexOf(i) == -1) { + if (i >= sensors.length) { $('#mydiv' + i).remove(); } }); diff --git a/src/app/routes/reports/demo/demo.component.html b/src/app/routes/reports/demo/demo.component.html index 3216e96..ed8b01c 100644 --- a/src/app/routes/reports/demo/demo.component.html +++ b/src/app/routes/reports/demo/demo.component.html @@ -8,7 +8,7 @@ <label> ��� ���</label> </div> <div nz-form-control class="flex-1"> - <nz-select [(ngModel)]="query.sensorKey" name="sensorKey" [nzSize]="'large'" [nzPlaceHolder]="'���������'" (ngModelChange)="sensorChange($event)" nzAllowClear> + <nz-select [(ngModel)]="query.sensorKey" name="sensorKey" [nzSize]="'large'" [nzPlaceHolder]="'���������'" nzAllowClear> <nz-option *ngFor="let option of sensorOptions" [nzLabel]="option.name" [nzValue]="option.sensorKey" ></nz-option> </nz-select> </div> diff --git a/src/app/routes/reports/demo/demo.component.ts b/src/app/routes/reports/demo/demo.component.ts index 41abb54..5060607 100644 --- a/src/app/routes/reports/demo/demo.component.ts +++ b/src/app/routes/reports/demo/demo.component.ts @@ -81,7 +81,7 @@ if (value) { this.monitorPointOptions.forEach(monitorPoint => { if (monitorPoint.id === value) { - this.monitorPoint = monitorPoint; + this.items[i].monitorPointName = monitorPoint.name; } }); this.http.get(environment.SERVER_BASH_URL + 'device/monitorPointId', {params: {monitorPointId: value}}).subscribe((res: any) => { @@ -94,17 +94,19 @@ } else { this.items[i].monitorPoint = null; this.items[i].mac = ''; + this.items[i].monitorPointName = ''; } } deviceChange(value, i) { - this.device = null; if (value) { this.deviceOptions.forEach(device => { if (device.mac === value) { - this.device = device; + this.items[i].deviceName = device.name; } }); + } else { + this.items[i].deviceName = ''; } } @@ -128,15 +130,17 @@ reportQuery() { const query = this.query; - if (query.type) { - this.items.forEach(item => { - if (item.monitorPoint && item.time) { - item.formatTime = this.dateSrv.date_format(item.time, this.time.format); - } else { - this.msgSrv.error('���������������������������������������'); - return; - } - }); + let validate = true; + for (let i = 0; i < this.items.length; i++) { + let item = this.items[i]; + if (item.monitorPoint && item.time) { + item.formatTime = this.dateSrv.date_format(item.time, this.time.format); + } else { + validate = false; + break; + } + } + if (validate && query.type) { query.format = this.timeType.format; query.typeFormat = this.timeType.typeFormat; query.xAxisName = this.timeType.xAxisName; @@ -148,15 +152,6 @@ this.msgSrv.error('���������������������������������������'); } - } - - sensorChange(value) { - this.sensor = {}; - this.sensorOptions.forEach(sensor => { - if (sensor.sensorKey === value) { - this.sensor = sensor; - } - }); } } diff --git a/src/app/routes/routes-routing.module.ts b/src/app/routes/routes-routing.module.ts index 7a4e094..8c628cf 100644 --- a/src/app/routes/routes-routing.module.ts +++ b/src/app/routes/routes-routing.module.ts @@ -43,7 +43,8 @@ }, // passport { path: 'report', - component: ReportComponent + component: ReportComponent, + data:{title:'������������'} }, { path: '**', redirectTo: 'passport/login' } ]; -- Gitblit v1.8.0