@@ -10,6 +10,8 @@ import { Observable } from 'rxjs/Rx';
1010import { FileUploader , FileUploaderOptions } from 'ng2-file-upload' ;
1111import { AppService } from '../../app.service' ;
1212import { ContactDNC } from './contact_dnc' ;
13+ import { NbTreeGridDataSource , NbTreeGridDataSourceBuilder } from '@nebular/theme' ;
14+
1315
1416
1517@Component ( {
@@ -20,19 +22,31 @@ import { ContactDNC } from './contact_dnc';
2022
2123
2224export class FormsContactDNCComponent implements OnInit {
23- constructor ( private contact_dnc_service : ContactDNCService , private modalService : NgbModal , private app_service : AppService ) { }
25+ constructor ( private contact_dnc_service : ContactDNCService ,
26+ private dataSourceBuilder : NbTreeGridDataSourceBuilder < ContactDNC > ,
27+ private modalService : NgbModal , private app_service : AppService ) { }
2428
2529 URL = `${ this . app_service . apiUrlContactDNC }
2630 public uploader : FileUploader = new FileUploader ( { url : this . URL , disableMultipart : true } ) ;
2731
28- aContactDNC : ContactDNCDataSource | null ;
32+ // aContactDNC: ContactDNCDataSource | null;
33+ contactArray : ContactDNC [ ] = [ ]
34+ dataSource : NbTreeGridDataSource < ContactDNC > ;
2935 length : number ;
3036 closeResult : any ;
3137 unsupportedErr : any = false ;
3238 file : any ;
3339 contact_dnc : ContactDNC = new ContactDNC ;
3440
35- displayedColumns = [ 'ID' , 'first_name' , 'last_name' , 'phone' , 'email' , 'operation' ] ;
41+ items_page = [ 5 , 10 , 25 , 100 ] ;
42+ pageSize = 10 ;
43+ startIndex : number = 0 ;
44+ currentPage : number ;
45+ total_pages : number ;
46+ minimumItems : number ;
47+ current_items : any [ ] = [ ] ;
48+
49+ displayedColumns = [ 'contact_dnc_id' , 'first_name' , 'last_name' , 'phone' , 'email' , 'operation' ] ;
3650
3751 @ViewChild ( MatSort ) sort : MatSort ;
3852
@@ -63,23 +77,55 @@ export class FormsContactDNCComponent implements OnInit {
6377 }
6478 getContactDNClist ( ) {
6579 this . contact_dnc_service . get_ContactDNCList ( ) . then ( data => {
80+ this . contactArray = data . sort ( ( a , b ) => b . contact_dnc_id - a . contact_dnc_id ) ;
81+
6682 this . length = data . length ;
67- this . aContactDNC = new ContactDNCDataSource ( new ContactDNCDatabase ( data ) , this . sort , this . paginator ) ;
83+ // this.aContactDNC = new ContactDNCDataSource(new ContactDNCDatabase(data), this.sort, this.paginator);
84+ this . paginate ( this . pageSize ) ;
85+
86+ this . dataSource = this . dataSourceBuilder . create ( this . current_items . map ( item => ( { data : item } ) ) ) ;
87+
6888 // Observable for the filter
69- Observable . fromEvent ( this . filter . nativeElement , 'keyup' )
70- . debounceTime ( 150 )
71- . distinctUntilChanged ( )
72- . subscribe ( ( ) => {
73- if ( ! this . aContactDNC ) { return ; }
74- this . aContactDNC . filter = this . filter . nativeElement . value ;
75- } ) ;
76- //Sort the data automatically
77- const sortState : Sort = { active : 'ID' , direction : 'desc' } ;
78- this . sort . active = sortState . active ;
79- this . sort . direction = sortState . direction ;
80- this . sort . sortChange . emit ( sortState ) ;
89+ // Observable.fromEvent(this.filter.nativeElement, 'keyup')
90+ // .debounceTime(150)
91+ // .distinctUntilChanged()
92+ // .subscribe(() => {
93+ // if (!this.aContactDNC) { return; }
94+ // this.aContactDNC.filter = this.filter.nativeElement.value;
95+ // });
96+ // // Sort the data automatically
97+ // const sortState: Sort = { active: 'ID', direction: 'desc' };
98+ // this.sort.active = sortState.active;
99+ // this.sort.direction = sortState.direction;
100+ // this.sort.sortChange.emit(sortState);
81101 } ) ;
82102 }
103+
104+ paginate ( page_Items : string | number ) {
105+ if ( typeof page_Items === 'string' ) {
106+ if ( page_Items === 'next' ) {
107+ if ( this . startIndex + this . pageSize < this . length ) {
108+ this . startIndex += this . pageSize ;
109+ }
110+ } else if ( page_Items === 'previous' ) {
111+ if ( this . startIndex > 0 ) {
112+ this . startIndex -= this . pageSize ;
113+ }
114+ }
115+ } else {
116+ this . pageSize = page_Items ;
117+ this . startIndex = 0 ;
118+ }
119+ this . currentPage = Math . floor ( this . startIndex / this . pageSize ) + 1 ;
120+ this . total_pages = Math . ceil ( this . length / this . pageSize ) ;
121+ this . minimumItems = Math . min ( this . startIndex + this . pageSize , this . length ) ;
122+
123+ const end = Math . min ( this . startIndex + this . pageSize , this . length ) ;
124+ this . current_items = this . contactArray . slice ( this . startIndex , end ) ;
125+ this . dataSource = this . dataSourceBuilder . create ( this . current_items . map ( item => ( { data : item } ) ) ) ;
126+ }
127+
128+
83129 private refreshData ( ) : void {
84130 this . contact_dnc_service . get_ContactDNCList ( ) . then ( data => {
85131 this . length = data . length ;
@@ -88,15 +134,17 @@ export class FormsContactDNCComponent implements OnInit {
88134 element . contact_phone = 'N/A' ;
89135 }
90136 } )
91- this . aContactDNC = new ContactDNCDataSource ( new ContactDNCDatabase ( data ) , this . sort , this . paginator ) ;
137+ // this.aContactDNC = new ContactDNCDataSource(new ContactDNCDatabase(data), this.sort, this.paginator);
138+ this . dataSource = this . dataSourceBuilder . create ( this . current_items . map ( item => ( { data : item } ) ) ) ;
139+
92140 // Observable for the filter
93- Observable . fromEvent ( this . filter . nativeElement , 'keyup' )
94- . debounceTime ( 150 )
95- . distinctUntilChanged ( )
96- . subscribe ( ( ) => {
97- if ( ! this . aContactDNC ) { return ; }
98- this . aContactDNC . filter = this . filter . nativeElement . value ;
99- } ) ;
141+ // Observable.fromEvent(this.filter.nativeElement, 'keyup')
142+ // .debounceTime(150)
143+ // .distinctUntilChanged()
144+ // .subscribe(() => {
145+ // if (!this.aContactDNC) { return; }
146+ // this.aContactDNC.filter = this.filter.nativeElement.value;
147+ // });
100148 } ) ;
101149
102150 }
0 commit comments