import {
  Component,
  OnInit,
  ChangeDetectionStrategy,
  Input,
  ViewChild,
  OnChanges,
  ChangeDetectorRef,
  Output,
  EventEmitter
} from '@angular/core';
import {SelectionModel} from '@angular/cdk/collections';
import {MatTableDataSource} from '@angular/material/table';
import {MatPaginator} from '@angular/material/paginator';
import {BaseList} from '../../../../../core/base/base-list';
import {AppTokenService} from '../../../../../core/service/security/app-token.service';

@Component({
  selector: 'app-table-swap-subject',
  templateUrl: './table-swap-subject.component.html',
  styleUrls: ['./table-swap-subject.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class TableSwapSubjectComponent extends BaseList implements OnInit , OnChanges {
  @Input() dataSource: any = [];
  @Input() SubjectGetCheck: any = [];
  column = ['1', '2'];
  // data = Object.assign(this.dataSourceRecieve);
  // dataSource = new MatTableDataSource(this.data);
  selection = new SelectionModel(true, []);
  uncheckedData = [];
  @Output() SubjectChecked = new EventEmitter();

  checkedData = [];
  checkedDataSource = new MatTableDataSource(this.checkedData);
  checkedSelection = new SelectionModel(true, []);

  selectedRows = [];
  selectedRowsChecked = [];

  @ViewChild('paginator') paginator: MatPaginator;
  @ViewChild('checkedpaginator') checkedpaginator: MatPaginator;
  constructor(
    private cdRef: ChangeDetectorRef,
  ) {
    super();
  }

  ngOnInit(): void {
  }

  ngOnChanges() {
    this.uncheckedData = this.dataSource;
    this.dataSource = this.updateMatTable(this.dataSource ? this.dataSource : []);
    const DatatableLength = this.dataSource.data;
    if (DatatableLength.length !== 0){
      for (const option of this.SubjectGetCheck) {
        // const exists = DatatableLength.find((x) => x.subject_uid === option.subject_uid);
        const exists = Array.isArray(DatatableLength) ? DatatableLength.find((x) => x.subject_uid === option.subject_uid) : 0;
        if (exists !== 0){
          this.selection.toggle(exists);
          this.transferSelectedRows();
        }
      }
    }
    this.checkedDataSource.paginator = this.checkedpaginator;
  }

  isAllSelected() {
    const numSelected = this.selection.selected.length;
    const numRows = this.dataSource.data.length;
    return numSelected === numRows;
  }

  isAllCheckedSelected() {
    const numSelected = this.checkedSelection.selected.length;
    const numRows = this.checkedDataSource.data.length;
    return numSelected === numRows;
  }


  transferSelectedRows() {
    this.selection.selected.forEach(item => {
      const index: number = this.uncheckedData.findIndex(d => d === item);
      this.checkedData.push(this.uncheckedData[index]);
      this.uncheckedData.splice(index,1);
    });
    this.selection = new SelectionModel(true, []);
    this.dataSource = new MatTableDataSource(this.uncheckedData);
    this.checkedDataSource = new MatTableDataSource(this.checkedData);
    this.dataSource.paginator = this.paginator;
    this.checkedDataSource.paginator = this.checkedpaginator;
    this.sendDataback(this.checkedData);
  }


  removeSelectedRows() {
    this.checkedSelection.selected.forEach(item => {
      const index: number = this.checkedData.findIndex(d => d === item);
      this.uncheckedData.push(this.checkedData[index]);
      this.checkedData.splice(index,1);
    });
    this.checkedSelection = new SelectionModel(true, []);
    this.dataSource = new MatTableDataSource(this.uncheckedData);
    this.checkedDataSource = new MatTableDataSource(this.checkedData);
    this.dataSource.paginator = this.paginator;
    this.checkedDataSource.paginator = this.checkedpaginator;
    this.sendDataback(this.checkedData);
  }

  /** Selects all rows if they are not all selected; otherwise clear selection. */
  masterToggle() {
    this.isAllSelected() ?
      this.selection.clear() :
      this.dataSource.data.forEach(row => this.selection.select(row));
  }

  masterCheckedToggle() {
    this.isAllCheckedSelected()?
      this.checkedSelection.clear() : this.checkedDataSource.data.forEach(row => this.checkedSelection.select(row));
  }

  applyFilter(event: Event) {
    const filterValue = (event.target as HTMLInputElement).value;
    this.dataSource.filter = filterValue.trim().toLowerCase();
  }

  applyFilter2(event: Event) {
    const filterValue2 = (event.target as HTMLInputElement).value;
    this.checkedDataSource.filter = filterValue2.trim().toLowerCase();
  }

  sendDataback(datasend){
    this.SubjectChecked.emit(datasend);
  }

}
