日历完善，设备相关功能开发

fengxiang

2018-07-31 eef69fa1194f6ab215b08a8baaf402d0539362cc

 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,6 +27,7 @@
        private deviceService: DeviceService,
        private http: _HttpClient,
        public msg: NzMessageService,
        private modalHelper: ModalHelper,
        private http2: HttpClient) {
    }

@@ -37,22 +40,93 @@
                data: {}
            }
        }
        // console.log(this.calendarDayCells);
        const startTime = this.getPeriodDate(new Date(),TimeUnits.DAY,'start');
        const endTime = this.getPeriodDate(new Date(),TimeUnits.HOUR,'end');
        this.http.get(
            'demo/get-dayaqis',{
                startTime: startTime,
                endTime: endTime
            }
        ).subscribe(
            (res: any[]) => {
                if(!!res && res.length >0) {
                    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);
    }
}