LP#1775466 more grid
authorBill Erickson <berickxx@gmail.com>
Tue, 8 May 2018 22:29:10 +0000 (18:29 -0400)
committerBill Erickson <berickxx@gmail.com>
Wed, 6 Jun 2018 20:59:25 +0000 (16:59 -0400)
Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/share/fm-editor/fm-editor.component.html
Open-ILS/src/eg2/src/app/share/grid/grid-data-source.ts
Open-ILS/src/eg2/src/app/share/grid/grid-header.component.html
Open-ILS/src/eg2/src/app/share/grid/grid-header.component.ts
Open-ILS/src/eg2/src/app/share/grid/grid.component.html
Open-ILS/src/eg2/src/app/staff/admin/server/config/billing_type.component.html
Open-ILS/src/eg2/src/app/staff/admin/server/config/billing_type.component.ts

index e509ce1..5b582db 100644 (file)
@@ -30,6 +30,8 @@
             <input *ngIf="field.datatype == 'id' && pkeyIsEditable"
               class="form-control"
               name="{{field.name}}"
+              placeholder="{{field.label}}..."
+              i18n-placeholder
               [readonly]="field.readOnly"
               [required]="field.isRequired()"
               [ngModel]="record[field.name]()"
@@ -38,6 +40,8 @@
             <input *ngIf="field.datatype == 'text'"
               class="form-control"
               name="{{field.name}}"
+              placeholder="{{field.label}}..."
+              i18n-placeholder
               [readonly]="field.readOnly"
               [required]="field.isRequired()"
               [ngModel]="record[field.name]()"
@@ -47,6 +51,8 @@
               class="form-control"
               type="number"
               name="{{field.name}}"
+              placeholder="{{field.label}}..."
+              i18n-placeholder
               [readonly]="field.readOnly"
               [required]="field.isRequired()"
               [ngModel]="record[field.name]()"
@@ -56,6 +62,8 @@
               class="form-control"
               type="number" step="0.1"
               name="{{field.name}}"
+              placeholder="{{field.label}}..."
+              i18n-placeholder
               [readonly]="field.readOnly"
               [required]="field.isRequired()"
               [ngModel]="record[field.name]()"
@@ -75,6 +83,8 @@
                 class="form-control"
                 type="number" step="0.1"
                 name="{{field.name}}"
+                placeholder="{{field.label}}..."
+                i18n-placeholder
                 [readonly]="field.readOnly"
                 [required]="field.isRequired()"
                 [ngModel]="record[field.name]()"
             </span>
   
             <eg-org-select *ngIf="field.datatype == 'org_unit'"
-              [placeholder]="field.label"
+              placeholder="{{field.label}}..."
+              i18n-placeholder
               [applyDefault]="field.orgDefaultAllowed"
               [initialOrgId]="record[field.name]()"
               (onChange)="record[field.name]($event)">
