import { Component, OnInit } from '@angular/core';
import { PageChangeEvent, DataStateChangeEvent } from '@progress/kendo-angular-grid';
import { orderBy, process, SortDescriptor, State } from '@progress/kendo-data-query';
import { KGridHelper } from '../../../_helpers/k-grid.class';
import { NotificationService } from '../../../_services/notification.service';
import { AuthenticationService } from '../../../_services/authentication.service';
import { ChequeService } from '../cheque-services';
import { debounceTime } from 'rxjs/operators';
import { Subject, Subscription } from 'rxjs';
import { BankChequeTransactionViewModel } from '../cheque-class';
import { LocalService } from '../../../_services/local.service';

@Component({
  selector: 'app-cheque-management',
  templateUrl: './cheque-management.component.html'
})
export class ChequeManagementComponent implements OnInit {
  public kGrid: KGridHelper = new KGridHelper();

  public columns: string[] = ['IssueDate', 'BankName', 'ChequeNo', 'Amount', 'Fk_PaymentAccount',
    'AgainstInvoice', 'Attachement', 'Remarks', 'Fk_Status', 'Action'];
  public columnsLabel: string[] = ['Date', 'Bank Name', 'Cheque No', 'Amount', 'Payee / Payeer',
    'Against Invoice', 'Attachement', 'Remarks', 'Status', 'Action'];
  public hiddenColumns: string[] = ['IssueDate', 'BankName', 'ChequeNo', 'Amount', 'Fk_PaymentAccount',
    'AgainstInvoice', 'Attachement', 'Remarks', 'Fk_Status', 'Action'];

  public openDilog = false;
  public openStatusDilog = false;

  public searchEvent = new Subject<any>();
  public searchSubcription: Subscription = null;
  public _recieveChequeStatusList: any = [];
  public _issueChequeStatusList: any = [];
  public _chequeStatusList: any = [];

  public Flags = ['Issued', 'Recieved'];
  public Flags2 = [];
  public _flag = '';
  public _flag2 = '';
  public _dateSelectVisible = false;
  public _fromDate: Date;
  public _toDate: Date;

  constructor(public _notificationService: NotificationService,
    public _authenticationService: AuthenticationService,
    public _chequeService: ChequeService,
    public _localService: LocalService) { }

  public state: State = {
    skip: 0,
    take: 5,
    // Initial filter descriptor
    filter: {
      logic: 'and',
      filters: []
    }
  };

  ngOnInit() {
    this.initializeProps();
    this.handleSearchEvents();
    this._flag = this.Flags[0];
    this.setFlag(this._flag);
    this._flag2 = this.Flags2[0];
    this.setFlag2(this._flag2);

    this.getChequeStatusesByChequeType(1);
    this.getChequeStatusesByChequeType(2);
  }

  public setFlag(flag) {
    this._dateSelectVisible = false;
    this._flag = flag;
    this._flag2 = '';
    this.Flags2 = [];
    this.Flags2 = (flag === this.Flags[0])
      ? ['All', 'Issued', 'Cleared', 'Bounced', 'Returned', 'Cancelled', 'Security']
      : ['All', 'Received', 'Deposited', 'Bounced', 'Cleared', 'Returned', 'Security'];
  }

  public setFlag2(flag2) {
    this._flag2 = flag2;
    // let today = new Date();
    // this._toDate = new Date();
    // this._toDate.setFullYear(today.getFullYear() - 20);
    // this._fromDate = new Date();
    if (this._dateSelectVisible == true) {
      this._dateSelectVisible = false;
      this._toDate = new Date();
      this._fromDate = new Date(this._fromDate.getUTCFullYear() - 30);
    }
    this.getChequeReport();
  }

  mainFlagChanged() {
    this._flag2 = '';
  }

  public customDates() {
    this._dateSelectVisible = true;
    this._fromDate = new Date();
    this._toDate = new Date();
    this._flag = '';
    this._flag2 = '';
  }

  public ItemToUpdate = new BankChequeTransactionViewModel();
  public _TotalAmount = 0;
  onOpenStatusDilog(event) {
    debugger;
    console.log(event);
    this.openStatusDilog = true;
    if (event.FK_ChequeType.Id == 1) {
      // issued
      this.getChequeStatusesByChequeType(1);
    } else {
      // Recieved
      this.getChequeStatusesByChequeType(2);
    }
    this.ItemToUpdate = event;
  }

  UpdateStatus() {
    this._chequeService.saveBankChequeTransaction(this.ItemToUpdate).subscribe((res) => {
      this._notificationService.notify('success', 'Updated Status Successfully!');
      this.getChequeReport();
      this.close('');
    }, (err) => {
      this._notificationService.notify('danger', err.msg);
      this.close('');
    });
  }

