// angular
import { Component } from '@angular/core';
import { Input } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { ActivatedRoute } from '@angular/router';
import { UntypedFormGroup } from '@angular/forms';
import { Validators } from '@angular/forms';
import { UntypedFormBuilder } from '@angular/forms';
import { Output } from '@angular/core';
import { EventEmitter } from '@angular/core';

// libs
import * as moment from 'moment';

// app
import { ApiRoutes } from '../../api-routes';
import { AccountDetailedModel } from '../../model/account.detailed.model';
import { AccountMotionModel } from '../../model/account.motion';

@Component({
	templateUrl: './account.component.html',
	styleUrls: ['./account.component.scss'],
	selector: 'account'
})
export class AccountComponent {
	public motions?: AccountMotionModel[];
	public newMotion: AccountMotionModel;
	public form!: UntypedFormGroup;
	@Input('account') account!: AccountDetailedModel;
	@Input('expanded') expanded!: boolean;

	@Output() onUpdate: EventEmitter<AccountMotionModel> = new EventEmitter<AccountMotionModel>();

	constructor(
		private fb: UntypedFormBuilder,
		private httpClient: HttpClient,
		private activatedRoute: ActivatedRoute
	) {
		this.newMotion = {
			date: new Date(),
			plus: 0,
			minus: 0,
		};
	}

	ngOnInit(): void {
		this.form = this.fb.group({
			dateFrom: [
				moment(new Date).add(-7, 'days').toDate(),
				[Validators.required],
			],
			dateTo: [
				new Date,
				[Validators.required],
			],
		});
		this.loadMotions();
	}

	onSubmitClick() {
	}

	handlerOnAdd(accountMotion: AccountMotionModel) {
		this.loadMotions();
		this.httpClient
			.get<AccountDetailedModel>(ApiRoutes.Account.replace(':id', this.account.account!.id!))
			.subscribe(data => {
				this.account = data;
			});

		/*var md = moment(accountMotion.date);
		var mdf = moment(this.form.value.dateFrom);
		var mdt = moment(this.form.value.dateTo);
		if (md.isBetween(mdf, mdt, 'days', '[]')) {
			this.motions?.push(accountMotion);
			//this.motions?.sort((a, b) => (b.date!.getMilliseconds() - a.date!.getMilliseconds()));
			this.motions?.sort((a, b) => {
				var aa = moment(a.date).toDate();
				var bb = moment(b.date).toDate();

				return (bb.getMilliseconds() - aa.getMilliseconds());
			});
		}*/
	}

	private loadMotions() {
		var url = ApiRoutes.Motions.replace(':id', this.account.account.id!);
		url += '?from=' + moment(this.form.value.dateFrom).format('yyyy-MM-DD');
		url += '&to=' + moment(this.form.value.dateTo).format('yyyy-MM-DD');

		this.activatedRoute.params.subscribe(params => {
			this.httpClient
				.get<AccountMotionModel[]>(url)
				.subscribe(data => {
					this.motions = data;
				});
		});
	}
}