125 lines
6.3 KiB
TypeScript
125 lines
6.3 KiB
TypeScript
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 class="loading-gif uk-align-center" >
|
||
</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;
|
||
}
|
||
}
|