import { DataSource } from '@angular/cdk/table'; import { Component, OnInit, ViewChild } from '@angular/core'; import { MatPaginator, MatSnackBar, MatSort, PageEvent } from '@angular/material'; import { ActivatedRoute, Params, Router } from '@angular/router'; import { TranslateService } from '@ngx-translate/core'; import { Observable } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { BaseComponent } from '../../core/common/base/base.component'; import { DatasetCriteria } from '../../models/criteria/dataset/DatasetCriteria'; import { DataTableRequest } from '../../models/data-table/DataTableRequest'; import { DatasetListingModel } from '../../models/datasets/DatasetListingModel'; import { DataManagementPlanService } from '../../services/data-management-plan/data-management-plan.service'; import { DatasetService } from '../../services/dataset/dataset.service'; import { BreadcrumbItem } from '../../shared/components/breadcrumb/definition/breadcrumb-item'; import { IBreadCrumbComponent } from '../../shared/components/breadcrumb/definition/IBreadCrumbComponent'; import { DatasetCriteriaComponent } from '../../shared/components/criteria/datasets/datasets-criteria.component'; import { JsonSerializer } from '../../utilities/JsonSerializer'; import { Utilities } from '../../utilities/utilities'; @Component({ selector: 'app-dataset-listing-component', templateUrl: 'dataset-listing.component.html', styleUrls: ['./dataset-listing.component.scss'], providers: [Utilities] }) export class DatasetListingComponent extends BaseComponent implements OnInit, IBreadCrumbComponent { @ViewChild(MatPaginator) _paginator: MatPaginator; @ViewChild(MatSort) sort: MatSort; @ViewChild(DatasetCriteriaComponent) criteria: DatasetCriteriaComponent; breadCrumbs: Observable; dataSource: DatasetDataSource | null; displayedColumns: String[] = ['label', 'project', 'dmp', 'profile', 'status', 'description', 'created']; pageEvent: PageEvent; titlePrefix: String; dmpId: string; statuses = [ { value: '0', viewValue: 'Active' }, { value: '1', viewValue: 'Inactive' } ]; constructor( private datasetService: DatasetService, private router: Router, private languageService: TranslateService, public snackBar: MatSnackBar, public route: ActivatedRoute, public dataManagementPlanService: DataManagementPlanService, public utilities: Utilities ) { super(); } ngOnInit() { this.route.params .pipe(takeUntil(this._destroyed)) .subscribe(async (params: Params) => { this.dmpId = params['dmpId']; this.criteria.setCriteria(this.getDefaultCriteria(this.dmpId)); this.refresh(); this.criteria.setRefreshCallback(() => this.refresh()); if (this.dmpId != null) { const dmp = await this.dataManagementPlanService.getSingle(this.dmpId).toPromise(); this.breadCrumbs = Observable.of([{ parentComponentName: 'DataManagementPlanEditorComponent', label: dmp.label, url: 'dmps/edit/' + this.dmpId }]); if (params['dmpLabel'] !== undefined) { this.titlePrefix = 'for ' + params['dmpLabel']; } } else { this.breadCrumbs = Observable.of([]); } }); } refresh() { this.dataSource = new DatasetDataSource(this.datasetService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, this.dmpId); } rowClick(rowId: String) { this.router.navigate(['/datasets/edit/' + rowId]); } getDefaultCriteria(dmpId: String): DatasetCriteria { const defaultCriteria = new DatasetCriteria(); if (dmpId != null) { defaultCriteria.dmpIds.push(dmpId); } return defaultCriteria; } makeItPublic(id: String) { this.datasetService.makeDatasetPublic(id) .pipe(takeUntil(this._destroyed)) .subscribe(); } } export class DatasetDataSource extends DataSource { totalCount = 0; isLoadingResults = false; constructor( private _service: DatasetService, private _paginator: MatPaginator, private _sort: MatSort, private _languageService: TranslateService, private _snackBar: MatSnackBar, private _criteria: DatasetCriteriaComponent, private dmpId: String ) { super(); } connect(): Observable { const displayDataChanges = [ this._paginator.page //this._sort.matSortChange ]; return Observable.merge(...displayDataChanges) .startWith(null) .switchMap(() => { setTimeout(() => { this.isLoadingResults = true; }); const startIndex = this._paginator.pageIndex * this._paginator.pageSize; let fields: Array = new Array(); if (this._sort.active) { fields = this._sort.direction === 'asc' ? ['+' + this._sort.active] : ['-' + this._sort.active]; } const request = new DataTableRequest(startIndex, this._paginator.pageSize, { fields: fields }); request.criteria = this._criteria.criteria; if (this.dmpId) { request.criteria.allVersions = true; } return this._service.getPaged(request); }) /*.catch((error: any) => { this._snackBar.openFromComponent(SnackBarNotificationComponent, { data: { message: 'GENERAL.SNACK-BAR.FORMS-BAD-REQUEST', language: this._languageService }, duration: 3000, extraClasses: ['snackbar-warning'] }); //this._criteria.criteria.onCallbackError(error); return Observable.of(null); })*/ .map(result => { result.data = JsonSerializer.fromJSONArray(result.data, DatasetListingModel); return result; }) .map(result => { setTimeout(() => { this.isLoadingResults = false; }); return result; }) .map(result => { if (!result) { return []; } if (this._paginator.pageIndex === 0) { this.totalCount = result.totalCount; } return result.data; }); } disconnect() { // No-op } }