<!-- buttons -->
<div class="btn-grp" *ngIf="gridContext.toolbarButtons.length">
- <button *ngFor="let btn of gridContext.toolbarButtons"
+ <button *ngFor="let btn of gridContext.toolbarButtons"
[disabled]="btn.disabled"
- class="btn btn-outline-dark mr-1" (click)="btn.action()">
+ class="btn btn-outline-dark mr-1" (click)="performButtonAction(btn)">
{{btn.label}}
</button>
</div>
<!-- checkboxes -->
- <div class="form-check form-check-inline"
+ <div class="form-check form-check-inline"
*ngIf="gridContext.toolbarCheckboxes.length">
<ng-container *ngFor="let cb of gridContext.toolbarCheckboxes">
<label class="form-check-label">
- <input class="form-check-input" type="checkbox"
+ <input class="form-check-input" type="checkbox"
+ [(ngModel)]="cb.isChecked"
(click)="cb.onChange($event.target.checked)"/>
{{cb.label}}
</label>
<!-- push everything else to the right -->
<div class="flex-1"></div>
+ <div class="font-sm font-italic d-flex flex-column-reverse mr-2">
+ {{gridContext.rowSelector.selected().length}} selected
+ </div>
<div ngbDropdown class="mr-1" placement="bottom-right">
<button ngbDropdownToggle [disabled]="!gridContext.toolbarActions.length"
class="btn btn-outline-dark no-dropdown-caret">
- <span title="Actions For Selected Rows" i18n-title
+ <span title="Actions For Selected Rows" i18n-title
class="material-icons mat-icon-in-button">playlist_add_check</span>
</button>
- <div class="dropdown-menu" ngbDropdownMenu>
+ <div class="dropdown-menu scrollable-menu" ngbDropdownMenu>
<button class="dropdown-item" (click)="performAction(action)"
*ngFor="let action of gridContext.toolbarActions"
[disabled]="shouldDisableAction(action)">
- <span class="ml-2">{{action.label}}</span>
+ <ng-container *ngIf="action.isGroup">
+ <span class="ml-2 font-weight-bold font-italic">{{action.label}}</span>
+ </ng-container>
+ <ng-container *ngIf="action.separator">
+ <div class="dropdown-divider"></div>
+ </ng-container>
+ <ng-container
+ *ngIf="!action.group && !action.isGroup && !action.separator">
+ <span class="ml-2">{{action.label}}</span>
+ </ng-container>
</button>
</div>
</div>
- <button [disabled]="gridContext.pager.isFirstPage()" type="button"
+ <ng-container *ngIf="!gridContext.disablePaging">
+
+ <button [disabled]="gridContext.pager.isFirstPage()" type="button"
class="btn btn-outline-dark mr-1" (click)="gridContext.pager.toFirst()">
- <span title="First Page" i18n-title
+ <span title="First Page" i18n-title
class="material-icons mat-icon-in-button">first_page</span>
</button>
- <button [disabled]="gridContext.pager.isFirstPage()" type="button"
+ <button [disabled]="gridContext.pager.isFirstPage()" type="button"
class="btn btn-outline-dark mr-1" (click)="gridContext.pager.decrement()">
- <span title="Previous Page" i18n-title
+ <span title="Previous Page" i18n-title
class="material-icons mat-icon-in-button">keyboard_arrow_left</span>
</button>
- <button [disabled]="gridContext.pager.isLastPage()" type="button"
+ <button [disabled]="gridContext.pager.isLastPage()" type="button"
class="btn btn-outline-dark mr-1" (click)="gridContext.pager.increment()">
- <span title="Next Page" i18n-title
+ <span title="Next Page" i18n-title
class="material-icons mat-icon-in-button">keyboard_arrow_right</span>
</button>
-
- <!--
- Hiding jump-to-last since there's no analog in the angularjs grid and
- it has limited value since the size of the data set is often unknown.
- <button [disabled]="!gridContext.pager.resultCount || gridContext.pager.isLastPage()"
- type="button" class="btn btn-outline-dark mr-1" (click)="gridContext.pager.toLast()">
- <span title="First Page" i18n-title
- class="material-icons mat-icon-in-button">last_page</span>
- </button>
- -->
-
<div ngbDropdown class="mr-1" placement="bottom-right">
<button ngbDropdownToggle class="btn btn-outline-dark text-button">
<span title="Select Row Count" i18n-title i18n>
</span>
</button>
<div class="dropdown-menu" ngbDropdownMenu>
- <a class="dropdown-item"
+ <a class="dropdown-item"
*ngFor="let count of [5, 10, 25, 50, 100]"
(click)="gridContext.pager.setLimit(count)">
<span class="ml-2">{{count}}</span>
</a>
</div>
</div>
+
+ </ng-container><!-- if disablePaging-->
- <button type="button"
- class="btn btn-outline-dark mr-1"
+
+ <button type="button"
+ class="btn btn-outline-dark mr-1"
(click)="gridContext.overflowCells=!gridContext.overflowCells">
<span *ngIf="!gridContext.overflowCells"
- title="Expand Cells Vertically" i18n-title
+ title="Expand Cells Vertically" i18n-title
class="material-icons mat-icon-in-button">expand_more</span>
<span *ngIf="gridContext.overflowCells"
- title="Collaps Cells Vertically" i18n-title
+ title="Collaps Cells Vertically" i18n-title
class="material-icons mat-icon-in-button">expand_less</span>
</button>
</eg-grid-column-config>
<div ngbDropdown placement="bottom-right">
<button ngbDropdownToggle class="btn btn-outline-dark no-dropdown-caret">
- <span title="Show Grid Options" i18n-title
+ <span title="Show Grid Options" i18n-title
class="material-icons mat-icon-in-button">settings</span>
</button>
- <div class="dropdown-menu" ngbDropdownMenu>
- <a class="dropdown-item label-with-material-icon"
+ <div class="dropdown-menu scrollable-menu" ngbDropdownMenu>
+ <a class="dropdown-item label-with-material-icon"
(click)="columnConfDialog.open({size:'lg'})">
<span class="material-icons">build</span>
<span class="ml-2" i18n>Manage Columns</span>
</a>
- <a class="dropdown-item label-with-material-icon"
+ <a class="dropdown-item label-with-material-icon"
(click)="colWidthConfig.isVisible = !colWidthConfig.isVisible">
<span class="material-icons">compare_arrows</span>
<span class="ml-2" i18n>Manage Column Widths</span>
</a>
- <a class="dropdown-item label-with-material-icon"
+ <a class="dropdown-item label-with-material-icon"
(click)="saveGridConfig()">
<span class="material-icons">save</span>
<span class="ml-2" i18n>Save Grid Settings</span>
</a>
- <a class="dropdown-item label-with-material-icon"
+ <a class="dropdown-item label-with-material-icon"
(click)="gridContext.columnSet.reset()">
<span class="material-icons">restore</span>
<span class="ml-2" i18n>Reset Columns</span>
</a>
- <a class="dropdown-item label-with-material-icon"
+ <a class="dropdown-item label-with-material-icon"
(click)="generateCsvExportUrl($event)"
[download]="csvExportFileName"
[href]="csvExportUrl">
<div class="dropdown-divider"></div>
- <a class="dropdown-item label-with-material-icon"
+ <a class="dropdown-item label-with-material-icon"
(click)="col.visible=!col.visible" *ngFor="let col of gridContext.columnSet.columns">
<span *ngIf="col.visible" class="badge badge-success">✓</span>
<span *ngIf="!col.visible" class="badge badge-warning">✗</span>
projects / evergreen-equinox.git / blobdiff