- |
|
-
-
- more_horiz
-
- {{ 'alarm.details' | translate }}
-
-
- |
-
{{actionDescriptor.icon}}
diff --git a/ui/src/app/widget/lib/display-columns-panel.scss b/ui/src/app/widget/lib/display-columns-panel.scss
new file mode 100644
index 0000000000..2e518cba96
--- /dev/null
+++ b/ui/src/app/widget/lib/display-columns-panel.scss
@@ -0,0 +1,31 @@
+/**
+ * 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-display-columns-panel {
+ min-width: 300px;
+ overflow: hidden;
+ background: #fff;
+ border-radius: 4px;
+ box-shadow:
+ 0 7px 8px -4px rgba(0, 0, 0, .2),
+ 0 13px 19px 2px rgba(0, 0, 0, .14),
+ 0 5px 24px 4px rgba(0, 0, 0, .12);
+
+ md-content {
+ overflow: hidden;
+ background-color: #fff;
+ }
+}
diff --git a/ui/src/app/widget/lib/display-columns-panel.tpl.html b/ui/src/app/widget/lib/display-columns-panel.tpl.html
new file mode 100644
index 0000000000..42e2471603
--- /dev/null
+++ b/ui/src/app/widget/lib/display-columns-panel.tpl.html
@@ -0,0 +1,24 @@
+
+
+
+
+ {{ column.title }}
+
+
diff --git a/ui/src/app/widget/lib/entities-table-widget.js b/ui/src/app/widget/lib/entities-table-widget.js
index d0b629d290..620f313749 100644
--- a/ui/src/app/widget/lib/entities-table-widget.js
+++ b/ui/src/app/widget/lib/entities-table-widget.js
@@ -14,11 +14,13 @@
* limitations under the License.
*/
import './entities-table-widget.scss';
+import './display-columns-panel.scss';
/* eslint-disable import/no-unresolved, import/default */
import entitiesTableWidgetTemplate from './entities-table-widget.tpl.html';
//import entityDetailsDialogTemplate from './entitiy-details-dialog.tpl.html';
+import displayColumnsPanelTemplate from './display-columns-panel.tpl.html';
/* eslint-enable import/no-unresolved, import/default */
@@ -45,7 +47,7 @@ function EntitiesTableWidget() {
}
/*@ngInject*/
-function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $translate, $timeout, utils, types) {
+function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $mdPanel, $document, $translate, $timeout, utils, types) {
var vm = this;
vm.stylesInfo = {};
@@ -98,6 +100,8 @@ function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $tra
vm.cellStyle = cellStyle;
vm.cellContent = cellContent;
+ vm.editColumnsToDisplay = editColumnsToDisplay;
+
$scope.$watch('vm.ctx', function() {
if (vm.ctx && vm.ctx.defaultSubscription) {
vm.settings = vm.ctx.settings;
@@ -414,12 +418,37 @@ function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $tra
}
}
+ function editColumnsToDisplay($event) {
+ var element = angular.element($event.target);
+ var position = $mdPanel.newPanelPosition()
+ .relativeTo(element)
+ .addPanelPosition($mdPanel.xPosition.ALIGN_END, $mdPanel.yPosition.BELOW);
+ var config = {
+ attachTo: angular.element($document[0].body),
+ controller: DisplayColumnsPanelController,
+ controllerAs: 'vm',
+ templateUrl: displayColumnsPanelTemplate,
+ panelClass: 'tb-display-columns-panel',
+ position: position,
+ fullscreen: false,
+ locals: {
+ 'columns': vm.columns
+ },
+ openFrom: $event,
+ clickOutsideToClose: true,
+ escapeToClose: true,
+ focusOnOpen: false
+ };
+ $mdPanel.open(config);
+ }
+
function updateDatasources() {
vm.stylesInfo = {};
vm.contentsInfo = {};
vm.columnWidth = {};
vm.dataKeys = [];
+ vm.columns = [];
vm.allEntities = [];
var datasource;
@@ -429,6 +458,42 @@ function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $tra
vm.ctx.widgetTitle = utils.createLabelFromDatasource(datasource, vm.entitiesTitle);
+ if (vm.displayEntityName) {
+ vm.columns.push(
+ {
+ name: 'entityName',
+ label: 'entityName',
+ title: vm.entityNameColumnTitle,
+ display: true
+ }
+ );
+ vm.contentsInfo['entityName'] = {
+ useCellContentFunction: false
+ };
+ vm.stylesInfo['entityName'] = {
+ useCellStyleFunction: false
+ };
+ vm.columnWidth['entityName'] = '0px';
+ }
+
+ if (vm.displayEntityType) {
+ vm.columns.push(
+ {
+ name: 'entityType',
+ label: 'entityType',
+ title: $translate.instant('entity.entity-type'),
+ display: true
+ }
+ );
+ vm.contentsInfo['entityType'] = {
+ useCellContentFunction: false
+ };
+ vm.stylesInfo['entityType'] = {
+ useCellStyleFunction: false
+ };
+ vm.columnWidth['entityType'] = '0px';
+ }
+
for (var d = 0; d < datasource.dataKeys.length; d++ ) {
dataKey = angular.copy(datasource.dataKeys[d]);
if (dataKey.type == types.dataKeyType.function) {
@@ -482,6 +547,9 @@ function EntitiesTableWidgetController($element, $scope, $filter, $mdMedia, $tra
var columnWidth = angular.isDefined(keySettings.columnWidth) ? keySettings.columnWidth : '0px';
vm.columnWidth[dataKey.label] = columnWidth;
+
+ dataKey.display = true;
+ vm.columns.push(dataKey);
}
for (var i=0;i
- | {{vm.entityNameColumnTitle}} |
- entity.entity-type |
- {{ key.title }} |
- |
+ {{ column.title }} |
+
+
+ view_column
+
+
+ {{'entity.columns-to-display' | translate}}
+
+
+ |
- | {{entity.entityName}} |
- {{entity.entityType}} |
-
+ |
|
-
| |