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

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

     if ( this.range > this.end ){
       this.range = this.end;
     }
-    this.date = new Date();
+    this.date = null;
   }
 
   private rangeBetween(start: number, end: number): number[] {
     this.debouncedDoFilter().then();
   }
   public onRangeChange(r: number): void {
-    console.log(this.date, r);
     this.debouncedDoFilter().then();
   }
 
     const fs: FilterDescriptor[] = [];
     const start: Date = new Date(this.date); start.setDate(this.date.getDate() - this.range);
     const end: Date = new Date(this.date); end.setDate(this.date.getDate() + this.range);
-    console.log(new Date(start), new Date(end));
     fs.push({
       field: this.fieldName,
       operator: 'gte',
-      value: start.getTime()
+      value: start.getTime() / 1000
     });
 
     fs.push({
       field: this.fieldName,
       operator: 'lte',
-      value: end.getTime()
+      value: end.getTime() / 1000
     });
     this.removeFilter(this.fieldName);
     const root: CompositeFilterDescriptor = this.filter || { logic: 'and',

src/app/grid-filter/number-range-filter/number-range-filter.component.ts

   }
 
   private initAvailableOperators(): void {
-    this.availableOperators = this.AllOperatorMap.filter(  v => {
-      // console.log(v, this.options.indexOf(v.value), this.options);
-      return this.options.indexOf(v.value) !== -1;
-    } );
-    if ( this.availableOperators.length === 0) {
+    this.availableOperators = [];
+    const self = this;
+    this.options.forEach( v => this.availableOperators.push(self.getOp(v)) );
+
+    if ( this.availableOperators.length <= 0) {
       this.availableOperators = [this.defaultOperator];
       this.operator = this.defaultOperator;
     }else{
     this.singleMode = this.operator.value !== 'range';
   }
 
+  private getOp(key: string): Operator {
+    let ret: Operator;
+    this.AllOperatorMap.every( v =>  {
+      if ( v.value === key ) {
+        ret = v;
+      }
+      return  v.value !== key;
+    });
+    return ret;
+  }
 
   //
   // Events handling

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

         this.removeFilter(this.fieldName) :
         this.updateFilter({
           field: this.fieldName,
-          operator: 'eq',
+          operator: 'contains',
           value: v
         })
     );

src/app/list-income/list-income.component.html

               [showLoanColumn]="true"
               [showUploadColumn]="true"
               [LoadDataNow]="startLoad"
+              [allowFilter]="true"
   >
   </app-pay-in>
 </div>

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

             [pageSize]="filter.Take"
             [skip]="filter.Skip"
             [sortable]="sortable"
-            [filterable]="allowFilter"
+            [filterable]="filterable"
             [loading]="loading"
 
             [sort]="filter.Sort"
         <span *ngIf="uploadMeta.Id > 0 " class="badge badge-pill badge-primary specific-upload"> {{uploadMeta.Id}}  </span>
         <span *ngIf="uploadMeta.Id > 0 " class="badge badge-secondary specific-upload"> {{uploadMeta.FileName}} </span>
         <button *ngIf="false" kendoButton icon="filter" (click)="showFilter()" >Filter</button>
-        <kendo-switch [(ngModel)]="allowFilter"      onLabel="⧩"
-                      offLabel="all"></kendo-switch>
+        <kendo-switch *ngIf="allowFilter" [(ngModel)]="filterable"   onLabel="⧩"    offLabel="all"
+                      (valueChange)="onFilterEnable($event)"></kendo-switch>
       </div>
     </div>
   </ng-template>
   <kendo-grid-column field="IncomeAmount" title="Income" width="150" format="{0:c}" editor="numeric">
     <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
       <app-number-range-filter [filter]="filter" [fieldName]="'IncomeAmount'"
-                               [options]="['eq', 'lte', 'gte', 'range']" [min]=0
+                               [options]="['gte', 'eq', 'lte', 'range']" [min]=0
       >
       </app-number-range-filter>
     </ng-template>
 
     <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
       <app-number-range-filter [filter]="filter" [fieldName]="'Balance'"
-                               [options]="['eq', 'lte', 'gte','range']" [min]=0
+                               [options]="['gte', 'lte', 'eq','range']" [min]=0
       >
       </app-number-range-filter>
     </ng-template>
     </ng-template>
     <ng-template kendoGridFilterCellTemplate let-filter let-column="column">
       <app-number-range-filter [filter]="filter" [fieldName]="'OffsetBalance'"
-                               [options]="['eq', 'lte', 'gte', 'range']" [min]=0
+                               [options]="['gte', 'lte', 'eq', 'range']" [min]=0
       >
       </app-number-range-filter>
     </ng-template>

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

   RowClassArgs,
   SortSettings,
   DataStateChangeEvent,
-  SelectableSettings
+  SelectableSettings, PagerSettings
 } from '@progress/kendo-angular-grid';
 import {CompositeFilterDescriptor, FilterDescriptor, SortDescriptor} from '@progress/kendo-data-query';
 import {UploadMetaModel} from '../models/uploadMetaModel';
   public showBalance = true;
   public showOffsetBalance = true;
 
-  @Input() public pageable = true;
+  @Input() public pageable: PagerSettings = {
+        pageSizes: [2, 5, 10, 15, 20, 30, 40, 50, 100],
+        previousNext: true
+  };
   @Input() public pageSize = 15;
 
   @Input() public Selection: number[] = [];
+
+  public pageSizeOptions = [2, 5, 10, 15, 20, 30, 40, 50, 100];
+  public filterable: boolean;
   public sortable: SortSettings = {
     mode: 'single'
   };
 
   public pageChange(event: PageChangeEvent): void {
     this.filter.Skip = event.skip;
+    this.filter.Take = event.take;
     // this.loadFilteredData();
   }
 
 
   public filterChange( filter: CompositeFilterDescriptor): void {
     // console.log (filter, this.state.filter);
+    this.filter.Skip = 0;
   }
   public dataStateChange(state: DataStateChangeEvent): void {
     this.state = state;
+    console.log(state);
     this.loadFilteredPayInList();
-    console.log(state, this.state);
   }
 
   public onLoanChange(loan: LoanModel): void {
     });
     return found;
   }
+
+  public onFilterEnable(filtering: boolean): void {
+    if ( ! filtering ) {
+      this.state.filter = {  logic: 'and',   filters: []   };
+      this.state.skip = 0;
+      this.loadFilteredPayInList();
+    }
+  }
 }