workload-list.component.ts

import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

import { DispatcherWorkload } from '~/shared/models/work-dispatcher.model';

@Component({
  selector: 'workload-list-comp',
  styleUrls: ['./workload-list.scss'],
  templateUrl: './workload-list.html',
})
export class WorkloadListComponent implements OnInit {
  public showPopup = false;

  @Input()
  public dragOperation: boolean;
  @Input()
  public listOfWorkloads = new BehaviorSubject<DispatcherWorkload[]>([]);
  @Input()
  public shouldHideZeros = false;

  @Output()
  public disableWorkload = new EventEmitter<DispatcherWorkload>();

  public ngOnInit() {}

  public onDisableWorkload(dispatcherWorkload: DispatcherWorkload) {
    this.disableWorkload.emit({ ...dispatcherWorkload, active: !dispatcherWorkload.active });
  }

  public toggleList(elem: any) {
    elem.parentElement.parentElement.classList.toggle('active');
  }

  public moveToTop(idx: number): void {
    const res: DispatcherWorkload[] = this.listOfWorkloads.getValue();
    res.unshift(res.splice(idx, 1)[0]);
    this.listOfWorkloads.next(res);
  }
}