lender list for payin concept cast into stone.

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

@@ -1,5 +1,6 @@
-<kendo-grid [data]="gridData"
+<kendo-grid #grid [data]="gridData"
             [pageable]="pageable"
+            [navigable]="true"
             [pageSize]="filter.Take"
             [skip]="filter.Skip"
             [sortable]="sortable"
@@ -8,6 +9,11 @@
 
             [sort]="filter.Sort"
 
+            [selectable]="true"
+            kendoGridSelectBy
+            [selectedKeys]="gridSelection"
+
+
             (add)="addHandler($event)"
             (cancel)="cancelHandler($event)"
             (save)="saveHandler($event)"

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

@@ -6,7 +6,7 @@ import {PayInService} from '../service/pay-in.service';
 import {PayInListResult} from '../models/pay-in-list-result.model';
 import {Router} from '@angular/router';
 import {PopupIncomeFilterComponent} from '../popup-income-filter/popup-income-filter.component';
-import {PageChangeEvent, SortSettings} from '@progress/kendo-angular-grid';
+import {GridComponent, PageChangeEvent, SortSettings} from '@progress/kendo-angular-grid';
 import {SortDescriptor} from '@progress/kendo-data-query';
 import {UploadMetaModel} from '../models/uploadMetaModel';
 import {debounce} from 'ts-debounce';
@@ -34,6 +34,7 @@ export class PayInComponent implements OnInit {
   @Input() filter: PayInListFilterModel = new PayInListFilterModel({});
   @Output() errorOccurred = new EventEmitter<string>();
   @ViewChild('filterDialog', {static: true}) filterDialog: PopupIncomeFilterComponent;
+  @ViewChild('grid', {static: true}) grid: GridComponent;
   private privateLoadDataNow = false;
 
 
@@ -44,7 +45,9 @@ export class PayInComponent implements OnInit {
   public showBalance = true;
   public showOffsetBalance = true;
 
-  public pageable = true;
+  @Input() public pageable = true;
+
+  public gridSelection: number[] = [];
   public sortable: SortSettings = {
     mode: 'single'
   };
@@ -312,4 +315,10 @@ export class PayInComponent implements OnInit {
       this.incomeFormGroup.get('LoanNumber').disable({onlySelf: true, emitEvent: false});
     }
   }
+
+  public ScrollTo(row: number): void {
+    this.grid.scrollTo({ row});
+    this.grid.focusCell(row + 1, 1 );
+    this.gridSelection = [row];
+  }
 }

src/app/service/funder.name.service.ts

