import { Component, OnInit, ViewChild, Input, AfterViewInit } from '@angular/core';
import { MatTableDataSource } from '@angular/material/table';
import * as moment from 'moment';
import { DecimalPipe } from '@angular/common';
import { TaxRateDialogService } from '../../../vuelo/components/vuelo-escala-dialog/services/vuelo-escala-dialog.service';
import { MatSort } from '@angular/material/sort';
import { MatPaginator } from '@angular/material/paginator';
import { ColumnTemplate } from '@xdf/gallery';
import { PasajeroDialogService } from '../reservation-pasajero-dialog/services/reservation-pasajero-dialog.service';

@Component({
  selector: 'byte-reservation-pasajero-grid',
  templateUrl: './reservation-pasajero-grid.component.html',
  styleUrls: ['./reservation-pasajero-grid.component.scss']
})
export class ReservationPasajeroGridComponent implements OnInit, AfterViewInit {


  @Input() mode;

  decimalParameter = 2;

  @ViewChild('paginator',{static: true}) paginator: MatPaginator;
  @ViewChild(MatSort, { static: false }) sort: MatSort | undefined;

  sortDirection = 'desc';
  sortColumn = 'fechaLlegada';

  displayedColumns: string[] = ['id', 'agente','pasajero','actions'];
  dataSource!: MatTableDataSource<any>;
  
  constructor(
    private taxRateDialogService : PasajeroDialogService,
    private decimalPipe : DecimalPipe,
  ) {
   }
  ngAfterViewInit(): void {
    this.paginator.pageSize = 5
    this.dataSource.paginator = this.paginator
    this.sort.sortChange.subscribe(() => {
      console.log()
    })
  }

  autoSort(data) {
    return data.sort((a, b) => new Date(a.fechaLlegada) < new Date(b.fechaLlegada) ? 1 : -1)
  }

  numberWithCommas(x): string {
    return x ? this.decimalPipe.transform(x, '1.'+this.decimalParameter+'-'+this.decimalParameter) : '';
  }

  getDateFormat(liquidationDate) {
    return moment(liquidationDate).format('DD-MM-YYYY');
  }

  ngOnInit(): void {
    this.dataSource = new MatTableDataSource<any>();
  }

  onEdit(item) {
    this.taxRateDialogService.loadComponent(item, this.mode, this.getMaxDate()).subscribe(
      data => {
        if(data !== null) {
          let dataSource = [...this.dataSource.data];
          let pos = dataSource.findIndex(x => x === item)
          dataSource[pos] = data;
          this.dataSource.data = this.autoSort(dataSource);;
        }
      }
    )
  }

  onDelete(item) {
    let dataSource = [...this.dataSource.data];
    let pos = dataSource.findIndex(x => x === item)
    dataSource.splice(pos, 1)
    this.dataSource.data = this.autoSort(dataSource);;
  }

  getMaxDate() {
    let maxDate 
    if(this.dataSource.data.length > 0) {
      maxDate = new Date(Math.max.apply(null,this.dataSource.data.map(x => new Date(x.fechaLlegada))));
      maxDate.setDate(maxDate.getDate() + 1);
    } else {
      maxDate = new Date();
    }
    return maxDate;
  }

  onCreate() {
    this.taxRateDialogService.loadComponent(null, this.mode, this.getMaxDate()).subscribe(
      data => {
        if(data !== null) {
          let datase = [];
          datase.push(data)
          console.log(datase);
          this.dataSource = new MatTableDataSource(datase);
        }
      }
    )
  }


  
}
