bug fix for number filter and pay-in list all income mode

src/app/app.config.model.ts

   public Socket = 'ws://c5016.biukop.com.au:8080/api/v1/';
   public SessionStorageKey = 'sk';
   public Version ? = environment.appVersion;
-  constructor(payload: Partial<AppConfigModel>) {
+
+  constructor(payload?: Partial<AppConfigModel>) {
+    if (!payload) { payload = {}; }
     this.Server = payload.Server || 'https://c5016.biukop.com.au:8080/api/v1/';
     this.Socket = payload.Socket || 'ws://c5016.biukop.com.au:8080/api/v1/';
     this.SessionStorageKey = payload.SessionStorageKey || 'sk';

src/app/grid-filter/date-filter/date-filter.component.ts

   @Input() fieldName = '';
   @Input() start = 0;
   @Input() end = 0;
+  @Input() format = 'Date';
 
   public date: Date;
   @Input() public range = 0;
       this.applyFilter(this.updateFilter({
         field: this.fieldName,
         operator: 'eq',
-        value: this.date
+        value: this.getOutput(this.date)
       }));
     }
   }
 
+  private getOutput(d: Date): Date| number {
+    switch ( this.format ){
+      case 'unixtimestamp':
+        return d.getTime() / 1000;
+      default:
+        return d;
+    }
+  }
+
   private buildRangeFilter(): void {
     const fs: FilterDescriptor[] = [];
     const start: Date = new Date(this.date); start.setDate(this.date.getDate() - this.range);
     fs.push({
       field: this.fieldName,
       operator: 'gte',
-      value: start.getTime() / 1000
+      value: this.getOutput(start)
     });
 
     fs.push({
       field: this.fieldName,
       operator: 'lte',
-      value: end.getTime() / 1000
+      value: this.getOutput(end)
     });
     this.removeFilter(this.fieldName);
     const root: CompositeFilterDescriptor = this.filter || { logic: 'and',

src/app/list-all-rewards/list-all-rewards.component.html

     class="fullheight_grid"
   >
     <ng-template kendoGridToolbarTemplate [position]="'top'">
-      <button (click)="onSelectionEmit()" class="k-button">Custom action</button>
+      <button (click)="onSelectionEmit()" class="k-button">Make Payment</button>
     </ng-template>
 
     <kendo-grid-checkbox-column *ngIf="EnableSelectButton" width="50" ></kendo-grid-checkbox-column>
     <kendo-grid-column field="Id" width="100">
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-string-filter-cell
-          [showOperators]="false"
-          [operator]="'eq'"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-string-filter-cell>
+        <app-number-range-filter [filter]="filter" [fieldName]="'Id'"
+                                 [options]="['eq']" [min]=1
+        >
+        </app-number-range-filter>
       </ng-template>
     </kendo-grid-column>
 
         <span >{{ dataItem.Amount | currency }}</span>
       </ng-template>
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-numeric-filter-cell
-          [showOperators]="false"
-          [operator]="'gte'"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-numeric-filter-cell>
+        <app-number-range-filter [filter]="filter" [fieldName]="'Amount'"
+                                 [options]="['gte', 'lte', 'eq']" [min]=0
+        >
+        </app-number-range-filter>
       </ng-template>
     </kendo-grid-column>
     <kendo-grid-column field="ToDisplay" title="Beneficiary" width="250">
           <div class="customer-name"> {{  dataItem.ToDisplay }}</div>
       </ng-template>
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-string-filter-cell
-          [showOperators]="false"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-string-filter-cell>
+        <app-string-filter [filter]="filter" [fieldName]="'ToDisplay'">
+        </app-string-filter>
       </ng-template>
     </kendo-grid-column>
     <kendo-grid-column field="Description" title=" Description" >
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-string-filter-cell
-          [showOperators]="false"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-string-filter-cell>
+        <app-string-filter [filter]="filter" [fieldName]="'Description'">
+        </app-string-filter>
       </ng-template>
     </kendo-grid-column>
 
     <kendo-grid-column field="Item" title=" From Loan">
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-string-filter-cell
-          [showOperators]="false"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-string-filter-cell>
+        <app-string-filter [filter]="filter" [fieldName]="'Item'">
+        </app-string-filter>
       </ng-template>
     </kendo-grid-column>
     <kendo-grid-column field="Status" title="Loan Status">
         <span *ngIf="dataItem.Status != 'none'" class="badge badge-success">{{dataItem.Status}}</span>
       </ng-template>
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-string-filter-cell
-          [showOperators]="false"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-string-filter-cell>
+        <app-string-filter [filter]="filter" [fieldName]="'Status'">
+        </app-string-filter>
       </ng-template>
     </kendo-grid-column>
 
         </div>
       </ng-template>
       <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-        <kendo-grid-date-filter-cell
-          [showOperators]="false"
-          [column]="column"
-          [filter]="filter">
-        </kendo-grid-date-filter-cell>
+        <app-date-filter [filter]="filter" [fieldName]="'Ts'" [start]=0 [end]="15"
+                         [range]=1 >
+        </app-date-filter>
       </ng-template>
     </kendo-grid-column>
 

src/app/list-all-rewards/list-all-rewards.component.ts

   public gridView: GridDataResult;
   public state: State = {
     skip: 0,
-    take: 20
+    take: 20,
+    filter: {logic: 'and', filters: []}
   };
   public loading = true;
 
   public selectTableSettings: SelectableSettings | boolean = true;
-  private multipleSelection: SelectableSettings = {
-    checkboxOnly: false,
-    mode: 'multiple',
-    drag: false
-  };
+  // private multipleSelection: SelectableSettings = {
+  //   checkboxOnly: false,
+  //   mode: 'multiple',
+  //   drag: false
+  // };
 
   public EnableSelectButton = true;
   @Input() selectedRewards: RewardModel[] = [];

src/app/models/pay-in-list.filter.model.ts

-import {SortDescriptor} from '@progress/kendo-data-query';
+import {CompositeFilterDescriptor, GroupDescriptor, SortDescriptor} from '@progress/kendo-data-query';
 
 export class PayInListFilterModel {
   LoanIds: string[];
   UploadIds: string[];
   Take: number;
   Skip: number;
-  TsFrom: Date;
-  TsTo: Date;
-  IdFrom: number;
-  IdTo: number;
-  TrailFrom: number;
-  TrailTo: number;
-  BalanceFrom: number;
-  BalanceTo: number;
-  AmountFrom: number;
-  AmountTo: number;
   Sort?: SortDescriptor[];
-
+  Group?: Array<GroupDescriptor>;
+  Filter?: CompositeFilterDescriptor;
   constructor(payload: Partial<PayInListFilterModel>) {
     this.LoanIds = [];
     if (payload.LoanIds !== undefined && payload.LoanIds.length > 0) {
     if (payload.UploadIds !== undefined && payload.UploadIds.length > 0 ) {
       payload.UploadIds.forEach(v => { this.UploadIds.push(v); });
     }
-
-    const bigNumber = 9999999999;
     this.Take = payload.Take || 0;
     this.Skip = payload.Skip || 0;
-    this.TsFrom = payload.TsFrom? new Date(payload.TsFrom) : new Date('1900-01-01');
-    this.TsTo = payload.TsTo? new Date(payload.TsTo) : new Date('2038-01-01');
-    this.IdFrom = payload.IdFrom || 0;
-    this.IdTo = payload.IdTo || bigNumber;
-    this.TrailFrom = payload.TrailFrom || 0;
-    this.TrailTo = payload.TrailTo || bigNumber;
-    this.BalanceFrom = payload.BalanceFrom || -1 ;
-    this.BalanceTo = payload.BalanceTo || bigNumber;
-    this.AmountFrom = payload.AmountFrom || 0;
-    this.AmountTo = payload.AmountTo || bigNumber;
+    this.Sort = payload.Sort || [];
+    this.Group = payload.Group || [];
+    this.Filter = payload.Filter || { logic: 'and', filters: []  };
   }
 }

src/app/pay-in/pay-in.component.html

             [loading]="loading"
 
             [sort]="filter.Sort"
-            [filter]="state.filter"
+            [filter]="filter.Filter"
 
             [selectable]="selectable"
             kendoGridSelectBy
     </ng-template>
 
     <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
-      <app-date-filter [filter]="filter" [fieldName]="'Ts'" [start]=0 [end]="15" [range]=1 >
+      <app-date-filter [filter]="filter" [fieldName]="'Ts'" [start]=0 [end]="15" [range]=1 [format]="'unixtimestamp'">
       </app-date-filter>
     </ng-template>
   </kendo-grid-column>
   </kendo-grid-column>
 
 </kendo-grid>
-<app-popup-income-filter #filterDialog (DoFilter)="doFilter($event)"> </app-popup-income-filter>
+<!--<app-popup-income-filter #filterDialog (DoFilter)="doFilter($event)"> </app-popup-income-filter>-->

src/app/pay-in/pay-in.component.ts

   private filterUploadMeta: UploadMetaModel = new UploadMetaModel({});
   public filterLoan = new LoanModel({});
   @Input() filter: PayInListFilterModel = new PayInListFilterModel({});
-  public state = new GridStateModel();
+  // public state = new GridStateModel();
   @Output() errorOccurred = new EventEmitter<string>();
   @Output() Updated = new EventEmitter<PayInModel>();
-  @ViewChild('filterDialog', {static: true}) filterDialog: PopupIncomeFilterComponent;
+  // @ViewChild('filterDialog', {static: true}) filterDialog: PopupIncomeFilterComponent;
   @ViewChild('grid', {static: true}) grid: GridComponent;
   private privateLoadDataNow = false;
 
   }
 
   ngOnInit(): void {
-    this.debouncedLoadFilteredData = debounce(this.loadFilteredData, 500);
+    this.debouncedLoadFilteredData = debounce(this.loadFilteredPayInList, 500);
     if (this.privateLoadDataNow) { // not in delayed loading mode
       this.debouncedLoadFilteredData();
     }
   }
 
-  public loadFilteredData(): void{
-    this.loading = true;
-    this.pis.getPayInList(this.filter).subscribe(
-      ( resp: PayInListResult) => {
-        this.gridData.total = resp.total;
-        this.gridData.data = [];
-        resp.data.forEach(v => {
-          this.gridData.data.push(new PayInModelEx(v));
-        });
-        this.loading = false;
-      }, err => {
-        this.loading = false;
-      }, () => {
-        this.loading = false;
-      }
-    );
-  }
+  // public loadFilteredData(): void{
+  //   this.loading = true;
+  //   this.pis.getPayInList(this.filter).subscribe(
+  //     ( resp: PayInListResult) => {
+  //       this.gridData.total = resp.total;
+  //       this.gridData.data = [];
+  //       resp.data.forEach(v => {
+  //         this.gridData.data.push(new PayInModelEx(v));
+  //       });
+  //       this.loading = false;
+  //     }, err => {
+  //       this.loading = false;
+  //     }, () => {
+  //       this.loading = false;
+  //     }
+  //   );
+  // }
 
   public loadFilteredPayInList(): void {
     this.loading = true;
-    this.pis.getFilteredPayInList(this.state).subscribe(
+    const state = new GridStateModel();
+    state.filter = this.filter.Filter;
+    state.sort  = this.filter.Sort;
+    state.take  = this.filter.Take;
+    state.group = this.filter.Group;
+    this.pis.getFilteredPayInList(state).subscribe(
       ( resp: PayInListResult) => {
         this.gridData.total = resp.total;
         this.gridData.data = [];
         this.Loan.cuPayIn( model);
         this.updatePiInGrid(model);
         this.Updated.emit(model);
-        console.log(this);
+        // console.log(this);
       },
       err => {
         // TODO: this.errorOccurred.emit('Error saving Income');
     }
   }
 
-  public showFilter(): void{
-    this.filterDialog.show();
-  }
-
-  public doFilter(filter: PayInListFilterModel): void {
-    this.filter.BalanceTo = filter.BalanceTo;
-    this.filter.BalanceFrom = filter.BalanceFrom;
-    this.filter.AmountFrom = filter.AmountFrom;
-    this.filter.AmountTo = filter.AmountTo;
-
-    this.filter.Take = filter.Take;
-    this.filter.TrailFrom = filter.TrailFrom;
-    this.filter.TrailTo = filter.TrailTo;
-    this.filter.IdFrom = filter.IdFrom;
-    this.filter.IdTo = filter.IdTo;
-    this.filter.TsFrom  = filter.TsFrom;
-    this.filter.TsTo = filter.TsTo;
-    this.loadFilteredData();
-  }
+  // public showFilter(): void{
+  //   this.filterDialog.show();
+  // }
+
+  // public doFilter(filter: PayInListFilterModel): void {
+  //   this.filter.BalanceTo = filter.BalanceTo;
+  //   this.filter.BalanceFrom = filter.BalanceFrom;
+  //   this.filter.AmountFrom = filter.AmountFrom;
+  //   this.filter.AmountTo = filter.AmountTo;
+  //
+  //   this.filter.Take = filter.Take;
+  //   this.filter.TrailFrom = filter.TrailFrom;
+  //   this.filter.TrailTo = filter.TrailTo;
+  //   this.filter.IdFrom = filter.IdFrom;
+  //   this.filter.IdTo = filter.IdTo;
+  //   this.filter.TsFrom  = filter.TsFrom;
+  //   this.filter.TsTo = filter.TsTo;
+  //   this.loadFilteredData();
+  // }
 
   public pageChange(event: PageChangeEvent): void {
     this.filter.Skip = event.skip;
     this.filter.Skip = 0;
   }
   public dataStateChange(state: DataStateChangeEvent): void {
-    this.state = state;
-    console.log(state);
+    this.filter.Filter = state.filter;
+    this.filter.Group = state.group;
+    this.filter.Sort = state.sort;
+    this.filter.Skip = state.skip;
+    this.filter.Take = state.take;
+    // console.log(state);
     this.loadFilteredPayInList();
   }
 
 
   public onFilterEnable(filtering: boolean): void {
     if ( ! filtering ) {
-      this.state.filter = {  logic: 'and',   filters: []   };
-      this.state.skip = 0;
+      this.filter.Filter = {  logic: 'and',   filters: []   };
+      this.filter.Skip = 0;
       this.loadFilteredPayInList();
     }
   }