openaire-library/landingPages/dataProvider/organizationsTab.component.ts

57 lines
2.1 KiB
TypeScript

import {Component, Input} from '@angular/core';
import {properties} from "../../../../environments/environment";
@Component({
selector: 'organizationsTab',
template: `
<div *ngIf=" !organizations || organizations.length == 0" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">
No organizations available
</div>
<div *ngIf=" organizations && organizations.length > 0">
<div *ngIf="organizations.length > pageSize" class="uk-margin-bottom">
{{organizations.length | number}} organizations, page {{organizationsPage | number}} of {{totalPages(organizations.length) | number}}
<paging-no-load class="uk-float-right" [currentPage]="organizationsPage" [totalResults]="organizations.length" [size]="pageSize" (pageChange)="updateOrganizationsPage($event)"></paging-no-load>
</div>
<div *ngFor="let item of organizations.slice((organizationsPage-1)*pageSize, organizationsPage*pageSize)">
<h4 *ngIf=" item != undefined && item['id'] != undefined">
<!--a href="{{item['url']}}"-->
<a [queryParams]="{organizationId: item.id}" routerLinkActive="router-link-active" [routerLink]="url">
<p>{{item['name']}}</p>
</a>
</h4>
<h4 *ngIf="item['id'] == undefined">
<p>{{item['name']}}</p>
</h4>
</div>
</div>
`
})
export class OrganizationsTabComponent {
@Input() organizations: {"name": string, "id": string}[];
public organizationsPage: number = 1;
public pageSize: number = 10;
public url = properties.searchLinkToDataProvider.split('?')[0];
constructor () {}
ngOnInit() {}
ngOnDestroy() {}
totalPages(totalResults: number): number {
let totalPages:any = totalResults/this.pageSize;
if(!(Number.isInteger(totalPages))) {
totalPages = (parseInt(totalPages, this.pageSize) + 1);
}
return totalPages;
}
updateOrganizationsPage($event) {
this.organizationsPage = $event.value;
}
}