From 456f87cf17a5ddd4ec8024646d9dae8855a3abae Mon Sep 17 00:00:00 2001 From: yksolanki9 Date: Sun, 11 Dec 2022 15:03:52 +0530 Subject: [PATCH] Add checkbox for selecting activities --- .../import-activities-dialog.component.ts | 29 ++++++--- .../import-activities-dialog.html | 17 +++++- .../import-activities-dialog.module.ts | 2 + .../app/services/import-activities.service.ts | 4 +- .../activities-table.component.html | 24 +++++++- .../activities-table.component.ts | 61 +++++++++++++------ .../activities-table.module.ts | 2 + 7 files changed, 109 insertions(+), 30 deletions(-) diff --git a/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.component.ts b/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.component.ts index 5e4b5d5b8..43bff63a3 100644 --- a/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.component.ts +++ b/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.component.ts @@ -7,9 +7,14 @@ import { } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { MatSnackBar } from '@angular/material/snack-bar'; +import { + Activities, + Activity +} from '@ghostfolio/api/app/order/interfaces/activities.interface'; import { ImportActivitiesService } from '@ghostfolio/client/services/import-activities.service'; import { isArray } from 'lodash'; import { Subject } from 'rxjs'; +import { CreateOrderDto } from '@ghostfolio/api/app/order/create-order.dto'; import { ImportActivitiesDialogParams } from './interfaces/interfaces'; @@ -20,8 +25,10 @@ import { ImportActivitiesDialogParams } from './interfaces/interfaces'; templateUrl: 'import-activities-dialog.html' }) export class ImportActivitiesDialog implements OnDestroy { + public activities: Activity[] | CreateOrderDto[] = []; public details: any[] = []; public errorMessages: string[] = []; + public importComplete = false; private unsubscribeSubject = new Subject(); @@ -93,7 +100,7 @@ export class ImportActivitiesDialog implements OnDestroy { return; } else if (file.name.endsWith('.csv')) { try { - await this.importActivitiesService.importCsv({ + this.activities = await this.importActivitiesService.importCsv({ fileContent, userAccounts: this.data.user.accounts }); @@ -163,14 +170,18 @@ export class ImportActivitiesDialog implements OnDestroy { } private handleImportSuccess() { - this.snackBar.open( - '✅ ' + $localize`Import has been completed`, - undefined, - { - duration: 3000 - } - ); + this.importComplete = true; - this.dialogRef.close(); + //Needed to trigger onPush change detection strategy + this.changeDetectorRef.markForCheck(); + // this.snackBar.open( + // '✅ ' + $localize`Import has been completed`, + // undefined, + // { + // duration: 3000 + // } + // ); + + // this.dialogRef.close(); } } diff --git a/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.html b/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.html index fc5985bba..5c0a072b1 100644 --- a/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.html +++ b/apps/client/src/app/pages/portfolio/activities/import-activities-dialog/import-activities-dialog.html @@ -6,7 +6,22 @@ >
- + + + +
diff --git a/libs/ui/src/lib/activities-table/activities-table.component.ts b/libs/ui/src/lib/activities-table/activities-table.component.ts index 6d423b6bd..414f284ed 100644 --- a/libs/ui/src/lib/activities-table/activities-table.component.ts +++ b/libs/ui/src/lib/activities-table/activities-table.component.ts @@ -8,6 +8,7 @@ import { Output, ViewChild } from '@angular/core'; +import { SelectionModel } from '@angular/cdk/collections'; import { MatPaginator, PageEvent } from '@angular/material/paginator'; import { MatSort } from '@angular/material/sort'; import { MatTableDataSource } from '@angular/material/table'; @@ -57,6 +58,7 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { public allFilters: Filter[]; public dataSource: MatTableDataSource = new MatTableDataSource(); + public selectedRows = new SelectionModel(true, []); public defaultDateFormat: string; public displayedColumns = []; public endOfToday = endOfToday(); @@ -83,8 +85,24 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { }); } + public areAllRowsSelected() { + const numSelectedRows = this.selectedRows.selected.length; + const numTotalRows = this.dataSource.data.length; + return numSelectedRows === numTotalRows; + } + + public toggleAll() { + this.areAllRowsSelected() + ? this.selectedRows.clear() + : this.dataSource.data.forEach((row) => this.selectedRows.select(row)); + + this.selectedActivities.emit(this.selectedRows.selected); + } + public ngOnChanges() { + console.log('INSIDE LIIB', this.activities); this.displayedColumns = [ + 'select', 'count', 'date', 'type', @@ -219,13 +237,18 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { }; } - fieldValueMap[activity.SymbolProfile.currency] = { - id: activity.SymbolProfile.currency, - label: activity.SymbolProfile.currency, - type: 'TAG' - }; + if (activity.SymbolProfile?.currency) { + fieldValueMap[activity.SymbolProfile.currency] = { + id: activity.SymbolProfile.currency, + label: activity.SymbolProfile.currency, + type: 'TAG' + }; + } - if (!isUUID(activity.SymbolProfile.symbol)) { + if ( + activity.SymbolProfile?.symbol && + !isUUID(activity.SymbolProfile.symbol) + ) { fieldValueMap[activity.SymbolProfile.symbol] = { id: activity.SymbolProfile.symbol, label: activity.SymbolProfile.symbol, @@ -233,17 +256,21 @@ export class ActivitiesTableComponent implements OnChanges, OnDestroy { }; } - fieldValueMap[activity.type] = { - id: activity.type, - label: activity.type, - type: 'TAG' - }; - - fieldValueMap[format(activity.date, 'yyyy')] = { - id: format(activity.date, 'yyyy'), - label: format(activity.date, 'yyyy'), - type: 'TAG' - }; + if (activity?.type) { + fieldValueMap[activity.type] = { + id: activity.type, + label: activity.type, + type: 'TAG' + }; + } + + // if (typeof activity?.date) { + // fieldValueMap[format(activity.date, 'yyyy')] = { + // id: format(activity.date, 'yyyy'), + // label: format(activity.date, 'yyyy'), + // type: 'TAG' + // }; + // } return Object.values(fieldValueMap); } diff --git a/libs/ui/src/lib/activities-table/activities-table.module.ts b/libs/ui/src/lib/activities-table/activities-table.module.ts index 4f38bcd2a..4d5951644 100644 --- a/libs/ui/src/lib/activities-table/activities-table.module.ts +++ b/libs/ui/src/lib/activities-table/activities-table.module.ts @@ -1,6 +1,7 @@ import { CommonModule } from '@angular/common'; import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; +import { MatCheckboxModule } from '@angular/material/checkbox'; import { MatMenuModule } from '@angular/material/menu'; import { MatPaginatorModule } from '@angular/material/paginator'; import { MatSortModule } from '@angular/material/sort'; @@ -26,6 +27,7 @@ import { ActivitiesTableComponent } from './activities-table.component'; GfSymbolModule, GfValueModule, MatButtonModule, + MatCheckboxModule, MatMenuModule, MatPaginatorModule, MatSortModule,