argos/dmp-frontend/src/app/dmps/listing/dmp-listing.component.ts

import { DataSource } from '@angular/cdk/table';
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog, MatPaginator, MatSnackBar, MatSort } from '@angular/material';
import { ActivatedRoute, 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 { DataManagementPlanCriteria } from '../../models/criteria/data-management-plan/DataManagementPlanCriteria';
import { DataManagementPlanListingModel } from '../../models/data-managemnt-plans/DataManagementPlanListingModel';
import { DataTableRequest } from '../../models/data-table/DataTableRequest';
import { ProjectModel } from '../../models/projects/ProjectModel';
import { DataManagementPlanService } from '../../services/data-management-plan/data-management-plan.service';
import { BreadcrumbItem } from '../../shared/components/breadcrumb/definition/breadcrumb-item';
import { IBreadCrumbComponent } from '../../shared/components/breadcrumb/definition/IBreadCrumbComponent';
import { DataManagementPlanCriteriaComponent } from '../../shared/components/criteria/data-management-plan/dmp-criteria.component';
import { InvitationComponent } from '../../shared/components/invitation/invitation.component';
import { JsonSerializer } from '../../utilities/JsonSerializer';
import { Utilities } from '../../utilities/utilities';

@Component({
	selector: 'app-dmp-listing-component',
	templateUrl: 'dmp-listing.component.html',
	styleUrls: ['./dmp-listing.component.scss'],
	providers: [Utilities]
})
export class DataManagementPlanListingComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {

	@ViewChild(MatPaginator) _paginator: MatPaginator;
	@ViewChild(MatSort) sort: MatSort;
	@ViewChild(DataManagementPlanCriteriaComponent) criteria: DataManagementPlanCriteriaComponent;

	breadCrumbs: Observable<BreadcrumbItem[]> = Observable.of([]);
	dataSource: DataManagementPlanDataSource | null;
	displayedColumns: String[] = ['name', 'project', 'status', 'creationTime', 'organisations', 'version', 'datasets', 'actions'];
	itemId: string;
	projectId: string;
	showProject: boolean;
	titlePrefix: string;
	constructor(
		private dataManagementPlanService: DataManagementPlanService,
		private router: Router,
		private route: ActivatedRoute,
		private languageService: TranslateService,
		public snackBar: MatSnackBar,
		public dialog: MatDialog,
		public utilities: Utilities
	) {
		super();
	}

	ngOnInit() {
		this.route.params
			.pipe(takeUntil(this._destroyed))
			.subscribe(async params => {
				let projectLabel;
				if (params['projectId']) {
					this.projectId = params['projectId'];
					this.showProject = false;
					const project = new ProjectModel();
					project.id = this.projectId;
					this.criteria.setCriteria({ like: null, projects: [project], groupIds: null, allVersions: false });
					this.refresh();
					projectLabel = this.route.snapshot.queryParams.projectLabel;
					this.breadCrumbs = Observable.of([{ parentComponentName: 'ProjectEditorComponent', label: projectLabel, url: '/projects/edit/' + this.projectId }]);
					this.criteria.setRefreshCallback(() => this.refresh());
				} else {
					this.itemId = params['groupId'];
					this.showProject = true;
					const breadCrumbs = [];

					if (this.itemId) {
						const dmplabel = this.route.snapshot.queryParams.groupLabel;
						breadCrumbs.push(
							{ parentComponentName: null, label: 'DMPs', url: '/dmps' },
						);
					}
					//else breadCrumbs.push({ parentComponentName: null, label: 'DMPs', url: "/dmps" })
					this.breadCrumbs = Observable.of(breadCrumbs);

					this.criteria.setCriteria(this.getDefaultCriteria());
					this.refresh();
					this.criteria.setRefreshCallback(() => this.refresh());
				}

				if (this.projectId != null) {
					if (projectLabel !== undefined) {
						this.titlePrefix = 'for ' + projectLabel;
					}
				}
			});

	}

	refresh() {
		this.dataSource = new DataManagementPlanDataSource(this.dataManagementPlanService, this._paginator, this.sort, this.languageService, this.snackBar, this.criteria, this.itemId);
	}

	rowClick(rowId: String) {
		this.router.navigate(['/dmps/edit/' + rowId]);
	}

	addDataset(rowId: String) {
		this.router.navigate(['/datasets/new/' + rowId]);
	}

	showDatasets(rowId: String, rowLabel: String) {
		this.router.navigate(['/datasets/dmp/' + rowId, { dmpLabel: rowLabel }]);
	}

	viewVersions(rowId: String, rowLabel: String) {
		this.router.navigate(['/dmps/viewversions/' + rowId], { queryParams: { groupLabel: rowLabel } });
	}

	getDefaultCriteria(): DataManagementPlanCriteria {
		const defaultCriteria = new DataManagementPlanCriteria();
		return defaultCriteria;
	}

	openShareDialog(rowId: any, rowName: any) {
		const dialogRef = this.dialog.open(InvitationComponent, {
			height: '200px',
			width: '700px',
			data: {
				dmpId: rowId,
				dmpName: rowName
			}
		});
	}
}

export class DataManagementPlanDataSource extends DataSource<DataManagementPlanListingModel> {

	totalCount = 0;
	isLoadingResults = false;
	constructor(
		private _service: DataManagementPlanService,
		private _paginator: MatPaginator,
		private _sort: MatSort,
		private _languageService: TranslateService,
		private _snackBar: MatSnackBar,
		private _criteria: DataManagementPlanCriteriaComponent,
		private itemId
	) {
		super();
	}

	connect(): Observable<DataManagementPlanListingModel[]> {
		const displayDataChanges = [
			this._paginator.page
		];

		return Observable.merge(...displayDataChanges)
			.startWith(null)
			.switchMap(() => {
				setTimeout(() => {
					this.isLoadingResults = true;
				});
				const startIndex = this._paginator.pageIndex * this._paginator.pageSize;
				let fields: Array<string> = new Array();
				if (this._sort.active) { fields = this._sort.direction === 'asc' ? ['+' + this._sort.active] : ['-' + this._sort.active]; }
				const request = new DataTableRequest<DataManagementPlanCriteria>(startIndex, this._paginator.pageSize, { fields: fields });
				request.criteria = this._criteria.formGroup.value;
				if (this.itemId) {
					request.criteria.groupIds = [this.itemId];
					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']
			  });
			  return Observable.of(null);
			})*/
			.map(result => {
				result.data = JsonSerializer.fromJSONArray(result.data, DataManagementPlanListingModel);
				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.map(item => {
					item['datasets'].map(dmp => {
						dmp.url = 'datasets/edit/' + dmp.url;
						dmp.all = 'datasets/dmp/' + item.id;
						return dmp;
					});
					return item;
				});
			});
	}

	disconnect() {
	}
}