import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { MatIconRegistry } from '@angular/material/icon';
import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table';
import { DomSanitizer } from '@angular/platform-browser';
import * as XLSX from 'xlsx';
import { EnviarInfoService } from '../../services/enviar-info.service';
import { RegistroAcademicoService } from '../../../Padres/services/registroAcademico.service';
import jsPDF from "jspdf";
import { forkJoin, map } from 'rxjs';
import { consultarRegistroService } from '../../services/consultarRegistro.service';
import { registroAlumnoComponent } from '../../../Padres/pages/registroAlumno/registroAlumno.component';

@Component({
  selector: 'app-consultar-registro-acay-admi',
  templateUrl: './consultar-registro-acay-admi.component.html',
  styleUrl: './consultar-registro-acay-admi.component.css',
  providers: [registroAlumnoComponent]
})
export class ConsultarRegistroAcayAdmiComponent implements OnInit {
  isLoading: Boolean= true;
  public color: string = '';
  public textColor: string = '';
  public columnas: string[] = ['IDAlumno', 'nombre', 'usuarioRegistro', 'academico','administrativo', 'ultActuaizacion', 'acciones'];
  public meses: any[] = [{ value: '01', viewValue: 'ENERO'}, { value: '02', viewValue: 'FEBRERO'}, { value: '03', viewValue: 'MARZO'}, { value: '04', viewValue: 'ABRIL'}, { value: '05', viewValue: 'MAYO'}, { value: '06', viewValue: 'JUNIO'}, { value: '07', viewValue: 'JULIO'}, { value: '08', viewValue: 'AGOSTO'}, { value: '09', viewValue: 'SEPTIEMBRE'}, { value: '10', viewValue: 'OCTUBRE'}, { value: '11', viewValue: 'NOVIEMBRE'}, { value: '12', viewValue: 'DICIEMBRE'}];

  public dataSource = new MatTableDataSource<any>();

  @ViewChild(MatPaginator, { static: true }) paginator!: MatPaginator;
  @ViewChild('TABLE') table!: ElementRef;
  constructor( private _DomSanitizer: DomSanitizer, private _MatIconRegister: MatIconRegistry,
    private _enviarInfo: EnviarInfoService,
    private _consultarRegistro: consultarRegistroService,
    private _registroAlumno: registroAlumnoComponent) {
    this._MatIconRegister.addSvgIcon('excel', this._DomSanitizer.bypassSecurityTrustResourceUrl('assets/icons/excel.svg'));

  }
  exportAsExcel() {
    const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(this.table.nativeElement);
    const wb: XLSX.WorkBook = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(wb, ws, 'COLEGIOABC-ConsultaRegistroAcademico/Administrativo');
    XLSX.writeFile(wb, 'RegistroAcademico/Administrativo.xlsx');
  }
  //exportar toda la data a excel
  exportAll() {
    const dataSource = this.dataSource.data;
    const ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet(dataSource);
    const wb: XLSX.WorkBook = XLSX.utils.book_new();

    XLSX.utils.book_append_sheet(wb, ws, 'COLEGIOABC-ConsultaRegistroAcademico/Administrativo');
    XLSX.writeFile(wb, 'RegistroAcademico/Administrativo.xlsx');
  }

 applyFilter(event: Event) {
    const filterValue = (event.target as HTMLInputElement).value;
    this.dataSource.filter = filterValue.trim().toLowerCase();
  }

  ngOnInit(): void {

    this._enviarInfo.currentTextColor.subscribe(textColor => {
      this.textColor = textColor;
    });

    this._enviarInfo.currentColor.subscribe(color => {
      this.color = color;
    });
    this.getAlumnos();
  }

  getAlumnos(){
     this._consultarRegistro.getConsultarRegistro().subscribe((data: any) =>{
      console.log(data);
      this.isLoading = false;
      this.dataSource = new MatTableDataSource<any>(data.data);
      this.dataSource.paginator = this.paginator;
     });
  }

  download(id:any){
    this._registroAlumno.descargarPDF(id);
  }

}
