tweaks to the object lists

This commit is contained in:
Art Lowel
2017-06-20 14:27:35 +02:00
parent 429d4a8937
commit b04b103207
5 changed files with 21 additions and 6 deletions

View File

@@ -1,7 +1,8 @@
<div *ngIf="topLevelCommunities.hasSucceeded | async"> <div *ngIf="topLevelCommunities.hasSucceeded | async">
<h2>{{'home.top-level-communities.head' | translate}}</h2> <h2>{{'home.top-level-communities.head' | translate}}</h2>
<p class="lead">{{'home.top-level-communities.help' | translate}}</p> <p class="lead">{{'home.top-level-communities.help' | translate}}</p>
<ds-object-list [config]="config" [sortConfig]="sortConfig" [objects]="topLevelCommunities" <ds-object-list [config]="config" [sortConfig]="sortConfig"
[objects]="topLevelCommunities" [hideGear]="false"
(pageChange)="onPageChange($event)" (pageChange)="onPageChange($event)"
(pageSizeChange)="onPageSizeChange($event)" (pageSizeChange)="onPageSizeChange($event)"
(sortDirectionChange)="onSortDirectionChange($event)" (sortDirectionChange)="onSortDirectionChange($event)"

View File

@@ -1 +1,7 @@
@import '../../../styles/variables.scss'; @import '../../../styles/variables.scss';
@import '../../../../node_modules/bootstrap/scss/variables';
:host {
display: block;
margin-bottom: $spacer-y;
}

View File

@@ -7,10 +7,10 @@
(pageSizeChange)="onPageSizeChange($event)" (pageSizeChange)="onPageSizeChange($event)"
(sortDirectionChange)="onSortDirectionChange($event)" (sortDirectionChange)="onSortDirectionChange($event)"
(sortFieldChange)="onSortDirectionChange($event)"> (sortFieldChange)="onSortDirectionChange($event)">
<ul *ngIf="objects.hasSucceeded | async"> <ul *ngIf="objects.hasSucceeded | async" class="list-unstyled">
<li *ngFor="let object of (objects.payload | async) | paginate: { itemsPerPage: (pageInfo | async)?.elementsPerPage, currentPage: (pageInfo | async)?.currentPage, totalItems: (pageInfo | async)?.totalElements }"> <li *ngFor="let object of (objects.payload | async) | paginate: { itemsPerPage: (pageInfo | async)?.elementsPerPage, currentPage: (pageInfo | async)?.currentPage, totalItems: (pageInfo | async)?.totalElements }">
<ds-object-list-element [object]="object"></ds-object-list-element> <ds-object-list-element [object]="object"></ds-object-list-element>
</li> </li>
</ul> </ul>
</ds-pagination> </ds-pagination>

View File

@@ -1,4 +1,4 @@
<div class="pagination-masked clearfix top {{hideGear ? 'invisible' : ''}}"> <div *ngIf="!hideGear" class="pagination-masked clearfix top">
<div class="row"> <div class="row">
<div class="col pagination-info"> <div class="col pagination-info">
<span class="align-middle hidden-xs-down">{{ 'pagination.showing.label' | translate }}</span> <span class="align-middle hidden-xs-down">{{ 'pagination.showing.label' | translate }}</span>
@@ -20,7 +20,7 @@
<ng-content></ng-content> <ng-content></ng-content>
<div class="pagination justify-content-center clearfix bottom {{(hidePagerWhenSinglePage && pageSize >= collectionSize) ? 'invisible' : ''}}"> <div *ngIf="shouldShowBottomPager" class="pagination justify-content-center clearfix bottom">
<ngb-pagination [boundaryLinks]="paginationOptions.boundaryLinks" <ngb-pagination [boundaryLinks]="paginationOptions.boundaryLinks"
[collectionSize]="collectionSize" [collectionSize]="collectionSize"
[disabled]="paginationOptions.disabled" [disabled]="paginationOptions.disabled"

View File

@@ -342,5 +342,13 @@ export class PaginationComponent implements OnDestroy, OnInit {
throw new Error("Paginate: Argument is missing the following required properties: " + missing.join(', ')); throw new Error("Paginate: Argument is missing the following required properties: " + missing.join(', '));
} }
} }
get hasMultiplePages(): boolean {
return this.collectionSize > this.pageSize;
}
get shouldShowBottomPager(): boolean {
return this.hasMultiplePages || !this.hidePagerWhenSinglePage
}
} }