openaire-library/landingPages/dataProvider/relatedDatasourcesTab.compo...

125 lines
6.3 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import {Component, Input} from '@angular/core';
import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';
import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';
import { ErrorCodes} from '../../utils/properties/errorCodes';
import {RouterHelper} from '../../utils/routerHelper.class';
import { Observable } from 'rxjs/Observable';
import{EnvProperties} from '../../utils/properties/env-properties';
@Component({
selector: 'relatedDatasourcesTab',
template: `
<!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NONE && fetchDatasets.searchUtils.status == errorCodes.NONE"
class="uk-alert uk-alert-primary uk-animation-fade" role="alert">
No related content providers available
</div>
<div *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR && fetchDatasets.searchUtils.status == errorCodes.ERROR"
class="uk-alert uk-alert-warning uk-animation-fade" role="alert">
An Error Occured
</div-->
<!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.NOT_AVAILABLE && fetchDatasets.searchUtils.status == errorCodes.NOT_AVAILABLE"
class="uk-alert uk-alert-danger uk-animation-fade" role="alert">
Service not available
</div-->
<!--div *ngIf="fetchPublications.searchUtils.status == errorCodes.LOADING || fetchDatasets.searchUtils.status == errorCodes.LOADING || loading"
class="uk-animation-fade uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
</div-->
<errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'related content providers'"></errorMessages>
<div *ngIf="(fetchPublications.searchUtils.status == errorCodes.DONE || fetchDatasets.searchUtils.status == errorCodes.DONE) && !loading">
<div *ngIf="results && results.size > pageSize" class="uk-margin">
<span class="uk-text-bold">{{results.size}} related content providers, page {{page}} of {{totalPages(results.size)}}</span>
<paging-no-load class="uk-float-right" [currentPage]="page" [totalResults]="results.size" [size]="pageSize" (pageChange)="updatePage($event)"></paging-no-load>
</div>
<table class="uk-table uk-table-striped">
<thead>
<tr>
<th class="uk-text-center">Content Provider Name</th>
<th *ngIf="fetchPublications.results.length > 0 || fetchPublications.searchUtils.status == errorCodes.ERROR"
class="uk-text-center">
Number of Publications
</th>
<th *ngIf="fetchDatasets.results.length > 0 || fetchDatasets.searchUtils.status == errorCodes.ERROR"
class="uk-text-center">
Number of Research Data
</th>
</tr>
</thead>
<tbody>
<ng-container *ngIf="results">
<ng-container *ngFor="let id of results.keys() let i=index">
<tr *ngIf="i>=(page-1)*pageSize && i<page*pageSize">
<td class="uk-text-center">
<a [queryParams]="{datasourceId: id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
{{results.get(id).name}}
</a>
</td>
<td *ngIf="fetchPublications.results.length > 0" class="uk-text-center">
<a [queryParams]="routerHelper.createQueryParams(['hostedBy', 'ho', 'collectedFrom', 'co'], [id, 'and', dataproviderId, 'and'])"
routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications">
{{results.get(id).countPublications}}
</a>
</td>
<td *ngIf="fetchPublications.searchUtils.status == errorCodes.ERROR" class="uk-text-center">-</td>
<td *ngIf="fetchDatasets.results.length > 0" class="uk-text-center">
<a [queryParams]="routerHelper.createQueryParams(['hostedBy', 'ho', 'collectedFrom', 'co'], [id, 'and', dataproviderId, 'and'])"
routerLinkActive="router-link-active" [routerLink]="linkToSearchResearchData">
{{results.get(id).countDatasets}}
</a>
</td>
<td *ngIf="fetchDatasets.searchUtils.status == errorCodes.ERROR" class="uk-text-center">-</td>
</tr>
</ng-container>
</ng-container>
</tbody>
</table>
</div>
`
})
export class RelatedDatasourcesTabComponent {
@Input() dataproviderId: string;
@Input() fetchPublications : FetchPublications;
@Input() fetchDatasets : FetchDatasets;
// true: preprocessing is not over
@Input() loading: boolean = true;
// Εvery content provider's id is a single key of a map
@Input() results: Map<string, {"name": string, "countPublications": string, "countDatasets": string}>;
@Input() properties:EnvProperties ;
public linkToSearchPublications: string = "";
public linkToSearchResearchData: string = "";
public routerHelper:RouterHelper = new RouterHelper();
public errorCodes:ErrorCodes = new ErrorCodes();
public page: number = 1;
public pageSize: number = 10;
constructor () {}
ngOnInit() {
this.linkToSearchPublications = this.properties.searchLinkToAdvancedPublications;
this.linkToSearchResearchData = this.properties.searchLinkToAdvancedDatasets;
}
ngOnDestroy() {}
totalPages(totalResults: number): number {
let totalPages:any = totalResults/this.pageSize;
if(!(Number.isInteger(totalPages))) {
totalPages = (parseInt(totalPages, this.pageSize) + 1);
}
return totalPages;
}
updatePage($event) {
this.page = $event.value;
}
}