55 lines
2.0 KiB
TypeScript
55 lines
2.0 KiB
TypeScript
|
import {Component, Input} from '@angular/core';
|
||
|
|
|
||
|
|
@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}} organizations, page {{organizationsPage}} of {{totalPages(organizations.length)}}
|
||
|
|
<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)" class="uk-h4">
|
||
|
|
<p *ngIf=" item != undefined && item['id'] != undefined">
|
||
|
|
<!--a href="{{item['url']}}"-->
|
||
|
|
<a [queryParams]="{organizationId: item.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
|
||
|
|
{{item['name']}}
|
||
|
|
</a>
|
||
|
|
</p>
|
||
|
|
<p *ngIf="item['id'] == undefined">
|
||
|
|
{{item['name']}}
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
`
|
||
|
|
})
|
||
|
|
|
||
|
|
export class OrganizationsTabComponent {
|
||
|
|
|
||
|
|
@Input() organizations: {"name": string, "id": string}[];
|
||
|
|
public organizationsPage: number = 1;
|
||
|
|
public pageSize: number = 10;
|
||
|
|
|
||
|
|
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;
|
||
|
|
}
|
||
|
|
}
|