import { Component, HostListener, Inject, OnInit } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { BusinessParametersService } from '../../services/business-parameters.service';
import { BytebotSettingsService } from 'projects/bytebot-html/src/app/services/bytebot-settings-service';
import { first } from 'rxjs/operators';

export interface DialogData {
  title: string;
}

@Component({
  selector: 'byte-change-history-dialog',
  templateUrl: './change-history-dialog.component.html',
  styleUrls: ['./change-history-dialog.component.scss']
})
export class ChangeHistoryDialogComponent implements OnInit {
  short = 'dd/M/yyyy';
  dataSource = [];
  displayedColumns = ['from', 'to', 'value'];
  id: any;
  description: any;
  protected title: string = "";
  logo: any;
  logoTipo: any;
  logoBase64: any;
  logoSrc: any;
  isExistDataSource: boolean = true;

  constructor(
    public dialogRef: MatDialogRef<ChangeHistoryDialogComponent>,
    protected service: BusinessParametersService,
    private BytebotSettingsService: BytebotSettingsService,
    @Inject(MAT_DIALOG_DATA) public data: any) {
    this.BytebotSettingsService.getApplicationSettings().pipe(first()).subscribe(result => {
      this.logo = result;
      this.logoTipo = this.logo.tipo;
      this.logoBase64 = this.logo.logoBase64;
      this.logoSrc = 'data:image/'.concat(this.logoTipo, ';base64,', this.logoBase64);
    });
    this.id = this.data.id;
    console.log(this.id);
    this.service.getConfiguration(this.id).subscribe(res => {
      this.dataSource = res;
      console.log(this.dataSource);
      if (this.dataSource.length === 0) {
        this.isExistDataSource = false;
      } else {
        this.isExistDataSource = true;
      }
    });
    
  }

  ngOnInit() {
  }

  close() {
    this.dialogRef.close({ id: 1, descripcion: "Histórico de cambios" });
  }

  ok() {
    // Logica del modal
  }

  @HostListener('window:keyup.esc') onKeyUp() {
    this.dialogRef.close({ success: false });
  }
}
