mirror of https://github.com/ghostfolio/ghostfolio
Thomas Kaul
10 months ago
13 changed files with 285 additions and 142 deletions
@ -1,53 +1,30 @@ |
|||||
import { Component } from '@angular/core'; |
import { DataService } from '@ghostfolio/client/services/data.service'; |
||||
|
import { InfoItem } from '@ghostfolio/common/interfaces'; |
||||
|
import { hasPermission, permissions } from '@ghostfolio/common/permissions'; |
||||
|
|
||||
|
import { Component, OnInit } from '@angular/core'; |
||||
|
|
||||
@Component({ |
@Component({ |
||||
selector: 'gf-resources-glossary', |
selector: 'gf-resources-glossary', |
||||
styleUrls: ['./resources-glossary.component.scss'], |
styleUrls: ['./resources-glossary.component.scss'], |
||||
templateUrl: './resources-glossary.component.html' |
templateUrl: './resources-glossary.component.html' |
||||
}) |
}) |
||||
export class ResourcesGlossaryPageComponent { |
export class ResourcesGlossaryPageComponent implements OnInit { |
||||
public glossaryItems = [ |
public hasPermissionForSubscription: boolean; |
||||
{ |
public info: InfoItem; |
||||
term: 'Buy and Hold', |
public routerLinkResourcesPersonalFinanceTools = [ |
||||
definition: |
'/' + $localize`:snake-case:resources`, |
||||
'Buy and hold is a passive investment strategy where you buy assets and hold them for a long period regardless of fluctuations in the market.', |
'personal-finance-tools' |
||||
link: 'https://www.investopedia.com/terms/b/buyandhold.asp' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'Deflation', |
|
||||
definition: |
|
||||
'Deflation is a decrease of the general price level for goods and services in an economy over a period of time.', |
|
||||
link: 'https://www.investopedia.com/terms/d/deflation.asp' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'Dollar-Cost Averaging (DCA)', |
|
||||
definition: |
|
||||
'Dollar-cost averaging is an investment strategy where you split the total amount to be invested across periodic purchases of a target asset to reduce the impact of volatility on the overall purchase.', |
|
||||
link: 'https://www.investopedia.com/terms/d/dollarcostaveraging.asp' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'Financial Independence', |
|
||||
definition: |
|
||||
'Financial independence is the status of having enough income, for example with a passive income like dividends, to cover your living expenses for the rest of your life.', |
|
||||
link: 'https://en.wikipedia.org/wiki/Financial_independence' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'FIRE', |
|
||||
definition: |
|
||||
'FIRE is a movement that promotes saving and investing to achieve financial independence and early retirement.', |
|
||||
link: '../en/blog/2023/07/exploring-the-path-to-fire' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'Inflation', |
|
||||
definition: |
|
||||
'Inflation is an increase of the general price level for goods and services in an economy over a period of time.', |
|
||||
link: 'https://www.investopedia.com/terms/i/inflation.asp' |
|
||||
}, |
|
||||
{ |
|
||||
term: 'Stagflation', |
|
||||
definition: |
|
||||
'Stagflation describes a situation in which there is a stagnant economy with high unemployment and high inflation.', |
|
||||
link: 'https://www.investopedia.com/terms/s/stagflation.asp' |
|
||||
} |
|
||||
]; |
]; |
||||
|
|
||||
|
public constructor(private dataService: DataService) { |
||||
|
this.info = this.dataService.fetchInfo(); |
||||
|
} |
||||
|
|
||||
|
public ngOnInit() { |
||||
|
this.hasPermissionForSubscription = hasPermission( |
||||
|
this.info?.globalPermissions, |
||||
|
permissions.enableSubscription |
||||
|
); |
||||
|
} |
||||
} |
} |
||||
|
|||||
@ -1,11 +1,12 @@ |
|||||
import { CommonModule } from '@angular/common'; |
import { CommonModule } from '@angular/common'; |
||||
import { NgModule } from '@angular/core'; |
import { NgModule } from '@angular/core'; |
||||
|
import { RouterModule } from '@angular/router'; |
||||
|
|
||||
import { ResourcesGlossaryRoutingModule } from './resources-glossary-routing.module'; |
import { ResourcesGlossaryRoutingModule } from './resources-glossary-routing.module'; |
||||
import { ResourcesGlossaryPageComponent } from './resources-glossary.component'; |
import { ResourcesGlossaryPageComponent } from './resources-glossary.component'; |
||||
|
|
||||
@NgModule({ |
@NgModule({ |
||||
declarations: [ResourcesGlossaryPageComponent], |
declarations: [ResourcesGlossaryPageComponent], |
||||
imports: [CommonModule, ResourcesGlossaryRoutingModule] |
imports: [CommonModule, ResourcesGlossaryRoutingModule, RouterModule] |
||||
}) |
}) |
||||
export class ResourcesGlossaryPageModule {} |
export class ResourcesGlossaryPageModule {} |
||||
|
|||||
@ -1,11 +1,12 @@ |
|||||
import { CommonModule } from '@angular/common'; |
import { CommonModule } from '@angular/common'; |
||||
import { NgModule } from '@angular/core'; |
import { NgModule } from '@angular/core'; |
||||
|
import { RouterModule } from '@angular/router'; |
||||
|
|
||||
import { ResourcesGuidesRoutingModule } from './resources-guides-routing.module'; |
import { ResourcesGuidesRoutingModule } from './resources-guides-routing.module'; |
||||
import { ResourcesGuidesComponent } from './resources-guides.component'; |
import { ResourcesGuidesComponent } from './resources-guides.component'; |
||||
|
|
||||
@NgModule({ |
@NgModule({ |
||||
declarations: [ResourcesGuidesComponent], |
declarations: [ResourcesGuidesComponent], |
||||
imports: [CommonModule, ResourcesGuidesRoutingModule] |
imports: [CommonModule, ResourcesGuidesRoutingModule, RouterModule] |
||||
}) |
}) |
||||
export class ResourcesGuidesModule {} |
export class ResourcesGuidesModule {} |
||||
|
|||||
@ -1,12 +1,64 @@ |
|||||
<div class="container"> |
<div class="container"> |
||||
<h1 class="h3 mb-4 text-center" i18n>Markets</h1> |
<h1 class="h3 mb-4 text-center" i18n>Markets</h1> |
||||
<div class="market-resources"> |
<div class="mb-5"> |
||||
@for (resource of marketResources; track resource) { |
<div class="mb-4 media"> |
||||
<div class="mb-4"> |
<div class="media-body"> |
||||
<h3 class="h5 mt-0">{{ resource.title }}</h3> |
<h3 class="h5 mt-0">Crypto Coins Heatmap</h3> |
||||
<p class="mb-1">{{ resource.description }}</p> |
<div class="mb-1"> |
||||
<a target="_blank" [href]="resource.link">View resource →</a> |
With the <i>Crypto Coins Heatmap</i> you can track the daily market |
||||
</div> |
movements of cryptocurrencies as a visual snapshot. |
||||
} |
</div> |
||||
|
<div> |
||||
|
<a href="https://www.tradingview.com/heatmap/crypto" target="_blank" |
||||
|
>Crypto Coins Heatmap →</a |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="mb-4 media"> |
||||
|
<div class="media-body"> |
||||
|
<h3 class="h5 mt-0">Fear & Greed Index</h3> |
||||
|
<div class="mb-1"> |
||||
|
The fear and greed index was developed by <i>CNNMoney</i> to measure |
||||
|
the primary emotions (fear and greed) that influence how much |
||||
|
investors are willing to pay for stocks. |
||||
|
</div> |
||||
|
<div> |
||||
|
<a href="https://money.cnn.com/data/fear-and-greed/" target="_blank" |
||||
|
>Fear & Greed Index →</a |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="media"> |
||||
|
<div class="mb-4 media"> |
||||
|
<h3 class="h5 mt-0">Inflation Chart</h3> |
||||
|
<div class="mb-1"> |
||||
|
<i>Inflation Chart</i> helps you find the intrinsic value of stock |
||||
|
markets, stock prices, goods and services by adjusting them to the |
||||
|
amount of the money supply (M0, M1, M2) or price of other goods (food |
||||
|
or oil). |
||||
|
</div> |
||||
|
<div> |
||||
|
<a href="https://inflationchart.com" target="_blank" |
||||
|
>Inflation Chart →</a |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="media"> |
||||
|
<div class="media-body"> |
||||
|
<h3 class="h5 mt-0">Stock Heatmap</h3> |
||||
|
<div class="mb-1"> |
||||
|
With the <i>Stock Heatmap</i> you can track the daily market movements |
||||
|
of stocks as a visual snapshot. |
||||
|
</div> |
||||
|
<div> |
||||
|
<a href="https://www.tradingview.com/heatmap/stock" target="_blank" |
||||
|
>Stock Heatmap →</a |
||||
|
> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
</div> |
</div> |
||||
</div> |
</div> |
||||
|
|||||
Loading…
Reference in new issue