LP1803787 Grid toolbar action separators

Add support for "separator" toolbar actions so the action menu may be
divided into groups.

Signed-off-by: Bill Erickson <berickxx@gmail.com>

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-action.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-action.component.ts
index 0a33376..b03695f 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-action.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-action.component.ts
@@ -18,6 +18,9 @@ export class GridToolbarActionComponent implements OnInit {
     // (default behavior), the action will be enabled.
     @Input() disableOnRows: (rows: any[]) => boolean;
 
+    // If true, render a separator bar only, no action link.
+    @Input() separator: boolean;
+
     // get a reference to our container grid.
     constructor(@Host() private grid: GridComponent) {}
 
@@ -31,6 +34,7 @@ export class GridToolbarActionComponent implements OnInit {
         const action = new GridToolbarAction();
         action.label = this.label;
         action.action = this.action;
+        action.separator = this.separator;
         action.disableOnRows = this.disableOnRows;
 
         this.grid.context.toolbarActions.push(action);

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 5eaa81f..11a4c87 100644 (file)
--- 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
@@ -35,11 +35,17 @@
         class="material-icons mat-icon-in-button">playlist_add_check</span>
     </button>
     <div class="dropdown-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>
-      </button>
+      <ng-container *ngFor="let action of gridContext.toolbarActions">
+        <ng-container *ngIf="action.separator">
+          <div class="dropdown-divider"></div>
+        </ng-container>
+        <ng-container *ngIf="!action.separator">
+          <a class="dropdown-item" (click)="performAction(action)"
+            [disabled]="shouldDisableAction(action)">
+            <span class="ml-2">{{action.label}}</span>
+          </a>
+        </ng-container>
+      </ng-container>
     </div>
   </div>
 

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 b591d8a..1c575be 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
@@ -882,6 +882,7 @@ export class GridContext {
 // Actions apply to specific rows
 export class GridToolbarAction {
     label: string;
+    separator: boolean;
     action: (rows: any[]) => any;
     disableOnRows: (rows: any[]) => boolean;
 }