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 4f85554..6ebe6de 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
@@ -26,11 +26,11 @@ 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) {
-        this.onClick = new EventEmitter<any []>();
-    }
+    constructor(@Host() private grid: GridComponent) { }
 
     ngOnInit() {
 
@@ -42,9 +42,14 @@ export class GridToolbarActionComponent implements OnInit {
         const action = new GridToolbarAction();
         action.label = this.label;
         action.action = this.action;
-        action.onClick = this.onClick;
         action.group = this.group;
+        action.separator = this.separator;
         action.disableOnRows = this.disableOnRows;
+
+        if (!this.separator) {
+            action.onClick = this.onClick = new EventEmitter<any []>();
+        }
+
         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 5dd307f..cd2bac2 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
@@ -42,11 +42,15 @@
         <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">
           <!-- grouped entries are indented -->
           <span class="ml-4">{{action.label}}</span>
         </ng-container>
-        <ng-container *ngIf="!action.group && !action.isGroup">
+        <ng-container 
+          *ngIf="!action.group && !action.isGroup && !action.separator">
           <span class="ml-2">{{action.label}}</span>
         </ng-container>
       </button>

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 7c30438..695a828 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
@@ -928,6 +928,7 @@ export class GridToolbarAction {
     action: (rows: any[]) => any; // DEPRECATED
     group: string;
     isGroup: boolean; // used for group placeholder entries
+    separator: boolean;
     disableOnRows: (rows: any[]) => boolean;
 }