import { Component, OnInit, ViewChild } from '@angular/core';
import { DataBindingDirective } from '@progress/kendo-angular-grid';
import { process } from '@progress/kendo-data-query';
import { trasnactions } from './employees';
import { images } from './images';
import { TransDetailsComponent} from '../trans-details/trans-details.component'

@Component({
  selector: 'app-transaction-list',
  templateUrl: './transaction-list.component.html',
  styleUrls: ['./transaction-list.component.scss']
})
export class TransactionListComponent implements OnInit {

  @ViewChild(DataBindingDirective) dataBinding: DataBindingDirective;
  public gridData: any[] = trasnactions;
  public gridView: any[];

  public mySelection: string[] = [];

  public ngOnInit(): void {
      this.gridView = this.gridData;
  }

  public onFilter(inputValue: string): void {
    //   if (inputValue == ""){
    //       this.gridView = this.gridData;
    //       return;
    //   }
    //   this.gridView = process(this.gridData, {
    //     filter: {
    //         logic: "or",
    //         filters: [
    //             {
    //                 field: 'id',
    //                 operator: 'contains',
    //                 value: 'ced'
    //             },

    //         ],
    //     }
    // }).data;
    // return;
      this.gridView = process(this.gridData, {
          filter: {
              logic: "or",
              filters: [
                  {
                      field: 'clients',
                      operator: 'contains',
                      value: inputValue
                  },
                  {
                      field: 'brokers',
                      operator: 'contains',
                      value: inputValue
                  },
                  {
                      field: 'bdm',
                      operator: 'contains',
                      value: inputValue
                  },
                  {
                      field: 'loan_limit',
                      operator: 'contains',
                      value: inputValue
                  },
                  {
                    field: 'lender',
                    operator: 'contains',
                    value: inputValue
                  },
                  {
                    field: 'status',
                    operator: 'contains',
                    value: inputValue
                  },
                  {
                    field: 'submission_date',
                    operator: 'contains',
                    value: inputValue
                  },
                  {
                    field: 'settlement_date',
                    operator: 'contains',
                    value: inputValue
                  },

                  {
                      field: 'address',
                      operator: 'contains',
                      value: inputValue
                  }
              ],
          }
      }).data;

      this.dataBinding.skip = 0;
  }

  private photoURL(dataItem: any): string {
      const code: string = dataItem.img_id + dataItem.gender;
      const image: any = images;

      return image[code];
  }

  private flagURL(dataItem: any): string {
      const code: string = dataItem.country;
      const image: any = images;

      return image[code];
  }

}
