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()); } } }