<!--
<ng-template [ngIf]="((total$|async)>0 || displayIfEmpty)" [ngIfElse]="noContent" >
-->
- <ng-template [ngIf]="true" [ngIfElse]="noContent" >
-
-
+<ng-container *ngIf="(paginationInfo$|async) as paginationInfo; else noContent">
<form class="mt-3 mb-3">
<!--
<div class="form-row align-items-center" *ngIf="(multiplePages$|async)||displayControlsIfSinglePage">
-->
- <div class="form-row align-items-center" *ngIf="(multiplePages$|async)==true">
- <div class="col-lg-4 col-md-2 col-sm-1">
- <label class="sr-only" for="searchQuery">{{'search.label' |translate}}</label>
- <input type="text" class="form-control" id="searchQuery" placeholder="{{'search.input'|translate}}" #searchTerm
- (keyup)="search(searchTerm.value)">
- </div>
- <div class="col-auto">
- <button type="submit" class="btn btn-primary">{{'search.button'|translate}}</button>
+ <div class="form-row align-items-center" *ngIf="paginationInfo.multiple()||displayControlsIfSinglePage">
+ <div class="col-lg-4 col-md-2 col-sm-1">
+ <label class="sr-only" for="searchQuery">{{'search.label' |translate}}</label>
+ <input type="text" class="form-control" id="searchQuery" placeholder="{{'search.input'|translate}}"
+ #searchTerm
+ (keyup)="search(searchTerm.value)">
+ </div>
+ <div class="col-auto">
+ <button type="submit" class="btn btn-primary">{{'search.button'|translate}}</button>
+ </div>
</div>
- </div>
-</form>
+ </form>
-<ng-content></ng-content>
+ <ng-content></ng-content>
-<ngb-pagination *ngIf="(multiplePages$|async)==true"
- [collectionSize]="total$|async" [pageSize]="pageSize" [maxSize]="pagination.maxSize" [rotate]="pagination.rotate"
- [boundaryLinks]="pagination.boundaryLinks" [ellipses]="pagination.ellipses"
- [(page)]="page" (pageChange)="changePage($event)" aria-label="Pagination"></ngb-pagination>
-</ng-template>
+ <ngb-pagination *ngIf="paginationInfo.multiple()||displayControlsIfSinglePage"
+ [collectionSize]="paginationInfo.total_count" [pageSize]="pageSize" [maxSize]="pagination.maxSize"
+ [rotate]="pagination.rotate"
+ [boundaryLinks]="pagination.boundaryLinks" [ellipses]="pagination.ellipses"
+ [(page)]="page" (pageChange)="changePage($event)" aria-label="Pagination"></ngb-pagination>
+</ng-container>
<ng-template #noContent>
{{displayKeyIfEmpty|translate}}
</ng-template>
\ No newline at end of file
multicast,
pluck,
refCount,
+ share,
startWith,
switchMap, tap
} from "rxjs/operators";
import {PageQuery} from "../model/page-query";
import {LoadingValue} from '../model/loading-value';
import {PagedResult} from "@app/model/paged-result";
+import {Multipage} from "@app/model/multipage";
+import {PaginationInfo} from "@app/model/pagination-info";
/**
/**
* The total number of elements available for the given search term
*/
- public total$: Observable<number>;
+ public paginationInfo$: Observable<PaginationInfo>;
/**
* The entity items retrieved from the service
*/
public items$: Observable<LoadingValue<PagedResult<T>>>;
- /**
- * true, if the current page result value represents a result with multiple pages,
- * otherwise false.
- */
- public multiplePages$:Observable<boolean>;
-
private pageStream: Subject<number> = new Subject<number>();
private searchTermStream: Subject<string> = new Subject<string>();
constructor() {
// console.log("Construct " + this.id);
this.items$=null;
- this.total$=null;
- this.multiplePages$=null;
+ this.paginationInfo$=null;
}
ngOnInit(): void {
),
// This is to avoid multiple REST calls, without each subscriber would
// cause a REST call.
- multicast(new Subject()),
+ multicast(()=>new Subject<LoadingValue<PagedResult<T>>>()),
refCount()
);
- this.total$ = source.pipe(tap((el)=>console.log("Total pipe "+this.id+": "+typeof(el)+" - "+JSON.stringify(el))),filter(val=>val.hasValue()),map(val=>val.value),
- pluck('pagination', 'total_count'),tap((el)=>console.log("Total end "+this.id+" - "+el)));
- this.multiplePages$ = source.pipe(tap((el)=>console.log("Multipage pipe "+this.id+": "+typeof(el)+" - "+JSON.stringify(el))),filter(val => val.hasValue()),
- map(val => val.value.pagination.total_count > val.value.pagination.limit));
- this.items$ = source.pipe(tap((el)=>console.log("Item pipe "+this.id+": "+typeof(el)+" - "+JSON.stringify(el))));
+ this.paginationInfo$ = source.pipe(filter(val => val.hasValue())
+ , map(val => PaginationInfo.of(val.value.pagination.total_count, val.value.pagination.offset, val.value.pagination.limit)),
+ tap((el) => this.page = el.page()));
+ this.items$ = source;
}
search(terms: string) {