revised eg-grid cell class callback

Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org>

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.html
index 14ce003..912615b 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.html
@@ -2,7 +2,7 @@
 <span *ngIf="!column.cellTemplate"
   [ngbTooltip]="column.disableTooltip ? null : context.getRowColumnValue(row, column)"
   placement="top-left"
-  class="{{context.cellClassCallback(row, column)}}"
+  
   triggers="mouseenter:mouseleave">
   <ng-container *ngIf="column.datatype === 'bool'">
     <eg-bool [value]="context.getRowColumnValue(row, column)"
@@ -14,7 +14,7 @@
   </ng-container>
 </span>
 <span *ngIf="column.cellTemplate" 
-  class="{{context.cellClassCallback(row, column)}}"
+  
   [ngbTooltip]="column.disableTooltip ? null : column.cellTemplate"
   placement="top-left"
   #tooltip="ngbTooltip" 

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.ts
index 4b613b6..ee3daaa 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-body-cell.component.ts
@@ -2,7 +2,7 @@ import {Component, Input} from '@angular/core';
 import {GridContext, GridColumn} from './grid';
 
 @Component({
-  selector: 'td.eg-grid-body-cell',
+  selector: 'eg-grid-body-cell',
   templateUrl: './grid-body-cell.component.html'
 })
 

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
index b654ca7..e9a27f3 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-body.component.html
@@ -41,7 +41,7 @@
     <!-- contextMenu applied to cells instead of rows so the position
          of the popover is close to the mouse.  As of writing, no way
          to position the popover at the mouse -->
-    <td [context]="context" [row]="row" [column]="col" class="eg-grid-cell eg-grid-body-cell eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}} eg-grid-class-{{context.idlClass}}"
+    <td class="eg-grid-cell eg-grid-body-cell  {{context.cellClassCallback(row, col)}}"
       [ngClass]="{'eg-grid-cell-overflow': context.overflowCells}"
       (dblclick)="onRowDblClick(row)"
       (click)="onRowClick($event, row, idx)"
@@ -52,6 +52,8 @@
       placement="bottom"
       triggers="manual"
       *ngFor="let col of context.columnSet.displayColumns()">
+        <eg-grid-body-cell [context]="context" [row]="row" [column]="col">
+        </eg-grid-body-cell>
       </td>
   </tr>
 

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid-header.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid-header.component.html
index ef9feb5..9821049 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid-header.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid-header.component.html
@@ -6,7 +6,7 @@
   </colgroup>
   <colgroup class="eg-grid-col-data">
     <col *ngFor="let col of context.columnSet.displayColumns()" 
-      class="eg-grid-col eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}} eg-grid-class-{{context.idlClass}}" 
+      class="eg-grid-col {{context.cellClassCallback(row, col)}}" 
       [ngStyle]="{flex:col.flex}">
   </colgroup>
 </tr>
@@ -37,7 +37,7 @@
     (dragover)="onColumnDragEnter($event, col)"
     (dragleave)="onColumnDragLeave($event, col)"
     [ngClass]="{'dragover' : col.isDragTarget}"
-    class="eg-grid-cell eg-grid-header-cell eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}} eg-grid-class-{{context.idlClass}}" [ngStyle]="{flex:col.flex}">
+    class="eg-grid-cell eg-grid-header-cell {{context.cellClassCallback(row, col)}}">
     <span>{{col.headerLabel}}</span>
     <button class="sortable label-with-material-icon" *ngIf="col.isSortable"
       (click)="sortOneColumn(col)">
@@ -59,7 +59,7 @@
     class="eg-grid-cell eg-grid-header-cell  {{context.idlFieldDef}}"></th>
 
   <th *ngFor="let col of context.columnSet.displayColumns()" 
-    class="eg-grid-cell eg-grid-filter-control-cell eg-grid-col-{{col.name}} eg-grid-type-{{col.datatype}} eg-grid-class-{{context.idlClass}}" [ngStyle]="{flex:col.flex}">
+    class="eg-grid-cell eg-grid-filter-control-cell {{context.cellClassCallback(row, col)}}">
     <eg-grid-filter-control [context]="context" [col]="col"></eg-grid-filter-control>
   </th>
 </tr>

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts b/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
index 23ed27a..f36dd1c 100644 (file)
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.ts
@@ -207,6 +207,10 @@ export class GridComponent implements OnInit, AfterViewInit, OnDestroy {
         this.context.cellClassCallback =
             this.cellClassCallback ||
             function (row: any, col: GridColumn) {
+                const classNames = ['eg-grid-type-'+col.datatype, 'eg-grid-class-'+col.idlClass, 'eg-grid-col-'+col.name];
+                if (col.path)
+                    classNames.push('eg-grid-path-'+col.path);
+
                 if (col.datatype === 'money') {
                     // get raw value
                     let val;
@@ -216,10 +220,10 @@ export class GridComponent implements OnInit, AfterViewInit, OnDestroy {
                         val = this.getObjectFieldValue(row, col.name);
                     }
                     if (Number(val) < 0) {
-                        return 'negative-money-amount';
+                        classNames.push('negative-money-amount');
                     }
                 }
-                return '';
+                return classNames.join(' ');
             };
 
         this.context.rowSelector.selectionChange.subscribe(