From 17ed82876ae0f8cc3ed5259e8eb18d8038cbc76d Mon Sep 17 00:00:00 2001 From: deaflynx Date: Mon, 11 Jan 2021 10:54:18 +0200 Subject: [PATCH] Edges overview widget cleanup --- .../widget/lib/edges-overview-widget-copy.js | 483 ------------------ .../lib/edges-overview-widget-copy.scss | 109 ---- .../app/widget/lib/edges-overview-widget.js | 447 +--------------- .../app/widget/lib/edges-overview-widget.scss | 56 -- 4 files changed, 13 insertions(+), 1082 deletions(-) delete mode 100644 ui/src/app/widget/lib/edges-overview-widget-copy.js delete mode 100644 ui/src/app/widget/lib/edges-overview-widget-copy.scss diff --git a/ui/src/app/widget/lib/edges-overview-widget-copy.js b/ui/src/app/widget/lib/edges-overview-widget-copy.js deleted file mode 100644 index 56921b264c..0000000000 --- a/ui/src/app/widget/lib/edges-overview-widget-copy.js +++ /dev/null @@ -1,483 +0,0 @@ -// /* -// * Copyright © 2016-2020 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 './edges-overview-widget-copy.scss'; -// -// /* eslint-disable import/no-unresolved, import/default */ -// -// import edgesOverviewWidgetTemplate from './edges-overview-widget.tpl.html'; -// -// /* eslint-enable import/no-unresolved, import/default */ -// -// export default angular.module('thingsboard.widgets.edgesOverviewWidget2', []) -// .directive('tbEdgesOverviewWidget', EdgesOverviewWidget) -// .name; -// /* eslint-disable no-unused-vars, no-undef */ -// /*@ngInject*/ -// function EdgesOverviewWidget() { -// return { -// restrict: "E", -// scope: true, -// bindToController: { -// hierarchyId: '=', -// ctx: '=' -// }, -// controller: EdgesOverviewWidgetController, -// controllerAs: 'vm', -// templateUrl: edgesOverviewWidgetTemplate -// }; -// } -// -// /*@ngInject*/ -// function EdgesOverviewWidgetController($element, $scope, $q, $timeout, toast, types, entityService, userService, entityRelationService, -// assetService, deviceService, entityViewService, dashboardService, ruleChainService /*$filter, $mdMedia, $mdPanel, $document, $translate, $timeout, utils, types*/) { -// var vm = this; -// -// vm.showData = true; -// -// vm.nodeEditCallbacks = {}; -// -// vm.nodeIdCounter = 0; -// -// vm.nodesMap = {}; -// vm.entityGroupsNodesMap = {}; -// vm.pendingUpdateNodeTasks = {}; -// -// vm.query = { -// search: null -// }; -// -// vm.edgeGroupsTypes = [ -// types.entityType.asset, -// types.entityType.device, -// types.entityType.entityView, -// types.entityType.dashboard, -// types.entityType.rulechain, -// ] -// -// vm.onNodesInserted = onNodesInserted; -// vm.onNodeSelected = onNodeSelected; -// -// $scope.$watch('vm.ctx', function() { -// if (vm.ctx && vm.ctx.defaultSubscription) { -// vm.settings = vm.ctx.settings; -// vm.widgetConfig = vm.ctx.widgetConfig; -// vm.subscription = vm.ctx.defaultSubscription; -// vm.datasources = vm.subscription.datasources; -// updateDatasources(); -// } -// }); -// -// $scope.$on('edges-overview-data-updated', function(event, hierarchyId) { -// if (vm.hierarchyId == hierarchyId) { -// if (vm.subscription) { -// updateNodeData(vm.subscription.data); -// } -// } -// }); -// -// function updateDatasources() { -// vm.loadNodes = loadNodes; -// } -// -// function onNodesInserted(nodes/*, parent*/) { -// if (nodes) { -// nodes.forEach((nodeId) => { -// var task = vm.pendingUpdateNodeTasks[nodeId]; -// if (task) { -// task(); -// delete vm.pendingUpdateNodeTasks[nodeId]; -// } -// }); -// } -// } -// -// function onNodeSelected(node, event) { -// var nodeId; -// if (!node) { -// nodeId = -1; -// } else { -// nodeId = node.id; -// } -// if (nodeId !== -1) { -// var selectedNode = vm.nodesMap[nodeId]; -// if (selectedNode) { -// var descriptors = vm.ctx.actionsApi.getActionDescriptors('nodeSelected'); -// if (descriptors.length) { -// var entity = selectedNode.data.nodeCtx.entity; -// vm.ctx.actionsApi.handleWidgetAction(event, descriptors[0], entity.id, entity.name, { nodeCtx: selectedNode.data.nodeCtx }); -// } -// } -// } -// } -// -// function updateNodeData(subscriptionData) { -// var affectedNodes = []; -// if (subscriptionData) { -// for (var i=0;i { -// var node = vm.nodeEditCallbacks.getNode(nodeId); -// if (node) { -// updateNodeStyle(vm.nodesMap[nodeId]); -// } else { -// vm.pendingUpdateNodeTasks[nodeId] = () => { -// updateNodeStyle(vm.nodesMap[nodeId]); -// }; -// } -// }); -// } -// -// function updateNodeStyle(node) { -// var newText = prepareNodeText(node); -// if (!angular.equals(node.text, newText)) { -// node.text = newText; -// vm.nodeEditCallbacks.updateNode(node.id, node.text); -// } -// var newDisabled = vm.nodeDisabledFunction(node.data.nodeCtx); -// if (!angular.equals(node.state.disabled, newDisabled)) { -// node.state.disabled = newDisabled; -// if (node.state.disabled) { -// vm.nodeEditCallbacks.disableNode(node.id); -// } else { -// vm.nodeEditCallbacks.enableNode(node.id); -// } -// } -// var newHasChildren = vm.nodeHasChildrenFunction(node.data.nodeCtx); -// if (!angular.equals(node.children, newHasChildren)) { -// node.children = newHasChildren; -// vm.nodeEditCallbacks.setNodeHasChildren(node.id, node.children); -// } -// } -// -// function prepareNodeText(node) { -// var nodeIcon = prepareNodeIcon(node.data.nodeCtx); -// var nodeText = vm.nodeTextFunction(node.data.nodeCtx); -// node.data.searchText = nodeText ? nodeText.replace(/<[^>]+>/g, '').toLowerCase() : ""; -// return nodeIcon + nodeText; -// } -// -// function prepareEgeGroupText(node) { -// var nodeIcon = prepareNodeIcon(node.data.nodeCtx); -// var nodeText = "Edge rule chains"; -// node.data.searchText = nodeText ? nodeText.replace(/<[^>]+>/g, '').toLowerCase() : ""; -// return nodeIcon + nodeText; -// } -// -// function loadNodes(node, cb) { -// var datasource = vm.datasources[0]; -// if (node.id === '#' && datasource) { -// if (datasource.type === 'entity' && datasource.entity.id.entityType === types.entityType.edge) { -// var selectedEdge = datasource.entity; -// vm.ctx.widgetTitle = selectedEdge.name; -// cb(loadNodesForEdge(selectedEdge.id.id, selectedEdge)) -// } -// } else { -// cb([]); -// } -// } -// -// function loadNodesForEdge(parentNodeId, entity) { -// var nodes = []; -// var nodesMap = {}; -// vm.entityGroupsNodesMap[parentNodeId] = nodesMap; -// var user = userService.getCurrentUser(); -// var allowedGroupTypes = vm.edgeGroupsTypes; -// if (user.authority === 'CUSTOMER_USER') { -// allowedGroupTypes = vm.edgeGroupsTypes.filter(type => type !== types.entityType.rulechain) -// } -// allowedGroupTypes.forEach((groupType) => { -// var node = { -// id: ++vm.nodeIdCounter, -// icon: 'material-icons ' + iconForGroupType(groupType), -// text: textForGroupType(groupType), -// children: true, -// data: { -// groupType, -// entity, -// internalId: entity.id.id + '_' + groupType -// } -// }; -// nodes.push(node); -// nodesMap[groupType] = node.id; -// }); -// return nodes; -// } -// -// function iconForGroupType(groupType) { -// switch (groupType) { -// case vm.types.entityType.asset: -// return 'tb-asset-group'; -// case vm.types.entityType.device: -// return 'tb-device-group'; -// case vm.types.entityType.entityView: -// return 'tb-entity-view-group'; -// case vm.types.entityType.dashboard: -// return 'tb-dashboard-group'; -// case vm.types.entityType.rulechain: -// return 'tb-rule-chain-group'; -// } -// return ''; -// } -// -// function textForGroupType(groupType) { -// switch (groupType) { -// case vm.types.entityType.asset: -// return $translate.instant('asset.assets'); -// case vm.types.entityType.device: -// return $translate.instant('device.devices'); -// case vm.types.entityType.entityView: -// return $translate.instant('entity-view.entity-views'); -// case vm.types.entityType.rulechain: -// return $translate.instant('rulechain.rulechains'); -// case vm.types.entityType.dashboard: -// return $translate.instant('dashboard.dashboards'); -// } -// return ''; -// } -// -// function edgeGroupsNodeText(entityType) { -// -// } -// -// function prepareNodes(nodes) { -// nodes = nodes.filter((node) => node !== null); -// nodes.sort((node1, node2) => vm.nodesSortFunction(node1.data.nodeCtx, node2.data.nodeCtx)); -// return nodes; -// } -// -// function datasourceToNode(datasource, parentNodeCtx) { -// var deferred = $q.defer(); -// resolveEntity(datasource).then( -// (entity) => { -// if (entity != null) { -// var node = { -// id: ++vm.nodeIdCounter -// }; -// vm.nodesMap[node.id] = node; -// datasource.nodeId = node.id; -// node.icon = false; -// var nodeCtx = { -// parentNodeCtx: parentNodeCtx, -// entity: entity, -// data: {} -// }; -// nodeCtx.level = parentNodeCtx ? parentNodeCtx.level + 1 : 1; -// node.data = { -// datasource: datasource, -// nodeCtx: nodeCtx -// }; -// node.state = { -// disabled: vm.nodeDisabledFunction(node.data.nodeCtx), -// opened: vm.nodeOpenedFunction(node.data.nodeCtx) -// }; -// node.text = prepareNodeText(node); -// node.children = vm.nodeHasChildrenFunction(node.data.nodeCtx); -// deferred.resolve(node); -// } else { -// deferred.resolve(null); -// } -// } -// ); -// return deferred.promise; -// } -// -// function edgeGroupToNode(entityType, parentDatasource, parentNodeCtx) { -// var deferred = $q.defer(); -// deferred.resolve(getEdgeGroupNode(entityType, parentDatasource, parentNodeCtx)); -// return deferred.promise; -// } -// -// function getEdgeGroupNode(entityType, parentDatasource, parentNodeCtx) { -// var datasource = { -// dataKeys: parentDatasource.dataKeys, -// entityId: parentDatasource.entity.id.id + '_' + entityType, -// type: "edgeGroup", -// entityType: entityType -// }; -// -// var node = { -// id: ++vm.nodeIdCounter -// }; -// vm.nodesMap[node.id] = node; -// datasource.nodeId = node.id; -// node.icon = false; -// var nodeCtx = { -// parentNodeCtx: 3, -// data: {}, -// entity: { -// id: { -// id: parentDatasource.entity.id.id + '_' + entityType, -// entityType: 'group' -// }, -// name: "Edge Group RC" -// } -// }; -// nodeCtx.level = parentNodeCtx ? parentNodeCtx.level + 1 : 1; -// node.data = { -// datasource: datasource, -// nodeCtx: nodeCtx -// }; -// node.state = { -// disabled: vm.nodeDisabledFunction(node.data.nodeCtx), -// opened: vm.nodeOpenedFunction(node.data.nodeCtx) -// }; -// node.text = prepareEgeGroupText(node); -// node.children = vm.nodeHasChildrenFunction(node.data.nodeCtx); -// return node; -// } -// -// function entityIdToEdgeGroupNode(entityType, entityId, parentDatasource, parentNodeCtx) { -// var deferred = $q.defer(); -// var datasource = { -// dataKeys: parentDatasource.dataKeys, -// type: types.datasourceType.entity, -// entityType: entityType, -// entityId: entityId -// }; -// datasourceToNode(datasource, parentNodeCtx).then( -// (node) => { -// if (node != null) { -// var subscriptionOptions = { -// type: types.widgetType.latest.value, -// datasources: [datasource], -// callbacks: { -// onDataUpdated: (subscription) => { -// updateNodeData(subscription.data); -// } -// } -// }; -// vm.ctx.subscriptionApi.createSubscription(subscriptionOptions, true).then( -// (/*subscription*/) => { -// deferred.resolve(node); -// } -// ); -// } else { -// deferred.resolve(node); -// } -// } -// ); -// return deferred.promise; -// } -// -// function resolveEntity(datasource) { -// var deferred = $q.defer(); -// if (datasource.type === types.datasourceType.function) { -// var entity = { -// id: { -// entityType: "function" -// }, -// name: datasource.name -// } -// deferred.resolve(entity); -// } else { -// entityService.getEntity(datasource.entityType, datasource.entityId, {ignoreLoading: true}).then( -// (entity) => { -// deferred.resolve(entity); -// }, -// () => { -// deferred.resolve(null); -// } -// ); -// } -// return deferred.promise; -// } -// -// function prepareNodeIcon(nodeCtx) { -// var iconInfo = vm.nodeIconFunction(nodeCtx); -// if (iconInfo && iconInfo === 'default') { -// iconInfo = defaultNodeIconFunction(nodeCtx); -// } -// if (iconInfo && (iconInfo.iconUrl || iconInfo.materialIcon)) { -// if (iconInfo.materialIcon) { -// return materialIconHtml(iconInfo.materialIcon); -// } else { -// return iconUrlHtml(iconInfo.iconUrl); -// } -// } else { -// return ""; -// } -// } -// -// function materialIconHtml(materialIcon) { -// return ''+materialIcon+''; -// } -// -// function iconUrlHtml(iconUrl) { -// return '
 
