LP#1626157 Grid column persistence
authorBill Erickson <berickxx@gmail.com>
Thu, 10 May 2018 18:38:02 +0000 (14:38 -0400)
committerBill Erickson <berickxx@gmail.com>
Thu, 10 May 2018 18:38:02 +0000 (14:38 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/core/store.service.ts
Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.html
Open-ILS/src/eg2/src/app/share/grid/grid-toolbar.component.ts
Open-ILS/src/eg2/src/app/share/grid/grid.component.html
Open-ILS/src/eg2/src/app/share/grid/grid.service.ts
Open-ILS/src/eg2/src/app/staff/admin/server/config/billing_type.component.html

index 218ad83..b4341a6 100644 (file)
@@ -43,12 +43,13 @@ export class EgStoreService {
 
     setItem(key: string, val: any, isJson?: Boolean): Promise<void> {
         // TODO: route keys appropriately
-        this.setLocalItem(key, val, false);
+        this.setLocalItem(key, val, isJson);
         return Promise.resolve();
     }
 
     setLocalItem(key: string, val: any, isJson?: Boolean): void {
         if (!isJson) val = JSON.stringify(val);
+        console.log(`${key} ${val}`);
         window.localStorage.setItem(key, val);
     }
 
index 6d4f471..36206d7 100644 (file)
         <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)="saveColumns()">
+        <span class="material-icons">save</span>
+        <span  class="ml-2" i18n>Save Columns</span>
+      </a>
+
       <div class="dropdown-divider"></div>
 
       <a class="dropdown-item label-with-material-icon" 
index 547e0f0..7d43a33 100644 (file)
@@ -18,6 +18,9 @@ export class EgGridToolbarComponent implements OnInit {
     @Input() toolbarButtons: EgGridToolbarButton[];
     @Input() columnSet: EgGridColumnSet;
     @Input() colWidthConfig: EgGridColumnWidthComponent;
+    @Input() persistKey: string;
+
+    constructor(private gridSvc: EgGridService) {}
 
     ngOnInit() {
 
@@ -25,6 +28,19 @@ export class EgGridToolbarComponent implements OnInit {
         this.pager.onChange$.subscribe(
             val => this.dataSource.requestPage(this.pager));
     }
+
+    saveColumns() {
+        // TODO: when server-side settings are supported, this operation
+        // may offer to save to user/workstation OR org unit settings
+        // depending on perms.
+
+        this.gridSvc.saveColumns(this.columnSet, this.persistKey)
+        .then(
+            // hide the with config after saving
+            ok => this.colWidthConfig.isVisible = false,
+            err => console.error(`Error saving columns: ${err}`)
+        );
+    }
 }
 
 
index 8a1ad18..ca94f76 100644 (file)
@@ -3,7 +3,7 @@
   <eg-grid-toolbar 
     [dataSource]="dataSource" [pager]="pager" 
     [toolbarButtons]="toolbarButtons" [columnSet]="columnSet"
-    [colWidthConfig]="colWidthConfig">
+    [colWidthConfig]="colWidthConfig" persistKey="{{persistKey}}">
   </eg-grid-toolbar>
   <eg-grid-header [columnSet]="columnSet" [dataSource]="dataSource"></eg-grid-header>
   <eg-grid-column-width #colWidthConfig [columnSet]="columnSet"></eg-grid-column-width>
index 20b0b4f..2b57f67 100644 (file)
@@ -2,6 +2,7 @@ import {Injectable, TemplateRef} from '@angular/core';
 import {EgIdlService, EgIdlObject} from '@eg/core/idl.service';
 import {EgOrgService} from '@eg/core/org.service';
 import {EgPcrudService} from '@eg/core/pcrud.service';
+import {EgStoreService} from '@eg/core/store.service';
 
 
 @Injectable()
@@ -10,6 +11,7 @@ export class EgGridService {
     constructor(
         private idl: EgIdlService,
         private org: EgOrgService,
+        private store: EgStoreService,
         private pcrud: EgPcrudService
     ) {
     }
@@ -66,6 +68,16 @@ export class EgGridService {
 
         return columnSet;
     }
+
+
+    saveColumns(columnSet: EgGridColumnSet, persistKey: string): Promise<any> {
+        if (!persistKey)
+            throw new Error('Grid persistKey required to save columns');
+        let compiled = columnSet.compileSaveObject();
+        return this.store.setItem('eg.grid.' + persistKey, compiled);
+    }
+
+    // TODO: saveColumnsAsOrgSetting(...)
 }
 
 
@@ -74,6 +86,7 @@ export class EgGridColumn {
     path: string;
     label: string;
     flex: number;
+    align: string;
     hidden: boolean;
     visible: boolean;
     sort: number;
@@ -106,6 +119,7 @@ export class EgGridColumnSet {
         if (col.isPkey) this.pkeyColumn = col;
         if (!col.flex) col.flex = 2;
         if (!col.label) col.label = col.name;
+        if (!col.align) col.align = 'left';
 
         col.visible = !col.hidden;
 
@@ -181,6 +195,20 @@ export class EgGridColumnSet {
         this.columns.splice(targetIdx, 0, col);
     }
 
+    compileSaveObject() {
+        // only store information about visible columns.
+        let conf = this.displayColumns();
+
+        // scrunch the data down to just the needed info
+        return conf.map(col => {
+            let c: any = {name : col.name}
+            if (col.align != 'left') c.align = col.align;
+            if (col.flex != 2) c.flex = col.flex;
+            if (Number(col.sort)) c.sort = Number(c.sort);
+            return c;
+        });
+    }
+
 }
 
 export class EgGridToolbarButton {
index fddd632..af6bdb1 100644 (file)
@@ -1,7 +1,8 @@
 <eg-staff-banner bannerText="Billing Type Configuration" i18n-bannerText>
 </eg-staff-banner>
 
-<eg-grid #btGrid idlClass="cbt" [dataSource]="dataSource" [isSortable]="true">
+<eg-grid #btGrid idlClass="cbt" [dataSource]="dataSource" 
+    [isSortable]="true" persistKey="admin.server.config.billing_type">
   <eg-grid-toolbar-button label="New Billing Type" i18n-label [action]="createBillingType">
   </eg-grid-toolbar-button>
 </eg-grid>