import { Component, OnInit } from '@angular/core';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MesmprInterface } from 'src/app/interfaces/mes/mesmpr/mesmpr-interface';
import { USERInterface } from 'src/app/interfaces/user-interface';
import { IAMService } from 'src/app/services/iam/iam.service';
import { MESMPRService } from 'src/app/services/mes/mesmpr/mesmpr.service';
import { MESMPRDetallesInterface } from 'src/app/interfaces/mes/mesmpr/mesmpr-detalles-interface';
import { ENCService } from 'src/app/services/enc/enc.service';
import { MesmprVacacionesInterface } from 'src/app/interfaces/mes/mesmpr/mesmpr-vacaciones-interface';
import { TileStyler } from '@angular/material/grid-list/tile-styler';
import { ResponseData } from 'src/app/interfaces/response-data';
@Component({
  selector: 'app-mesmpr',
  templateUrl: './mesmpr.component.html',
  styleUrls: ['./mesmpr.component.css'],
})
export class MESMPRComponent implements OnInit {
  loading: Boolean = true;
  
  public detalles: Array<any> = [];

  public periodos: Array<MesmprInterface> = [] as Array<MesmprInterface>;


  public caso0: boolean = false;
  public casoEAYG: boolean = false;
  public casoActual: boolean = false;
  public casoAnterior: boolean = false;

  public periodoEAYG: string = "2020-2021";
  public periodoActual: string = "2020-2021";
  public periodoAnterior: string = "2020-2021";

  public fechaVencimientoEAYG: string = "2020-2021";
  public fechaVencimientoActual: string = "2020-2021";
  public fechaVencimientoAnterior: string = "2020-2021";

  public diasDisponiblesEAYG: number = 10;
  public diasDisponiblesActual: number = 10;
  public diasDisponiblesAnterior: number = 10;

  public diasPeriodoEAYG: number = 5;
  public diasPeriodoActual: number = 5;
  public diasPeriodoAnterior: number = 5;

  public diasTomadosEAYG: number = 5;
  public diasTomadosActual: number = 5;
  public diasTomadosAnterior: number = 5;

  public diasSolicitadosEAYG: number = 0;
  public diasSolicitadosActual: number = 0;
  public diasSolicitadosAnterior: number = 0;

  usuario: string = '';
  usuario_session: USERInterface = JSON.parse(
    localStorage.getItem('TIMUSERENC')!
  );

  constructor(
    private _mesmprService: MESMPRService,
    private _iamService: IAMService,
    private _snackBar: MatSnackBar,
    private _encService: ENCService
  ) {
    this.usuario = this.usuario_session.NOMBRE;
  }

  ngOnInit(): void {
    this.obtener();
  }

  private async obtener() {
    this._mesmprService.obtener().subscribe(
      (res: ResponseData) => {        
        if (res.status == 'Token is Expired') {
          this._iamService.logout();
          this.snackAlert('Sesión expirada. Vuelva a iniciar sesión');
        }else{
          let verPeriodos:MesmprInterface[] = res.response.filter((element:any) => element.CADUCADO === "No"  && element.DETALLES.length > 0);

          this.periodos = verPeriodos;                 
          this.obtenerCasos(res.response);
          this.loading = false;
        }
      },
      (error) => {
        console.log(error);
        
        if (!error.ok) {
          this.snackAlert('Ocurrió un error inesperado');
        }
        if (error.error.msg != undefined) {
          this.snackAlert(error.error.msg);
        }
        if (error.status == 408) {
          this.snackAlert('Conexion lenta');
        }
      }
    );
  }

