tanshu/brewman
1
0
Fork 0
Code Issues Pull Requests Releases Activity

All datasources done. Now to wire them up in the components.

Browse Source 
Plus ElementRefs are now optional as they cannot be initialized
This commit is contained in:
Amritanshu Agrawal
2020-11-23 10:25:53 +05:30
parent 39e3cc51bb
commit af343cb7f9
66 changed files with 556 additions and 328 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
overlord/src/app/ledger/ledger-datasource.ts
View File

@ -1,26 +1,32 @@
import { DataSource } from '@angular/cdk/collections';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { EventEmitter } from '@angular/core';
import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { MatSort, Sort } from '@angular/material/sort';
import { merge, Observable, of as observableOf } from 'rxjs';
import { map } from 'rxjs/operators';
import { LedgerItem } from './ledger-item';
/** Simple sort comparator for example ID/Name columns (for client-side sorting). */
function compare(a, b, isAsc) {
function compare(a: string | number, b: string | number, isAsc: boolean) {
return (a < b ? -1 : 1) * (isAsc ? 1 : -1);
}
export class LedgerDataSource extends DataSource<LedgerItem> {
constructor(private paginator: MatPaginator, private sort: MatSort, public data: LedgerItem[]) {
constructor(public data: LedgerItem[], private paginator?: MatPaginator, private sort?: MatSort) {
super();
}
connect(): Observable<LedgerItem[]> {
const dataMutations = [observableOf(this.data), this.paginator.page, this.sort.sortChange];
const dataMutations: (
| Observable<LedgerItem[]>
| EventEmitter<PageEvent>
| EventEmitter<Sort>
)[] = [observableOf(this.data)];
if (this.paginator) dataMutations.push((this.paginator as MatPaginator).page);
if (this.sort) dataMutations.push((this.sort as MatSort).sortChange);
// Set the paginators length
this.paginator.length = this.data.length;
if (this.paginator) this.paginator.length = this.data.length;
return merge(...dataMutations).pipe(
map(() => this.getPagedData(this.getSortedData([...this.data]))),
@ -30,18 +36,21 @@ export class LedgerDataSource extends DataSource<LedgerItem> {
disconnect() {}
private getPagedData(data: LedgerItem[]) {
if (this.paginator === undefined) return data;
const startIndex = this.paginator.pageIndex * this.paginator.pageSize;
return data.splice(startIndex, this.paginator.pageSize);
}
private getSortedData(data: LedgerItem[]) {
if (this.sort === undefined) return data;
if (!this.sort.active || this.sort.direction === '') {
return data;
}
const sort = this.sort as MatSort;
return data.sort((a, b) => {
const isAsc = this.sort.direction === 'asc';
switch (this.sort.active) {
const isAsc = sort.direction === 'asc';
switch (sort.active) {
case 'date':
return compare(a.date, b.date, isAsc);
case 'debit':

6
overlord/src/app/ledger/ledger.component.ts
View File

@ -22,9 +22,9 @@ import { LedgerService } from './ledger.service';
styleUrls: ['./ledger.component.css'],
})
export class LedgerComponent implements OnInit, AfterViewInit {
@ViewChild('accountElement', { static: true }) accountElement: ElementRef;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
@ViewChild(MatSort, { static: true }) sort: MatSort;
@ViewChild('accountElement', { static: true }) accountElement?: ElementRef;
@ViewChild(MatPaginator, { static: true }) paginator?: MatPaginator;
@ViewChild(MatSort, { static: true }) sort?: MatSort;
dataSource: LedgerDataSource;
form: FormGroup;
info: Ledger;