rulenode.component.ts
3.05 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
///
/// Copyright © 2016-2022 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 { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
import { Component, OnInit } from '@angular/core';
import { FcNodeComponent } from 'ngx-flowchart';
import { FcRuleNode, RuleNodeType } from '@shared/models/rule-node.models';
import { Router } from '@angular/router';
import { RuleChainType } from '@app/shared/models/rule-chain.models';
import { TranslateService } from '@ngx-translate/core';
@Component({
// tslint:disable-next-line:component-selector
selector: 'rule-node',
templateUrl: './rulenode.component.html',
styleUrls: ['./rulenode.component.scss']
})
export class RuleNodeComponent extends FcNodeComponent implements OnInit {
iconUrl: SafeResourceUrl;
RuleNodeType = RuleNodeType;
constructor(private sanitizer: DomSanitizer,
private translate: TranslateService,
private router: Router) {
super();
}
ngOnInit(): void {
super.ngOnInit();
if (this.node.iconUrl) {
this.iconUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.node.iconUrl);
}
}
openRuleChain($event: Event, node: FcRuleNode) {
if ($event) {
$event.stopPropagation();
}
if (node.configuration?.ruleChainId) {
if (node.ruleChainType === RuleChainType.EDGE) {
this.router.navigateByUrl(`/edgeManagement/ruleChains/${node.configuration?.ruleChainId}`);
} else {
this.router.navigateByUrl(`/ruleChains/${node.configuration?.ruleChainId}`);
}
}
}
displayOpenRuleChainTooltip($event: MouseEvent, node: FcRuleNode) {
if ($event) {
$event.stopPropagation();
}
this.userNodeCallbacks.mouseLeave($event, node);
const tooltipContent = '<div class="tb-rule-node-tooltip">' +
'<div id="tb-node-content">' +
'<div class="tb-node-description">' + this.translate.instant('rulechain.open-rulechain') + '</div></div></div>';
const element = $($event.target);
element.tooltipster(
{
theme: 'tooltipster-shadow',
delay: 100,
trigger: 'custom',
triggerOpen: {
click: false,
tap: false
},
triggerClose: {
click: true,
tap: true,
scroll: true,
mouseleave: true
},
side: 'top',
distance: 12,
trackOrigin: true
}
);
const tooltip = element.tooltipster('instance');
const contentElement = $(tooltipContent);
tooltip.content(contentElement);
tooltip.open();
}
}