UI: Improve dashboard state component synchronization

This commit is contained in:
Igor Kulikov 2022-01-24 18:42:48 +02:00
parent 29ccfaa23e
commit d416103e74
3 changed files with 11 additions and 3 deletions

View File

@ -134,6 +134,7 @@ import {
import { DomSanitizer, SafeUrl } from '@angular/platform-browser'; import { DomSanitizer, SafeUrl } from '@angular/platform-browser';
import cssjs from '@core/css/css'; import cssjs from '@core/css/css';
import { DOCUMENT } from '@angular/common'; import { DOCUMENT } from '@angular/common';
import { IAliasController } from '@core/api/widget-api.models';
// @dynamic // @dynamic
@Component({ @Component({
@ -179,6 +180,9 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
@Input() @Input()
parentDashboard?: IDashboardComponent = null; parentDashboard?: IDashboardComponent = null;
@Input()
parentAliasController?: IAliasController = null;
@ViewChild('dashboardContainer') dashboardContainer: ElementRef<HTMLElement>; @ViewChild('dashboardContainer') dashboardContainer: ElementRef<HTMLElement>;
prevDashboard: Dashboard; prevDashboard: Dashboard;
@ -419,7 +423,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
this.readonly = this.embedded || (this.singlePageMode && !this.widgetEditMode && !this.route.snapshot.queryParamMap.get('edit')) this.readonly = this.embedded || (this.singlePageMode && !this.widgetEditMode && !this.route.snapshot.queryParamMap.get('edit'))
|| this.forceFullscreen || this.isMobileApp || this.authUser.authority === Authority.CUSTOMER_USER; || this.forceFullscreen || this.isMobileApp || this.authUser.authority === Authority.CUSTOMER_USER;
this.dashboardCtx.aliasController = new AliasController(this.utils, this.dashboardCtx.aliasController = this.parentAliasController ? this.parentAliasController : new AliasController(this.utils,
this.entityService, this.entityService,
this.translate, this.translate,
() => this.dashboardCtx.stateController, () => this.dashboardCtx.stateController,

View File

@ -21,7 +21,8 @@
[hideToolbar]="true" [hideToolbar]="true"
[currentState]="currentState" [currentState]="currentState"
[dashboard]="dashboard" [dashboard]="dashboard"
[parentDashboard]="parentDashboard"> [parentDashboard]="parentDashboard"
[parentAliasController]="parentAliasController">
</tb-dashboard-page> </tb-dashboard-page>
<div class="tb-absolute-fill tb-widget-error" *ngIf="!stateExists"> <div class="tb-absolute-fill tb-widget-error" *ngIf="!stateExists">
<span>{{ 'dashboard.non-existent-dashboard-state-error' | translate:{stateId} }}</span> <span>{{ 'dashboard.non-existent-dashboard-state-error' | translate:{stateId} }}</span>

View File

@ -19,7 +19,7 @@ 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 { Dashboard, DashboardLayoutId } from '@shared/models/dashboard.models'; import { Dashboard, DashboardLayoutId } from '@shared/models/dashboard.models';
import { StateObject } from '@core/api/widget-api.models'; import { IAliasController, StateObject } from '@core/api/widget-api.models';
import { updateEntityParams, WidgetContext } from '@home/models/widget-component.models'; import { updateEntityParams, WidgetContext } from '@home/models/widget-component.models';
import { deepClone, isDefinedAndNotNull, isNotEmptyStr, objToBase64 } from '@core/utils'; import { deepClone, isDefinedAndNotNull, isNotEmptyStr, objToBase64 } from '@core/utils';
import { IDashboardComponent } from '@home/models/dashboard-component.models'; import { IDashboardComponent } from '@home/models/dashboard-component.models';
@ -63,6 +63,8 @@ export class DashboardStateComponent extends PageComponent implements OnInit, On
parentDashboard: IDashboardComponent; parentDashboard: IDashboardComponent;
parentAliasController: IAliasController;
stateExists = true; stateExists = true;
private stateSubscription: Subscription; private stateSubscription: Subscription;
@ -92,6 +94,7 @@ export class DashboardStateComponent extends PageComponent implements OnInit, On
this.parentDashboard = this.ctx.parentDashboard ? this.parentDashboard = this.ctx.parentDashboard ?
this.ctx.parentDashboard : this.ctx.dashboard; this.ctx.parentDashboard : this.ctx.dashboard;
if (this.syncParentStateParams) { if (this.syncParentStateParams) {
this.parentAliasController = this.parentDashboard.aliasController;
this.stateSubscription = this.ctx.stateController.dashboardCtrl.dashboardCtx.stateChanged.subscribe(() => { this.stateSubscription = this.ctx.stateController.dashboardCtrl.dashboardCtx.stateChanged.subscribe(() => {
this.updateCurrentState(); this.updateCurrentState();
this.cd.markForCheck(); this.cd.markForCheck();