diff --git a/apps/client/src/app/app.module.ts b/apps/client/src/app/app.module.ts index 9dca3244c..695612864 100644 --- a/apps/client/src/app/app.module.ts +++ b/apps/client/src/app/app.module.ts @@ -1,6 +1,8 @@ import { Platform } from '@angular/cdk/platform'; import { HttpClientModule } from '@angular/common/http'; import { NgModule } from '@angular/core'; +import { MatAutocompleteModule } from '@angular/material/autocomplete'; +import { MatChipsModule } from '@angular/material/chips'; import { DateAdapter, MAT_DATE_FORMATS, @@ -38,6 +40,8 @@ export function NgxStripeFactory(): string { GfHeaderModule, HttpClientModule, MarkdownModule.forRoot(), + MatAutocompleteModule, + MatChipsModule, MaterialCssVarsModule.forRoot({ darkThemeClass: 'is-dark-theme', isAutoContrast: true, diff --git a/apps/client/src/app/components/accounts-table/accounts-table.component.html b/apps/client/src/app/components/accounts-table/accounts-table.component.html index 434ec9410..d576e5447 100644 --- a/apps/client/src/app/components/accounts-table/accounts-table.component.html +++ b/apps/client/src/app/components/accounts-table/accounts-table.component.html @@ -214,9 +214,9 @@
-
ID
+
User ID
{{ user?.id }}
diff --git a/apps/client/src/app/pages/accounts/accounts-page.component.ts b/apps/client/src/app/pages/accounts/accounts-page.component.ts index 65952b00a..81c02c2fd 100644 --- a/apps/client/src/app/pages/accounts/accounts-page.component.ts +++ b/apps/client/src/app/pages/accounts/accounts-page.component.ts @@ -29,7 +29,6 @@ export class AccountsPageComponent implements OnDestroy, OnInit { public hasImpersonationId: boolean; public hasPermissionToCreateAccount: boolean; public hasPermissionToDeleteAccount: boolean; - public hasPermissionToShowValues: boolean; public routeQueryParams: Subscription; public totalBalanceInBaseCurrency = 0; public totalValueInBaseCurrency = 0; @@ -61,7 +60,7 @@ export class AccountsPageComponent implements OnDestroy, OnInit { } else if (params['editDialog']) { if (this.accounts) { const account = this.accounts.find((account) => { - return account.id === params['transactionId']; + return account.id === params['accountId']; }); this.openUpdateAccountDialog(account); @@ -80,8 +79,6 @@ export class AccountsPageComponent implements OnDestroy, OnInit { .pipe(takeUntil(this.unsubscribeSubject)) .subscribe((aId) => { this.hasImpersonationId = !!aId; - - this.hasPermissionToShowValues = !this.hasImpersonationId; }); this.userService.stateChanged @@ -149,7 +146,7 @@ export class AccountsPageComponent implements OnDestroy, OnInit { public onUpdateAccount(aAccount: AccountModel) { this.router.navigate([], { - queryParams: { editDialog: true, transactionId: aAccount.id } + queryParams: { accountId: aAccount.id, editDialog: true } }); } @@ -207,7 +204,7 @@ export class AccountsPageComponent implements OnDestroy, OnInit { this.unsubscribeSubject.complete(); } - private openAccountDetailDialog(aAccountId) { + private openAccountDetailDialog(aAccountId: string) { const dialogRef = this.dialog.open(AccountDetailDialog, { autoFocus: false, data: { diff --git a/apps/client/src/app/pages/accounts/accounts-page.html b/apps/client/src/app/pages/accounts/accounts-page.html index c5ddd9f7f..228ccdd78 100644 --- a/apps/client/src/app/pages/accounts/accounts-page.html +++ b/apps/client/src/app/pages/accounts/accounts-page.html @@ -7,7 +7,6 @@ [accounts]="accounts" [baseCurrency]="user?.settings?.baseCurrency" [deviceType]="deviceType" - [hasPermissionToShowValues]="hasPermissionToShowValues" [locale]="user?.settings?.locale" [showActions]="!hasImpersonationId && hasPermissionToDeleteAccount && !user.settings.isRestrictedView" [totalBalanceInBaseCurrency]="totalBalanceInBaseCurrency" diff --git a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html index ad7ee3988..eaef9d607 100644 --- a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html +++ b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html @@ -50,6 +50,17 @@ +
+ + Account ID + + +
diff --git a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts index ee4b755f4..9c60b4e13 100644 --- a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts +++ b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts @@ -1,6 +1,8 @@ import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core'; import { MatDialog } from '@angular/material/dialog'; import { ActivatedRoute, Router } from '@angular/router'; +import { AccountDetailDialog } from '@ghostfolio/client/components/account-detail-dialog/account-detail-dialog.component'; +import { AccountDetailDialogParams } from '@ghostfolio/client/components/account-detail-dialog/interfaces/interfaces'; import { PositionDetailDialogParams } from '@ghostfolio/client/components/position/position-detail-dialog/interfaces/interfaces'; import { PositionDetailDialog } from '@ghostfolio/client/components/position/position-detail-dialog/position-detail-dialog.component'; import { DataService } from '@ghostfolio/client/services/data.service'; @@ -99,7 +101,9 @@ export class AllocationsPageComponent implements OnDestroy, OnInit { this.routeQueryParams = route.queryParams .pipe(takeUntil(this.unsubscribeSubject)) .subscribe((params) => { - if ( + if (params['accountId'] && params['accountDetailDialog']) { + this.openAccountDetailDialog(params['accountId']); + } else if ( params['dataSource'] && params['positionDetailDialog'] && params['symbol'] @@ -379,13 +383,21 @@ export class AllocationsPageComponent implements OnDestroy, OnInit { this.markets.otherMarkets.value / marketsTotal; } + public onAccountChartClicked({ symbol }: UniqueAsset) { + if (symbol) { + this.router.navigate([], { + queryParams: { accountId: symbol, accountDetailDialog: true } + }); + } + } + public onChangePeriod(aValue: string) { this.period = aValue; this.initializeAnalysisData(this.period); } - public onProportionChartClicked({ dataSource, symbol }: UniqueAsset) { + public onSymbolChartClicked({ dataSource, symbol }: UniqueAsset) { if (dataSource && symbol) { this.router.navigate([], { queryParams: { dataSource, symbol, positionDetailDialog: true } @@ -398,6 +410,26 @@ export class AllocationsPageComponent implements OnDestroy, OnInit { this.unsubscribeSubject.complete(); } + private openAccountDetailDialog(aAccountId: string) { + const dialogRef = this.dialog.open(AccountDetailDialog, { + autoFocus: false, + data: { + accountId: aAccountId, + deviceType: this.deviceType, + hasImpersonationId: this.hasImpersonationId + }, + height: this.deviceType === 'mobile' ? '97.5vh' : '80vh', + width: this.deviceType === 'mobile' ? '100vw' : '50rem' + }); + + dialogRef + .afterClosed() + .pipe(takeUntil(this.unsubscribeSubject)) + .subscribe(() => { + this.router.navigate(['.'], { relativeTo: this.route }); + }); + } + private openPositionDialog({ dataSource, symbol diff --git a/apps/client/src/app/pages/portfolio/allocations/allocations-page.html b/apps/client/src/app/pages/portfolio/allocations/allocations-page.html index 416af40c0..869148b5c 100644 --- a/apps/client/src/app/pages/portfolio/allocations/allocations-page.html +++ b/apps/client/src/app/pages/portfolio/allocations/allocations-page.html @@ -24,11 +24,13 @@ @@ -116,7 +118,7 @@ [locale]="user?.settings?.locale" [positions]="symbols" [showLabels]="deviceType !== 'mobile'" - (proportionChartClicked)="onProportionChartClicked($event)" + (proportionChartClicked)="onSymbolChartClicked($event)" > diff --git a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts index 11795788e..f8e43fa5e 100644 --- a/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts +++ b/libs/ui/src/lib/portfolio-proportion-chart/portfolio-proportion-chart.component.ts @@ -276,12 +276,14 @@ export class PortfolioProportionChartComponent padding: this.showLabels === true ? 100 : 0 }, onClick: (event, activeElements) => { - const dataIndex = activeElements[0].index; - const symbol: string = event.chart.data.labels[dataIndex]; + try { + const dataIndex = activeElements[0].index; + const symbol: string = event.chart.data.labels[dataIndex]; - const dataSource = this.positions[symbol]?.dataSource; + const dataSource = this.positions[symbol]?.dataSource; - this.proportionChartClicked.emit({ dataSource, symbol }); + this.proportionChartClicked.emit({ dataSource, symbol }); + } catch {} }, onHover: (event, chartElement) => { if (this.cursor) {