  ItemStatusChanged(itu) {
    this._flag2 = itu.Fk_Status.Name;
  }

  getChequeReport() {
    this.kGrid.loading = true;
    //this.kGrid.skip, this.kGrid.pageSize
    this._chequeService.getChequeTransactionList(0, 100, this._fromDate, this._toDate, this._flag, this._flag2).subscribe((res: any) => {
      this.kGrid.data = [];
      this.kGrid.data = this.parseDate(res.DtlList);
      this.kGrid.totalRecords = res.TotalCount;
      this.kGrid.gridView = { data: this.kGrid.data, total: this.kGrid.totalRecords };
      this.kGrid.loading = false;
      console.log(this.kGrid.gridView);
    }, (err) => {
      console.log(err.msg);
      this.handleError(err);
    });
  }

  private initializeProps() {
    this.kGrid.loading = false;
    this.kGrid.pageSize = 20;
    this.kGrid.pageSizes = [20, 50, 100];
  }

  parseDate(list) {
    this._TotalAmount = 0;
    list.forEach(item => {
      this._TotalAmount += item.Amount;
    });
    // for (let i = 0; i < list.length; i++) {
    //   list[i].Status = list[i].Status == true ? 'Active' : 'InActive';
    //   list[i].Bike_Salik = !list[i].Bike_Salik ? 'No' : 'Yes';
    // }
    return list;
  }

  public dataStateChange(state: DataStateChangeEvent): void {
    debugger;
    this.state = state;
    this.kGrid.gridView = process(this.kGrid.data, this.state);
    this.getChequeReport();
  }

  public sortChange(sort: SortDescriptor[]): void {
    if (sort[0].field == 'asd') { return; }
    this.kGrid.sort = sort;
    this.sortData();
  }

  private sortData() {
    this.kGrid.gridView = {
      data: orderBy(this.kGrid.data, this.kGrid.sort),
      total: this.kGrid.totalRecords
    };
  }

  public pageChange(event: PageChangeEvent): void {
    this.kGrid.skip = event.skip;
    this.getChequeReport();
  }

  private handleError(err: any) {
    this.kGrid.loading = false;
    if (err.status == 403) {
      this._authenticationService.logout();
    }
  }

  onBinClick(aid: number) {
    alert(aid);
  }

  public changePagesize(value: any) {
    this.kGrid.pageSize = +value;
    this.kGrid.skip = 0;
    // this.getEmployeelist();
  }

  public close(status) {
    //  this.getEmployeelist();
    this.openDilog = false;
    this.openStatusDilog = false;
  }

  public isHidden(columnName: string): boolean {
    var c = this.columns[this.columnsLabel.indexOf(columnName)];
    return this.hiddenColumns.indexOf(c) > -1;
  }

  public isHiddenGrid(columnName: string): boolean {
    return this.hiddenColumns.indexOf(columnName) > -1;
  }

  public isDisabled(columnName: string): boolean {
    var c = this.columns[this.columnsLabel.indexOf(columnName)]
    return this.columns.length - this.hiddenColumns.length === 1 && !this.isHidden(columnName);
  }

  public hideColumn(columnName: string): void {
    var c = this.columns[this.columnsLabel.indexOf(columnName)];
    const hiddenColumns = this.hiddenColumns;

    if (!this.isHidden(columnName)) {
      hiddenColumns.push(c);
    } else {
      hiddenColumns.splice(hiddenColumns.indexOf(c), 1);
    }
  }

  getChequeStatusesByChequeType(id: number) {

    this._issueChequeStatusList = [];
    this._recieveChequeStatusList = [];
    this._chequeStatusList = [];
    this._chequeService.getChequeStatusesByChequeType(id).subscribe((res: any) => {
      this._chequeStatusList = res;
      if (id == 1) {
        this._issueChequeStatusList = res;
      }
      if (id == 2) {
        this._recieveChequeStatusList = res;
      }
    }, (err) => {
      console.log(err);
    });
  }

  public handleSearchEvents() {
    this.searchSubcription = this.searchEvent.pipe(
      debounceTime(400)).subscribe((x: any) => {
        // console.log(x);
        if (x) {

          if (x.filter == 'Issed_Fk_Status') {
            // issued
            this.getChequeStatusesByChequeType(1);
          }
          if (x.filter == 'Recieved_Fk_Status') {
            // Recieved
            this.getChequeStatusesByChequeType(2);
          }
        }
      });
  }

}