mirror of https://github.com/ghostfolio/ghostfolio
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
410 lines
13 KiB
410 lines
13 KiB
<mat-toolbar class="px-0">
|
|
@if (user) {
|
|
<div class="d-flex h-100 logo-container" [ngClass]="{ filled: hasTabs }">
|
|
<a
|
|
class="align-items-center justify-content-start rounded-0"
|
|
mat-button
|
|
[ngClass]="{ 'w-100': hasTabs }"
|
|
[routerLink]="['/']"
|
|
(click)="onLogoClick()"
|
|
>
|
|
<gf-logo class="px-2" [label]="pageTitle" />
|
|
</a>
|
|
</div>
|
|
<span class="gf-spacer"></span>
|
|
<ul class="alig-items-center d-flex list-inline m-0 px-2">
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold':
|
|
currentRoute === 'home' || currentRoute === 'zen',
|
|
'text-decoration-underline':
|
|
currentRoute === 'home' || currentRoute === 'zen'
|
|
}"
|
|
[routerLink]="['/']"
|
|
>Overview</a
|
|
>
|
|
</li>
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === 'portfolio',
|
|
'text-decoration-underline': currentRoute === 'portfolio'
|
|
}"
|
|
[routerLink]="['/portfolio']"
|
|
>Portfolio</a
|
|
>
|
|
</li>
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === 'accounts',
|
|
'text-decoration-underline': currentRoute === 'accounts'
|
|
}"
|
|
[routerLink]="['/accounts']"
|
|
>Accounts</a
|
|
>
|
|
</li>
|
|
@if (hasPermissionToAccessAdminControl) {
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === 'admin',
|
|
'text-decoration-underline': currentRoute === 'admin'
|
|
}"
|
|
[routerLink]="['/admin']"
|
|
>Admin Control</a
|
|
>
|
|
</li>
|
|
}
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeResources,
|
|
'text-decoration-underline': currentRoute === routeResources
|
|
}"
|
|
[routerLink]="routerLinkResources"
|
|
>Resources</a
|
|
>
|
|
</li>
|
|
@if (
|
|
hasPermissionForSubscription && user?.subscription?.type === 'Basic'
|
|
) {
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routePricing,
|
|
'text-decoration-underline': currentRoute === routePricing
|
|
}"
|
|
[routerLink]="routerLinkPricing"
|
|
>Pricing</a
|
|
>
|
|
</li>
|
|
}
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeAbout,
|
|
'text-decoration-underline': currentRoute === routeAbout
|
|
}"
|
|
[routerLink]="routerLinkAbout"
|
|
>About</a
|
|
>
|
|
</li>
|
|
@if (hasPermissionToAccessAssistant) {
|
|
<li class="list-inline-item">
|
|
<button
|
|
#assistantTrigger="matMenuTrigger"
|
|
class="h-100 no-min-width px-2"
|
|
mat-button
|
|
matBadge="✓"
|
|
matBadgeSize="small"
|
|
[mat-menu-trigger-for]="assistantMenu"
|
|
[matBadgeHidden]="!hasFilters"
|
|
[matMenuTriggerRestoreFocus]="false"
|
|
(menuOpened)="onOpenAssistant()"
|
|
>
|
|
<ion-icon class="rotate-90" name="options-outline" />
|
|
</button>
|
|
<mat-menu
|
|
#assistantMenu="matMenu"
|
|
class="assistant"
|
|
xPosition="before"
|
|
[overlapTrigger]="true"
|
|
(closed)="assistantElement?.setIsOpen(false)"
|
|
>
|
|
<gf-assistant
|
|
#assistant
|
|
[deviceType]="deviceType"
|
|
[hasPermissionToAccessAdminControl]="
|
|
hasPermissionToAccessAdminControl
|
|
"
|
|
[user]="user"
|
|
(closed)="closeAssistant()"
|
|
(dateRangeChanged)="onDateRangeChange($event)"
|
|
(filtersChanged)="onFiltersChanged($event)"
|
|
/>
|
|
</mat-menu>
|
|
</li>
|
|
}
|
|
<li class="list-inline-item">
|
|
<button
|
|
class="no-min-width px-1"
|
|
mat-flat-button
|
|
[matMenuTriggerFor]="accountMenu"
|
|
(menuClosed)="onMenuClosed()"
|
|
(menuOpened)="onMenuOpened()"
|
|
>
|
|
<ion-icon
|
|
class="d-none d-sm-block"
|
|
name="person-circle-outline"
|
|
size="large"
|
|
/>
|
|
<ion-icon
|
|
class="d-block d-sm-none"
|
|
size="large"
|
|
[name]="isMenuOpen ? 'close-outline' : 'menu-outline'"
|
|
/>
|
|
</button>
|
|
<mat-menu #accountMenu="matMenu" xPosition="before">
|
|
@if (
|
|
hasPermissionForSubscription && user?.subscription?.type === 'Basic'
|
|
) {
|
|
<a class="d-flex" mat-menu-item [routerLink]="routerLinkPricing"
|
|
><span class="align-items-center d-flex"
|
|
><span>
|
|
@if (user.subscription.offer === 'default') {
|
|
<ng-container i18n>Upgrade Plan</ng-container>
|
|
} @else if (
|
|
user.subscription.offer === 'renewal' ||
|
|
user.subscription.offer === 'renewal-early-bird'
|
|
) {
|
|
<ng-container i18n>Renew Plan</ng-container>
|
|
}
|
|
</span>
|
|
<gf-premium-indicator
|
|
class="d-inline-block ml-1"
|
|
[enableLink]="false" /></span
|
|
></a>
|
|
<hr class="m-0" />
|
|
}
|
|
@if (user?.access?.length > 0) {
|
|
<button mat-menu-item (click)="impersonateAccount(null)">
|
|
<span class="align-items-center d-flex">
|
|
<ion-icon
|
|
class="mr-2"
|
|
[name]="
|
|
impersonationId
|
|
? 'radio-button-off-outline'
|
|
: 'radio-button-on-outline'
|
|
"
|
|
/>
|
|
<span i18n>Me</span>
|
|
</span>
|
|
</button>
|
|
@for (accessItem of user?.access; track accessItem) {
|
|
<button mat-menu-item (click)="impersonateAccount(accessItem.id)">
|
|
<span class="align-items-center d-flex">
|
|
<ion-icon
|
|
class="mr-2"
|
|
name="square-outline"
|
|
[name]="
|
|
accessItem.id === impersonationId
|
|
? 'radio-button-on-outline'
|
|
: 'radio-button-off-outline'
|
|
"
|
|
/>
|
|
@if (accessItem.alias) {
|
|
<span>{{ accessItem.alias }}</span>
|
|
} @else {
|
|
<span i18n>User</span>
|
|
}
|
|
</span>
|
|
</button>
|
|
}
|
|
<hr class="m-0" />
|
|
}
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{
|
|
'font-weight-bold':
|
|
currentRoute === 'home' || currentRoute === 'zen'
|
|
}"
|
|
[routerLink]="['/']"
|
|
>Overview</a
|
|
>
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === 'portfolio'
|
|
}"
|
|
[routerLink]="['/portfolio']"
|
|
>Portfolio</a
|
|
>
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{ 'font-weight-bold': currentRoute === 'accounts' }"
|
|
[routerLink]="['/accounts']"
|
|
>Accounts</a
|
|
>
|
|
<a
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{ 'font-weight-bold': currentRoute === 'account' }"
|
|
[routerLink]="['/account']"
|
|
>My Ghostfolio</a
|
|
>
|
|
@if (hasPermissionToAccessAdminControl) {
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{ 'font-weight-bold': currentRoute === 'admin' }"
|
|
[routerLink]="['/admin']"
|
|
>Admin Control</a
|
|
>
|
|
}
|
|
<hr class="m-0" />
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeResources
|
|
}"
|
|
[routerLink]="routerLinkResources"
|
|
>Resources</a
|
|
>
|
|
@if (
|
|
hasPermissionForSubscription && user?.subscription?.type === 'Basic'
|
|
) {
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{ 'font-weight-bold': currentRoute === routePricing }"
|
|
[routerLink]="routerLinkPricing"
|
|
>Pricing</a
|
|
>
|
|
}
|
|
<a
|
|
class="d-flex d-sm-none"
|
|
i18n
|
|
mat-menu-item
|
|
[ngClass]="{ 'font-weight-bold': currentRoute === routeAbout }"
|
|
[routerLink]="routerLinkAbout"
|
|
>About Ghostfolio</a
|
|
>
|
|
<hr class="d-flex d-sm-none m-0" />
|
|
<button mat-menu-item (click)="onSignOut()">Logout</button>
|
|
</mat-menu>
|
|
</li>
|
|
</ul>
|
|
}
|
|
@if (user === null) {
|
|
<div class="d-flex h-100 logo-container" [ngClass]="{ filled: hasTabs }">
|
|
<a
|
|
class="align-items-center justify-content-start rounded-0"
|
|
mat-button
|
|
[ngClass]="{ 'w-100': hasTabs }"
|
|
[routerLink]="['/']"
|
|
>
|
|
<gf-logo
|
|
class="px-2"
|
|
[label]="pageTitle"
|
|
[showLabel]="currentRoute !== 'register'"
|
|
/>
|
|
</a>
|
|
</div>
|
|
<span class="gf-spacer"></span>
|
|
<ul class="alig-items-center d-flex list-inline m-0 px-2">
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeFeatures,
|
|
'text-decoration-underline': currentRoute === routeFeatures
|
|
}"
|
|
[routerLink]="routerLinkFeatures"
|
|
>Features</a
|
|
>
|
|
</li>
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeAbout,
|
|
'text-decoration-underline': currentRoute === routeAbout
|
|
}"
|
|
[routerLink]="routerLinkAbout"
|
|
>About</a
|
|
>
|
|
</li>
|
|
@if (hasPermissionForSubscription) {
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routePricing,
|
|
'text-decoration-underline': currentRoute === routePricing
|
|
}"
|
|
[routerLink]="routerLinkPricing"
|
|
>Pricing</a
|
|
>
|
|
</li>
|
|
}
|
|
@if (hasPermissionToAccessFearAndGreedIndex) {
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
i18n
|
|
mat-flat-button
|
|
[ngClass]="{
|
|
'font-weight-bold': currentRoute === routeMarkets,
|
|
'text-decoration-underline': currentRoute === routeMarkets
|
|
}"
|
|
[routerLink]="routerLinkMarkets"
|
|
>Markets</a
|
|
>
|
|
</li>
|
|
}
|
|
<li class="list-inline-item">
|
|
<a
|
|
class="d-none d-sm-block no-min-width p-1"
|
|
href="https://github.com/ghostfolio/ghostfolio"
|
|
mat-flat-button
|
|
><ion-icon name="logo-github"></ion-icon
|
|
></a>
|
|
</li>
|
|
<li class="list-inline-item">
|
|
<button class="d-sm-block" mat-flat-button (click)="openLoginDialog()">
|
|
<ng-container i18n>Sign in</ng-container>
|
|
</button>
|
|
</li>
|
|
@if (currentRoute !== 'register' && hasPermissionToCreateUser) {
|
|
<li class="list-inline-item ml-1">
|
|
<a
|
|
class="d-none d-sm-block"
|
|
color="primary"
|
|
mat-flat-button
|
|
[routerLink]="routerLinkRegister"
|
|
><ng-container i18n>Get started</ng-container>
|
|
</a>
|
|
</li>
|
|
}
|
|
</ul>
|
|
}
|
|
</mat-toolbar>
|
|
|