From 5913516ca6ac3a15a629803a2bf78ab9a2afcc68 Mon Sep 17 00:00:00 2001
From: fengxiang <110431245@qq.com>
Date: Tue, 14 Aug 2018 09:10:54 +0800
Subject: [PATCH] 控制加载网格 层级
---
src/app/routes/statistics/calendar/calendar.component.ts | 97 ++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 88 insertions(+), 9 deletions(-)
diff --git a/src/app/routes/statistics/calendar/calendar.component.ts b/src/app/routes/statistics/calendar/calendar.component.ts
index 09e03c1..7054066 100644
--- a/src/app/routes/statistics/calendar/calendar.component.ts
+++ b/src/app/routes/statistics/calendar/calendar.component.ts
@@ -1,9 +1,11 @@
import { Component, OnInit, OnDestroy } from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd';
-import { _HttpClient } from '@delon/theme';
+import { _HttpClient, ModalHelper } from '@delon/theme';
import { HttpClient } from '@angular/common/http';
import * as moment from 'moment';
import { DeviceService } from '@business/services/http/device.service';
+import { TimeUnits } from '@business/enum/types.enum';
+import { AqiDetailComponent } from './aqi-detail/aqi-detail.component';
@Component({
selector: 'statistics-calender',
@@ -25,11 +27,13 @@
private deviceService: DeviceService,
private http: _HttpClient,
public msg: NzMessageService,
+ private modalHelper: ModalHelper,
private http2: HttpClient) {
}
ngOnInit() {
- const day = Number(moment().format('DD'));
+ // const day = Number(moment().format('DD'));
+ const day = 31;
for(let index = 1;index <= day; index++) {
this.calendarDayCells[('0'+index).slice(-2)] = {
status: 'processing',
@@ -37,22 +41,97 @@
data: {}
}
}
- // console.log(this.calendarDayCells);
+ // const startTime = this.getPeriodDate(new Date(),TimeUnits.DAY,'start');
+ // const endTime = this.getPeriodDate(new Date(),TimeUnits.HOUR,'end');
+ const mo = moment().subtract(1,"months");
+ const startTime = this.getPeriodDate(mo.toDate(),TimeUnits.DAY,'start');
+ const endTime = this.getPeriodDate(mo.toDate(),TimeUnits.DAY,'end');
+ this.http.get(
+ 'demo/get-dayaqis',{
+ startTime: startTime,
+ endTime: endTime
+ }
+ ).subscribe(
+ (res: any[]) => {
+ if(!!res && res.length >0) {
+ debugger;
+ Object.keys(this.calendarDayCells).forEach(
+ (key) => {
+ const index = Number(key) -1;
+ if(res.length > index){
+ const data = res[index];
+ if(!!data) {
+ const aqiJson = JSON.parse(data.aqi_json);
+ const cell = this.calendarDayCells[key];
+ cell.data = aqiJson;
+ cell.statusName = aqiJson.quality;
+ switch(aqiJson.quality) {
+ case '���' : cell.status = 'success';break;
+ case '���' : cell.status = 'success';break;
+ case '������������' : cell.status = 'warning';break;
+ case '������������' : cell.status = 'warning';break;
+ case '������������' : cell.status = 'error';break;
+ default: cell.status = 'success';break;
+ }
+ }
+ }
+ }
+ );
+ }
+ }
+ );
}
-
+ private getPeriodDate(value: Date , timeUnit: TimeUnits,type?: 'start'|'end' ): Date {
+ let month = 0;
+ let day = 1;
+ let hour = 0;
+ let minute = 0;
+ let second = 0;
+ let millisecond = 0;
+ if ('end' === type) {
+ month = 11;
+ day = 31;
+ hour = 23;
+ minute = 59;
+ second = 59;
+ millisecond = 999;
+ }
+ const mo = moment(value);
+ switch ( timeUnit ) {
+ case TimeUnits.MONTH:
+ mo.month(month).date(day).hour(hour).minute(minute).second(second).millisecond(millisecond); break;
+ case TimeUnits.DAY:
+ mo.date(day).hour(hour).minute(minute).second(second).millisecond(millisecond); break;
+ case TimeUnits.HOUR:
+ mo.hour(hour).minute(minute).second(second).millisecond(millisecond); break;
+ case TimeUnits.MINUTE:
+ mo.minute(minute).second(second).millisecond(millisecond); break;
+ // case TimeUnits.MINUTE:
+ // mo.second(second).millisecond(millisecond); break;
+ }
+ return mo.toDate();
+ }
ngOnDestroy(): void {
}
// ��������������� ���������
calendarClick(mo: moment.Moment) {
- console.log(mo.format('DD'));
+ // console.log(mo.format('DD'));
+ const dayKey = mo.format('DD');
+ const selectedMoment = mo;
+ const dayData = this.calendarDayCells[dayKey];
+ if( !!dayData ) {
+ this.modalHelper.open( AqiDetailComponent, { dayData,selectedMoment }).subscribe(
+ res => {}
+ );
+ }
}
public isExpire(mo: moment.Moment):boolean {
- // console.log(moment().valueOf());
- // console.log(mo.valueOf());
- // console.log(moment().valueOf() < mo.valueOf());
return moment().valueOf() < mo.valueOf();
}
+ public isCellExist(mo: moment.Moment):boolean {
+ return !!this.calendarDayCells[mo.format('DD')];
+ }
loadCalendar(event) {
- console.log(event);
+ // console.log(event);
}
}
--
Gitblit v1.8.0