'; -// } -// -// function defaultNodeIconFunction(nodeCtx) { -// var materialIcon = 'insert_drive_file'; -// var entity = nodeCtx.entity; -// if (entity && entity.id && entity.id.entityType) { -// switch (entity.id.entityType) { -// case 'function': -// materialIcon = 'functions'; -// break; -// case types.entityType.device: -// materialIcon = 'devices_other'; -// break; -// case types.entityType.asset: -// materialIcon = 'domain'; -// break; -// case types.entityType.tenant: -// materialIcon = 'supervisor_account'; -// break; -// case types.entityType.customer: -// materialIcon = 'supervisor_account'; -// break; -// case types.entityType.user: -// materialIcon = 'account_circle'; -// break; -// case types.entityType.dashboard: -// materialIcon = 'dashboards'; -// break; -// case types.entityType.alarm: -// materialIcon = 'notifications_active'; -// break; -// case types.entityType.entityView: -// materialIcon = 'view_quilt'; -// break; -// case types.entityType.edge: -// materialIcon = 'router'; -// break; -// case types.entityType.rulechain: -// materialIcon = 'settings_ethernet'; -// break; -// } -// } -// return { -// materialIcon: materialIcon -// }; -// } -// -// } diff --git a/ui/src/app/widget/lib/edges-overview-widget-copy.scss b/ui/src/app/widget/lib/edges-overview-widget-copy.scss deleted file mode 100644 index 59d335b2fa..0000000000 --- a/ui/src/app/widget/lib/edges-overview-widget-copy.scss +++ /dev/null @@ -1,109 +0,0 @@ -///** -// * Copyright © 2016-2020 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-has-timewindow { -// .tb-edges-overview { -// md-toolbar { -// min-height: 60px; -// max-height: 60px; -// } -// } -//} -// -//.tb-edges-overview { -// md-toolbar { -// min-height: 39px; -// max-height: 39px; -// } -// -// .tb-entities-nav-tree-panel { -// overflow-x: auto; -// overflow-y: auto; -// -// .tb-nav-tree-container { -// &.jstree-proton { -// .jstree-anchor { -// div.node-icon { -// display: inline-block; -// width: 22px; -// height: 22px; -// margin-right: 2px; -// margin-bottom: 2px; -// background-color: transparent; -// background-repeat: no-repeat; -// background-attachment: scroll; -// background-position: center center; -// background-size: 18px 18px; -// } -// -// md-icon.node-icon { -// width: 22px; -// min-width: 22px; -// height: 22px; -// min-height: 22px; -// margin-right: 2px; -// margin-bottom: 2px; -// color: inherit; -// -// &.material-icons { /* stylelint-disable-line selector-max-class */ -// font-size: 18px; -// line-height: 22px; -// text-align: center; -// } -// } -// -// &.jstree-hovered:not(.jstree-clicked), -// &.jstree-disabled { -// div.node-icon { /* stylelint-disable-line selector-max-class */ -// opacity: .5; -// } -// } -// } -// } -// } -// } -//} -// -//@media (max-width: 768px) { -// .tb-edges-overview { -// .tb-entities-nav-tree-panel { -// .tb-nav-tree-container { -// &.jstree-proton-responsive { -// .jstree-anchor { -// div.node-icon { -// width: 40px; -// height: 40px; -// margin: 0; -// background-size: 24px 24px; -// } -// -// md-icon.node-icon { -// width: 40px; -// min-width: 40px; -// height: 40px; -// min-height: 40px; -// margin: 0; -// -// &.material-icons { /* stylelint-disable-line selector-max-class */ -// font-size: 24px; -// line-height: 40px; -// } -// } -// } -// } -// } -// } -// } -//} diff --git a/ui/src/app/widget/lib/edges-overview-widget.js b/ui/src/app/widget/lib/edges-overview-widget.js index aa549a8b10..095500e5b5 100644 --- a/ui/src/app/widget/lib/edges-overview-widget.js +++ b/ui/src/app/widget/lib/edges-overview-widget.js @@ -40,33 +40,17 @@ function EdgesOverviewWidget() { } /*@ngInject*/ -function EdgesOverviewWidgetController($element, $scope, $q, $timeout, $translate, toast, types, utils, entityService, edgeService, customerService, userService /*$filter, $mdMedia, $mdPanel, $document, $timeout, utils, types*/) { +function EdgesOverviewWidgetController($scope, $translate, types, utils, entityService, edgeService, customerService, userService) { var vm = this; vm.showData = true; - vm.nodeEditCallbacks = {}; - vm.nodeIdCounter = 0; - vm.nodesMap = {}; vm.entityNodesMap = {}; vm.entityGroupsNodesMap = {}; vm.pendingUpdateNodeTasks = {}; - vm.query = { - search: null - }; - - vm.searchAction = { - name: 'action.search', - show: true, - onAction: function() { - vm.enterFilterMode(); - }, - icon: 'search' - }; - vm.customerTitle = null; vm.edgeIsDatasource = true; @@ -78,226 +62,26 @@ function EdgesOverviewWidgetController($element, $scope, $q, $timeout, $translat types.entityType.rulechain, ] - vm.onNodesInserted = onNodesInserted; - vm.onNodeSelected = onNodeSelected; - vm.enterFilterMode = enterFilterMode; - vm.exitFilterMode = exitFilterMode; - vm.searchCallback = searchCallback; - $scope.$watch('vm.ctx', function() { if (vm.ctx && vm.ctx.defaultSubscription) { vm.settings = vm.ctx.settings; vm.widgetConfig = vm.ctx.widgetConfig; vm.subscription = vm.ctx.defaultSubscription; vm.datasources = vm.subscription.datasources; - initializeConfig(); updateDatasources(); } }); - $scope.$watch("vm.query.search", function(newVal, prevVal) { - if (!angular.equals(newVal, prevVal) && vm.query.search != null) { - updateSearchNodes(); - } - }); - - $scope.$on('edges-overview-data-updated', function(event, hierarchyId) { - if (vm.hierarchyId == hierarchyId) { - if (vm.subscription) { - updateNodeData(vm.subscription.data); - } - } - }); - - function initializeConfig() { - - vm.ctx.widgetActions = [ vm.searchAction ]; - - var testNodeCtx = { - entity: { - id: { - entityType: 'DEVICE', - id: '123' - }, - name: 'TEST DEV1' - }, - data: {}, - level: 2 - }; - var parentNodeCtx = angular.copy(testNodeCtx); - parentNodeCtx.level = 1; - testNodeCtx.parentNodeCtx = parentNodeCtx; - - var nodeRelationQueryFunction = loadNodeCtxFunction(vm.settings.nodeRelationQueryFunction, 'nodeCtx', testNodeCtx); - var nodeIconFunction = loadNodeCtxFunction(vm.settings.nodeIconFunction, 'nodeCtx', testNodeCtx); - var nodeTextFunction = loadNodeCtxFunction(vm.settings.nodeTextFunction, 'nodeCtx', testNodeCtx); - var nodeDisabledFunction = loadNodeCtxFunction(vm.settings.nodeDisabledFunction, 'nodeCtx', testNodeCtx); - var nodeOpenedFunction = loadNodeCtxFunction(vm.settings.nodeOpenedFunction, 'nodeCtx', testNodeCtx); - var nodeHasChildrenFunction = loadNodeCtxFunction(vm.settings.nodeHasChildrenFunction, 'nodeCtx', testNodeCtx); - - var testNodeCtx2 = angular.copy(testNodeCtx); - testNodeCtx2.entity.name = 'TEST DEV2'; - - var nodesSortFunction = loadNodeCtxFunction(vm.settings.nodesSortFunction, 'nodeCtx1,nodeCtx2', testNodeCtx, testNodeCtx2); - - vm.nodeRelationQueryFunction = nodeRelationQueryFunction || defaultNodeRelationQueryFunction; - vm.nodeIconFunction = nodeIconFunction || defaultNodeIconFunction; - vm.nodeTextFunction = nodeTextFunction || ((nodeCtx) => nodeCtx.entity.name); - vm.nodeDisabledFunction = nodeDisabledFunction || (() => false); - vm.nodeOpenedFunction = nodeOpenedFunction || defaultNodeOpenedFunction; - vm.nodeHasChildrenFunction = nodeHasChildrenFunction || (() => true); - vm.nodesSortFunction = nodesSortFunction || defaultSortFunction; - } - - function loadNodeCtxFunction(functionBody, argNames, ...args) { - var nodeCtxFunction = null; - if (angular.isDefined(functionBody) && functionBody.length) { - try { - nodeCtxFunction = new Function(argNames, functionBody); - var res = nodeCtxFunction.apply(null, args); - if (angular.isUndefined(res)) { - nodeCtxFunction = null; - } - } catch (e) { - nodeCtxFunction = null; - } - } - return nodeCtxFunction; - } - - function enterFilterMode () { - vm.query.search = ''; - vm.ctx.hideTitlePanel = true; - $timeout(()=>{ - angular.element(vm.ctx.$container).find('.searchInput').focus(); - }) - } - - function exitFilterMode () { - vm.query.search = null; - updateSearchNodes(); - vm.ctx.hideTitlePanel = false; - } - - function searchCallback (searchText, node) { - var theNode = vm.nodesMap[node.id]; - if (theNode && theNode.data.searchText) { - return theNode.data.searchText.includes(searchText.toLowerCase()); - } - return false; - } - function updateDatasources() { vm.loadNodes = loadNodes; } - function updateSearchNodes() { - if (vm.query.search != null) { - vm.nodeEditCallbacks.search(vm.query.search); - } else { - vm.nodeEditCallbacks.clearSearch(); - } - } - - function onNodesInserted(nodes/*, parent*/) { - if (nodes) { - nodes.forEach((nodeId) => { - var task = vm.pendingUpdateNodeTasks[nodeId]; - if (task) { - task(); - delete vm.pendingUpdateNodeTasks[nodeId]; - } - }); - } - } - - function onNodeSelected(node, event) { - var nodeId; - if (!node) { - nodeId = -1; - } else { - nodeId = node.id; - } - if (nodeId !== -1) { - var selectedNode = vm.nodesMap[nodeId]; - if (selectedNode) { - var descriptors = vm.ctx.actionsApi.getActionDescriptors('nodeSelected'); - if (descriptors.length) { - var entity = selectedNode.data.nodeCtx.entity; - vm.ctx.actionsApi.handleWidgetAction(event, descriptors[0], entity.id, entity.name, { nodeCtx: selectedNode.data.nodeCtx }); - } - } - } - } - - function updateNodeData(subscriptionData) { - var affectedNodes = []; - if (subscriptionData) { - for (var i=0;i { - var node = vm.nodeEditCallbacks.getNode(nodeId); - if (node) { - updateNodeStyle(vm.nodesMap[nodeId]); - } else { - vm.pendingUpdateNodeTasks[nodeId] = () => { - updateNodeStyle(vm.nodesMap[nodeId]); - }; - } - }); - } - - function updateNodeStyle(node) { - var newText = prepareNodeText(node); - if (!angular.equals(node.text, newText)) { - node.text = newText; - vm.nodeEditCallbacks.updateNode(node.id, node.text); - } - var newDisabled = vm.nodeDisabledFunction(node.data.nodeCtx); - if (!angular.equals(node.state.disabled, newDisabled)) { - node.state.disabled = newDisabled; - if (node.state.disabled) { - vm.nodeEditCallbacks.disableNode(node.id); - } else { - vm.nodeEditCallbacks.enableNode(node.id); - } - } - var newHasChildren = vm.nodeHasChildrenFunction(node.data.nodeCtx); - if (!angular.equals(node.children, newHasChildren)) { - node.children = newHasChildren; - vm.nodeEditCallbacks.setNodeHasChildren(node.id, node.children); - } - } - - function prepareNodeText(node) { - var nodeIcon = prepareNodeIcon(node.data.nodeCtx); - var nodeText = vm.nodeTextFunction(node.data.nodeCtx); - node.data.searchText = nodeText ? nodeText.replace(/<[^>]+>/g, '').toLowerCase() : ""; - return nodeIcon + nodeText; - } - function loadNodes(node, cb) { var datasource = vm.datasources[0]; if (node.id === '#' && datasource) { if (datasource.type === types.datasourceType.entity && datasource.entity && datasource.entity.id.entityType === types.entityType.edge) { var selectedEdge = datasource.entity; - getCustomerTitle(selectedEdge.id.id); + vm.customerTitle = getCustomerTitle(selectedEdge.id.id); vm.ctx.widgetTitle = selectedEdge.name; cb(loadNodesForEdge(selectedEdge.id.id, selectedEdge)); } else if (datasource.type === types.datasourceType.function) { @@ -366,16 +150,16 @@ function EdgesOverviewWidgetController($element, $scope, $q, $timeout, $translat allowedGroupTypes = edgeGroupsTypes.filter(type => type !== types.entityType.rulechain); } allowedGroupTypes.forEach( - (entityType) => { + (groupType) => { var node = { id: ++vm.nodeIdCounter, - icon: 'material-icons ' + iconForGroupType(entityType), - text: textForGroupType(entityType), + icon: 'material-icons ' + iconForGroupType(groupType), + text: textForGroupType(groupType), children: true, data: { - entityType, + groupType, entity, - internalId: entity ? entity.id.id + '_' + entityType : utils.guid() + internalId: entity ? entity.id.id + '_' + groupType : utils.guid() } }; nodes.push(node); @@ -419,222 +203,17 @@ function EdgesOverviewWidgetController($element, $scope, $q, $timeout, $translat function getCustomerTitle(edgeId) { edgeService.getEdge(edgeId, true).then( function success(edge) { - customerService.getShortCustomerInfo(edge.customerId.id).then( + customerService.getCustomer(edge.customerId.id, { ignoreErrors: true }).then( function success(customer) { - vm.customerTitle = $translate.instant('edge.assigned-to-customer-widget', {customerTitle: customer.title}); + vm.customerTitle = $translate.instant('edge.assigned-to-customer-widget', { customerTitle: customer.title }); + }, + function fail() { } ); - } - ) - } - - function showError(errorText) { - var toastParent = angular.element('.tb-entities-hierarchy', $element); - toast.showError(errorText, toastParent, 'bottom left'); - } - - function prepareNodes(nodes) { - nodes = nodes.filter((node) => node !== null); - nodes.sort((node1, node2) => vm.nodesSortFunction(node1.data.nodeCtx, node2.data.nodeCtx)); - return nodes; - } - - function datasourceToNode(datasource, parentNodeCtx) { - var deferred = $q.defer(); - resolveEntity(datasource).then( - (entity) => { - if (entity != null) { - var node = { - id: ++vm.nodeIdCounter - }; - vm.nodesMap[node.id] = node; - datasource.nodeId = node.id; - node.icon = false; - var nodeCtx = { - parentNodeCtx: parentNodeCtx, - entity: entity, - data: {} - }; - nodeCtx.level = parentNodeCtx ? parentNodeCtx.level + 1 : 1; - node.data = { - datasource: datasource, - nodeCtx: nodeCtx - }; - node.state = { - disabled: vm.nodeDisabledFunction(node.data.nodeCtx), - opened: vm.nodeOpenedFunction(node.data.nodeCtx) - }; - node.text = prepareNodeText(node); - node.children = vm.nodeHasChildrenFunction(node.data.nodeCtx); - deferred.resolve(node); - } else { - deferred.resolve(null); - } - } - ); - return deferred.promise; - } - - function entityIdToNode(entityType, entityId, parentDatasource, parentNodeCtx) { - var deferred = $q.defer(); - var datasource = { - dataKeys: parentDatasource.dataKeys, - type: types.datasourceType.entity, - entityType: entityType, - entityId: entityId - }; - datasourceToNode(datasource, parentNodeCtx).then( - (node) => { - if (node != null) { - var subscriptionOptions = { - type: types.widgetType.latest.value, - datasources: [datasource], - callbacks: { - onDataUpdated: (subscription) => { - updateNodeData(subscription.data); - } - } - }; - vm.ctx.subscriptionApi.createSubscription(subscriptionOptions, true).then( - (/*subscription*/) => { - deferred.resolve(node); - } - ); - } else { - deferred.resolve(node); - } - } - ); - return deferred.promise; - } - - function resolveEntity(datasource) { - var deferred = $q.defer(); - if (datasource.type === types.datasourceType.function) { - var entity = { - id: { - entityType: "function" - }, - name: datasource.name - } - deferred.resolve(entity); - } else { - entityService.getEntity(datasource.entityType, datasource.entityId, {ignoreLoading: true}).then( - (entity) => { - deferred.resolve(entity); - }, - () => { - deferred.resolve(null); - } - ); - } - return deferred.promise; - } - - - function prepareNodeRelationQuery(nodeCtx) { - var relationQuery = vm.nodeRelationQueryFunction(nodeCtx); - if (relationQuery && relationQuery === 'default') { - relationQuery = defaultNodeRelationQueryFunction(nodeCtx); - } - return relationQuery; - } - - function defaultNodeRelationQueryFunction(nodeCtx) { - var entity = nodeCtx.entity; - var query = { - parameters: { - rootId: entity.id.id, - rootType: entity.id.entityType, - direction: types.entitySearchDirection.from, - relationTypeGroup: "COMMON", - maxLevel: 1 }, - filters: [ - { - relationType: "Contains", - entityTypes: [] - } - ] - }; - return query; - } - - function prepareNodeIcon(nodeCtx) { - var iconInfo = vm.nodeIconFunction(nodeCtx); - if (iconInfo && iconInfo === 'default') { - iconInfo = defaultNodeIconFunction(nodeCtx); - } - if (iconInfo && (iconInfo.iconUrl || iconInfo.materialIcon)) { - if (iconInfo.materialIcon) { - return materialIconHtml(iconInfo.materialIcon); - } else { - return iconUrlHtml(iconInfo.iconUrl); - } - } else { - return ""; - } - } - - function materialIconHtml(materialIcon) { - return ''+materialIcon+''; - } - - function iconUrlHtml(iconUrl) { - return '
 
