LP1808268: Add [disable] option to <eg-grid-toolbar-action> in eg2

To test:
1) Apply this commit and recompile eg2.
2) Open the eg2 sandbox (https://yourdomain/eg2/staff/sandbox)
3) Ensure that the action called "Action that needs a single row"
is only enabled when one row of the grid is selected.
4) Create more <eg-grid-toolbar-actions> on grids in eg2.  Make sure
that they all enable/disable those actions per the output of the
functions you reference in the [disabled] attribute.

Signed-off-by: Jane Sandberg <sandbej@linnbenton.edu>
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 593530a..6b6114f 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
@@ -13,6 +13,11 @@ export class GridToolbarActionComponent implements OnInit {
     @Input() label: string;
     @Input() action: (rows: any[]) => any;
 
+    // Optional: add a function that returns true or false.
+    // If true, this action will be disabled; if false
+    // (default behavior), the action will be enabled.
+    @Input() disabled: (rows: any[]) => boolean;
+
     // get a reference to our container grid.
     constructor(@Host() private grid: GridComponent) {}
 
@@ -27,7 +32,9 @@ export class GridToolbarActionComponent implements OnInit {
         action.label = this.label;
         action.action = this.action;
 
+        action.disabled = (this.disabled == null) ? (rows: any[]) => false : this.disabled;
+
+
         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 ae24021..5eaa81f 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,10 +35,11 @@
         class="material-icons mat-icon-in-button">playlist_add_check</span>
     </button>
     <div class="dropdown-menu" ngbDropdownMenu>
-      <a class="dropdown-item" (click)="performAction(action)"
-        *ngFor="let action of gridContext.toolbarActions">
+      <button class="dropdown-item" (click)="performAction(action)"
+        *ngFor="let action of gridContext.toolbarActions"
+        [disabled]="shouldDisableAction(action)">
         <span class="ml-2">{{action.label}}</span>
-      </a>
+      </button>
     </div>
   </div>
 

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts
index 5c8b523..a133623 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts
@@ -41,6 +41,10 @@ export class GridToolbarComponent implements OnInit {
         action.action(this.gridContext.getSelectedRows());
     }
 
+    shouldDisableAction(action: GridToolbarAction) {
+        return action.disabled(this.gridContext.getSelectedRows());
+    }
+
     printHtml() {
         this.gridPrinter.printGrid();
     }

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 a352c0c..35ca542 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.ts
@@ -890,6 +890,7 @@ export class GridContext {
 export class GridToolbarAction {
     label: string;
     action: (rows: any[]) => any;
+    disabled: (rows: any[]) => boolean;
 }
 
 // Buttons are global actions

diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
index cd003ff..66398fe 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
+++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
@@ -122,6 +122,8 @@ HERasdfE
   [rowFlairCallback]="btGridRowFlairCallback"
   [cellClassCallback]="btGridCellClassCallback"
   [sortable]="true">
+  <eg-grid-toolbar-action label="Action that needs a single row" i18n-label [action]="complimentEvergreen" [disabled]="notOneSelectedRow">
+  </eg-grid-toolbar-action>
   <eg-grid-column name="test" [cellTemplate]="cellTmpl" 
     [cellContext]="btGridTestContext" [sortable]="false">
   </eg-grid-column>

diff --git a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts
index 6178969..0389521 100644 (file)
--- a/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts
+++ b/Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts
@@ -55,6 +55,9 @@ export class SandboxComponent implements OnInit {
 
     name = 'Jane';
 
+    complimentEvergreen: (rows: IdlObject[]) => void;
+    notOneSelectedRow: (rows: IdlObject[]) => boolean;
+
     constructor(
         private idl: IdlService,
         private org: OrgService,
@@ -108,6 +111,10 @@ export class SandboxComponent implements OnInit {
                 return cbt;
             }));
         };
+
+        this.complimentEvergreen = (rows: IdlObject[]) => alert('Evergreen is great!');
+        this.notOneSelectedRow = (rows: IdlObject[]) => (rows.length != 1);
+
     }
 
     btGridRowClassCallback(row: any): string {