datatable.component.ts

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

import { SearchQueryParams } from '../../store/model';
import { Attribute, Dataset } from 'src/app/metamodel/model';

@Component({
    selector: 'app-datatable',
    templateUrl: 'datatable.component.html',
    styleUrls: ['datatable.component.css'],
    changeDetection: ChangeDetectionStrategy.OnPush,
    encapsulation: ViewEncapsulation.None
})
export class DatatableComponent implements OnInit {
    @Input() datasetName: string;
    @Input() datasetList: Dataset[];
    @Input() queryParams: SearchQueryParams;
    @Input() datasetAttributeList: Attribute[];
    @Input() outputList: number[];
    @Input() searchData: any[];
    @Input() dataLength: number;
    @Input() selectedData: any[];
    @Input() processWip: boolean;
    @Input() processDone: boolean;
    @Input() processId: string;
    @Output() getSearchData: EventEmitter<[number, number, number, string]> = new EventEmitter();
    @Output() addSelectedData: EventEmitter<any> = new EventEmitter();
    @Output() deleteSelectedData: EventEmitter<any> = new EventEmitter();
    @Output() executeProcess: EventEmitter<string> = new EventEmitter();
    nbItems = 10;
    page = 1;
    sortedCol: number = null;
    sortedOrder: string = null;

    ngOnInit() {
        this.sortedCol = this.datasetAttributeList.find(a => a.search_flag === 'ID').id; 
        this.sortedOrder = 'a';
    }

    getOutputList(): Attribute[] {
        return this.datasetAttributeList
            .filter(a => this.outputList.includes(a.id))
            .sort((a, b) => a.output_display - b.output_display);
    }

    getDataset(): Dataset {
        return this.datasetList.find(dataset => dataset.name === this.datasetName);
    }

    getAttributeId(attributeName: string): number {
        const attribute = this.datasetAttributeList.find(a => a.name === attributeName);
        return attribute.id;
    }

    getAttributeRenderer(attributeName: string): string {
        const attribute = this.datasetAttributeList.find(a => a.name === attributeName);
        return attribute.renderer;
    }

    getAttributeUriAction(attributeName: string, datum: string): string {
        const attribute = this.datasetAttributeList.find(a => a.name === attributeName);
        if (attribute.uri_action) {
            return attribute.uri_action + datum;
        } else {
            return datum;
        }
    }

    toggleSelection(datum: any): void {
        const attribute = this.datasetAttributeList.find(a => a.search_flag === 'ID');

        const index = this.selectedData.indexOf(datum[attribute.label]);
        if (index > -1) {
            this.deleteSelectedData.emit(datum[attribute.label]);
        } else {
            this.addSelectedData.emit(datum[attribute.label]);
        }
    }

    isSelected(datum: any): boolean {
        const attribute = this.datasetAttributeList.find(a => a.search_flag === 'ID');

        if (this.selectedData.indexOf(datum[attribute.label]) > -1) {
            return true;
        }
        return false;
    }

    noSelectedData(): boolean {
        return this.selectedData.length < 1;
    }

    emitProcess(typeProcess: string): void {
        this.executeProcess.emit(typeProcess);
    }

    changePage(nb: number): void {
        this.page = nb;
        this.getSearchData.emit([this.page, this.nbItems, this.sortedCol, this.sortedOrder]);
    } 
    changeNbItems(nb: number): void {
        this.nbItems = nb;
        this.getSearchData.emit([this.page, this.nbItems, this.sortedCol, this.sortedOrder]);
    }

    sort(id: number): void {
        if (id === this.sortedCol) {
            this.sortedOrder = this.sortedOrder === 'a' ? 'd' : 'a';
        } else {
            this.sortedCol = id;
            this.sortedOrder = 'a';
        }
        this.getSearchData.emit([this.page, this.nbItems, this.sortedCol, this.sortedOrder]);
    }
}