diff --git a/ui-ngx/src/app/core/api/widget-api.models.ts b/ui-ngx/src/app/core/api/widget-api.models.ts index dde2459efc..ec2199b66a 100644 --- a/ui-ngx/src/app/core/api/widget-api.models.ts +++ b/ui-ngx/src/app/core/api/widget-api.models.ts @@ -259,6 +259,8 @@ export interface IWidgetSubscription { subscribe(): void; + isDataResolved(): boolean; + destroy(): void; update(): void; diff --git a/ui-ngx/src/app/core/api/widget-subscription.ts b/ui-ngx/src/app/core/api/widget-subscription.ts index 8bc293ccf1..605921bc5e 100644 --- a/ui-ngx/src/app/core/api/widget-subscription.ts +++ b/ui-ngx/src/app/core/api/widget-subscription.ts @@ -112,6 +112,7 @@ export class WidgetSubscription implements IWidgetSubscription { init$: Observable; cafs: {[cafId: string]: CancelAnimationFrame} = {}; + hasResolvedData = false; targetDeviceAliasId: string; targetDeviceId: string; @@ -249,6 +250,7 @@ export class WidgetSubscription implements IWidgetSubscription { } else { this.rpcEnabled = this.ctx.utils.widgetEditMode ? true : false; } + this.hasResolvedData = this.rpcEnabled; this.callbacks.rpcStateChanged(this); initRpcSubject.next(); initRpcSubject.complete(); @@ -275,6 +277,7 @@ export class WidgetSubscription implements IWidgetSubscription { } else { this.rpcEnabled = this.ctx.utils.widgetEditMode ? true : false; } + this.hasResolvedData = true; this.callbacks.rpcStateChanged(this); initRpcSubject.next(); initRpcSubject.complete(); @@ -286,6 +289,7 @@ export class WidgetSubscription implements IWidgetSubscription { const initAlarmSubscriptionSubject = new ReplaySubject(1); this.loadStDiff().subscribe(() => { if (!this.ctx.aliasController) { + this.hasResolvedData = true; this.configureAlarmsData(); initAlarmSubscriptionSubject.next(); initAlarmSubscriptionSubject.complete(); @@ -293,6 +297,9 @@ export class WidgetSubscription implements IWidgetSubscription { this.ctx.aliasController.resolveAlarmSource(this.alarmSource).subscribe( (alarmSource) => { this.alarmSource = alarmSource; + if (alarmSource) { + this.hasResolvedData = true; + } this.configureAlarmsData(); initAlarmSubscriptionSubject.next(); initAlarmSubscriptionSubject.complete(); @@ -313,6 +320,7 @@ export class WidgetSubscription implements IWidgetSubscription { const initDataSubscriptionSubject = new ReplaySubject(1); this.loadStDiff().subscribe(() => { if (!this.ctx.aliasController) { + this.hasResolvedData = true; this.configureData(); initDataSubscriptionSubject.next(); initDataSubscriptionSubject.complete(); @@ -320,6 +328,9 @@ export class WidgetSubscription implements IWidgetSubscription { this.ctx.aliasController.resolveDatasources(this.datasources).subscribe( (datasources) => { this.datasources = datasources; + if (datasources && datasources.length) { + this.hasResolvedData = true; + } this.configureData(); initDataSubscriptionSubject.next(); initDataSubscriptionSubject.complete(); @@ -804,6 +815,10 @@ export class WidgetSubscription implements IWidgetSubscription { return subscriptionsChanged; } + isDataResolved(): boolean { + return this.hasResolvedData; + } + destroy(): void { this.unsubscribe(); for (const cafId of Object.keys(this.cafs)) { diff --git a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts index 3f273f6fc7..64a64376bc 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts @@ -352,8 +352,23 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI this.onDestroy(); } + private displayWidgetInstance(): boolean { + if (this.widget.type !== widgetType.static) { + for (const id of Object.keys(this.widgetContext.subscriptions)) { + const subscription = this.widgetContext.subscriptions[id]; + if (subscription.isDataResolved()) { + return true; + } + } + return false; + } else { + return true; + } + } + private onDestroy() { if (this.widgetContext) { + const shouldDestroyWidgetInstance = this.displayWidgetInstance(); for (const id of Object.keys(this.widgetContext.subscriptions)) { const subscription = this.widgetContext.subscriptions[id]; subscription.destroy(); @@ -369,7 +384,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } } try { - this.widgetTypeInstance.onDestroy(); + if (shouldDestroyWidgetInstance) { + this.widgetTypeInstance.onDestroy(); + } } catch (e) { this.handleWidgetException(e); } @@ -471,7 +488,11 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } this.cafs.init = this.raf.raf(() => { try { - this.widgetTypeInstance.onInit(); + if (this.displayWidgetInstance()) { + this.widgetTypeInstance.onInit(); + } else { + this.loadingData = false; + } this.detectChanges(); } catch (e) { this.handleWidgetException(e); @@ -492,7 +513,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } this.cafs.resize = this.raf.raf(() => { try { - this.widgetTypeInstance.onResize(); + if (this.displayWidgetInstance()) { + this.widgetTypeInstance.onResize(); + } } catch (e) { this.handleWidgetException(e); } @@ -513,7 +536,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } this.cafs.editMode = this.raf.raf(() => { try { - this.widgetTypeInstance.onEditModeChanged(); + if (this.displayWidgetInstance()) { + this.widgetTypeInstance.onEditModeChanged(); + } } catch (e) { this.handleWidgetException(e); } @@ -532,7 +557,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } this.cafs.mobileMode = this.raf.raf(() => { try { - this.widgetTypeInstance.onMobileModeChanged(); + if (this.displayWidgetInstance()) { + this.widgetTypeInstance.onMobileModeChanged(); + } } catch (e) { this.handleWidgetException(e); } @@ -781,7 +808,9 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI options.callbacks = { onDataUpdated: () => { try { - this.widgetTypeInstance.onDataUpdated(); + if (this.displayWidgetInstance()) { + this.widgetTypeInstance.onDataUpdated(); + } } catch (e){} }, onDataUpdateError: (subscription, e) => {