From 032ca75e238cc2f2a96b3bf27532b5a243d9a24a Mon Sep 17 00:00:00 2001
From: 沈斌 <bluelazysb@hotmail.com>
Date: Tue, 13 Mar 2018 16:00:41 +0800
Subject: [PATCH] 工作台数据统计页面
---
src/app/routes/analysis/query/query.component.ts | 118 ++++++++++++++++++++++++++++++++++++++++++++++++++++-------
1 files changed, 104 insertions(+), 14 deletions(-)
diff --git a/src/app/routes/analysis/query/query.component.ts b/src/app/routes/analysis/query/query.component.ts
index 9d59510..4b327f8 100644
--- a/src/app/routes/analysis/query/query.component.ts
+++ b/src/app/routes/analysis/query/query.component.ts
@@ -1,7 +1,7 @@
import { ExampleService } from '@business/services/util/example.service';
import { MonitorPointService } from '@business/services/http/monitor-point.service';
import { AreacodeService } from '@business/services/http/areacode.service';
-import { LineChartCriteria, TimePeriod, Organization, MonitorPoint, DataCondition, Device } from '@business/entity/data';
+import { LineChartCriteria, TimePeriod, Organization, MonitorPoint, DataCondition, Device, PairData } from '@business/entity/data';
import { PageBean, ResultBean } from '@business/entity/grid';
import { Sensor } from '@business/entity/data';
import { SensorsService } from '@business/services/http/sensors.service';
@@ -12,6 +12,8 @@
import { CascaderOption } from 'ng-zorro-antd/src/cascader/nz-cascader.component';
import { environment } from '@env/environment';
import { DeviceService } from '@business/services/http/device.service';
+import { DateService } from '@business/services/util/date.service';
+import { NzMessageService } from 'ng-zorro-antd';
@Component({
selector: 'app-query',
templateUrl: './query.component.html',
@@ -89,6 +91,8 @@
private http: _HttpClient,
private monitorPointService: MonitorPointService,
private deviceService: DeviceService,
+ private dateService: DateService,
+ private msg: NzMessageService
) {
}
@@ -298,31 +302,32 @@
}
private getPeriodDate(value: Date , type?: 'start'|'end' ): Date {
- debugger;
- let month = 0 ;
- let day = 0;
+ let month = 0;
+ let day = 1;
let hour = 0;
let minute = 0;
let second = 0;
+ let millisecond = 0;
if ('end' === type) {
- month = 12;
+ month = 11;
day = 31;
hour = 23;
minute = 59;
second = 59;
+ millisecond = 999;
}
const mo = moment(value);
switch ( this.lineChartCriteria.timePeriod.timeUnits ) {
case TimeUnits.YEAR:
- mo.month(month).day(day).hour(hour).minute(minute).second(second); break;
+ mo.month(month).date(day).hour(hour).minute(minute).second(second).millisecond(millisecond); break;
case TimeUnits.MONTH:
- mo.day(day).hour(hour).minute(minute).second(second); break;
+ mo.date(day).hour(hour).minute(minute).second(second).millisecond(millisecond); break;
case TimeUnits.DAY:
- mo.hour(hour).minute(minute).second(second); break;
+ mo.hour(hour).minute(minute).second(second).millisecond(millisecond); break;
case TimeUnits.HOUR:
- mo.minute(minute).second(second); break;
+ mo.minute(minute).second(second).millisecond(millisecond); break;
case TimeUnits.MINUTE:
- mo.second(second); break;
+ mo.second(second).millisecond(millisecond); break;
}
return mo.toDate();
}
@@ -465,7 +470,8 @@
// ������������������������ actualTimeDisabled
get actualTimeDisabled() {
if (!!this.dataTimeUnitsList && this._dataTimeUnits === this.dataTimeUnitsList[0]) {
- this._actualTime = null;
+ this.setActualTime(null);
+ // ������������������������������
this.actualTimes = null;
}
return !!this.dataTimeUnitsList && this._dataTimeUnits === this.dataTimeUnitsList[0];
@@ -483,10 +489,94 @@
this.lineChartCriteria.timePeriod.endTime = this.getPeriodDate(endTime, 'end');
this.lineChartCriteria.dataConditions.pop();
this.lineChartCriteria.dataConditions.push(this.dataConditionTemp);
- this.http.post(environment.SERVER_BASH_URL + '/report/line-chart', this.lineChartCriteria).subscribe(
- res => console.log(res)
- );
+ this.reloadChart();
}
+ private reloadChart(): void {
+ const countTimeRange = this.dateService.countTimeRange(this.lineChartCriteria.timePeriod);
+ let timeList: string[];
+ const maxTimeRange = 5000;
+ if (countTimeRange < maxTimeRange ) {
+ timeList = this.dateService.makeTimeList(this.lineChartCriteria.timePeriod);
+ } else {
+ this.msg.error('������������������������' + maxTimeRange + '������������������������' + countTimeRange);
+ return ;
+ }
+
+ if (!!this.echartsIntance) {
+ this.chartOption = null;
+ this.echartsIntance.clear();
+ }
+ this.initOpton({data: timeList});
+ this.chartLoading = true;
+ this.http.post(environment.SERVER_BASH_URL + '/report/line-chart', this.lineChartCriteria).subscribe(
+ (res: ResultBean<Array<Array<PairData>>>) => {
+ if (res.code === 1) {
+ const series = [];
+ const dataList = res.data;
+ if (!!dataList && !!dataList.length) {
+ dataList.forEach(
+ data => {
+ const outData = data.map( item => {
+ return item.value;
+ });
+ series.push({type: 'line', data: outData});
+ }
+ );
+ this.echartsIntance.setOption({
+ series: series
+ });
+ this.chartLoading = false;
+ }
+ }
+ }
+ );
+ }
+ private initOpton(opt: {data: string[]}) {
+
+ this.chartOption = {
+ title: {
+ text: ''
+ },
+ tooltip : {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ label: {
+ backgroundColor: '#6a7985'
+ }
+ }
+ },
+ legend: {
+ data: []
+ },
+ toolbox: {
+ feature: {
+ saveAsImage: {}
+ }
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ xAxis : [
+ {
+ type : 'category',
+ boundaryGap : false,
+ data : opt.data
+ }
+ ],
+ yAxis : [
+ {
+ type : 'value'
+ }
+ ],
+ series : [
+ ]
+ };
+ }
+ chartLoading: boolean;
chartOption;
echartsIntance;
onChartInit(ec) {
--
Gitblit v1.8.0