// app
import { Component } from '@angular/core';
import { UntypedFormBuilder } from '@angular/forms';
import { UntypedFormGroup } from '@angular/forms';
import { Validators } from '@angular/forms';
import { Input } from '@angular/core';
import { Output } from '@angular/core';
import { EventEmitter } from '@angular/core';

// libs
import * as moment from 'moment'


@Component({
  selector: 'app-date-period',
  templateUrl: './date-period.component.html',
  styleUrls: ['./date-period.component.css']
})
export class DatePeriodComponent {

	@Input('from') dateFrom!: Date;
	@Input('to') dateTo!: Date;

	@Output() onChange: EventEmitter<Date[]> = new EventEmitter<Date[]>();

	form!: UntypedFormGroup;

	constructor(
		private fb: UntypedFormBuilder
	) {

	}

	ngOnInit() {
		this.form = this.fb.group({
			dateFrom: [
				this.dateFrom,
				[Validators.required],
			],
			dateTo: [
				this.dateTo,
				[Validators.required],
			],
		});
	}

	onSubmitClick() {
	}

	onInputChange() {
		this.onChange.emit([this.form.value.dateFrom, this.form.value.dateTo]);
	}
}
