import { AfterViewInit, Component, ViewChild } from '@angular/core';
import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from '@angular/material/table';
import { AlertaComponent } from 'src/app/components/resources/dialogos/alerta/alerta.component';
import { MCOMDFService } from 'src/app/services/mco/mcomdf/mcomdf.service';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';

import {
  MAT_MOMENT_DATE_FORMATS,
  MomentDateAdapter,
  MAT_MOMENT_DATE_ADAPTER_OPTIONS,
} from '@angular/material-moment-adapter';
import {
  DateAdapter,
  MAT_DATE_FORMATS,
  MAT_DATE_LOCALE,
} from '@angular/material/core';
import 'moment/locale/es';
import { MCOMDFMOTIVOComponent } from '../mcomdf-motivo/mcomdf-motivo.component';
import { IAMService } from 'src/app/services/iam/iam.service';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ENCService } from 'src/app/services/enc/enc.service';
import { USERInterface } from 'src/app/interfaces/user-interface';

@Component({
  selector: 'app-mcomdf-form',
  templateUrl: './mcomdf-form.component.html',
  styleUrls: ['./mcomdf-form.component.css'],
  providers: [
    { provide: MAT_DATE_LOCALE, useValue: 'es-MX ' },
    {
      provide: DateAdapter,
      useClass: MomentDateAdapter,
      deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS],
    },
    { provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
  ],
})
export class MCOMDFFORMComponent implements AfterViewInit {
  usuario_session: USERInterface = JSON.parse(
    localStorage.getItem('TIMUSERENC')!
  );
  selected: any;
  loading_register: boolean = false;
  nombreMeses: any[] = [
    'Enero',
    'Febrero',
    'Marzo',
    'Abril',
    'Mayo',
    'Junio',
    'Julio',
    'Agosto',
    'Septiembre',
    'Octubre',
    'Noviembre',
    'Diciembre',
  ];
  dia_repetido = false;
  cont = 0;
  visibility = 'hidden';
  diasSeleccionados: any[] = [];
  displayedColumns: string[] = ['fecha', 'motivo', 'accion'];
  dataSource = new MatTableDataSource<any>(this.diasSeleccionados);
  todayDate = new Date();

  @ViewChild(MatPaginator) paginator!: MatPaginator;

  ngAfterViewInit() {
    this.dataSource.paginator = this.paginator;
    this.paginator._intl.itemsPerPageLabel = 'Datos por página';
    this.paginator._intl.firstPageLabel = 'Primera Página';
    this.paginator._intl.lastPageLabel = 'Últmina Página';
    this.paginator._intl.nextPageLabel = 'Siguiente Página';
    this.paginator._intl.previousPageLabel = 'Anterior Página';
  }

  constructor(
    public dialog: MatDialog,
    private _mcomdfService: MCOMDFService,
    private _router: Router,
    private _snackBar: MatSnackBar,
    private _encService: ENCService
  ) {}

  addEvent(e: any) {
    if (this.selected != undefined && !this.loading_register) {
      if (this.diasSeleccionados.length > 4) {
        this.visibility = 'visible';
      }

      if (e.target.innerText > 0 && e.target.innerText <= 31) {
        const dialogRef = this.dialog.open(MCOMDFMOTIVOComponent);

        dialogRef.afterClosed().subscribe((result) => {
          if (result && result !== undefined) {
            this.diasSeleccionados.push({
              id: this.cont++,
              date: this.selected._d,
              dateString: `${this.selected._d.getDate()} de ${
                this.nombreMeses[this.selected._d.getMonth()]
              }`,
              motivo: result,
            });

            this.dataSource.data = this.diasSeleccionados;
          }
        });
      }
    }
  }

  obtener(item: any) {
    this.dataSource.data = item;
  }

  deleteItem(item: any) {
    let index = this.dataSource.data.indexOf(item);
    this.dataSource.data.splice(index, 1);

    this.obtener(this.dataSource.data);
  }

  async registrar() {
    let dia_repetido = await this.processData(this.dataSource.data);
    if (!dia_repetido) {
      this._router.navigate(['/admin/mcomdf']);
    }
  }

  habilitar(item: any) {
    let data = {
      dia: item.dia,
      mes: item.mes,
      anio: item.anio,
      id_usuario_habilita: this._encService.desencriptar(
        this.usuario_session.IDUSUARIO
      ),
    };

    this._mcomdfService.habilitar(data);
    this._router.navigate(['/admin/mcomdf']);
  }

  async openDialog(accion: string, item: any = null) {
    let dataAction = {};

    switch (accion) {
      case 'Crear':
        dataAction = {
          titulo: 'Confirmación',
          descripcion:
            this.dataSource.data.length > 1
              ? `¿Está seguro de registrar las ${this.dataSource.data.length} fechas? `
              : `¿Está seguro de registrar esta fecha?`,
        };
        break;
      case 'Habilitar':
        dataAction = {
          titulo: 'Confirmación',
          descripcion: `¿Está seguro de habilitar el día ${item.dia}/${item.mes}/${item.anio}?`,
        };
        break;
    }

    const dialogRef = this.dialog.open(AlertaComponent, {
      data: dataAction,
    });

    dialogRef.afterClosed().subscribe((result) => {
      if (result) {
        switch (accion) {
          case 'Crear':
            this.registrar();
            break;
          case 'Habilitar':
            this.habilitar(item);
            break;
          default:
            alert('Ocurrió un error inesperado');
        }
      }
    });
  }

  private async processData(fecha: any) {
    this.loading_register = true;
    let data: any;
    let dia_repetido = false;
    await fecha.forEach((element: any) => {
      data = {
        anio: element.date.getFullYear(),
        mes: element.date.getMonth() + 1,
        dia: element.date.getDate(),
        motivo: element.motivo,
        rfc_empresa: this.usuario_session.RFCEMPRESA,
        id_usuario_registra: this._encService.desencriptar(
          this.usuario_session.IDUSUARIO
        ),
      };

      this._mcomdfService.crear(data).subscribe(
        (res) => {
          if (!res.error) {
            this.snackAlert('¡Registro Exitoso!');
          } else {
            this.snackAlert(res.msg);
          }
        },
        async (error) => {
          if (
            error.error.msg ==
            'ERR_MCOMDF_SER_CRE003: El día feriado ya existe.'
          ) {
            dia_repetido = true;
            this.openDialog('Habilitar', data);
          }
          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');
          }
        }
      );
    });
    const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
    await sleep(5000);
    this.loading_register = false;
    return dia_repetido;
  }

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