From 051a77599ca8b7972df8728ff46822d308627cbc Mon Sep 17 00:00:00 2001
From: xufenglei <xufenglei>
Date: Wed, 28 Mar 2018 14:32:32 +0800
Subject: [PATCH] 报表 优化
---
src/app/routes/report/report.component.ts | 12 ++--
src/app/routes/reports/demo/demo.component.ts | 19 ++----
src/app/routes/reports/excel/excel.component.html | 16 +++--
src/app/routes/reports/excel/excel.component.ts | 71 ++++++-----------------
src/app/routes/reports/demo/demo.component.html | 6 +-
5 files changed, 43 insertions(+), 81 deletions(-)
diff --git a/src/app/routes/report/report.component.ts b/src/app/routes/report/report.component.ts
index 31d5571..64d1127 100644
--- a/src/app/routes/report/report.component.ts
+++ b/src/app/routes/report/report.component.ts
@@ -63,10 +63,9 @@
public sensorArr: any = [];
public items: any = [];
- private timeType: any = {};
public title: string;
private timeArr = ['���', '���', '���', '���', '���'];
-
+ public typeArr = ['year', 'month', 'day', 'hour'];
constructor(
public injector: Injector,
public http: HttpClient,
@@ -81,7 +80,7 @@
ngOnInit() {
this.activeRoute.queryParams.subscribe(params => {
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);
@@ -89,12 +88,13 @@
const option = this.echartOption;
const sensors = res.data.sensors;
const timeArr = this.timeArr;
+ const label = timeArr[this.typeArr.indexOf(timeType)];
option.xAxis.data = res.data.times;
- option.xAxis.name = timeArr[timeArr.indexOf(timeType.label) + 1];
+ 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 = [];
@@ -105,7 +105,7 @@
}
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);
+ const legendName = items[i].formatTime + label + (items[i].mac ? items[i].deviceName : items[i].monitorPointName);
option.legend.data[i] = legendName;
option.series.push({
name: legendName,
diff --git a/src/app/routes/reports/demo/demo.component.html b/src/app/routes/reports/demo/demo.component.html
index 0d55022..a88f325 100644
--- a/src/app/routes/reports/demo/demo.component.html
+++ b/src/app/routes/reports/demo/demo.component.html
@@ -9,7 +9,7 @@
</div>
<div nz-form-control class="flex-1">
<nz-select [nzMode]="'multiple'" [(ngModel)]="query.sensorKey" name="sensorKey" [nzSize]="'large'" [nzPlaceHolder]="'���������'">
- <nz-option *ngFor="let option of sensorOptions" [nzLabel]="option.name" [nzValue]="option"></nz-option>
+ <nz-option *ngFor="let option of sensorOptions" [nzLabel]="option.name" [nzValue]="option.sensorKey + '-' + option.name + '-' + option.unit"></nz-option>
</nz-select>
</div>
</div>
@@ -80,8 +80,8 @@
<label nz-form-item-required>������</label>
</div>
<div nz-form-control class="flex-1">
- <nz-datepicker style="width: 100%;" [(ngModel)]="item.time" name="time{{item.id}}" [nzPlaceHolder]="'���������'" [nzFormat]="timeType.format.toUpperCase()" [nzSize]="'large'"
- [nzMode]="timeType.value=='hour'||timeType.value=='day'?'day':'month'" [nzShowTime]="timeType.value=='hour'?true:false" [nzDisabledDate]="_disabledDate"></nz-datepicker>
+ <nz-datepicker style="width: 100%;" [(ngModel)]="item.time" name="time{{item.id}}" [nzPlaceHolder]="'���������'" [nzFormat]="timeType.format" [nzDisabledDate]="_disabledDate"
+ [nzMode]="timeType.value=='hour'||timeType.value=='day'?'day':'month'" [nzShowTime]="timeType.value=='hour'?true:false" [nzSize]="'large'"></nz-datepicker>
</div>
</div>
</div>
diff --git a/src/app/routes/reports/demo/demo.component.ts b/src/app/routes/reports/demo/demo.component.ts
index c64baca..37cf5ed 100644
--- a/src/app/routes/reports/demo/demo.component.ts
+++ b/src/app/routes/reports/demo/demo.component.ts
@@ -16,10 +16,10 @@
public query: any = {};
public sensorOptions = [];
public typeOptions = [
- {value: 'year', label: '���', format: 'yyyy', typeFormat: '%Y-%m', timeLength: 12},
- {value: 'month', label: '���', format: 'yyyy-MM', typeFormat: '%Y-%m-%d', timeLength: 28},
- {value: 'day', label: '���', format: 'yyyy-MM-dd', typeFormat: '%Y-%m-%d %H', timeLength: 24},
- {value: 'hour', label: '���', format: 'yyyy-MM-dd HH', typeFormat: '%Y-%m-%d %H:%i', timeLength: 60}
+ {value: 'year', label: '���', format: 'YYYY'},
+ {value: 'month', label: '���', format: 'YYYY-MM'},
+ {value: 'day', label: '���', format: 'YYYY-MM-DD'},
+ {value: 'hour', label: '���', format: 'YYYY-MM-DD HH'}
];
public reportOptions = [
{value: 'bar', label: '���������'},
@@ -122,7 +122,7 @@
}
queryItem.deviceCount = queryItem.deviceOptions.length;
delete queryItem.deviceOptions;
- queryItem.formatTime = this.dateSrv.date_format(queryItem.time, this.timeType.format.toUpperCase());
+ queryItem.formatTime = this.dateSrv.date_format(queryItem.time, this.timeType.format);
delete queryItem.time;
queryItems.push(queryItem);
} else {
@@ -131,16 +131,11 @@
}
}
if (validate && this.timeType && query.reportType) {
- query.sensors = null;
if (query.sensorKey && query.sensorKey.length > 0) {
- const sensors = [];
- query.sensorKey.forEach(sensor => {
- sensors.push(sensor.sensorKey + '-' + sensor.name + '-' + sensor.unit);
- });
- query.sensors = JSON.stringify(sensors);
+ query.sensors = JSON.stringify(query.sensorKey);
}
query.items = JSON.stringify(queryItems);
- query.timeType = JSON.stringify(this.timeType);
+ query.type = this.timeType.value;
this.router.navigate(['report'], {queryParams: query});
} else {
this.msgSrv.error('���������������������������������������');
diff --git a/src/app/routes/reports/excel/excel.component.html b/src/app/routes/reports/excel/excel.component.html
index 4ecbfe3..6ba33e1 100644
--- a/src/app/routes/reports/excel/excel.component.html
+++ b/src/app/routes/reports/excel/excel.component.html
@@ -8,8 +8,8 @@
<label> ������</label>
</div>
<div nz-form-control class="flex-1">
- <nz-select [(ngModel)]="query.sensorKey" name="sensorKey" [nzSize]="'large'" [nzPlaceHolder]="'���������'" nzAllowClear (ngModelChange)="sensorChange($event)">
- <nz-option *ngFor="let option of sensorOptions" [nzLabel]="option.name" [nzValue]="option.sensorKey" ></nz-option>
+ <nz-select [(ngModel)]="query.sensorKey" name="sensorKey" [nzSize]="'large'" [nzPlaceHolder]="'���������'" [nzMode]="'multiple'">
+ <nz-option *ngFor="let option of sensorOptions" [nzLabel]="option.name" [nzValue]="option.sensorKey + '-' + option.name + '-' + option.unit" ></nz-option>
</nz-select>
</div>
</div>
@@ -48,8 +48,8 @@
<label nz-form-item-required>������</label>
</div>
<div nz-form-control class="flex-1">
- <nz-select [(ngModel)]="query.type" name="isDelete" [nzSize]="'large'" [nzPlaceHolder]="'���������'" (ngModelChange)="typeChange($event)">
- <nz-option *ngFor="let option of typeOptions" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option>
+ <nz-select [(ngModel)]="timeType" name="timeType" [nzSize]="'large'" [nzPlaceHolder]="'���������'">
+ <nz-option *ngFor="let option of typeOptions" [nzLabel]="option.label" [nzValue]="option" ></nz-option>
</nz-select>
</div>
</div>
@@ -60,7 +60,8 @@
<label nz-form-item-required>���������</label>
</div>
<div nz-form-control class="flex-1">
- <nz-datepicker style="width: 100%;" [(ngModel)]="query.time" name="time" [nzPlaceHolder]="'���������'" [nzFormat]="time.format" [nzMode]="time.mode" [nzSize]="'large'" nzShowTime></nz-datepicker>
+ <nz-datepicker style="width: 100%;" [(ngModel)]="query.time" name="time" [nzPlaceHolder]="'���������'" [nzSize]="'large'" [nzFormat]="timeType.format"
+ [nzMode]="timeType.value=='hour'||timeType.value=='day'?'day':'month'" [nzShowTime]="timeType.value=='hour'?true:false"></nz-datepicker>
</div>
</div>
</div>
@@ -70,7 +71,8 @@
<label > ���</label>
</div>
<div nz-form-control class="flex-1">
- <nz-datepicker style="width: 100%;" [(ngModel)]="query.timeb" name="timeb" [nzPlaceHolder]="'���������'" [nzFormat]="time.format" [nzMode]="time.mode" [nzSize]="'large'" nzShowTime></nz-datepicker>
+ <nz-datepicker style="width: 100%;" [(ngModel)]="query.timeb" name="timeb" [nzPlaceHolder]="'���������'" [nzSize]="'large'" [nzFormat]="timeType.format"
+ [nzMode]="timeType.value=='hour'||timeType.value=='day'?'day':'month'" [nzShowTime]="timeType.value=='hour'?true:false"></nz-datepicker>
</div>
</div>
</div>
@@ -81,7 +83,7 @@
<div nz-row [nzGutter]="24">
<div nz-col [nzSpan]="6" class="mb-md">
<button nz-button type="submit" [nzType]="'primary'" [nzSize]="'large'">������</button>
- <button nz-button type="reset" [nzSize]="'large'" class="mx-sm">������</button>
+ <!-- <button nz-button type="reset" [nzSize]="'large'" class="mx-sm">������</button> -->
</div>
</div>
</form>
diff --git a/src/app/routes/reports/excel/excel.component.ts b/src/app/routes/reports/excel/excel.component.ts
index 519b820..a6fce42 100644
--- a/src/app/routes/reports/excel/excel.component.ts
+++ b/src/app/routes/reports/excel/excel.component.ts
@@ -3,7 +3,7 @@
import {NzMessageService, NzModalService} from 'ng-zorro-antd';
import {Component, OnInit, Inject} from '@angular/core';
import {HttpClient} from '@angular/common/http';
-import { ITokenService, DA_SERVICE_TOKEN } from '@delon/auth';
+import {ITokenService, DA_SERVICE_TOKEN} from '@delon/auth';
@Component({
selector: 'app-excel',
@@ -12,25 +12,25 @@
})
export class ExcelComponent implements OnInit {
[x: string]: any;
-
- query: any = {
- };
-
- time: any = {
- format: 'YYYY',
- mode: 'month'
- };
-
+ public query: any = {};
public sensorOptions = [];
public monitorPointOptions = [];
public deviceOptions = [];
+ public typeOptions = [
+ {value: 'year', label: '���', format: 'YYYY'},
+ {value: 'month', label: '���', format: 'YYYY-MM'},
+ {value: 'day', label: '���', format: 'YYYY-MM-DD'},
+ {value: 'hour', label: '���', format: 'YYYY-MM-DD HH'}
+ ];
constructor(
public http: HttpClient,
public dateSrv: DateService,
public msgSrv: NzMessageService,
- @Inject(DA_SERVICE_TOKEN)public tokenService: ITokenService
- ) {}
+ @Inject(DA_SERVICE_TOKEN) public tokenService: ITokenService
+ ) {
+ this.timeType = this.typeOptions[1];
+ }
ngOnInit() {
this.query.time = null;
@@ -40,14 +40,6 @@
this.msgSrv.error(res.message);
} else {
this.sensorOptions = res.data;
- }
- });
- }
-
- sensorChange(value) {
- this.sensorOptions.forEach(sensor => {
- if (sensor.sensorKey === value) {
- this.sensor = sensor;
}
});
}
@@ -78,56 +70,29 @@
this.deviceOptions = res.data;
}
});
- } else {
- this.monitorPointa = null;
}
- }
-
-
- public typeOptions = [
- {value: 'year', label: '���', mode: 'month', xAxisName: '���', format: 'yyyy', typeFormat: '%Y-%m'},
- {value: 'month', label: '���', mode: 'month', xAxisName: '���', format: 'yyyy-MM', typeFormat: '%Y-%m-%d'},
- {value: 'day', label: '���', mode: 'day', xAxisName: '���', format: 'yyyy-MM-dd', typeFormat: '%Y-%m-%d %H'},
- {value: 'hour', label: '���', mode: 'day', xAxisName: '���', format: 'yyyy-MM-dd HH', typeFormat: '%Y-%m-%d %H:%i'}
- ];
-
-
- typeChange(searchText) {
- this.typeOptions.forEach(types => {
- if (types.value === searchText) {
- this.timeType = types;
- this.time.format = types.format.toUpperCase();
- this.time.mode = types.mode;
- }
- });
}
reportQuery() {
const query = this.query;
- if (query.type && query.monitorPointId && query.time) {
- if (query.time) {
- query.time = this.dateSrv.date_format(query.time, this.time.format);
- }
+ if (this.timeType && query.monitorPointId && query.time) {
+ query.time = this.dateSrv.date_format(query.time, this.timeType.format);
if (query.timeb) {
- query.timeb = this.dateSrv.date_format(query.timeb, this.time.format);
+ query.timeb = this.dateSrv.date_format(query.timeb, this.timeType.format);
}
- if (query.sensorKey) {
- query.sensorName = this.sensor.name;
+ if (query.sensorKey && query.sensorKey.length > 0) {
+ query.sensors = JSON.stringify(query.sensorKey);
}
- query.format = this.timeType.format;
- query.typeFormat = this.timeType.typeFormat;
+ query.type = this.timeType.value;
let url = environment.SERVER_BASH_URL + 'report/excel?';
for (const a in query) {
if (query[a]) {
url += encodeURI(a) + '=' + encodeURI(query[a]) + '&';
}
}
-
window.location.href = url + '_token=' + this.tokenService.get().token;
} else {
this.msgSrv.error('������������������');
}
-
}
-
}
--
Gitblit v1.8.0