import { AfterViewInit, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { MatDialog, MatTableDataSource } from '@angular/material';
import { ApiService } from '../../../../core/api/api.service';
import { ModalFiltrosProductividadComponent } from './modal-filtros-productividad/modal-filtros-productividad.component';
import { ProductividadModel } from './productividad.model';

@Component({
	selector: 'kt-productividad',
	templateUrl: './productividad.component.html',
	styleUrls: ['./productividad.component.scss']
})
export class ProductividadComponent implements OnInit, AfterViewInit {

	titulo = 'Reporte de productividad atención a clientes';

	displayedColumns: string[] = ['numero_solicitud', 'fecha_servicio', 'hora_servicio', 'servicio', 'costo', 'tipo_servicio', 'estatus_servicio', 'nombre_cliente', 'colonia_cliente', 'nombre_asesor', 'nombre_auxiliar', 'vehiculo', 'duracion_servicio'];
	dataSource: MatTableDataSource<ProductividadModel>;

	//Loadings
	isLoading = false;
	showMessageWait = false;
	showMessageSetFilters = true;

	//Paginator, Searcher
	page = '1';
	perPage = '10';
	total = 0;
	sortBy = 'denominacion';
	order = 'asc';
	pages = [10, 25, 50, 100];
	deleted = '0';

	data = null;

	constructor(private api: ApiService, private ref: ChangeDetectorRef, private dialog: MatDialog) {
		this.dataSource = new MatTableDataSource<ProductividadModel>();
	}

	ngOnInit() {
	}

	getInformation(excel = false){
		if(this.data){
			this.isLoading = true;
			this.showMessageWait = true;

			let url = excel? 'productividad/atencionclientes/excel' : 'productividad/atencionclientes';

			this.api.reportesService.getInformation(url, this.data, this.page, this.perPage, this.deleted).subscribe(res => {

				this.isLoading = false;
				this.showMessageWait = false;

				if(excel){
					if (res.nombre_archivo) {
						document.location.href = this.api.reportesService.baseUrlStorage + 'productividad_atencion_clientes/' + res.nombre_archivo;
					}
				}else{
					this.dataSource.data = [];

					this.dataSource.data = res.data;
					this.total = res.total;
				}

				this.ref.detectChanges();
			}, () => {
				this.isLoading = false;
				this.showMessageWait = false;
			});
		}
	}

	filters(){
		const dialogRef = this.dialog.open(ModalFiltrosProductividadComponent, {
			data: this.data,
			disableClose: true
		});

		dialogRef.afterClosed().subscribe(data => {
			if(data){
				this.showMessageSetFilters = false;
				this.data = data;
				this.dataSource.data = [];
				this.titulo = 'Reporte de productividad atención a clientes (' + data.user + ')';
				this.getInformation();
			}
		});
	}

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


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

	ngAfterViewInit() {
		this.filters();
	}
}
