From aca0d77e915defb1aba07ab7ce4699a1657ccb3c Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Sat, 18 Dec 2021 16:43:34 +0100 Subject: [PATCH] Feature/add line chart to historical data view (#555) * Add line chart * Update changelog --- CHANGELOG.md | 6 ++++++ .../admin-market-data-detail.component.html | 8 +++++++- .../admin-market-data-detail.component.scss | 4 ++++ .../admin-market-data-detail.component.ts | 8 ++++++++ .../admin-market-data-detail.module.ts | 3 ++- .../components/admin-market-data/admin-market-data.html | 5 +---- .../src/app/components/admin-users/admin-users.html | 2 +- 7 files changed, 29 insertions(+), 7 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index f89dff77..bb5418b8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +## Unreleased + +### Added + +- Added a line chart to the historical data view in the admin control panel + ## 1.91.0 - 18.12.2021 ### Changed diff --git a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.html b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.html index 6aab2161..23c20178 100644 --- a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.html +++ b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.html @@ -1,4 +1,10 @@ -
+
+
{{ itemByMonth.key }}
diff --git a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.scss b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.scss index b5dabd46..128c63cc 100644 --- a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.scss +++ b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.scss @@ -14,6 +14,10 @@ margin-right: 0.25rem; width: 0.5rem; + &:hover { + opacity: 0.8; + } + &.valid { background-color: var(--danger); } diff --git a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.ts b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.ts index 3c6db767..4ee2b9ae 100644 --- a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.ts +++ b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.component.ts @@ -8,6 +8,7 @@ import { import { MatDialog } from '@angular/material/dialog'; import { DEFAULT_DATE_FORMAT } from '@ghostfolio/common/config'; import { DATE_FORMAT } from '@ghostfolio/common/helper'; +import { LineChartItem } from '@ghostfolio/ui/line-chart/interfaces/line-chart.interface'; import { DataSource, MarketData } from '@prisma/client'; import { format, isBefore, isValid, parse } from 'date-fns'; import { DeviceDetectorService } from 'ngx-device-detector'; @@ -29,6 +30,7 @@ export class AdminMarketDataDetailComponent implements OnChanges, OnInit { public days = Array(31); public defaultDateFormat = DEFAULT_DATE_FORMAT; public deviceType: string; + public historicalDataItems: LineChartItem[]; public marketDataByMonth: { [yearMonth: string]: { [day: string]: MarketData & { day: number } }; } = {}; @@ -45,6 +47,12 @@ export class AdminMarketDataDetailComponent implements OnChanges, OnInit { public ngOnInit() {} public ngOnChanges() { + this.historicalDataItems = this.marketData.map((marketDataItem) => { + return { + date: format(marketDataItem.date, DATE_FORMAT), + value: marketDataItem.marketPrice + }; + }); this.marketDataByMonth = {}; for (const marketDataItem of this.marketData) { diff --git a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.module.ts b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.module.ts index 9ea09ab5..b51d497b 100644 --- a/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.module.ts +++ b/apps/client/src/app/components/admin-market-data-detail/admin-market-data-detail.module.ts @@ -1,5 +1,6 @@ import { CommonModule } from '@angular/common'; import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; +import { GfLineChartModule } from '@ghostfolio/ui/line-chart/line-chart.module'; import { AdminMarketDataDetailComponent } from './admin-market-data-detail.component'; import { GfMarketDataDetailDialogModule } from './market-data-detail-dialog/market-data-detail-dialog.module'; @@ -7,7 +8,7 @@ import { GfMarketDataDetailDialogModule } from './market-data-detail-dialog/mark @NgModule({ declarations: [AdminMarketDataDetailComponent], exports: [AdminMarketDataDetailComponent], - imports: [CommonModule, GfMarketDataDetailDialogModule], + imports: [CommonModule, GfLineChartModule, GfMarketDataDetailDialogModule], providers: [], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) diff --git a/apps/client/src/app/components/admin-market-data/admin-market-data.html b/apps/client/src/app/components/admin-market-data/admin-market-data.html index 15bab021..5e8083e9 100644 --- a/apps/client/src/app/components/admin-market-data/admin-market-data.html +++ b/apps/client/src/app/components/admin-market-data/admin-market-data.html @@ -4,7 +4,6 @@ - @@ -17,7 +16,6 @@ class="cursor-pointer mat-row" (click)="setCurrentSymbol(item.symbol)" > - - - - +
# Symbol Data Source First Transaction{{ i + 1 }} {{ item.symbol }} {{ item.dataSource}} @@ -44,8 +42,7 @@
+
## User Registration