Igor Kulikov
9 years ago
23 changed files with 1761 additions and 121 deletions
@ -0,0 +1,48 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
<md-dialog aria-label="{{ 'rulenode.add-link' | translate }}" tb-help="'rulechains'" help-container-id="help-container"> |
|||
<form name="theForm" ng-submit="vm.add()"> |
|||
<md-toolbar> |
|||
<div class="md-toolbar-tools"> |
|||
<h2 translate>rulenode.add-link</h2> |
|||
<span flex></span> |
|||
<div id="help-container"></div> |
|||
<md-button class="md-icon-button" ng-click="vm.cancel()"> |
|||
<ng-md-icon icon="close" aria-label="{{ 'dialog.close' | translate }}"></ng-md-icon> |
|||
</md-button> |
|||
</div> |
|||
</md-toolbar> |
|||
<md-progress-linear class="md-warn" md-mode="indeterminate" ng-disabled="!$root.loading" ng-show="$root.loading"></md-progress-linear> |
|||
<span style="min-height: 5px;" flex="" ng-show="!$root.loading"></span> |
|||
<md-dialog-content> |
|||
<div class="md-dialog-content"> |
|||
<tb-rule-node-link link="vm.link" labels="vm.labels" is-edit="true" the-form="theForm"></tb-rule-node-link> |
|||
</div> |
|||
</md-dialog-content> |
|||
<md-dialog-actions layout="row"> |
|||
<span flex></span> |
|||
<md-button ng-disabled="$root.loading || theForm.$invalid || !theForm.$dirty" type="submit" |
|||
class="md-raised md-primary"> |
|||
{{ 'action.add' | translate }} |
|||
</md-button> |
|||
<md-button ng-disabled="$root.loading" ng-click="vm.cancel()" style="margin-right:20px;">{{ 'action.cancel' | |
|||
translate }} |
|||
</md-button> |
|||
</md-dialog-actions> |
|||
</form> |
|||
</md-dialog> |
|||
@ -0,0 +1,48 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
<md-dialog aria-label="{{ 'rulenode.add' | translate }}" tb-help="'rulechains'" help-container-id="help-container" style="min-width: 650px;"> |
|||
<form name="theForm" ng-submit="vm.add()"> |
|||
<md-toolbar> |
|||
<div class="md-toolbar-tools"> |
|||
<h2 translate>rulenode.add</h2> |
|||
<span flex></span> |
|||
<div id="help-container"></div> |
|||
<md-button class="md-icon-button" ng-click="vm.cancel()"> |
|||
<ng-md-icon icon="close" aria-label="{{ 'dialog.close' | translate }}"></ng-md-icon> |
|||
</md-button> |
|||
</div> |
|||
</md-toolbar> |
|||
<md-progress-linear class="md-warn" md-mode="indeterminate" ng-disabled="!$root.loading" ng-show="$root.loading"></md-progress-linear> |
|||
<span style="min-height: 5px;" flex="" ng-show="!$root.loading"></span> |
|||
<md-dialog-content> |
|||
<div class="md-dialog-content"> |
|||
<tb-rule-node rule-node="vm.ruleNode" rule-chain-id="vm.ruleChainId" is-edit="true" the-form="theForm"></tb-rule-node> |
|||
</div> |
|||
</md-dialog-content> |
|||
<md-dialog-actions layout="row"> |
|||
<span flex></span> |
|||
<md-button ng-disabled="$root.loading || theForm.$invalid || !theForm.$dirty" type="submit" |
|||
class="md-raised md-primary"> |
|||
{{ 'action.add' | translate }} |
|||
</md-button> |
|||
<md-button ng-disabled="$root.loading" ng-click="vm.cancel()" style="margin-right:20px;">{{ 'action.cancel' | |
|||
translate }} |
|||
</md-button> |
|||
</md-dialog-actions> |
|||
</form> |
|||
</md-dialog> |
|||
@ -0,0 +1,39 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
<md-content class="md-padding tb-link" layout="column"> |
|||
<fieldset ng-disabled="$root.loading || !isEdit || isReadOnly"> |
|||
<md-input-container class="md-block"> |
|||
<label translate>rulenode.link-label</label> |
|||
<md-select ng-model="selectedLabel" ng-change="selectedLabelChanged()"> |
|||
<md-option ng-repeat="label in labels" ng-value="label"> |
|||
{{label.name}} |
|||
</md-option> |
|||
</md-select> |
|||
<div ng-messages="theForm.linkLabel.$error"> |
|||
<div translate ng-message="required">rulenode.link-label-required</div> |
|||
</div> |
|||
</md-input-container> |
|||
<md-input-container ng-if="selectedLabel.custom" class="md-block"> |
|||
<label translate>rulenode.link-label</label> |
|||
<input required name="customLinkLabel" ng-model="link.label"> |
|||
<div ng-messages="theForm.customLinkLabel.$error"> |
|||
<div translate ng-message="required">rulenode.custom-link-label-required</div> |
|||
</div> |
|||
</md-input-container> |
|||
</fieldset> |
|||
</md-content> |
|||
@ -0,0 +1,71 @@ |
|||
/* |
|||
* Copyright © 2016-2018 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. |
|||
*/ |
|||
|
|||
/* eslint-disable import/no-unresolved, import/default */ |
|||
|
|||
import linkFieldsetTemplate from './link-fieldset.tpl.html'; |
|||
|
|||
/* eslint-enable import/no-unresolved, import/default */ |
|||
|
|||
/*@ngInject*/ |
|||
export default function LinkDirective($compile, $templateCache, $filter) { |
|||
var linker = function (scope, element) { |
|||
var template = $templateCache.get(linkFieldsetTemplate); |
|||
element.html(template); |
|||
|
|||
scope.selectedLabel = null; |
|||
|
|||
scope.$watch('link', function() { |
|||
scope.selectedLabel = null; |
|||
if (scope.link && scope.labels) { |
|||
if (scope.link.label) { |
|||
var result = $filter('filter')(scope.labels, {name: scope.link.label}); |
|||
if (result && result.length) { |
|||
scope.selectedLabel = result[0]; |
|||
} else { |
|||
result = $filter('filter')(scope.labels, {custom: true}); |
|||
if (result && result.length && result[0].custom) { |
|||
scope.selectedLabel = result[0]; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}); |
|||
|
|||
scope.selectedLabelChanged = function() { |
|||
if (scope.link && scope.selectedLabel) { |
|||
if (!scope.selectedLabel.custom) { |
|||
scope.link.label = scope.selectedLabel.name; |
|||
} else { |
|||
scope.link.label = ""; |
|||
} |
|||
} |
|||
}; |
|||
|
|||
$compile(element.contents())(scope); |
|||
} |
|||
return { |
|||
restrict: "E", |
|||
link: linker, |
|||
scope: { |
|||
link: '=', |
|||
labels: '=', |
|||
isEdit: '=', |
|||
isReadOnly: '=', |
|||
theForm: '=' |
|||
} |
|||
}; |
|||
} |
|||
@ -0,0 +1,262 @@ |
|||
/** |
|||
* Copyright © 2016-2018 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. |
|||
*/ |
|||
|
|||
.tb-rulechain { |
|||
.tb-fullscreen-button-style { |
|||
z-index: 1; |
|||
} |
|||
.tb-rulechain-library { |
|||
width: 250px; |
|||
min-width: 250px; |
|||
overflow-y: auto; |
|||
overflow-x: hidden; |
|||
|
|||
.tb-rulechain-library-panel-group { |
|||
.tb-panel-title { |
|||
-webkit-user-select: none; |
|||
-moz-user-select: none; |
|||
-ms-user-select: none; |
|||
user-select: none; |
|||
min-width: 180px; |
|||
} |
|||
.fc-canvas { |
|||
background: none; |
|||
} |
|||
md-icon.md-expansion-panel-icon { |
|||
margin-right: 0px; |
|||
} |
|||
md-expansion-panel-collapsed, .md-expansion-panel-header-container { |
|||
background: #e6e6e6; |
|||
border-color: #909090; |
|||
position: static; |
|||
} |
|||
md-expansion-panel { |
|||
&.md-open { |
|||
margin-top: 0; |
|||
margin-bottom: 0; |
|||
} |
|||
} |
|||
md-expansion-panel-content { |
|||
padding: 0px; |
|||
} |
|||
} |
|||
} |
|||
.tb-rulechain-graph { |
|||
overflow: auto; |
|||
} |
|||
} |
|||
|
|||
.fc-canvas { |
|||
min-width: 100%; |
|||
min-height: 100%; |
|||
outline: none; |
|||
} |
|||
|
|||
.tb-rule-node { |
|||
display: flex; |
|||
flex-direction: row; |
|||
min-width: 150px; |
|||
max-width: 150px; |
|||
min-height: 28px; |
|||
max-height: 28px; |
|||
padding: 5px 10px; |
|||
border-radius: 5px; |
|||
background-color: #F15B26; |
|||
color: #333; |
|||
border: solid 1px #777; |
|||
font-size: 12px; |
|||
&.tb-input-type { |
|||
background-color: #a3eaa9; |
|||
user-select: none; |
|||
} |
|||
&.tb-filter-type { |
|||
background-color: #f1e861; |
|||
} |
|||
&.tb-enrichment-type { |
|||
background-color: #cdf14e; |
|||
} |
|||
&.tb-transformation-type { |
|||
background-color: #79cef1; |
|||
} |
|||
&.tb-action-type { |
|||
background-color: #f1928f; |
|||
} |
|||
&.tb-rule-chain-type { |
|||
background-color: #d6c4f1; |
|||
} |
|||
md-icon { |
|||
font-size: 20px; |
|||
width: 20px; |
|||
height: 20px; |
|||
min-height: 20px; |
|||
min-width: 20px; |
|||
padding-right: 4px; |
|||
} |
|||
.tb-node-type { |
|||
|
|||
} |
|||
.tb-node-title { |
|||
font-weight: 600; |
|||
} |
|||
.tb-node-type, .tb-node-title { |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
text-overflow: ellipsis; |
|||
} |
|||
} |
|||
|
|||
.fc-node { |
|||
z-index: 1; |
|||
outline: none; |
|||
&.fc-hover, &.fc-selected { |
|||
-webkit-filter: brightness(70%); |
|||
filter: brightness(70%); |
|||
} |
|||
&.fc-dragging { |
|||
z-index: 10; |
|||
} |
|||
p { |
|||
padding: 0 15px; |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.fc-leftConnectors, .fc-rightConnectors { |
|||
position: absolute; |
|||
top: 0; |
|||
height: 100%; |
|||
|
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
z-index: 0; |
|||
.fc-magnet { |
|||
align-items: center; |
|||
} |
|||
} |
|||
|
|||
.fc-leftConnectors { |
|||
left: -20px; |
|||
} |
|||
|
|||
.fc-rightConnectors { |
|||
right: -20px; |
|||
} |
|||
|
|||
.fc-magnet { |
|||
display: flex; |
|||
flex-grow: 1; |
|||
height: 60px; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.fc-connector { |
|||
width: 14px; |
|||
height: 14px; |
|||
border: 1px solid #333; |
|||
margin: 10px; |
|||
border-radius: 5px; |
|||
background-color: #ccc; |
|||
} |
|||
|
|||
.fc-connector.fc-hover { |
|||
background-color: #000; |
|||
} |
|||
|
|||
.fc-edge { |
|||
outline: none; |
|||
stroke: gray; |
|||
stroke-width: 4; |
|||
fill: transparent; |
|||
&.fc-selected { |
|||
stroke: red; |
|||
stroke-width: 4; |
|||
fill: transparent; |
|||
} |
|||
&.fc-active { |
|||
animation: dash 3s linear infinite; |
|||
stroke-dasharray: 20; |
|||
} |
|||
&.fc-hover { |
|||
stroke: gray; |
|||
stroke-width: 6; |
|||
fill: transparent; |
|||
} |
|||
&.fc-dragging { |
|||
pointer-events: none; |
|||
} |
|||
} |
|||
|
|||
.edge-endpoint { |
|||
fill: gray; |
|||
} |
|||
|
|||
.fc-nodedelete { |
|||
display: none; |
|||
} |
|||
|
|||
.fc-selected .fc-nodedelete { |
|||
outline: none; |
|||
display: block; |
|||
position: absolute; |
|||
right: -13px; |
|||
top: -16px; |
|||
border: solid 2px white; |
|||
border-radius: 50%; |
|||
font-weight: 600; |
|||
font-size: 18px; |
|||
line-height: 18px; |
|||
height: 20px; |
|||
padding-top: 2px; |
|||
width: 22px; |
|||
background: #494949; |
|||
color: #fff; |
|||
text-align: center; |
|||
vertical-align: bottom; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.fc-edge-label { |
|||
position: absolute; |
|||
user-select: none; |
|||
pointer-events: none; |
|||
opacity: 0.8; |
|||
} |
|||
|
|||
.fc-edge-label-text { |
|||
position: absolute; |
|||
left: 50%; |
|||
-webkit-transform: translateX(-50%); |
|||
transform: translateX(-50%); |
|||
white-space: nowrap; |
|||
text-align: center; |
|||
font-size: 14px; |
|||
font-weight: 600; |
|||
top: 5px; |
|||
span { |
|||
border: solid 2px #003a79; |
|||
border-radius: 10px; |
|||
color: #003a79; |
|||
background-color: #fff; |
|||
padding: 3px 5px; |
|||
} |
|||
} |
|||
|
|||
@keyframes dash { |
|||
from { |
|||
stroke-dashoffset: 500; |
|||
} |
|||
} |
|||
@ -0,0 +1,130 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
|
|||
<md-content flex tb-expand-fullscreen |
|||
expand-tooltip-direction="bottom" layout="column" class="tb-rulechain"> |
|||
<section class="tb-rulechain-container" flex layout="column"> |
|||
<div class="tb-rulechain-layout" flex layout="row"> |
|||
<div class="tb-rulechain-library"> |
|||
<md-expansion-panel-group class="tb-rulechain-library-panel-group" md-component-id="libraryPanelGroup" auto-expand="true" multiple> |
|||
<md-expansion-panel md-component-id="{{typeId}}" id="{{typeId}}" ng-repeat="(typeId, typeModel) in vm.ruleNodeTypesModel"> |
|||
<md-expansion-panel-collapsed> |
|||
<div class="tb-panel-title" translate>{{vm.types.ruleNodeType[typeId].name}}</div> |
|||
<md-expansion-panel-icon></md-expansion-panel-icon> |
|||
</md-expansion-panel-collapsed> |
|||
<md-expansion-panel-expanded> |
|||
<md-expansion-panel-header ng-click="vm.$mdExpansionPanel(typeId).collapse()"> |
|||
<div class="tb-panel-title" translate>{{vm.types.ruleNodeType[typeId].name}}</div> |
|||
<md-expansion-panel-icon></md-expansion-panel-icon> |
|||
</md-expansion-panel-header> |
|||
<md-expansion-panel-content> |
|||
<fc-canvas id="tb-rulechain-{{typeId}}" |
|||
model="vm.ruleNodeTypesModel[typeId].model" selected-objects="vm.ruleNodeTypesModel[typeId].selectedObjects" |
|||
automatic-resize="false" |
|||
node-width="170" |
|||
node-height="50" |
|||
drop-target-id="'tb-rulchain-canvas'"></fc-canvas> |
|||
</md-expansion-panel-content> |
|||
</md-expansion-panel-expanded> |
|||
</md-expansion-panel> |
|||
</md-expansion-panel-group> |
|||
</div> |
|||
<div flex class="tb-rulechain-graph"> |
|||
<fc-canvas id="tb-rulchain-canvas" |
|||
ng-keydown="vm.keyDown($event)" |
|||
ng-keyup="vm.keyUp($event)" |
|||
model="vm.ruleChainModel" |
|||
selected-objects="vm.selectedObjects" |
|||
edge-style="curved" |
|||
node-width="170" |
|||
node-height="50" |
|||
automatic-resize="true" |
|||
control="vm.canvasControl" |
|||
callbacks="vm.editCallbacks"> |
|||
</fc-canvas> |
|||
</div> |
|||
</div> |
|||
<tb-details-sidenav class="tb-rulenode-details-sidenav" |
|||
header-title="{{vm.editingRuleNode.name}}" |
|||
header-subtitle="{{'rulenode.rulenode-details' | translate}}" |
|||
is-read-only="false" |
|||
is-open="vm.isEditingRuleNode" |
|||
is-always-edit="true" |
|||
on-close-details="vm.onEditRuleNodeClosed()" |
|||
on-toggle-details-edit-mode="vm.onRevertRuleNodeEdit(vm.ruleNodeForm)" |
|||
on-apply-details="vm.saveRuleNode(vm.ruleNodeForm)" |
|||
the-form="vm.ruleNodeForm"> |
|||
<details-buttons tb-help="vm.helpLinkIdForRuleNodeType()" help-container-id="help-container"> |
|||
<div id="help-container"></div> |
|||
</details-buttons> |
|||
<form name="vm.ruleNodeForm" ng-if="vm.isEditingRuleNode"> |
|||
<tb-rule-node |
|||
rule-node="vm.editingRuleNode" |
|||
rule-chain-id="vm.ruleChain.id.id" |
|||
is-edit="true" |
|||
is-read-only="false" |
|||
on-delete-rule-node="vm.deleteRuleNode(event, vm.editingRuleNode)" |
|||
the-form="vm.ruleNodeForm"> |
|||
</tb-rule-node> |
|||
</form> |
|||
</tb-details-sidenav> |
|||
<tb-details-sidenav class="tb-rulenode-link-details-sidenav" |
|||
header-title="{{vm.editingRuleNodeLink.label}}" |
|||
header-subtitle="{{'rulenode.link-details' | translate}}" |
|||
is-read-only="false" |
|||
is-open="vm.isEditingRuleNodeLink" |
|||
is-always-edit="true" |
|||
on-close-details="vm.onEditRuleNodeLinkClosed()" |
|||
on-toggle-details-edit-mode="vm.onRevertRuleNodeLinkEdit(vm.ruleNodeLinkForm)" |
|||
on-apply-details="vm.saveRuleNodeLink(vm.ruleNodeLinkForm)" |
|||
the-form="vm.ruleNodeLinkForm"> |
|||
<details-buttons tb-help="vm.helpLinkIdForRuleNodeLink()" help-container-id="link-help-container"> |
|||
<div id="link-help-container"></div> |
|||
</details-buttons> |
|||
<form name="vm.ruleNodeLinkForm" ng-if="vm.isEditingRuleNodeLink"> |
|||
<tb-rule-node-link |
|||
link="vm.editingRuleNodeLink" |
|||
labels="vm.editingRuleNodeLinkLabels" |
|||
is-edit="true" |
|||
is-read-only="false" |
|||
the-form="vm.ruleNodeLinkForm"> |
|||
</tb-rule-node-link> |
|||
</form> |
|||
</tb-details-sidenav> |
|||
</section> |
|||
<section layout="row" layout-wrap class="tb-footer-buttons md-fab" layout-align="start end"> |
|||
<md-button ng-disabled="$root.loading || !vm.isDirty" |
|||
class="tb-btn-footer md-accent md-hue-2 md-fab" |
|||
aria-label="{{ 'action.apply' | translate }}" |
|||
ng-click="vm.saveRuleChain()"> |
|||
<md-tooltip md-direction="top"> |
|||
{{ 'action.apply-changes' | translate }} |
|||
</md-tooltip> |
|||
<ng-md-icon icon="done"></ng-md-icon> |
|||
</md-button> |
|||
<md-button ng-disabled="$root.loading || !vm.isDirty" |
|||
class="tb-btn-footer md-accent md-hue-2 md-fab" |
|||
aria-label="{{ 'action.decline-changes' | translate }}" |
|||
ng-click="vm.revertRuleChain()"> |
|||
<md-tooltip md-direction="top"> |
|||
{{ 'action.decline-changes' | translate }} |
|||
</md-tooltip> |
|||
<ng-md-icon icon="close"></ng-md-icon> |
|||
</md-button> |
|||
</section> |
|||
</md-content> |
|||
@ -0,0 +1,188 @@ |
|||
/* |
|||
* Copyright © 2016-2018 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. |
|||
*/ |
|||
/* eslint-disable import/no-unresolved, import/default */ |
|||
|
|||
import addRuleChainTemplate from './add-rulechain.tpl.html'; |
|||
import ruleChainCard from './rulechain-card.tpl.html'; |
|||
|
|||
/* eslint-enable import/no-unresolved, import/default */ |
|||
|
|||
/*@ngInject*/ |
|||
export default function RuleChainsController(ruleChainService, userService, importExport, $state, $stateParams, $filter, $translate, types) { |
|||
|
|||
var ruleChainActionsList = [ |
|||
{ |
|||
onAction: function ($event, item) { |
|||
vm.grid.openItem($event, item); |
|||
}, |
|||
name: function() { return $translate.instant('rulechain.details') }, |
|||
details: function() { return $translate.instant('rulechain.rulechain-details') }, |
|||
icon: "edit" |
|||
}, |
|||
{ |
|||
onAction: function ($event, item) { |
|||
exportRuleChain($event, item); |
|||
}, |
|||
name: function() { $translate.instant('action.export') }, |
|||
details: function() { return $translate.instant('rulechain.export') }, |
|||
icon: "file_download" |
|||
}, |
|||
{ |
|||
onAction: function ($event, item) { |
|||
vm.grid.deleteItem($event, item); |
|||
}, |
|||
name: function() { return $translate.instant('action.delete') }, |
|||
details: function() { return $translate.instant('rulechain.delete') }, |
|||
icon: "delete", |
|||
isEnabled: isRuleChainEditable |
|||
} |
|||
]; |
|||
|
|||
var ruleChainAddItemActionsList = [ |
|||
{ |
|||
onAction: function ($event) { |
|||
vm.grid.addItem($event); |
|||
}, |
|||
name: function() { return $translate.instant('action.create') }, |
|||
details: function() { return $translate.instant('rulechain.create-new-rulechain') }, |
|||
icon: "insert_drive_file" |
|||
}, |
|||
{ |
|||
onAction: function ($event) { |
|||
importExport.importRuleChain($event).then( |
|||
function() { |
|||
vm.grid.refreshList(); |
|||
} |
|||
); |
|||
}, |
|||
name: function() { return $translate.instant('action.import') }, |
|||
details: function() { return $translate.instant('rulechain.import') }, |
|||
icon: "file_upload" |
|||
} |
|||
]; |
|||
|
|||
var vm = this; |
|||
|
|||
vm.types = types; |
|||
|
|||
vm.ruleChainGridConfig = { |
|||
|
|||
refreshParamsFunc: null, |
|||
|
|||
deleteItemTitleFunc: deleteRuleChainTitle, |
|||
deleteItemContentFunc: deleteRuleChainText, |
|||
deleteItemsTitleFunc: deleteRuleChainsTitle, |
|||
deleteItemsActionTitleFunc: deleteRuleChainsActionTitle, |
|||
deleteItemsContentFunc: deleteRuleChainsText, |
|||
|
|||
fetchItemsFunc: fetchRuleChains, |
|||
saveItemFunc: saveRuleChain, |
|||
clickItemFunc: openRuleChain, |
|||
deleteItemFunc: deleteRuleChain, |
|||
|
|||
getItemTitleFunc: getRuleChainTitle, |
|||
itemCardTemplateUrl: ruleChainCard, |
|||
parentCtl: vm, |
|||
|
|||
actionsList: ruleChainActionsList, |
|||
addItemActions: ruleChainAddItemActionsList, |
|||
|
|||
onGridInited: gridInited, |
|||
|
|||
addItemTemplateUrl: addRuleChainTemplate, |
|||
|
|||
addItemText: function() { return $translate.instant('rulechain.add-rulechain-text') }, |
|||
noItemsText: function() { return $translate.instant('rulechain.no-rulechains-text') }, |
|||
itemDetailsText: function() { return $translate.instant('rulechain.rulechain-details') }, |
|||
isSelectionEnabled: isRuleChainEditable, |
|||
isDetailsReadOnly: function(ruleChain) { |
|||
return !isRuleChainEditable(ruleChain); |
|||
} |
|||
}; |
|||
|
|||
if (angular.isDefined($stateParams.items) && $stateParams.items !== null) { |
|||
vm.ruleChainGridConfig.items = $stateParams.items; |
|||
} |
|||
|
|||
if (angular.isDefined($stateParams.topIndex) && $stateParams.topIndex > 0) { |
|||
vm.ruleChainGridConfig.topIndex = $stateParams.topIndex; |
|||
} |
|||
|
|||
vm.isRuleChainEditable = isRuleChainEditable; |
|||
|
|||
vm.exportRuleChain = exportRuleChain; |
|||
|
|||
function deleteRuleChainTitle(ruleChain) { |
|||
return $translate.instant('rulechain.delete-rulechain-title', {ruleChainName: ruleChain.name}); |
|||
} |
|||
|
|||
function deleteRuleChainText() { |
|||
return $translate.instant('rulechain.delete-rulechain-text'); |
|||
} |
|||
|
|||
function deleteRuleChainsTitle(selectedCount) { |
|||
return $translate.instant('rulechain.delete-rulechains-title', {count: selectedCount}, 'messageformat'); |
|||
} |
|||
|
|||
function deleteRuleChainsActionTitle(selectedCount) { |
|||
return $translate.instant('rulechain.delete-rulechains-action-title', {count: selectedCount}, 'messageformat'); |
|||
} |
|||
|
|||
function deleteRuleChainsText() { |
|||
return $translate.instant('rulechain.delete-rulechains-text'); |
|||
} |
|||
|
|||
function gridInited(grid) { |
|||
vm.grid = grid; |
|||
} |
|||
|
|||
function fetchRuleChains(pageLink) { |
|||
return ruleChainService.getRuleChains(pageLink); |
|||
} |
|||
|
|||
function saveRuleChain(ruleChain) { |
|||
return ruleChainService.saveRuleChain(ruleChain); |
|||
} |
|||
|
|||
function openRuleChain($event, ruleChain) { |
|||
if ($event) { |
|||
$event.stopPropagation(); |
|||
} |
|||
$state.go('home.ruleChains.ruleChain', {ruleChainId: ruleChain.id.id}); |
|||
} |
|||
|
|||
function deleteRuleChain(ruleChainId) { |
|||
return ruleChainService.deleteRuleChain(ruleChainId); |
|||
} |
|||
|
|||
function getRuleChainTitle(ruleChain) { |
|||
return ruleChain ? ruleChain.name : ''; |
|||
} |
|||
|
|||
function isRuleChainEditable(ruleChain) { |
|||
if (userService.getAuthority() === 'TENANT_ADMIN') { |
|||
return ruleChain && ruleChain.tenantId.id != types.id.nullUid; |
|||
} else { |
|||
return userService.getAuthority() === 'SYS_ADMIN'; |
|||
} |
|||
} |
|||
|
|||
function exportRuleChain($event, ruleChain) { |
|||
$event.stopPropagation(); |
|||
importExport.exportRuleChain(ruleChain.id.id); |
|||
} |
|||
|
|||
} |
|||
@ -0,0 +1,55 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
<md-button ng-click="onDeleteRuleNode({event: $event})" |
|||
ng-show="!isEdit && !isReadOnly" |
|||
class="md-raised md-primary">{{ 'rulenode.delete' | translate }}</md-button> |
|||
|
|||
<md-content class="md-padding tb-rulenode" layout="column"> |
|||
<fieldset ng-disabled="$root.loading || !isEdit || isReadOnly"> |
|||
<md-input-container class="md-block"> |
|||
<label translate>rulenode.type</label> |
|||
<input readonly name="type" ng-model="ruleNode.type"> |
|||
</md-input-container> |
|||
<section ng-if="ruleNode.nodeType != types.ruleNodeType.RULE_CHAIN.value"> |
|||
<md-input-container class="md-block"> |
|||
<label translate>rulenode.name</label> |
|||
<input required name="name" ng-model="ruleNode.name"> |
|||
<div ng-messages="theForm.name.$error"> |
|||
<div translate ng-message="required">rulenode.name-required</div> |
|||
</div> |
|||
</md-input-container> |
|||
<md-input-container class="md-block"> |
|||
<label translate>rulenode.description</label> |
|||
<textarea ng-model="ruleNode.additionalInfo.description" rows="2"></textarea> |
|||
</md-input-container> |
|||
</section> |
|||
<section ng-if="ruleNode.nodeType == types.ruleNodeType.RULE_CHAIN.value"> |
|||
<tb-entity-autocomplete the-form="theForm" |
|||
ng-disabled="$root.loading || !isEdit || isReadOnly" |
|||
tb-required="true" |
|||
exclude-entity-ids="[ruleChainId]" |
|||
entity-type="types.entityType.rulechain" |
|||
ng-model="params.targetRuleChainId"> |
|||
</tb-entity-autocomplete> |
|||
<md-input-container class="md-block"> |
|||
<label translate>rulenode.description</label> |
|||
<textarea ng-model="ruleNode.additionalInfo.description" rows="2"></textarea> |
|||
</md-input-container> |
|||
</section> |
|||
</fieldset> |
|||
</md-content> |
|||
@ -0,0 +1,79 @@ |
|||
/* |
|||
* Copyright © 2016-2018 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. |
|||
*/ |
|||
|
|||
/* eslint-disable import/no-unresolved, import/default */ |
|||
|
|||
import ruleNodeFieldsetTemplate from './rulenode-fieldset.tpl.html'; |
|||
|
|||
/* eslint-enable import/no-unresolved, import/default */ |
|||
|
|||
/*@ngInject*/ |
|||
export default function RuleNodeDirective($compile, $templateCache, ruleChainService, types) { |
|||
var linker = function (scope, element) { |
|||
var template = $templateCache.get(ruleNodeFieldsetTemplate); |
|||
element.html(template); |
|||
|
|||
scope.types = types; |
|||
|
|||
scope.params = { |
|||
targetRuleChainId: null |
|||
}; |
|||
|
|||
scope.$watch('ruleNode', function() { |
|||
if (scope.ruleNode && scope.ruleNode.nodeType == types.ruleNodeType.RULE_CHAIN.value) { |
|||
scope.params.targetRuleChainId = scope.ruleNode.targetRuleChainId; |
|||
watchTargetRuleChain(); |
|||
} else { |
|||
if (scope.targetRuleChainWatch) { |
|||
scope.targetRuleChainWatch(); |
|||
scope.targetRuleChainWatch = null; |
|||
} |
|||
} |
|||
}); |
|||
|
|||
function watchTargetRuleChain() { |
|||
scope.targetRuleChainWatch = scope.$watch('params.targetRuleChainId', |
|||
function(targetRuleChainId) { |
|||
if (scope.ruleNode.targetRuleChainId != targetRuleChainId) { |
|||
scope.ruleNode.targetRuleChainId = targetRuleChainId; |
|||
if (targetRuleChainId) { |
|||
ruleChainService.getRuleChain(targetRuleChainId).then( |
|||
(ruleChain) => { |
|||
scope.ruleNode.name = ruleChain.name; |
|||
} |
|||
); |
|||
} else { |
|||
scope.ruleNode.name = ""; |
|||
} |
|||
} |
|||
} |
|||
); |
|||
} |
|||
$compile(element.contents())(scope); |
|||
} |
|||
return { |
|||
restrict: "E", |
|||
link: linker, |
|||
scope: { |
|||
ruleChainId: '=', |
|||
ruleNode: '=', |
|||
isEdit: '=', |
|||
isReadOnly: '=', |
|||
theForm: '=', |
|||
onDeleteRuleNode: '&' |
|||
} |
|||
}; |
|||
} |
|||
@ -0,0 +1,45 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 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. |
|||
|
|||
--> |
|||
<div |
|||
id="{{node.id}}" |
|||
ng-attr-style="position: absolute; top: {{ node.y }}px; left: {{ node.x }}px;" |
|||
ng-dblclick="callbacks.doubleClick($event, node)"> |
|||
<div class="tb-rule-node {{node.nodeClass}}"> |
|||
<md-icon aria-label="node-type-icon" flex="15" |
|||
class="material-icons">{{node.icon}}</md-icon> |
|||
<div layout="column" flex="85" layout-align="center"> |
|||
<span class="tb-node-type">{{ node.type }}</span> |
|||
<span class="tb-node-title" ng-if="node.name">{{ node.name }}</span> |
|||
</div> |
|||
<div class="{{flowchartConstants.leftConnectorClass}}"> |
|||
<div fc-magnet |
|||
ng-repeat="connector in modelservice.nodes.getConnectorsByType(node, flowchartConstants.leftConnectorType)"> |
|||
<div fc-connector></div> |
|||
</div> |
|||
</div> |
|||
<div class="{{flowchartConstants.rightConnectorClass}}"> |
|||
<div fc-magnet |
|||
ng-repeat="connector in modelservice.nodes.getConnectorsByType(node, flowchartConstants.rightConnectorType)"> |
|||
<div fc-connector></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div ng-if="modelservice.isEditable() && !node.readonly" class="fc-nodedelete" ng-click="modelservice.nodes.delete(node)"> |
|||
× |
|||
</div> |
|||
</div> |
|||
Loading…
Reference in new issue