Browse Source

Fix `tb-logo` feature to navigate to root dashboard in expanded fullscreen.

pull/14057/head
deaflynx 1 year ago
parent
commit
de34e0de3b
  1. 2
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html
  2. 8
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts
  3. 2
      ui-ngx/src/app/shared/components/logo.component.html
  4. 17
      ui-ngx/src/app/shared/components/logo.component.ts

2
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.html

@ -74,7 +74,7 @@
{{'dashboard.states-short' | translate}} {{'dashboard.states-short' | translate}}
</button> </button>
</ng-container> </ng-container>
<tb-logo *ngIf="showDashboardLogo()" [logoSrc]="dashboardLogo | image | async" class="dashboard_logo"></tb-logo> <tb-logo *ngIf="showDashboardLogo()" [logoUrl]="dashboardLogoUrl" [logoSrc]="dashboardLogo | image | async" class="dashboard_logo"></tb-logo>
</div> </div>
<div class="tb-dashboard-action-panel"> <div class="tb-dashboard-action-panel">
<button [class.!hidden]="!showCloseToolbar()" mat-icon-button class="close-action" <button [class.!hidden]="!showCloseToolbar()" mat-icon-button class="close-action"

8
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts

@ -38,7 +38,7 @@ import {
import { PageComponent } from '@shared/components/page.component'; import { PageComponent } from '@shared/components/page.component';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import { AppState } from '@core/core.state'; import { AppState } from '@core/core.state';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router, UrlTree } from '@angular/router';
import { UtilsService } from '@core/services/utils.service'; import { UtilsService } from '@core/services/utils.service';
import { import {
BreakpointId, BreakpointId,
@ -272,6 +272,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
{width: '100%', height: '100%', maxWidth: '100%', minWidth: '100%'}; {width: '100%', height: '100%', maxWidth: '100%', minWidth: '100%'};
rightLayoutSize: {width: string; height: string} = {width: '100%', height: '100%'}; rightLayoutSize: {width: string; height: string} = {width: '100%', height: '100%'};
dashboardLogoUrl = this.getDashboardLogoUrl();
private dashboardLogoCache: SafeUrl; private dashboardLogoCache: SafeUrl;
private defaultDashboardLogo = 'assets/logo_title_white.svg'; private defaultDashboardLogo = 'assets/logo_title_white.svg';
@ -1826,4 +1828,8 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
} }
return false; return false;
} }
private getDashboardLogoUrl(): UrlTree {
return this.forceFullscreen ? null : this.router.createUrlTree([], {relativeTo: this.route});
}
} }

2
ui-ngx/src/app/shared/components/logo.component.html

@ -20,7 +20,7 @@
<ng-container *ngTemplateOutlet="logo"></ng-container> <ng-container *ngTemplateOutlet="logo"></ng-container>
</a> </a>
} @else { } @else {
<a [routerLink]="logoLink"> <a [routerLink]="logoUrl">
<ng-container *ngTemplateOutlet="logo"></ng-container> <ng-container *ngTemplateOutlet="logo"></ng-container>
</a> </a>
} }

17
ui-ngx/src/app/shared/components/logo.component.ts

@ -14,7 +14,7 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { Component, Input, OnInit } from '@angular/core'; import { Component, Input, AfterViewInit } from '@angular/core';
import { coerceBoolean } from '@shared/decorators/coercion'; import { coerceBoolean } from '@shared/decorators/coercion';
import { AuthService } from '@core/auth/auth.service'; import { AuthService } from '@core/auth/auth.service';
import { AppState } from '@core/core.state'; import { AppState } from '@core/core.state';
@ -28,7 +28,7 @@ import { UrlHolder } from '@shared/pipe/image.pipe';
templateUrl: './logo.component.html', templateUrl: './logo.component.html',
styleUrls: ['./logo.component.scss'] styleUrls: ['./logo.component.scss']
}) })
export class LogoComponent implements OnInit { export class LogoComponent implements AfterViewInit {
@Input() @Input()
@coerceBoolean() @coerceBoolean()
@ -37,16 +37,19 @@ export class LogoComponent implements OnInit {
@Input() @Input()
logoSrc: string | UrlHolder = 'assets/logo_title_white.svg'; logoSrc: string | UrlHolder = 'assets/logo_title_white.svg';
logoLink: UrlTree; @Input()
logoUrl: string | UrlTree;
constructor(private authService: AuthService, constructor(private authService: AuthService,
private store: Store<AppState>) { private store: Store<AppState>) {
} }
ngOnInit() { ngAfterViewInit() {
if (!this.isLogin) { if (!this.isLogin && !this.logoUrl) {
const authState = getCurrentAuthState(this.store); setTimeout(() => {
this.logoLink = this.authService.defaultUrl(true, authState); const authState = getCurrentAuthState(this.store);
this.logoUrl = this.authService.defaultUrl(true, authState);
}, 0);
} }
} }
} }

Loading…
Cancel
Save