import { Component } from '@angular/core';
import { ISService } from '../is.service';
import { MatTableDataSource } from '@angular/material/table';
import { WfHistoryEntry } from '../model/controller.model';
import { ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs';
import {map} from 'rxjs/operators';

@Component({
  selector: 'app-wf-history',
  templateUrl: './wf-history.component.html',
  styleUrls: ['./wf-history.component.css']
})
export class WfHistoryComponent {

  wfDatasource:MatTableDataSource<WfHistoryEntry> = new MatTableDataSource<WfHistoryEntry>([]); 
  
  colums : string[] = ['processId', 'name', 'family', 'status', 'startDate', 'endDate', 'dsName'];

  total:number = 100
  from:number = -1
  to:number = -1

  constructor(public service:ISService, route: ActivatedRoute)  {
    
    let totalP = route.snapshot.paramMap.get('total');
    let fromP = route.snapshot.queryParamMap.get('from');
    let toP = route.snapshot.queryParamMap.get('to');

    if (totalP) { this.total = parseInt(totalP); }
    if (fromP) { this.from = parseInt(fromP); }
    if (toP) { this.to = parseInt(toP); }

    this.service.loadWfHistory(this.total, this.from, this.to).subscribe({
      next:(data:WfHistoryEntry[]) => this.wfDatasource.data = data,
      error:error => console.log(error),
      complete:() => console.log("Completed")
    })
  }

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