datetime.component.ts

import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';

import { Criterion, DatetimeCriterion } from '../../store/model';
import { MapType } from '@angular/compiler';

@Component({
    selector: 'app-datetime',
    templateUrl: 'datetime.component.html',
    styleUrls: ['time.component.css'],
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class DatetimeComponent {
    @Input() id: number;
    @Input() label: string;
    @Input() placeholder: string;
    @Input()
    set criterion(criterion: Criterion) {
        this.getDefault(criterion);
    }
    @Output() add: EventEmitter<DatetimeCriterion> = new EventEmitter();

    date = new FormControl('');
    time: Date = null;
    isTimeDisabled: boolean;
    isValidFields: boolean = false;
    datetime: Date = new Date();

    addCriterion() {
        const fd = new DatetimeCriterion(this.id, this.datetime);
        this.add.emit(fd);
    }

    getDefault(criterion: Criterion): void {
        if (!criterion) {
            this.date.setValue('');
            this.date.enable();
            this.time = null;
            this.isTimeDisabled = false;
            this.isValidFields = false;
        } else {
            console.log('pas vide');
            const c = criterion as DatetimeCriterion;
            this.date.setValue(c.value);
            this.date.disable();
            this.time = c.value;
            this.isTimeDisabled = true;
            this.isValidFields = true;
        }
    }

    getPlaceholder(): string {
        if (!this.placeholder) {
            return '';
        } else {
            return this.placeholder;
        }
    }

    change(): void {
        if (!this.time || !this.date.value) {
            this.isValidFields = false;
        } else {
            this.isValidFields = true;
            this.datetime.setFullYear(
                this.date.value.getFullYear(),
                this.date.value.getMonth(),
                this.date.value.getDate());
            this.datetime.setHours(
                this.time.getHours(),
                this.time.getMinutes());
        }
    }
}