index af54b26..f75a5f2 100644 (file)
@@ -5,11 +5,13 @@ import {Pager} from '@eg/share/util/pager';
 export class EgGridDataSource {
 
     data: any[];
+    sort: any[];
     pager: Pager;
     allRowsRetrieved: boolean;
-    getRows: (pager: Pager) => Observable<any>;
+    getRows: (pager: Pager, sort: any[]) => Observable<any>;
 
     constructor() {
+        this.sort = [];
         this.reset();
     }
 
@@ -44,7 +46,7 @@ export class EgGridDataSource {
         if (!this.getRows) return;
 
         let idx = pager.offset;
-        this.getRows(pager).subscribe(
+        this.getRows(pager, this.sort).subscribe(
             row => this.data[idx++] = row,
             err => console.error(`grid getRows() error ${err}`),
             ()  => this.checkAllRetrieved(pager, idx)
index 622de57..14aeec6 100644 (file)
@@ -14,7 +14,9 @@
     (dragleave)="onColumnDragLeave($event, col)"
     [ngClass]="{'dragover' : col.isDragTarget}"
     class="eg-grid-cell eg-grid-header-cell" [ngStyle]="{flex:col.flex}">
-    <a class="sortable" *ngIf="col.isSortable">{{col.label}}</a>
+    <a class="sortable" *ngIf="col.isSortable" (click)="sortOneColumn(col)">
+      {{col.label}}
+    </a>
     <span *ngIf="!col.isSortable">{{col.label}}</span>
   </div>
 </div>
index aaadba3..4234d46 100644 (file)
@@ -1,5 +1,7 @@
-import {Component, Input, OnInit, HostListener} from '@angular/core';
+import {Component, Input, OnInit, Host} from '@angular/core';
 import {EgGridService, EgGridColumn, EgGridColumnSet} from './grid.service';
+import {EgGridDataSource} from './grid-data-source';
+import {EgGridComponent} from './grid.component';
 
 @Component({
   selector: 'eg-grid-header',
@@ -10,9 +12,13 @@ export class EgGridHeaderComponent implements OnInit {
 
     @Input() columnSet: EgGridColumnSet;
     @Input() selected: {[idx:number] : boolean};
+    @Input() dataSource: EgGridDataSource;
     dragColumn: EgGridColumn;
 
-    constructor(private gridSvc: EgGridService) { }
+    constructor(
+        private gridSvc: EgGridService,
+        @Host() private grid: EgGridComponent
+    ) { }
 
     ngOnInit() {
     }
@@ -32,5 +38,17 @@ export class EgGridHeaderComponent implements OnInit {
         this.columnSet.insertBefore(this.dragColumn, col);
         this.columnSet.columns.forEach(c => c.isDragTarget = false);
     }
+
+    sortOneColumn(col: EgGridColumn) {
+        let dir = 'ASC';
+        let sort = this.dataSource.sort;
+
+        if (sort.length && sort[0].name == col.name && sort[0].dir == 'ASC') {
+            dir = 'DESC';
+        }
+
+        this.dataSource.sort = [{name: col.name, dir: dir}];
+        this.grid.reload();
+    }
 }
 
index ad655cb..ac9ed9a 100644 (file)
@@ -2,7 +2,7 @@
 <div class="eg-grid">
   <eg-grid-toolbar [dataSource]="dataSource" [pager]="pager" 
     [toolbarButtons]="toolbarButtons" [columnSet]="columnSet"></eg-grid-toolbar>
-  <eg-grid-header [columnSet]="columnSet"></eg-grid-header>
+  <eg-grid-header [columnSet]="columnSet" [dataSource]="dataSource"></eg-grid-header>
 
   <div class="eg-grid-row eg-grid-body-row"
     [ngClass]="{'eg-grid-row-selected': selector[idx]}"
index 94b39f5..fddd632 100644 (file)
@@ -1,7 +1,7 @@
 <eg-staff-banner bannerText="Billing Type Configuration" i18n-bannerText>
 </eg-staff-banner>
 
-<eg-grid #btGrid idlClass="cbt" [dataSource]="dataSource" >
+<eg-grid #btGrid idlClass="cbt" [dataSource]="dataSource" [isSortable]="true">
   <eg-grid-toolbar-button label="New Billing Type" i18n-label [action]="createBillingType">
   </eg-grid-toolbar-button>
 </eg-grid>
index dce24df..dc28098 100644 (file)
@@ -41,11 +41,15 @@ export class BillingTypeComponent implements OnInit {
 
     ngOnInit() {
 
-        this.dataSource.getRows = (pager: Pager) => {
+        this.dataSource.getRows = (pager: Pager, sort: any[]) => {
+            let orderBy = {};
+            if (sort.length) 
+                orderBy = {cbt: sort[0].name + ' ' + sort[0].dir};
+
             return this.pcrud.retrieveAll('cbt', {
                 offset: pager.offset, 
                 limit: pager.limit,
-                order_by: {cbt: 'name'}
+                order_by: orderBy
             });
         }