  private obtenerCasos(response: Array<MesmprInterface>){
    let verPeriodos:MesmprInterface[] = response.filter(element => element.CADUCADO === "No");
    if(verPeriodos.length == 0){
      this.caso0 = true;
    }else{
      let periodoAux = verPeriodos;
      periodoAux.map(element => {
        if (element.DETALLES.length > 0) {
          this.detalles = [...element.DETALLES];
        }
        return element;
      });
      
      if (verPeriodos.some(element => element.ESEAYG === "Si")) {
        let eayg:MesmprInterface = verPeriodos.pop()!;

        this.periodoEAYG = this.formatoPeriodo(eayg.PERIODO) // Periodo en años 'Periodo EAYG'
        this.fechaVencimientoEAYG = this.formatoFecha(eayg.PERIODO.split('|')[1]); // Fecha de vencimiento del periodo
        this.diasPeriodoEAYG = this.obtenerDiasPeriodos(eayg.DETALLES) + eayg.VACACIONESDISPONIBLES; // Cantidad de días disponibles por periodo 'Días por periodo' EAYG
        this.diasDisponiblesEAYG = eayg.VACACIONESDISPONIBLES; // Cantidad de 'Días disponibles' EAYG
        this.diasTomadosEAYG = this.obtenerDiasTomados(eayg.DETALLES) // Cantidad de días tomados 'Días tomados' EAYG
        this.diasSolicitadosEAYG = this.obtenerDiasSolicitados(eayg.DETALLES);
        this.casoEAYG = true;
      }

      if (verPeriodos.length > 0){
        let actual:MesmprInterface = verPeriodos.pop()!;

        this.periodoActual = this.formatoPeriodo(actual.PERIODO) ; // Periodo en años 'Periodo EAYG'
        this.fechaVencimientoActual = this.formatoFecha(actual.PERIODO.split('|')[1]); // Fecha de vencimiento del periodo
        this.diasPeriodoActual = this.obtenerDiasPeriodos(actual.DETALLES) + actual.VACACIONESDISPONIBLES; // Cantidad de días disponibles por periodo 'Días por periodo' EAYG
        this.diasDisponiblesActual = actual.VACACIONESDISPONIBLES; // Cantidad de 'Días disponibles' EAYG
        this.diasTomadosActual = this.obtenerDiasTomados(actual.DETALLES) // Cantidad de días tomados 'Días tomados' EAYG
        this.casoActual = true;
      }
      
      if (verPeriodos.length > 0){
        let anterior:MesmprInterface = verPeriodos.pop()!;

        this.periodoAnterior = this.formatoPeriodo(anterior.PERIODO) ; // Periodo en años 'Periodo EAYG'
        this.fechaVencimientoAnterior = this.formatoFecha(anterior.PERIODO.split('|')[1]); // Fecha de vencimiento del periodo
        this.diasPeriodoAnterior = this.obtenerDiasPeriodos(anterior.DETALLES) + anterior.VACACIONESDISPONIBLES; // Cantidad de días disponibles por periodo 'Días por periodo' EAYG
        this.diasDisponiblesAnterior = anterior.VACACIONESDISPONIBLES; // Cantidad de 'Días disponibles' EAYG
        this.diasTomadosAnterior = this.obtenerDiasTomados(anterior.DETALLES) // Cantidad de días tomados 'Días tomados' EAYG

        this.casoAnterior = true;
      }
    }
  }
  
  private obtenerDiasPeriodos(detalles: Array<MesmprVacacionesInterface>){
    if (detalles.length > 0) {
      let total:number = 0;
      
      detalles.map( detalle => {
        if(detalle.DIASTOMADOS === 0){
          total += detalle.DIASSOLICITADOS
        }
        total += detalle.DIASTOMADOS
      });
      return total;
    }else{
      return 0;
    }
  }

  private obtenerDiasTomados(detalles: Array<MesmprVacacionesInterface>){
    if (detalles.length > 0) {
      let total:number = 0;
      detalles.map( detalle => {
        total += detalle.DIASTOMADOS
      });
      return total;
    }else{
      
      return 0;
    }
  }

  public formatoDetalles(detalles: Array<MesmprVacacionesInterface>):Array<any>{
    let respuesta = detalles.map(element => {
      let arrFecha = element.FECHASVACACIONES.split('|');
      return {
        fecha_inicio: arrFecha[0],
        fecha_fin: arrFecha[0],
        dias_tomados: element.DIASTOMADOS
      }
    });    
    return respuesta;
  }

  private obtenerDiasSolicitados(detalles:Array<MesmprVacacionesInterface> ){
    if (detalles.length > 0) {
      let total:number = 0;
      detalles.map( detalle => {
        total += detalle.DIASSOLICITADOS
      });
      return total;
    }else{
      
      return 0;
    }
  }

  construirPeriodo(periodo:String){
    let arr_periodo = periodo.split("|");
    let anio_inicio = arr_periodo[0].split("-")[0];
    let anio_final = arr_periodo[1].split("-")[0];
    return `${anio_inicio}-${anio_final}`
  }


  formatoPeriodo(periodo: String): string {
    let anios = periodo.split('|');
    return anios[0].split('-')[0] + '-' + anios[1].split('-')[0];
  }

  formatoDosPeriodo(periodo: String): string {
    let anios = periodo.split('|');
    return anios[0].split('/')[0] 
  }

  formatoFecha(fecha: string): string {
    let split = fecha.split('-');
    return `${split[2]}-${split[1]}-${split[0]}`;
  }

  private snackAlert(mensaje: string) {
    this._snackBar.open(mensaje, 'Cerrar', {
      duration: 4000,
    });
  }
}
