|
|
|
@ -21,11 +21,13 @@ import { |
|
|
|
Component, |
|
|
|
EventEmitter, |
|
|
|
Input, |
|
|
|
OnChanges, |
|
|
|
OnDestroy, |
|
|
|
OnInit, |
|
|
|
Output, |
|
|
|
ViewChild |
|
|
|
ViewChild, |
|
|
|
computed, |
|
|
|
inject, |
|
|
|
input |
|
|
|
} from '@angular/core'; |
|
|
|
import { MatButtonModule } from '@angular/material/button'; |
|
|
|
import { MatCheckboxModule } from '@angular/material/checkbox'; |
|
|
|
@ -45,7 +47,6 @@ import { MatTableDataSource, MatTableModule } from '@angular/material/table'; |
|
|
|
import { MatTooltipModule } from '@angular/material/tooltip'; |
|
|
|
import { IonIcon } from '@ionic/angular/standalone'; |
|
|
|
import { isUUID } from 'class-validator'; |
|
|
|
import { endOfToday, isAfter } from 'date-fns'; |
|
|
|
import { addIcons } from 'ionicons'; |
|
|
|
import { |
|
|
|
alertCircleOutline, |
|
|
|
@ -62,7 +63,7 @@ import { |
|
|
|
trashOutline |
|
|
|
} from 'ionicons/icons'; |
|
|
|
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; |
|
|
|
import { Subject, Subscription, takeUntil } from 'rxjs'; |
|
|
|
import { Subject, takeUntil } from 'rxjs'; |
|
|
|
|
|
|
|
import { GfActivityTypeComponent } from '../activity-type/activity-type.component'; |
|
|
|
import { GfEntityLogoComponent } from '../entity-logo/entity-logo.component'; |
|
|
|
@ -94,10 +95,9 @@ import { GfValueComponent } from '../value/value.component'; |
|
|
|
templateUrl: './activities-table.component.html' |
|
|
|
}) |
|
|
|
export class GfActivitiesTableComponent |
|
|
|
implements AfterViewInit, OnChanges, OnDestroy, OnInit |
|
|
|
implements AfterViewInit, OnDestroy, OnInit |
|
|
|
{ |
|
|
|
@Input() baseCurrency: string; |
|
|
|
@Input() dataSource: MatTableDataSource<Activity>; |
|
|
|
@Input() deviceType: string; |
|
|
|
@Input() hasActivities: boolean; |
|
|
|
@Input() hasPermissionToCreateActivity: boolean; |
|
|
|
@ -107,10 +107,7 @@ export class GfActivitiesTableComponent |
|
|
|
@Input() locale = getLocale(); |
|
|
|
@Input() pageIndex: number; |
|
|
|
@Input() pageSize = DEFAULT_PAGE_SIZE; |
|
|
|
@Input() showAccountColumn = true; |
|
|
|
@Input() showActions = true; |
|
|
|
@Input() showCheckbox = false; |
|
|
|
@Input() showNameColumn = true; |
|
|
|
@Input() sortColumn: string; |
|
|
|
@Input() sortDirection: SortDirection; |
|
|
|
@Input() sortDisabled = false; |
|
|
|
@ -132,19 +129,66 @@ export class GfActivitiesTableComponent |
|
|
|
@ViewChild(MatPaginator) paginator: MatPaginator; |
|
|
|
@ViewChild(MatSort) sort: MatSort; |
|
|
|
|
|
|
|
public displayedColumns = []; |
|
|
|
public endOfToday = endOfToday(); |
|
|
|
public hasDrafts = false; |
|
|
|
public hasErrors = false; |
|
|
|
public isAfter = isAfter; |
|
|
|
public isLoading = true; |
|
|
|
public isUUID = isUUID; |
|
|
|
public routeQueryParams: Subscription; |
|
|
|
public selectedRows = new SelectionModel<Activity>(true, []); |
|
|
|
|
|
|
|
private unsubscribeSubject = new Subject<void>(); |
|
|
|
public readonly dataSource = input.required< |
|
|
|
MatTableDataSource<Activity> | undefined |
|
|
|
>(); |
|
|
|
public readonly showAccountColumn = input(true); |
|
|
|
public readonly showCheckbox = input(false); |
|
|
|
public readonly showNameColumn = input(true); |
|
|
|
|
|
|
|
public constructor(private notificationService: NotificationService) { |
|
|
|
protected readonly displayedColumns = computed(() => { |
|
|
|
let columns = [ |
|
|
|
'select', |
|
|
|
'importStatus', |
|
|
|
'icon', |
|
|
|
'nameWithSymbol', |
|
|
|
'type', |
|
|
|
'date', |
|
|
|
'quantity', |
|
|
|
'unitPrice', |
|
|
|
'fee', |
|
|
|
'value', |
|
|
|
'currency', |
|
|
|
'valueInBaseCurrency', |
|
|
|
'account', |
|
|
|
'comment', |
|
|
|
'actions' |
|
|
|
]; |
|
|
|
|
|
|
|
if (!this.showAccountColumn()) { |
|
|
|
columns = columns.filter((column) => { |
|
|
|
return column !== 'account'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (!this.showCheckbox()) { |
|
|
|
columns = columns.filter((column) => { |
|
|
|
return column !== 'importStatus' && column !== 'select'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (!this.showNameColumn()) { |
|
|
|
columns = columns.filter((column) => { |
|
|
|
return column !== 'nameWithSymbol'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
return columns; |
|
|
|
}); |
|
|
|
|
|
|
|
protected readonly isLoading = computed(() => { |
|
|
|
return !this.dataSource(); |
|
|
|
}); |
|
|
|
|
|
|
|
private readonly notificationService = inject(NotificationService); |
|
|
|
private readonly unsubscribeSubject = new Subject<void>(); |
|
|
|
|
|
|
|
public constructor() { |
|
|
|
addIcons({ |
|
|
|
alertCircleOutline, |
|
|
|
calendarClearOutline, |
|
|
|
@ -162,7 +206,7 @@ export class GfActivitiesTableComponent |
|
|
|
} |
|
|
|
|
|
|
|
public ngOnInit() { |
|
|
|
if (this.showCheckbox) { |
|
|
|
if (this.showCheckbox()) { |
|
|
|
this.toggleAllRows(); |
|
|
|
this.selectedRows.changed |
|
|
|
.pipe(takeUntil(this.unsubscribeSubject)) |
|
|
|
@ -173,8 +217,10 @@ export class GfActivitiesTableComponent |
|
|
|
} |
|
|
|
|
|
|
|
public ngAfterViewInit() { |
|
|
|
if (this.dataSource) { |
|
|
|
this.dataSource.paginator = this.paginator; |
|
|
|
const dataSource = this.dataSource(); |
|
|
|
|
|
|
|
if (dataSource) { |
|
|
|
dataSource.paginator = this.paginator; |
|
|
|
} |
|
|
|
|
|
|
|
this.sort.sortChange.subscribe((value: Sort) => { |
|
|
|
@ -182,51 +228,9 @@ export class GfActivitiesTableComponent |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
public ngOnChanges() { |
|
|
|
this.displayedColumns = [ |
|
|
|
'select', |
|
|
|
'importStatus', |
|
|
|
'icon', |
|
|
|
'nameWithSymbol', |
|
|
|
'type', |
|
|
|
'date', |
|
|
|
'quantity', |
|
|
|
'unitPrice', |
|
|
|
'fee', |
|
|
|
'value', |
|
|
|
'currency', |
|
|
|
'valueInBaseCurrency', |
|
|
|
'account', |
|
|
|
'comment', |
|
|
|
'actions' |
|
|
|
]; |
|
|
|
|
|
|
|
if (!this.showAccountColumn) { |
|
|
|
this.displayedColumns = this.displayedColumns.filter((column) => { |
|
|
|
return column !== 'account'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (!this.showCheckbox) { |
|
|
|
this.displayedColumns = this.displayedColumns.filter((column) => { |
|
|
|
return column !== 'importStatus' && column !== 'select'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (!this.showNameColumn) { |
|
|
|
this.displayedColumns = this.displayedColumns.filter((column) => { |
|
|
|
return column !== 'nameWithSymbol'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (this.dataSource) { |
|
|
|
this.isLoading = false; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
public areAllRowsSelected() { |
|
|
|
const numSelectedRows = this.selectedRows.selected.length; |
|
|
|
const numTotalRows = this.dataSource.data.length; |
|
|
|
const numTotalRows = this.dataSource()?.data.length; |
|
|
|
return numSelectedRows === numTotalRows; |
|
|
|
} |
|
|
|
|
|
|
|
@ -241,7 +245,7 @@ export class GfActivitiesTableComponent |
|
|
|
|
|
|
|
public isExcludedFromAnalysis(activity: Activity) { |
|
|
|
return ( |
|
|
|
activity.account?.isExcluded || |
|
|
|
activity.account?.isExcluded ?? |
|
|
|
activity.tags?.some(({ id }) => { |
|
|
|
return id === TAG_ID_EXCLUDE_FROM_ANALYSIS; |
|
|
|
}) |
|
|
|
@ -253,7 +257,7 @@ export class GfActivitiesTableComponent |
|
|
|
} |
|
|
|
|
|
|
|
public onClickActivity(activity: Activity) { |
|
|
|
if (this.showCheckbox) { |
|
|
|
if (this.showCheckbox()) { |
|
|
|
if (!activity.error) { |
|
|
|
this.selectedRows.toggle(activity); |
|
|
|
} |
|
|
|
@ -299,8 +303,8 @@ export class GfActivitiesTableComponent |
|
|
|
|
|
|
|
public onExportDrafts() { |
|
|
|
this.exportDrafts.emit( |
|
|
|
this.dataSource.filteredData |
|
|
|
.filter((activity) => { |
|
|
|
this.dataSource() |
|
|
|
?.filteredData.filter((activity) => { |
|
|
|
return activity.isDraft; |
|
|
|
}) |
|
|
|
.map((activity) => { |
|
|
|
@ -331,7 +335,7 @@ export class GfActivitiesTableComponent |
|
|
|
if (this.areAllRowsSelected()) { |
|
|
|
this.selectedRows.clear(); |
|
|
|
} else { |
|
|
|
this.dataSource.data.forEach((row) => { |
|
|
|
this.dataSource()?.data.forEach((row) => { |
|
|
|
this.selectedRows.select(row); |
|
|
|
}); |
|
|
|
} |
|
|
|
|
Kenrick Tandrian
1 day ago
GitHub