@@ -17,7 +17,7 @@ export class FunderNameService  extends BehaviorSubject<string[]> {
 
   private fetch(): Observable<string[]>{
     this.loading = true;
-    return this.http.get<string[]>(this.config.getUrl('funder-list/')).pipe(
+    return this.http.get<string[]>(this.config.getUrl('lender-list/')).pipe(
       tap(() => this.loading = false)
     );
   }

src/app/upload-detail/upload-detail.component.html

@@ -53,42 +53,7 @@
               </div>
               <div *ngIf="scanDone" class="analysis-result">
                 <div *ngIf="ua.Funders === undefined || ua.Funders.length == 0"> No result analyzed </div>
-                <kendo-tabstrip *ngIf="ua.Funders !== undefined && ua.Funders.length > 0">
-                  <kendo-tabstrip-tab *ngIf="ua.AAA !==undefined && ua.AAA !== null" [title]="'AAA'" [selected]="true">
-                    <ng-template kendoTabContent>
-                      <kendo-grid  [data]="analysisAAA">
-                        <ng-template kendoGridToolbarTemplate>
-                          {{ ua.Funders[0] }}
-                        </ng-template>
-                        <kendo-grid-column field="Period" format='{0:yyyy MMMM}'> </kendo-grid-column>
-                        <kendo-grid-column field="LoanNumber"> </kendo-grid-column>
-                        <kendo-grid-column field="Settlement" format='{0:MM/dd/yyyy h:mm a}'> </kendo-grid-column>
-                        <kendo-grid-column field="LoanAmount" format='{0:c}' > </kendo-grid-column>
-                        <kendo-grid-column field="Balance" format='{0:c}' > </kendo-grid-column>
-                        <kendo-grid-column field="InTrail" format='{0:c}'> </kendo-grid-column>
-                      </kendo-grid>
-                    </ng-template>
-                  </kendo-tabstrip-tab>
-                  <kendo-tabstrip-tab [title]="'Paris'" >
-                    <ng-template kendoTabContent>
-                      <p>
-                        Paris is the capital and most populous city of France. It has an area of 105 square kilometres (41 square miles) and a population in 2013 of 2,229,621 within its administrative limits. The city is both a commune and department, and forms the centre and headquarters of the Île-de-France, or Paris Region, which has an area of 12,012 square kilometres (4,638 square miles) and a population in 2014 of 12,005,077, comprising 18.2 percent of the population of France.
-                      </p>
-                    </ng-template>
-                  </kendo-tabstrip-tab>
 
-                  <kendo-tabstrip-tab [title]="'Tallinn'">
-                    <ng-template kendoTabContent>
-                      <p>
-                        Tallinn is the capital and largest city of Estonia. It is situated on the northern coast of the country, on the shore of the Gulf of Finland, 80 km (50 mi) south of Helsinki, east of Stockholm and west of Saint Petersburg. From the 13th century until 1918 (and briefly during the Nazi occupation of Estonia from 1941 to 1944), the city was known as Reval. Tallinn occupies an area of 159.2 km2 (61.5 sq mi) and has a population of 443,894. Approximately 32% of Estonia's total population lives in Tallinn.
-                      </p>
-                      <p>
-                        Tallinn was founded in 1248, but the earliest human settlements are over 5,000 years old, making it one of the oldest capital cities of Northern Europe. Due to its strategic location, the city became a major trade hub, especially from the 14th to the 16th century, when it grew in importance as part of the Hanseatic League.
-                      </p>
-                    </ng-template>
-                  </kendo-tabstrip-tab>
-                  <kendo-tabstrip-tab [title]="'Sydney'" [disabled]="true"></kendo-tabstrip-tab>
-                </kendo-tabstrip>
               </div>
 
             </ng-template>
@@ -103,11 +68,12 @@
                          (sizeChange)="onPayInSizeChange($event)"
                          [(size)]="PayInSize">
       <div class="pane-content">
-        <app-pay-in *ngIf="ua.Input !== undefined && ua.Input !== null"
+        <app-pay-in *ngIf="ua.Input !== undefined && ua.Input !== null" #PayIn
                     [uploadMeta]="ua.Input"
                     [showUploadColumn]="false"
                     [showLoanColumn]="true"
                     [LoadDataNow] = "true"
+                    [pageable]="false"
         >
         </app-pay-in>
       </div>

src/app/upload-detail/upload-detail.component.ts

@@ -6,6 +6,8 @@ import {UploadMetaModel} from '../models/uploadMetaModel';
 import {FloatingActionButtonComponent} from '@progress/kendo-angular-buttons';
 import {DrawerSelectEvent, TabStripComponent} from '@progress/kendo-angular-layout';
 import {PayInAAARowModel} from '../models/Pay.In.AAA.Row.model';
+import {CellCloseEvent} from '@progress/kendo-angular-grid';
+import {PayInComponent} from '../pay-in/pay-in.component';
 
 
 
@@ -21,6 +23,8 @@ export class UploadDetailComponent implements OnInit, AfterViewInit {
   @ViewChild('fab', {static: true}) fab: FloatingActionButtonComponent;
   @ViewChild('pdf', {static: false}) pdf: ElementRef;
   @ViewChild('tabs', {static: true}) tab: TabStripComponent;
+  @ViewChild('PayIn', {static: false}) payIn: PayInComponent;
+
   // 'http://africau.edu/images/default/sample.pdf';
   public uploadAsPicUrl =  '';
   public uploadAsPdfUrl = '';
@@ -167,4 +171,9 @@ export class UploadDetailComponent implements OnInit, AfterViewInit {
     this.resizeSplitter = true;
     this.fabOffset = {x: '10px', y: s};
   }
+
+  public onCellClick(event: CellCloseEvent): void{
+    console.log('cell-click', event.dataItem, event, this.payIn);
+    this.payIn.ScrollTo(2);
+  }
 }