import { Component, Inject, OnInit } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { CatalogData, DataDialogCatalog } from '../../../../../../interfaces/acquisition-management/provider.interface';
import { ResourcesService } from '../../../../../../services/resources.service';

@Component({
    selector: 'app-catalogs-provider-form',
    templateUrl: './catalogs-provider-form.component.html',
    styleUrl: './catalogs-provider-form.component.css',
    standalone: false
})
export class CatalogsProviderFormComponent implements OnInit {
  public titleDialog: string;
  public isLoading: boolean;
  public isLoadingForm: boolean;
  public formGroup: FormGroup;

  constructor(
    @Inject(MAT_DIALOG_DATA) public dataDialog: DataDialogCatalog,
    public resourcesService: ResourcesService,
    private _dialogRef: MatDialogRef<Array<CatalogData>>,
  ) {
    if (dataDialog.typeDialog === 'REGISTER') {
      this.titleDialog = 'Registro de Catálogo';
    } else if (dataDialog.typeDialog === 'UPDATE') {
      this.titleDialog = 'Modificación de Catálogo';
    }else{
      this.titleDialog = 'Catálogo';
    }

    this.isLoading = false;
    this.isLoadingForm = false;

    this.formGroup = this.createFormGroup()
  }

  private createFormGroup() {
    return new FormGroup({
      'ID_CATALOG': new FormControl( this.dataDialog.dataSource.length + 1, Validators.required),
      'CATALAGO': new FormControl('', Validators.required),
      'DESCRIPCION': new FormControl('', Validators.required),
      'URL_CATALAGO': new FormControl('', [Validators.required, Validators.pattern("[Hh][Tt][Tt][Pp][Ss]?:\/\/(?:(?:[a-zA-Z\u00a1-\uffff0-9]+-?)*[a-zA-Z\u00a1-\uffff0-9]+)(?:\.(?:[a-zA-Z\u00a1-\uffff0-9]+-?)*[a-zA-Z\u00a1-\uffff0-9]+)*(?:\.(?:[a-zA-Z\u00a1-\uffff]{2,}))(?::\d{2,5})?(?:\/[^\s]*)?")]),
      'ESTADO': new FormControl('Nuevo', Validators.required),
    });
  }
  
  ngOnInit(): void {
    this.setDataUpdate();
  }

  private setDataUpdate() {
    if (this.dataDialog.typeDialog === 'UPDATE') {
      this.isLoadingForm = true;
      this.formGroup.controls['ID_CATALOG'].setValue(this.dataDialog.dataElement.ID_CATALOG);
      this.formGroup.controls['CATALAGO'].setValue(this.dataDialog.dataElement.CATALAGO);
      this.formGroup.controls['DESCRIPCION'].setValue(this.dataDialog.dataElement.DESCRIPCION);
      this.formGroup.controls['URL_CATALAGO'].setValue(this.dataDialog.dataElement.URL_CATALAGO);
      if (this.dataDialog.dataElement.ESTADO !== 'Nuevo') {
        this.formGroup.controls['ESTADO'].setValue('Modificado');
      }
      this.isLoadingForm = false;
    }
  }

  public registerCatalog() {
    this.isLoadingForm = true;
    let arrDataSource: Array<CatalogData> = this.dataDialog.dataSource;
    arrDataSource.push(this.formGroup.value);
    this._dialogRef.close(arrDataSource);
    this.isLoadingForm = false;
  }
  
  public updateCatalog() {
    this.isLoadingForm = true;
    let arrDataSource: Array<CatalogData> = this.dataDialog.dataSource;
    arrDataSource = arrDataSource.map((element: CatalogData) => {
      if (element.ID_CATALOG === this.formGroup.controls['ID_CATALOG'].value) {
        element = this.formGroup.value;
      }
      return element;
    });
    this._dialogRef.close(arrDataSource);
    this.isLoadingForm = false;
  }
}
