import { Component, OnInit, Input, NgModule, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { OverlayPanel, OverlayPanelModule } from 'primeng/overlaypanel';
import { TableModule } from 'primeng/table';
import { CommonModule } from '@angular/common';
import { AuditTrailService } from 'ekangularbase/src/service/object/audit-trail.service';
import { AuditTrailClass } from 'ekangularbase/src/interface/audit-trail';
import { EtableColumn } from 'ekangularbase/src/interface/EtableColumn';
import { SelectItem } from 'primeng/api';
import { DropdownModule } from 'primeng/dropdown';
import { FormsModule } from '@angular/forms';
import { FieldHasAuditTrailClass } from 'ekangularbase/src/interface/field-has-audit-trial';


@Component({
  selector: 'app-audit-trail-list',
  templateUrl: './audit-trail-list.component.html',
  styleUrls: ['./audit-trail-list.component.css'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class AuditTrailListComponent implements OnInit {
  cols: EtableColumn[];
  columnOption: SelectItem[];
  selectedColumnOption: SelectItem;

  loading = false;
  @Input() rowID: string;
  @Input() entityName: string;
  @Input() columns: EtableColumn[];
  @Input() baseZIndex = 10000;
  @Input() columnList: string[] = [];

  fieldName: string;
  displayFieldName: string;

  auditList: AuditTrailClass[];


  constructor(private auditTrailService: AuditTrailService, private cd: ChangeDetectorRef) {
    }
  ngOnInit() {

    this.cols = [
      { visible: true, field: 'changeDate', header: 'Updated Date',  width: '51'},
      { visible: true, field: 'changeBy', header: 'Updated By',  width: '50'},
      { visible: true, field: 'before', header: 'Before Value', width: '50'},
      { visible: true, field: 'after', header: 'After Value',  width: '50'}

    ];

  }

  showAuditTrailEvent(event, overlaypanel: OverlayPanel) {
    console.log(this.columnList);
    if (this.columnList && this.columnList.length > 0) {
      this.getAuditDetailsByColumnList();
    } else { this.getAuditDetails(); }
    overlaypanel.toggle(event);
  }

  getAuditDetailsByColumnList() {
    this.loading = true;
    this.selectedColumnOption = null;
    this.auditTrailService.PostHasChanges(this.entityName, this.rowID, this.columnList).subscribe(feilds => {
        this.bindFields(feilds);
    });
  }

  bindFields(feilds: FieldHasAuditTrailClass[]) {
    this.columnOption = [];

    feilds.forEach(f => {
      if (f.hasChanges) {
          const c = this.columns.find(s => s.field.toLowerCase() === f.fieldName.toLowerCase());
          if (c) {
              this.columnOption.push({value: f.fieldName, label: c.header});
          } else {
              const cc = this.columns.find(s => s.field.toLowerCase() ===
                  f.fieldName.substr(0, f.fieldName.length - 2).toLowerCase() && s.isSubObject === true);
              if (cc) {
                  this.columnOption.push({value: f.fieldName, label: cc.header});
              } else {
                  this.columnOption.push({value: f.fieldName, label: f.fieldName});
              }
          }
      }
    });

    if (this.columnOption.length > 0) {
        this.auditList = [];
        this.selectedColumnOption = this.columnOption[0].value;
        this.displayFieldName = this.columnOption[0].label;
        this.auditTrailService.GetChanges(this.entityName, this.rowID, this.columnOption[0].value).subscribe(res => {
        this.auditList = res;
        this.loading = false;
        this.cd.detectChanges();
       }, error => {
            this.loading = false;
            console.log(error);
       });
    } else {
        this.loading = false;
    }
  }

  getAuditDetails() {
    this.loading = true;
    this.selectedColumnOption = null;
    this.auditTrailService.GetHasChanges(this.entityName, this.rowID).subscribe(feilds => {
      this.bindFields(feilds);
    });
  }

  columnChange(event) {
    this.loading = true;
    this.auditList = [];
    console.log(this.selectedColumnOption);
    this.displayFieldName = event.originalEvent.srcElement.textContent;
    this.auditTrailService.GetChanges(this.entityName, this.rowID, event.value).subscribe(res => {
        this.auditList = res;
        this.loading = false;
        this.cd.detectChanges();
        }, error => {
            this.loading = false;
            console.log(error);
    });
    // overlaypanel.toggle(event);
  }

}

@NgModule({
  imports: [CommonModule, TableModule, OverlayPanelModule, DropdownModule, FormsModule],
  exports: [AuditTrailListComponent],
  declarations: [AuditTrailListComponent]
})
export class AuditTrailListModule { }