/** Angular Imports. */ import { Component , OnInit , ViewChild , AfterViewInit } from '@angular/core' ; import { MatCheckbox } from '@angular/material/checkbox' ; import { MatPaginator } from '@angular/material/paginator' ; import { MatSort } from '@angular/material/sort' ; import { ClientsDataSource } from './clients.datasource' ; /** rxjs Imports */ import { merge } from 'rxjs' ; import { tap } from 'rxjs/operators' ; /** Custom Services */ import { ClientsService } from './clients.service' ; @ Component ( { selector : 'mifosx-clients' , templateUrl : './clients.component.html' , styleUrls : [ './clients.component.scss' ] , } ) export class ClientsComponent implements OnInit , AfterViewInit { @ ViewChild ( 'showClosedAccounts' , { static : true } ) showClosedAccounts : MatCheckbox ; displayedColumns = [ 'name' , 'clientno' , 'externalid' , 'status' , 'mobileNo' , 'gender' , 'office' , 'staff' ] ; dataSource : ClientsDataSource ; /** Get the required filter value. */ searchValue = '' ; @ ViewChild ( MatPaginator , { static : true } ) paginator : MatPaginator ; @ ViewChild ( MatSort , { static : true } ) sort : MatSort ; constructor ( private clientsService ) { } ngOnInit ( ) { this . getClients ( ) ; } ngAfterViewInit ( ) { this . sort . sortChange . subscribe ( ( ) => this . paginator . pageIndex = 0 ) ; merge ( this . sort . sortChange , this . paginator . page , this . showClosedAccounts . change ) . pipe ( tap ( ( ) => this . loadClientsPage ( ) ) ) . subscribe ( ) ; } /**
     * Loads a page of journal entries.
     */ loadClientsPage ( ) { if ( ! this . sort . direction ) { delete this . sort . active ; } if ( this . searchValue !== '' ) { this . applyFilter ( this . searchValue ) ; } else { this . dataSource . getClients ( this . sort . active , this . sort . direction , this . paginator . pageIndex , this . paginator . pageSize , ! this . showClosedAccounts . checked ) ; } } /**
     * Initializes the data source for clients table and loads the first page.
     */ getClients ( ) { this . dataSource = new ClientsDataSource ( this . clientsService ) ; this . dataSource . getClients ( this . sort . active , this . sort . direction , this . paginator . pageIndex , this . paginator . pageSize , ! this . showClosedAccounts . checked ) ; } param { string } filterValue applyFilter ( filterValue = '' ) { this . searchValue = filterValue ; this . dataSource . filterClients ( filterValue . trim ( ) . toLowerCase ( ) , this . sort . active , this . sort . direction , this . paginator . pageIndex , this . paginator . pageSize , ! this . showClosedAccounts . checked ) ; } }