import { SelectionModel } from '@angular/cdk/collections';
import { HttpErrorResponse } from '@angular/common/http';
import { Component, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { MatTableDataSource } from '@angular/material/table';
import { ActivatedRoute, Router } from '@angular/router';
import { lastValueFrom } from 'rxjs';
import { ArtitleService } from 'src/app/services/acquisition-management/acquisition/artitle.service';
import { EncService } from 'src/app/services/enc/enc.service';
import { ResourcesService } from 'src/app/services/resources/resources.service';
import { DetailsArtitleComponent } from '../details-artitle/details-artitle.component';
import { ArtitleResponse, ResponseArtitle, DataTableResponse, ContentArtitle, ObjectRequest, ProductoDetails } from 'src/app/interfaces/acquisition-management/acquisition/artitle.interface';

@Component({
  selector: 'app-artitle-information.component',
  templateUrl: './artitle-information.component.html',
  styleUrls: ['./artitle-information.component.css']
})
export class ArtitleInformationComponent implements OnInit {

  // ---- SmartPage ----
  public btnSmall: boolean = false;
  public card_size = 'card-size-normal mat-elevation-z8';

  public displayedColumns: string[] = ['SELECT','MODELO','CODIGO','CARACTERISTICAS','CANTIDAD','PRECIO','ACCIONES'];
  public dataSource = new MatTableDataSource<DataTableResponse>([]);
  public selection = new SelectionModel<DataTableResponse>(true, []);

  private idArtitle:string;
  private idProvider:string;

  public isLoading: boolean;

  public artitle: ArtitleResponse
  public quantityCarArtitle: number;

  constructor(
    public resourcesService: ResourcesService,
    private dialog: MatDialog,
    private _activatedRouter: ActivatedRoute,
    private _encService: EncService,
    private _router: Router,
    private _artitleServices: ArtitleService,
    private _resourceService: ResourcesService,
  ) {
    this.isLoading = false;
    this.artitle = {} as ArtitleResponse;
    this.quantityCarArtitle = null !;
    this.idArtitle = "";
    this.idProvider = "";
  }

  async ngOnInit() {
    // Método para renderizar los tamaños de la pantalla
    this.onResize();
    // Se obtiene la información del artículo
    this.getIdProviderAndIdArtitle();
    // Se obtienen los artículos del carrito de compra
    this.getQuantityCarArtitle();
  }

  // Método para obtener los ID del Artículo y del Proveedor para realizar la búsqueda
  private async getIdProviderAndIdArtitle(){
    try{
      // Se obtiene el identificador del id del artículo encriptado
      let encIdArtitle:string = this._activatedRouter.snapshot.paramMap.get('idArtitle')!;
      // Se obtiene el identificador del id del proveedor encriptado
      let encIdProvider:string = this._activatedRouter.snapshot.paramMap.get('idProvider')!;

      this.idArtitle = await this._encService.desencriptar(encIdArtitle);

      this.idProvider = await this._encService.desencriptar(encIdProvider);

      // Se verifica que los ID sean válidos
      if ( (encIdArtitle !== '' && encIdArtitle !== null) && (encIdProvider !== '' && encIdProvider !== null)) {
        // Se obtiene el artículo seleccionado mediante los ID del artículo y el proveedor
        this.getArtitle(encIdArtitle, encIdProvider);
      }else{
        this.resourcesService.openSnackBar('Ocurrió un error al obtener el identificador del artículo y/o proveedor, intentelo nuevamente.');
        this._router.navigate(['/sam/shopping']);
      }
    }catch(error: any){
      this.resourcesService.openSnackBar('Ocurrió al desencriptar el identificador del artículo y/o proveedor.');
      this._router.navigate(['/sam/shopping']);
    }
  }

  private async getArtitle(encIdArtitle:string, encIdProvider:string){
    this.isLoading = true;
    let objRequest:ObjectRequest = {
      lineNumber: 1,
      idArtitle: encIdArtitle,
      idProvider: encIdProvider,
    }
    await lastValueFrom(this._artitleServices.getArtitleByProvider(objRequest)).then(
      (data: ResponseArtitle) => {
        this.artitle = !data.error ? data.response : { } as ArtitleResponse;
        this.dataSource.data = this.setQuatityTable( JSON.parse(this.artitle.INFO_PRODUCTO) );
      }, (error: HttpErrorResponse) => this._resourceService.checkErrors(error)
    );
    this.isLoading = false;
  }

  // Colocación de la variable de CANTIDAD
  private setQuatityTable(arrTables: Array<DataTableResponse>): Array<DataTableResponse>{
    let arrNewData: Array<DataTableResponse> = [];
    arrTables.map( (element:DataTableResponse) => {
      element.CANTIDAD = 0;
      arrNewData.push(element);
    })
    return arrNewData;
  }

  // Método para obtener la cantidad de productos en el carrito
  public async getQuantityCarArtitle() {
    // Se obtiene los datos del localstorage del carrito de compra
    let localStorageCar = localStorage.getItem('car_shopping_artitles');
    // Se valida que la variable se encuentre en el localstorage
    let strItemsCar:string = localStorageCar !== null && localStorageCar !== undefined ?  localStorageCar : '';
    // Se verifica si hay articulos en el localstorage
    if (strItemsCar?.length === 0) {
      // Se coloca la cantidad como null
      this.quantityCarArtitle = null!;
    }else{
      // Se desencripta la cadena obtenida por el localstorage
      let decArtitlesSelected: string = await this._encService.desencriptar(strItemsCar);
      // Se transforma a un arreglo los datos guardados del localstorage
      let arrCarShopping: Array<ContentArtitle> = JSON.parse(decArtitlesSelected);

      // Se ingresa la cantidad a la variable global
      arrCarShopping.map( (element:ContentArtitle) => {
        this.quantityCarArtitle += element.content.length;
      });
      this.quantityCarArtitle = this.quantityCarArtitle > 0 ? this.quantityCarArtitle : null!;
    }
  }

  // Agregar artículos al carrito de compra
  public async getShoppingCar() {
    let error: boolean = false;
    if (this.selection.selected.length === 0) {
      this._resourceService.openSnackBar("Selecciona un artículo antes de agregar al carrito.");
      error = true;
    }else{
      this.selection.selected.map( (element:DataTableResponse) => {
        if(element.CANTIDAD <= 0) {
          this._resourceService.openSnackBar("Los artículos seleccionados debe tener una cantidad asignada.");
          error = true;
        }
      });
    }

    // En caso de no haber un error, entonces
    if (!error) {
      // Se obtiene los datos del localstorage del carrito de compra
      let localStorageCar = localStorage.getItem('car_shopping_artitles');
      // Se valida que la variable se encuentre en el localstorage
      let strItemsCar:string = localStorageCar !== null && localStorageCar !== undefined ?  localStorageCar : '';

      /**
         * Caso 1: En caso no haber ningun artículo en el carrito, se inicializará el arreglo y se uniran los artículos
         * Caso 2: En caso de ya existir el mismo artículo en el carrito y del mismo producto, entonces solo se aumentará la cantidad en el carrito
         * Caso 3: En caso de ya existir el mismo artículo en el carrito pero diferente producto, entonces solo se agregará al contenido del artículo del carrito
         * Caso 4: En caso de no existir, entonces solo se ingresa el nuevo artículo en el carrito
         */

      // Se verifica si hay articulos en el localstorage
      if (strItemsCar?.length === 0) {
        // Caso 1
        // Objeto con el contenido a ingresar
        let artitlesSelected: ContentArtitle = {
          idArtitle: this.artitle.ID_DESC_ARTI,
          artitle: this.artitle.MODELO,
          idProvider: this.artitle.ID_PROVEEDOR,
          url_imagen: this.artitle.URL_IMAGEN,
          content: this.selection.selected
        }
        // Se inicializa la variable del carrito
        let arrArtitles: Array<ContentArtitle> = [];
        // Se ingresan los artíulos en el carrito
        arrArtitles.push(artitlesSelected);

        // El arreglo del carrito se transforma a una cadena
        let strArtitlesSelected: string = JSON.stringify( arrArtitles );

        // La cadena es encriptada para subirla al localstorage
        let encArtitlesSelected: string = await this._encService.encriptar(strArtitlesSelected);

        // Se guarda el carrito encriptado en el almacenamiento
        localStorage.setItem('car_shopping_artitles', encArtitlesSelected);
      }else{

        // Se desencripta la cadena obtenida por el localstorage
        let decArtitlesSelected: string = await this._encService.desencriptar(strItemsCar);
        // Se transforma a un arreglo los datos guardados del localstorage
        let arrCarShopping: Array<ContentArtitle> = JSON.parse(decArtitlesSelected);

        // Caso 2
        // Se iteran todos los artículos del carrito
        arrCarShopping.map( (elementCarShopping:ContentArtitle, indexCarShopping:number) => {
          // Se identifica si existe el artículo seleccionado en el carrito
          if (elementCarShopping.idArtitle === this.idArtitle) {
            // En caso de existir, entonces se obtienen los productos seleccionados
            let arrContenido: Array<DataTableResponse> = elementCarShopping.content;
            // Se iteran los productos del carrito
            arrContenido.map( (elementContent:DataTableResponse, indexContent:number) => {
              // Se iteran los productos seleccionado
              this.selection.selected.map( (elementSelection:DataTableResponse, indexSelection:number) => {
                // Se identifica si algún producto del carrito coincide con los seleccionados
                if (elementContent.NUMERO_PRODUCTO === elementSelection.NUMERO_PRODUCTO) {
                  // Se le suma la cantidad seleccionada con la del carrito
                  elementContent.CANTIDAD += elementSelection.CANTIDAD;
                  // Se elimina el producto seleccioando ya que fue ya ingresado al carrito
                  this.selection.selected.splice(indexSelection, 1);
                }
              });
            });
            elementCarShopping.content = arrContenido;
          }
        });

        // Caso 3
        // Se veririca que existan datos seleccioandos
        if (this.selection.selected.length > 0) {
          // Se iteran todos los artículos del carrito
          arrCarShopping.map( (elementCarShopping:ContentArtitle, indexCarShopping:number) => {
            // Se identifica si existe el artículo seleccionado en el carrito
            if (elementCarShopping.idArtitle === this.idArtitle) {
              elementCarShopping.content = elementCarShopping.content.concat(this.selection.selected);
              this.selection.clear();
            }
          });
        }

        // Caso 4
        // Se veririca que existan datos seleccioandos
        if (this.selection.selected.length > 0) {
          // Objeto con el contenido a ingresar
          let artitlesSelected: ContentArtitle = {
            idArtitle: this.artitle.ID_ARTICULO,
            artitle: this.artitle.MODELO,
            idProvider: this.artitle.ID_PROVEEDOR,
            url_imagen: this.artitle.URL_IMAGEN,
            content: this.selection.selected
          }
          // Se ingresa el objeto con los nuevos artículos al carrito
          arrCarShopping.push(artitlesSelected);
        }

        // El arreglo ya unido se transforma a una cadena
        let strArtitlesSelected: string = JSON.stringify(arrCarShopping);
        // La cadena se encripta
        let encArtitlesSelected: string = await this._encService.encriptar(strArtitlesSelected);
        // Se coloca la cadena encriptra en el localstorage en la variable del carrito de compra
        localStorage.setItem('car_shopping_artitles', encArtitlesSelected);
      }
      // Se redirige al carrito
      this._resourceService.openSnackBar('¡Artículos Agregados!');
      this._router.navigate(['/sam/shopping-cart']);
    }

  }

  // Modificación de la cantidad de los productos
  public quantityProducts(accion: string, data: any) {
    console.log(data);

    this.dataSource.data.map( (element:any) => {
      if (element.NUMERO_INFORMACION === data.NUMERO_INFORMACION && accion == 'suma') {
        element.CANTIDAD ++;
      }else if (element.NUMERO_INFORMACION === data.NUMERO_INFORMACION && accion == 'resta') {
        element.CANTIDAD --;
      }
    } );
  }

  // Validación de la cantidad de los artículos
  public validateQuantity(cantidad: number, data: any){
    if (cantidad < 0 ) {
      this.dataSource.data.map( (element:any) => {
        if (element.NUMERO_INFORMACION === data.NUMERO_INFORMACION) {
          element.CANTIDAD = 0;
        }
      } );
    }
  }

  // Regresar a la pantalla anterior
  public goBack() {
    window.history.back();
  }

  // Abrir dialogos
  public openDialog(action: string, data: any = null) {
    if (action === 'VIEW') {

      let objArtitle: ProductoDetails = {
        ID_DESC_ARTI: this.artitle.ID_ARTICULO,
        ID_ARTICULO:this.artitle.ID_ARTICULO,
        CODIGO_ARTICULO: this.artitle.CODIGO,
        MODELO_ARTICULO: this.artitle.MODELO,
        ID_ARTICULO_FAMILIA: this.artitle.ID_FAMILIA,
        FAMILIA_ARTICULO: this.artitle.FAMILIA,
        ID_ARTICULO_SUBFAMILIA: this.artitle.ID_SUBFAMILIA,
        SUBFAMILIA_ARTICULO: this.artitle.SUBFAMILIA,
        DESCRIPCION_ARTICULO: this.artitle.DESCRIPCION,
        CARACTERISTICAS_ARTICULO: this.artitle.CARACTERISTICAS,
        COMPRA_ARTICULO_WEB: this.artitle.COMPRA_WEB,
        TIPO_ARTICULO: this.artitle.TIPO,
        URL_ARTICULO_IMAGEN: this.artitle.URL_IMAGEN,
        ID_ARTICULO_PROVEEDOR: this.artitle.ID_PROVEEDOR,
        PROVEEDOR_ARTICULO: this.artitle.PROVEEDOR,
        CODIGO_PRODUCTO: data.CODIGO,
        MODELO_PRODUCTO: data.MODELO,
        PRECIO_PRODUCTO: data.PRECIO,
        CANTIDAD_PRODUCTO: data.CANTIDAD,
        CARACTERISTICAS_PRODUCTO: data.CARACTERISTICAS,
        NUMERO_PRODUCTO: data.NUMERO_PRODUCTO,
      }

      const dialogRef = this.dialog.open(DetailsArtitleComponent, {
        width: '800px',
        disableClose: true,
        data: objArtitle
      });
    }
  }

  // Método para reajustar la pantalla
  public onResize() {
    if (window.innerWidth <= 1400) {
      this.btnSmall = true;
      this.card_size = 'card-size-small';
    } else if (window.innerWidth > 1400) {
      this.btnSmall = false;
      this.card_size = 'card-size-normal mat-elevation-z8';
    }
  }

  public isAllSelected() {
    const numSelected = this.selection.selected.length;
    const numRows = this.dataSource.data.length;
    return numSelected === numRows;
  }

  public toggleAllRows() {
    if (this.isAllSelected()) {
      this.selection.clear();
      return;
    }
    this.selection.select(...this.dataSource.data);
  }

  public checkboxLabel(row?: any): string {
    if (!row) {
      return `${this.isAllSelected() ? 'deselect' : 'select'} all`;
    }
    return `${this.selection.isSelected(row) ? 'deselect' : 'select'} row ${row.codigo + 1}`;
  }
}
