From: Jason Etheridge <jason@EquinoxOLI.org>
Date: Wed, 8 Mar 2023 12:32:53 +0000 (-0500)
Subject: lp1993824: grids enhancement; add grid button adjacent labels to eg-grid
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=11815be8daf20cca07f3015c44136146d9d83ae6;p=working%2FEvergreen.git

lp1993824: grids enhancement; add grid button adjacent labels to eg-grid

Signed-off-by: Jason Etheridge <jason@EquinoxOLI.org>
---

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-button.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-button.component.ts
index d5fce519b9..a00eb7eaa1 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-button.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-button.component.ts
@@ -12,6 +12,10 @@ export class GridToolbarButtonComponent implements OnInit {
     // Note most input fields should match class fields for GridColumn
     @Input() label: string;
 
+    // These are optional labels that can come before and after the button
+    @Input() adjacentPreceedingLabel: string = '';
+    @Input() adjacentSubsequentLabel: string = '';
+
     // Register to click events
     @Output() onClick: EventEmitter<any>;
 
@@ -46,6 +50,8 @@ export class GridToolbarButtonComponent implements OnInit {
         this.button.onClick = this.onClick;
         this.button.routerLink = this.routerLink;
         this.button.label = this.label;
+        this.button.adjacentPreceedingLabel = this.adjacentPreceedingLabel;
+        this.button.adjacentSubsequentLabel = this.adjacentSubsequentLabel;
         this.button.action = this.action;
         this.grid.context.toolbarButtons.push(this.button);
     }
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html
index 43b9b5c333..8e998d150c 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html
@@ -16,11 +16,23 @@
         [disabled]="!gridContext.filtersSet() || gridContext.dataSource.requestingData" i18n>
         Remove Filters
       </button>
-      <button *ngFor="let btn of gridContext.toolbarButtons"
-        [disabled]="btn.disabled"
-        class="btn btn-outline-dark me-1" (click)="performButtonAction(btn)">
-        {{btn.label}}
-      </button>
+      <ng-container *ngFor="let btn of gridContext.toolbarButtons">
+        <label
+            *ngIf="btn.adjacentPreceedingLabel"
+            [ngClass]="{'button-adjacent-label':true,'disabled':btn.disabled}">
+            {{btn.adjacentPreceedingLabel}}
+        </label>
+        <button
+          [disabled]="btn.disabled"
+          class="btn btn-outline-dark me-1" (click)="performButtonAction(btn)">
+          {{btn.label}}
+        </button>
+        <label
+            *ngIf="btn.adjacentSubsequentLabel"
+            [ngClass]="{'button-adjacent-label':true,'disabled':btn.disabled}">
+            {{btn.adjacentSubsequentLabel}}
+        </label>
+      </ng-container>
     </div>
 
     <!-- checkboxes -->
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.css b/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
index 0cd8bf30c0..8b8ed5638e 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
@@ -95,6 +95,15 @@
   padding-bottom: 11px;
 }
 
+.button-adjacent-label {
+    vertical-align: inherit;
+    cursor: auto;
+}
+
+.button-adjacent-label.disabled {
+    opacity: .65;
+}
+
 .eg-grid-cell-skinny {
   width: 2em;
   text-align: center;
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.ts b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
index 6aeddab851..fa1c28a754 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
@@ -1372,6 +1372,8 @@ export class GridToolbarAction {
 // Buttons are global actions
 export class GridToolbarButton {
     label: string;
+    adjacentPreceedingLabel: string;
+    adjacentSubsequentLabel: string;
     onClick: EventEmitter<any []>;
     action: () => any; // DEPRECATED
     disabled: boolean;