LP1923640 Grid option to hide action menu entries WIP user/berick/lp1923640-ang-grid-menu-hide-entries
authorBill Erickson <berickxx@gmail.com>
Tue, 13 Apr 2021 17:05:18 +0000 (13:05 -0400)
committerBill Erickson <berickxx@gmail.com>
Tue, 13 Apr 2021 17:05:18 +0000 (13:05 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.html [new file with mode: 0644]
Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.ts [new file with mode: 0644]
Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html
Open-ILS/src/eg2/src/app/share/grid/grid.module.ts
Open-ILS/src/eg2/src/app/share/grid/grid.ts

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.html
new file mode 100644 (file)
index 0000000..0a56bc5
--- /dev/null
@@ -0,0 +1,37 @@
+<ng-template #dialogContent>
+  <div class="modal-header bg-info">
+    <h4 class="modal-title" i18n>Grid Menu Configuration</h4>
+    <button type="button" class="close" 
+      i18n-aria-label aria-label="Close" (click)="close()">
+      <span aria-hidden="true">&times;</span>
+    </button>
+  </div>
+  <div class="modal-body">
+    <div class="row">
+      <div class="col-lg-9 eg-grid-header-cell" i18n>Menu Item</div>
+      <div class="col-lg-3 eg-grid-header-cell" i18n>Visible</div>
+    </div>
+    <div class="row pt-1" *ngFor="let action of gridContext.toolbarActions">
+      <ng-container *ngIf="action.isGroup">
+        <div class="col-lg-12 font-weight-bold font-italic">{{action.label}}</div>
+      </ng-container>
+      <ng-container *ngIf="action.isSeparator">
+        <div class="col-lg-12 dropdown-divider"></div>
+      </ng-container>
+      <ng-container *ngIf="!action.isGroup && !action.isSeparator">
+        <div class="col-lg-9">
+          <div [ngClass]="{'pl-2': action.group}"
+            (click)="action.hidden=!action.hidden">{{action.label}}</div>
+        </div>
+        <div class="col-lg-3" (click)="action.hidden=!action.hidden">
+          <span *ngIf="!action.hidden" class="badge badge-success">&#x2713;</span>
+          <span *ngIf="action.hidden" class="badge badge-warning">&#x2717;</span>
+        </div>
+      </ng-container>
+    </div>
+  </div>
+  <div class="modal-footer">
+    <button type="button" class="btn btn-success ml-2" 
+      (click)="close('confirmed')" i18n>Close</button>
+  </div>
+</ng-template>
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid-toolbar-actions-editor.component.ts
new file mode 100644 (file)
index 0000000..8385e38
--- /dev/null
@@ -0,0 +1,17 @@
+import {Component, Input, OnInit, Host} from '@angular/core';
+import {GridToolbarAction, GridContext} from '@eg/share/grid/grid';
+import {DialogComponent} from '@eg/share/dialog/dialog.component';
+
+/** Allows users to show/hide toolbar action entries */
+
+@Component({
+  selector: 'eg-grid-toolbar-actions-editor',
+  templateUrl: 'grid-toolbar-actions-editor.component.html'
+})
+
+export class GridToolbarActionsEditorComponent extends DialogComponent {
+
+    @Input() gridContext: GridContext;
+
+}
+
index eb701ce..f645903 100644 (file)
@@ -1,3 +1,5 @@
+<eg-grid-toolbar-actions-editor #toolbarActionsEditor [gridContext]="gridContext">
+</eg-grid-toolbar-actions-editor>
 
 <div class="eg-grid-toolbar mb-2">
 
         <span class="material-icons">compare_arrows</span>
         <span class="ml-2" i18n>Manage Column Widths</span>
       </a>
+      <a class="dropdown-item label-with-material-icon" 
+        (click)="toolbarActionsEditor.open().subscribe()">
+        <span class="material-icons">menu</span>
+        <span class="ml-2" i18n>Manage Actions Menu</span>
+      </a>
       <a class="dropdown-item label-with-material-icon"
         *ngIf="!disableSaveSettings"
         (click)="saveGridConfig()">
index b738ac6..0757fab 100644 (file)
@@ -15,6 +15,7 @@ import {GridColumnConfigComponent} from './grid-column-config.component';
 import {GridColumnWidthComponent} from './grid-column-width.component';
 import {GridPrintComponent} from './grid-print.component';
 import {GridFilterControlComponent} from './grid-filter-control.component';
+import {GridToolbarActionsEditorComponent} from './grid-toolbar-actions-editor.component';
 
 
 @NgModule({
@@ -33,7 +34,8 @@ import {GridFilterControlComponent} from './grid-filter-control.component';
         GridColumnConfigComponent,
         GridColumnWidthComponent,
         GridPrintComponent,
-        GridFilterControlComponent
+        GridFilterControlComponent,
+        GridToolbarActionsEditorComponent
     ],
     imports: [
         EgCommonModule,
index c45acb3..60e8c4a 100644 (file)
@@ -1142,6 +1142,7 @@ export class GridToolbarAction {
     isGroup: boolean; // used for group placeholder entries
     isSeparator: boolean;
     disableOnRows: (rows: any[]) => boolean;
+    hidden?: boolean;
 }
 
 // Buttons are global actions