import {Component, OnInit, ChangeDetectionStrategy, Input, OnChanges, ChangeDetectorRef, Output, EventEmitter} from '@angular/core';
import {MatTableDataSource} from '@angular/material/table';
import {SelectionModel} from '@angular/cdk/collections';
import {CalendarDialogComponent} from '../../../settings/calendars/presenter/dialog/calendar-dialog/calendar-dialog.component';
import {MatDialog} from '@angular/material/dialog';
import {CopyComponent} from '../dialog/copy/copy.component';
import { BaseList } from 'src/app/core/base/base-list';
import {concatMap, filter, tap} from 'rxjs/operators';
import {SweetalertService} from '../../../../core/service/sweetalert/sweetalert';
import {TestingCenterService} from '../../../../core/service/TestingCenter/testing-center.service';
// import {mkdir} from 'fs';

export interface PeriodicElement {
  position: number;
  testing_center_id: number;
  year: number;
  term: number;
  centername: string;
  testcentername: string;
  roomname: string;
  row: number;
  total: number;
}

@Component({
  selector: 'app-manage-test-center-table',
  templateUrl: './manage-test-center-table.component.html',
  styleUrls: ['./manage-test-center-table.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ManageTestCenterTableComponent extends BaseList implements OnInit, OnChanges {
  @Input() testingcenterList: any = [];
  @Output() delete = new EventEmitter();
  @Output() onViewAvailableSeat = new EventEmitter()
  column = [
    'select',
    'academic_year_name_th',
    'academic_semester_name_th',
    'branch_name_th',
    'testing_field_name_th',
    'testing_room_name_th',
    'total_row',
    'total_seat',
    'created_by',
    'created_datetime',
    'actions'
  ];
  dataSource = new MatTableDataSource();
  selection = new SelectionModel(true, []);

  /** Whether the number of selected elements matches the total number of rows. */
  isAllSelected() {
    const numSelected = this.selection.selected.length;
    const numRows = this.testingcenterList?.data?.length;
    return numSelected === numRows;
  }

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

  /** The label for the checkbox on the passed row */
  checkboxLabel(row?: PeriodicElement): string {
    if (!row) {
      return `${this.isAllSelected() ? 'select' : 'deselect'} all`;
    }
    return `${this.selection.isSelected(row) ? 'deselect' : 'select'} row ${
      row.position + 1
    }`;
  }


  reload: boolean;
  constructor(
    private dialog: MatDialog,
    private cdr: ChangeDetectorRef,
    private swSV: SweetalertService,
    private testingCenterSV: TestingCenterService,
  ) {
    super();
  }

  ngOnInit(): void {
    this.reload = false;
    setTimeout(() => {
      this.reload = true;
    }, 2000);
  }

  ngOnChanges(){
    this.testingcenterList = this.updateMatTable(this.testingcenterList ? this.testingcenterList : []);
  }


  openCopydialog(){
    const dialogRef = this.dialog.open(CopyComponent, {
      width: '500px',
      height: '200px',
      data: this.selection.selected
    });
    dialogRef.afterClosed().pipe(
      tap(x => {
        this.testingCenterSV.getAll().subscribe(
          res =>
          {
            this.testingcenterList = this.updateMatTable(res)
          }
        );
      }),
      tap(x => this.cdr.detectChanges())
    ).subscribe();
  }

  onDelete(id){
    this.delete.emit(id);
  }




}
