diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.html b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.html new file mode 100644 index 0000000000..b2bd40aa1a --- /dev/null +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.html @@ -0,0 +1,47 @@ + +
+ +

{{ 'rulenode.events' | translate}}

+ + +
+
+ +
+
+ +
+
diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.scss b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.scss new file mode 100644 index 0000000000..c4798d06f9 --- /dev/null +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.scss @@ -0,0 +1,26 @@ +/** + * Copyright © 2016-2025 The Thingsboard Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +:host { + .debug-dialog-container { + width: 1080px; + max-width: 100%; + + .debug-dialog-content { + height: 65vh; + border-radius: 0; + } + } +} diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.ts new file mode 100644 index 0000000000..e7a7947009 --- /dev/null +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-debug-dialog.component.ts @@ -0,0 +1,65 @@ +/// +/// Copyright © 2016-2025 The Thingsboard Authors +/// +/// Licensed under the Apache License, Version 2.0 (the "License"); +/// you may not use this file except in compliance with the License. +/// You may obtain a copy of the License at +/// +/// http://www.apache.org/licenses/LICENSE-2.0 +/// +/// Unless required by applicable law or agreed to in writing, software +/// distributed under the License is distributed on an "AS IS" BASIS, +/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +/// See the License for the specific language governing permissions and +/// limitations under the License. +/// + +import { AfterViewInit, Component, Inject, ViewChild } from '@angular/core'; +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { DialogComponent } from '@shared/components/dialog.component'; +import { EventTableComponent } from '@home/components/event/event-table.component'; +import { Store } from '@ngrx/store'; +import { AppState } from '@core/core.state'; +import { Router } from '@angular/router'; +import { DebugEventType, EventType } from '@shared/models/event.models'; +import { TenantId } from '@shared/models/id/tenant-id'; +import { EntityId } from '@shared/models/id/entity-id'; + +export interface RuleNodeDebugDialogData { + isActive: boolean; + tenantId: TenantId; + ruleNodeId: EntityId; + ruleNodeTestButtonLabel: string; + onDebugEventSelected: ()=> void; +} + +@Component({ + selector: 'tb-rule-node-debug-dialog', + templateUrl: './rule-node-debug-dialog.component.html', + styleUrl: './rule-node-debug-dialog.component.scss' +}) +export class RuleNodeDebugDialogComponent extends DialogComponent implements AfterViewInit{ + + @ViewChild(EventTableComponent, {static: true}) eventsTable: EventTableComponent; + + readonly DebugEventType = DebugEventType; + readonly debugEventTypes = DebugEventType; + readonly EventType = EventType; + + dialogTitle: string; + + constructor(protected store: Store, + protected router: Router, + @Inject(MAT_DIALOG_DATA) public data: RuleNodeDebugDialogData, + protected dialogRef: MatDialogRef) { + super(store, router, dialogRef); + } + + ngAfterViewInit() { + this.eventsTable.entitiesTable.updateData(); + } + + cancel(): void { + this.dialogRef.close(null); + } +} diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html index b55dcdaa73..a66819a49b 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-details.component.html @@ -36,6 +36,7 @@
(); diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.html b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.html index 423bde7da3..c31f24c0ea 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.html +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.html @@ -106,6 +106,7 @@ (RuleNodeDebugDialogComponent, { + disableClose: true, + panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], + data: { + active: true, + tenantId: this.ruleChain.tenantId, + ruleNodeId: this.editingRuleNode.ruleNodeId, + functionTestButtonLabel: this.ruleNodeTestButtonLabel, + debugEventSelected: this.onDebugEventSelected.bind(this) + } + }) + .afterClosed() + .subscribe(); + } + private updateNodeErrorTooltip(node: FcRuleNode) { if (node.error) { const element = $('#' + node.id); diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts index 34518e2b70..51197e1073 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.module.ts @@ -33,6 +33,7 @@ import { RuleNodeDetailsComponent } from '@home/pages/rulechain/rule-node-detail import { RuleNodeConfigComponent } from '@home/pages/rulechain/rule-node-config.component'; import { LinkLabelsComponent } from '@home/pages/rulechain/link-labels.component'; import { RuleNodeLinkComponent } from '@home/pages/rulechain/rule-node-link.component'; +import { RuleNodeDebugDialogComponent } from '@home/pages/rulechain/rule-node-debug-dialog.component'; @NgModule({ declarations: [ @@ -43,7 +44,8 @@ import { RuleNodeLinkComponent } from '@home/pages/rulechain/rule-node-link.comp RuleNodeConfigComponent, AddRuleNodeLinkDialogComponent, AddRuleNodeDialogComponent, - CreateNestedRuleChainDialogComponent + CreateNestedRuleChainDialogComponent, + RuleNodeDebugDialogComponent ], imports: [ CommonModule,