import {AfterViewInit, ChangeDetectorRef, Component, OnInit} from '@angular/core';
import {MatTableDataSource} from '@angular/material';
import {ApiService} from '../../../../../core/api/api.service';
import {ActivatedRoute, Router} from '@angular/router';
import {LayoutUtilsService, MessageType} from '../../../../../core/_base/crud';
import {FormasPago} from '../formas-pago.model';

@Component({
  selector: 'kt-formas-pago-list',
  templateUrl: './formas-pago-list.component.html',
  styleUrls: ['./formas-pago-list.component.scss']
})
export class FormasPagoListComponent implements OnInit {

  //Search
	lastLength = 0;
	typingTimer;
	typingInterval = 700;

	displayedColumns: string[] = ['nombre', 'zeros', 'created_at', 'actions'];
	dataSourceFormasPago: MatTableDataSource<FormasPago>;

	//Loadings
	isLoading = true;
	showMessageWait = true;
	deleted_at = '0';

	//Paginator, Searcher
	searchText: string;
	sortBy = 'nombre';
	order = 'asc';
	page = '1';
	perPage = '10';
	total = 0;
	pages = [10, 25, 50, 100];
	titulo = 'Formas de pago';

	constructor(private api: ApiService,
				private router: Router,
				private layoutUtilsService: LayoutUtilsService,
				private activatedRoute: ActivatedRoute,
				private ref: ChangeDetectorRef) {
		this.dataSourceFormasPago = new MatTableDataSource<FormasPago>();
	}

	ngOnInit() {
	}

	toggle(event){
		this.deleted_at = event.checked == false ? '0' : '1';
		this.getFormasPago();
	}

	getFormasPago(){
		this.isLoading = true;
		this.api.formasPago.index(this.page, this.searchText, this.sortBy, this.order, this.perPage, null, this.deleted_at).subscribe(res =>{
			this.isLoading = false;
			this.showMessageWait = false;
			this.dataSourceFormasPago.data = res.data;
			this.total = res.total;
			this.ref.detectChanges();
		}, ()=>{
			this.isLoading = false;
			this.showMessageWait = false;
		})
	}

	//Search
	filtrarBusqueda(filterValue: string) {
		if (filterValue.length != 0) {
			this.searchText = filterValue.trim().toLowerCase();
			this.getFormasPago();
		} else if (this.lastLength != 0) {
			this.searchText = '';
			this.getFormasPago();
		}

		this.lastLength = filterValue.length;
	}

	onKeyUp(ev) {
		clearTimeout(this.typingTimer);
		this.typingTimer = setTimeout(() => {
			this.filtrarBusqueda(ev.target.value)
		}, this.typingInterval);
	}

	onKeyDown() {
		this.showMessageWait = true;
		this.dataSourceFormasPago.data = [];
		clearTimeout(this.typingTimer);
	}//Fin search

	editFormasPago(id) {
		this.router.navigate(['../formas-pago/edit/', id], {relativeTo: this.activatedRoute})
	}

	deleteFormasPago(formasPago) {
		let title = (!formasPago.deleted_at) ? 'Eliminar forma de pago' : 'Activar forma de pago';
		let name = (formasPago.nombre) ? formasPago.nombre : '';
		let description = (!formasPago.deleted_at) ? '¿Está seguro de eliminar la forma de pago ' + name + '?' : '¿Está seguro de activar la forma de pago ' + name + '?';
		let waitDesciption = (!formasPago.deleted_at) ? 'Eliminando forma de pago...' : 'Activando forma de pago...';
		let deleteMessage = (!formasPago.deleted_at) ? `La forma de pago ha sido eliminado con éxito` : `La forma de pago ha sido activada con éxito`;
		let errorMessage = (!formasPago.deleted_at) ? `La forma de pago no se ha podido eliminar` : `La forma de pago no se ha podido activar`;
		let btnText = (!formasPago.deleted_at) ? 'Eliminar' : 'Activar';

		let dialogRef = this.layoutUtilsService.deleteElement(title, description, waitDesciption, btnText);
		dialogRef.afterClosed().subscribe(res => {
			if (!res) {
				return;
			}
			let reactivate = (formasPago.deleted_at != null)

			this.api.formasPago.delete(formasPago.id, reactivate).subscribe(() => {
				this.getFormasPago();
				this.layoutUtilsService.showActionNotification(deleteMessage, MessageType.Delete);
			}, () => {
				this.layoutUtilsService.showActionNotification(errorMessage, MessageType.Delete);
			});
		});

	}

	sort(event) {
		this.order = event.direction;
		this.sortBy = event.active;
		this.getFormasPago();
	}

	paginator(event) {
		let nextPage = event.pageIndex + 1;
		this.page = nextPage.toString();
		this.perPage = event.pageSize.toString();
		this.getFormasPago();
	}

	ngAfterViewInit(): void {
		this.getFormasPago();
	}

}
