openaire-library/searchPages/searchUtils/searchPaging.component.ts

85 lines
3.8 KiB
TypeScript

import {Component, Input, Output, EventEmitter} from '@angular/core';
import {Observable} from 'rxjs';
import {ErrorCodes} from '../../utils/properties/errorCodes';
@Component({
selector: 'search-paging',
template: `
<div class= "paging-hr searchPaging uk-margin-small-bottom"
*ngIf="(results && searchUtils.totalResults > 0) || (!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING)">
<div class="uk-panel uk-margin-small-top uk-grid uk-flex uk-flex-middle">
<div class="uk-width-1-1@s uk-width-1-2@m uk-text-uppercase"
*ngIf="results && searchUtils.totalResults > 0">
{{searchUtils.totalResults|number}}
<span class="uk-text-muted uk-text-uppercase"> {{type}}, page </span>
{{searchUtils.page | number}}
<span class="uk-text-muted uk-text-uppercase"> of </span>
{{(totalPages(searchUtils.totalResults)|number)}}
</div>
<div class="uk-width-1-1@s uk-width-1-2@m"
*ngIf="!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING">
{{oldTotalResults|number}}
<span class="uk-text-muted uk-text-uppercase"> {{type}}, page </span>
{{searchUtils.page | number}}
<span class="uk-text-muted uk-text-uppercase"> of </span>
{{(totalPages(oldTotalResults)|number)}}
</div>
<!--div class="uk-width-1-1@s uk-width-1-2@m" *ngIf="results && searchUtils.totalResults > 0">
{{searchUtils.totalResults|number}} {{type}}, page {{searchUtils.page | number}} of {{(totalPages(searchUtils.totalResults)|number)}}
</div>
<div class="uk-width-1-1@s uk-width-1-2@m" *ngIf="!loadPaging && oldTotalResults > 0 && searchUtils.status == errorCodes.LOADING">
{{oldTotalResults|number}} {{type}}, page {{searchUtils.page | number}} of {{(totalPages(oldTotalResults)|number)}}
</div-->
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand" *ngIf="results && searchUtils.totalResults > searchUtils.size">
<paging [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [baseUrl]="baseUrl"
[size]="searchUtils.size" [parameterNames] = "parameterNames" [parameterValues] = "parameterValues"
[isDisabled]="isDisabled">
</paging>
</div>
<div class="float-children-right-at-medium margin-small-top-at-small uk-width-expand" *ngIf="!loadPaging && oldTotalResults > searchUtils.size && searchUtils.status == errorCodes.LOADING">
<paging [currentPage]="searchUtils.page" [totalResults]="oldTotalResults" [baseUrl]="baseUrl"
[size]="searchUtils.size" [parameterNames] = "parameterNames" [parameterValues] = "parameterValues"
[isDisabled]="isDisabled">
</paging>
</div>
</div>
</div>
`
})
export class SearchPagingComponent {
@Input() isDisabled: boolean = false;
@Input() searchUtils;
@Input() results;
@Input() baseUrl;
@Input() type;
@Input() parameterNames:string[];
@Input() parameterValues:string[];
@Input() loadPaging: boolean = true;
@Input() oldTotalResults: number = 0;
public totalResults: number = 0;
public errorCodes:ErrorCodes = new ErrorCodes();
// @Input() totalResults:number = 0;
constructor () {}
ngOnInit() {
// this.totalResults = this.searchUtils.totalResults;
// if(!this.loadPaging && this.totalResults == 0) {
// this.totalResults = this.oldTotalResults;
// }
}
totalPages(totalResults: number): number {
let totalPages:any = totalResults/(this.searchUtils.size);
if(!(Number.isInteger(totalPages))) {
totalPages = (parseInt(totalPages, 10) + 1);
}
return totalPages;
}
}