'; - } - - function defaultNodeIconFunction(nodeCtx) { - var materialIcon = 'insert_drive_file'; - var entity = nodeCtx.entity; - if (entity && entity.id && entity.id.entityType) { - switch (entity.id.entityType) { - case 'function': - materialIcon = 'functions'; - break; - case types.entityType.device: - materialIcon = 'devices_other'; - break; - case types.entityType.asset: - materialIcon = 'domain'; - break; - case types.entityType.tenant: - materialIcon = 'supervisor_account'; - break; - case types.entityType.customer: - materialIcon = 'supervisor_account'; - break; - case types.entityType.user: - materialIcon = 'account_circle'; - break; - case types.entityType.dashboard: - materialIcon = 'dashboards'; - break; - case types.entityType.alarm: - materialIcon = 'notifications_active'; - break; - case types.entityType.entityView: - materialIcon = 'view_quilt'; - break; - case types.entityType.edge: - materialIcon = 'router'; - break; + function fail() { } - } - return { - materialIcon: materialIcon - }; - } - - function defaultNodeOpenedFunction(nodeCtx) { - return nodeCtx.level <= 4; + ) } - function defaultSortFunction(nodeCtx1, nodeCtx2) { - var result = nodeCtx1.entity.id.entityType.localeCompare(nodeCtx2.entity.id.entityType); - if (result === 0) { - result = nodeCtx1.entity.name.localeCompare(nodeCtx2.entity.name); - } - return result; - } } diff --git a/ui/src/app/widget/lib/edges-overview-widget.scss b/ui/src/app/widget/lib/edges-overview-widget.scss index f5fcc90f8f..6b7ce3f26e 100644 --- a/ui/src/app/widget/lib/edges-overview-widget.scss +++ b/ui/src/app/widget/lib/edges-overview-widget.scss @@ -13,21 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -.tb-has-timewindow { - .tb-edges-overview { - md-toolbar { - min-height: 60px; - max-height: 60px; - } - } -} - .tb-edges-overview { - md-toolbar { - min-height: 39px; - max-height: 39px; - } - .mat-subheader { padding: 15px; font-size: 14px; @@ -38,48 +24,6 @@ .tb-entities-nav-tree-panel { overflow-x: auto; overflow-y: auto; - - .tb-nav-tree-container { - &.jstree-proton { - .jstree-anchor { - div.node-icon { - display: inline-block; - width: 22px; - height: 22px; - margin-right: 2px; - margin-bottom: 2px; - background-color: transparent; - background-repeat: no-repeat; - background-attachment: scroll; - background-position: center center; - background-size: 18px 18px; - } - - md-icon.node-icon { - width: 22px; - min-width: 22px; - height: 22px; - min-height: 22px; - margin-right: 2px; - margin-bottom: 2px; - color: inherit; - - &.material-icons { /* stylelint-disable-line selector-max-class */ - font-size: 18px; - line-height: 22px; - text-align: center; - } - } - - &.jstree-hovered:not(.jstree-clicked), - &.jstree-disabled { - div.node-icon { /* stylelint-disable-line selector-max-class */ - opacity: .5; - } - } - } - } - } } }