|
|
|
@ -10,10 +10,12 @@ import { |
|
|
|
Component, |
|
|
|
EventEmitter, |
|
|
|
Input, |
|
|
|
OnChanges, |
|
|
|
OnDestroy, |
|
|
|
Output, |
|
|
|
ViewChild |
|
|
|
computed, |
|
|
|
inject, |
|
|
|
input, |
|
|
|
viewChild |
|
|
|
} from '@angular/core'; |
|
|
|
import { MatButtonModule } from '@angular/material/button'; |
|
|
|
import { MatMenuModule } from '@angular/material/menu'; |
|
|
|
@ -33,7 +35,7 @@ import { |
|
|
|
walletOutline |
|
|
|
} from 'ionicons/icons'; |
|
|
|
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; |
|
|
|
import { Subject, Subscription } from 'rxjs'; |
|
|
|
import { Subject } from 'rxjs'; |
|
|
|
|
|
|
|
@Component({ |
|
|
|
changeDetection: ChangeDetectionStrategy.OnPush, |
|
|
|
@ -53,20 +55,13 @@ import { Subject, Subscription } from 'rxjs'; |
|
|
|
styleUrls: ['./accounts-table.component.scss'], |
|
|
|
templateUrl: './accounts-table.component.html' |
|
|
|
}) |
|
|
|
export class GfAccountsTableComponent implements OnChanges, OnDestroy { |
|
|
|
@Input() accounts: Account[]; |
|
|
|
export class GfAccountsTableComponent implements OnDestroy { |
|
|
|
@Input() activitiesCount: number; |
|
|
|
@Input() baseCurrency: string; |
|
|
|
@Input() deviceType: string; |
|
|
|
@Input() hasPermissionToOpenDetails = true; |
|
|
|
@Input() locale = getLocale(); |
|
|
|
@Input() showActions: boolean; |
|
|
|
@Input() showActivitiesCount = true; |
|
|
|
@Input() showAllocationInPercentage: boolean; |
|
|
|
@Input() showBalance = true; |
|
|
|
@Input() showFooter = true; |
|
|
|
@Input() showValue = true; |
|
|
|
@Input() showValueInBaseCurrency = true; |
|
|
|
@Input() totalBalanceInBaseCurrency: number; |
|
|
|
@Input() totalValueInBaseCurrency: number; |
|
|
|
|
|
|
|
@ -74,71 +69,72 @@ export class GfAccountsTableComponent implements OnChanges, OnDestroy { |
|
|
|
@Output() accountToUpdate = new EventEmitter<Account>(); |
|
|
|
@Output() transferBalance = new EventEmitter<void>(); |
|
|
|
|
|
|
|
@ViewChild(MatSort) sort: MatSort; |
|
|
|
|
|
|
|
public dataSource = new MatTableDataSource<Account>(); |
|
|
|
public displayedColumns = []; |
|
|
|
public isLoading = true; |
|
|
|
public routeQueryParams: Subscription; |
|
|
|
|
|
|
|
private unsubscribeSubject = new Subject<void>(); |
|
|
|
|
|
|
|
public constructor( |
|
|
|
private notificationService: NotificationService, |
|
|
|
private router: Router |
|
|
|
) { |
|
|
|
addIcons({ |
|
|
|
arrowRedoOutline, |
|
|
|
createOutline, |
|
|
|
documentTextOutline, |
|
|
|
ellipsisHorizontal, |
|
|
|
eyeOffOutline, |
|
|
|
trashOutline, |
|
|
|
walletOutline |
|
|
|
public readonly accounts = input.required<Account[] | undefined>(); |
|
|
|
public readonly showActions = input<boolean>(); |
|
|
|
public readonly showActivitiesCount = input(true); |
|
|
|
public readonly showAllocationInPercentage = input<boolean>(); |
|
|
|
public readonly showBalance = input(true); |
|
|
|
public readonly showValue = input(true); |
|
|
|
public readonly showValueInBaseCurrency = input(false); |
|
|
|
public readonly sort = viewChild.required(MatSort); |
|
|
|
|
|
|
|
protected readonly dataSource = computed(() => { |
|
|
|
const dataSource = new MatTableDataSource<Account>(this.accounts()); |
|
|
|
dataSource.sortingDataAccessor = getLowercase; |
|
|
|
dataSource.sort = this.sort(); |
|
|
|
return dataSource; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
public ngOnChanges() { |
|
|
|
this.displayedColumns = ['status', 'account', 'platform']; |
|
|
|
protected readonly displayedColumns = computed(() => { |
|
|
|
const columns = ['status', 'account', 'platform']; |
|
|
|
|
|
|
|
if (this.showActivitiesCount) { |
|
|
|
this.displayedColumns.push('activitiesCount'); |
|
|
|
if (this.showActivitiesCount()) { |
|
|
|
columns.push('activitiesCount'); |
|
|
|
} |
|
|
|
|
|
|
|
if (this.showBalance) { |
|
|
|
this.displayedColumns.push('balance'); |
|
|
|
if (this.showBalance()) { |
|
|
|
columns.push('balance'); |
|
|
|
} |
|
|
|
|
|
|
|
if (this.showValue) { |
|
|
|
this.displayedColumns.push('value'); |
|
|
|
if (this.showValue()) { |
|
|
|
columns.push('value'); |
|
|
|
} |
|
|
|
|
|
|
|
this.displayedColumns.push('currency'); |
|
|
|
columns.push('currency'); |
|
|
|
|
|
|
|
if (this.showValueInBaseCurrency) { |
|
|
|
this.displayedColumns.push('valueInBaseCurrency'); |
|
|
|
if (this.showValueInBaseCurrency()) { |
|
|
|
columns.push('valueInBaseCurrency'); |
|
|
|
} |
|
|
|
|
|
|
|
if (this.showAllocationInPercentage) { |
|
|
|
this.displayedColumns.push('allocation'); |
|
|
|
if (this.showAllocationInPercentage()) { |
|
|
|
columns.push('allocation'); |
|
|
|
} |
|
|
|
|
|
|
|
this.displayedColumns.push('comment'); |
|
|
|
columns.push('comment'); |
|
|
|
|
|
|
|
if (this.showActions) { |
|
|
|
this.displayedColumns.push('actions'); |
|
|
|
if (this.showActions()) { |
|
|
|
columns.push('actions'); |
|
|
|
} |
|
|
|
|
|
|
|
this.isLoading = true; |
|
|
|
return columns; |
|
|
|
}); |
|
|
|
|
|
|
|
this.dataSource = new MatTableDataSource(this.accounts); |
|
|
|
this.dataSource.sortingDataAccessor = getLowercase; |
|
|
|
protected readonly isLoading = computed(() => !this.accounts()); |
|
|
|
|
|
|
|
this.dataSource.sort = this.sort; |
|
|
|
private readonly notificationService = inject(NotificationService); |
|
|
|
private readonly router = inject(Router); |
|
|
|
private readonly unsubscribeSubject = new Subject<void>(); |
|
|
|
|
|
|
|
if (this.accounts) { |
|
|
|
this.isLoading = false; |
|
|
|
} |
|
|
|
public constructor() { |
|
|
|
addIcons({ |
|
|
|
arrowRedoOutline, |
|
|
|
createOutline, |
|
|
|
documentTextOutline, |
|
|
|
ellipsisHorizontal, |
|
|
|
eyeOffOutline, |
|
|
|
trashOutline, |
|
|
|
walletOutline |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
public onDeleteAccount(aId: string) { |
|
|
|
|
Kenrick Tandrian
22 hours ago
GitHub