2 <div class="eg-grid-toolbar mb-2">
4 <div class="btn-toolbar">
7 <div class="btn-grp" *ngIf="gridContext.toolbarButtons.length || gridContext.isFilterable">
8 <!-- special case for remove filters button -->
9 <button *ngIf="gridContext.isFilterable"
10 class="btn btn-outline-dark mr-1" (click)="gridContext.removeFilters()"
11 [disabled]="!gridContext.filtersSet()" i18n>
14 <button *ngFor="let btn of gridContext.toolbarButtons"
15 [disabled]="btn.disabled"
16 class="btn btn-outline-dark mr-1" (click)="performButtonAction(btn)">
22 <div class="form-check form-check-inline"
23 *ngIf="gridContext.toolbarCheckboxes.length">
24 <ng-container *ngFor="let cb of gridContext.toolbarCheckboxes">
25 <label class="form-check-label">
26 <input class="form-check-input" type="checkbox"
27 [(ngModel)]="cb.isChecked"
28 (click)="cb.onChange.emit($event.target.checked)"/>
35 <!-- push everything else to the right -->
36 <div class="flex-1"></div>
38 <div class="font-sm font-italic d-flex flex-column-reverse mr-2">
39 {{gridContext.getSelectedRows().length}} selected
41 <div ngbDropdown class="mr-1" placement="bottom-right">
42 <button ngbDropdownToggle [disabled]="!gridContext.toolbarActions.length"
43 class="btn btn-outline-dark no-dropdown-caret">
44 <span title="Actions For Selected Rows" i18n-title
45 class="material-icons mat-icon-in-button">playlist_add_check</span>
47 <div class="dropdown-menu" ngbDropdownMenu>
48 <eg-grid-toolbar-actions-menu [gridContext]="gridContext">
49 </eg-grid-toolbar-actions-menu>
53 <ng-container *ngIf="!gridContext.disablePaging">
55 <button [disabled]="gridContext.pager.isFirstPage()" type="button"
56 class="btn btn-outline-dark mr-1" (click)="gridContext.pager.toFirst()">
57 <span title="First Page" i18n-title
58 class="material-icons mat-icon-in-button">first_page</span>
60 <button [disabled]="gridContext.pager.isFirstPage()" type="button"
61 class="btn btn-outline-dark mr-1" (click)="gridContext.pager.decrement()">
62 <span title="Previous Page" i18n-title
63 class="material-icons mat-icon-in-button">keyboard_arrow_left</span>
65 <button [disabled]="gridContext.pager.isLastPage()" type="button"
66 class="btn btn-outline-dark mr-1" (click)="gridContext.pager.increment()">
67 <span title="Next Page" i18n-title
68 class="material-icons mat-icon-in-button">keyboard_arrow_right</span>
70 <div ngbDropdown class="mr-1" placement="bottom-right">
71 <button ngbDropdownToggle class="btn btn-outline-dark text-button">
72 <span title="Select Row Count" i18n-title i18n>
73 Rows {{gridContext.pager.limit}}
76 <div class="dropdown-menu" ngbDropdownMenu>
77 <a class="dropdown-item"
78 *ngFor="let count of [5, 10, 25, 50, 100]"
79 (click)="gridContext.pager.setLimit(count)">
80 <span class="ml-2">{{count}}</span>
85 </ng-container><!-- if disablePaging-->
89 class="btn btn-outline-dark mr-1"
90 (click)="gridContext.overflowCells=!gridContext.overflowCells">
91 <span *ngIf="!gridContext.overflowCells"
92 title="Expand Cells Vertically" i18n-title
93 class="material-icons mat-icon-in-button">expand_more</span>
94 <span *ngIf="gridContext.overflowCells"
95 title="Collapse Cells Vertically" i18n-title
96 class="material-icons mat-icon-in-button">expand_less</span>
99 <eg-grid-column-config #columnConfDialog [columnSet]="gridContext.columnSet">
100 </eg-grid-column-config>
101 <div ngbDropdown placement="bottom-right">
102 <button ngbDropdownToggle class="btn btn-outline-dark no-dropdown-caret">
103 <span title="Show Grid Options" i18n-title
104 class="material-icons mat-icon-in-button">settings</span>
106 <div class="dropdown-menu scrollable-menu" ngbDropdownMenu>
107 <a class="dropdown-item label-with-material-icon"
108 (click)="columnConfDialog.open({size:'lg'})">
109 <span class="material-icons">build</span>
110 <span class="ml-2" i18n>Manage Columns</span>
112 <a class="dropdown-item label-with-material-icon"
113 (click)="colWidthConfig.isVisible = !colWidthConfig.isVisible">
114 <span class="material-icons">compare_arrows</span>
115 <span class="ml-2" i18n>Manage Column Widths</span>
117 <a class="dropdown-item label-with-material-icon"
118 *ngIf="!disableSaveSettings"
119 (click)="saveGridConfig()">
120 <span class="material-icons">save</span>
121 <span class="ml-2" i18n>Save Grid Settings</span>
123 <a class="dropdown-item label-with-material-icon"
124 (click)="gridContext.columnSet.reset()">
125 <span class="material-icons">restore</span>
126 <span class="ml-2" i18n>Reset Columns</span>
128 <a class="dropdown-item label-with-material-icon"
129 (click)="generateCsvExportUrl($event)"
130 [download]="csvExportFileName"
131 [href]="csvExportUrl">
132 <span class="material-icons">cloud_download</span>
133 <span class="ml-2" i18n>Download Full CSV</span>
135 <a class="dropdown-item label-with-material-icon" (click)="printHtml()">
136 <span class="material-icons">print</span>
137 <span class="ml-2" i18n>Print Full Grid</span>
140 <div class="dropdown-divider"></div>
142 <a class="dropdown-item label-with-material-icon"
143 (click)="col.visible=!col.visible" *ngFor="let col of gridContext.columnSet.columns">
144 <span *ngIf="col.visible" class="badge badge-success">✓</span>
145 <span *ngIf="!col.visible" class="badge badge-warning">✗</span>
146 <span class="ml-2">{{col.label}}</span>