TB-70: Improve dashboard configuration. Add new alias type 'Single entity'.

Igor Kulikov
1 parent 71eda9ed
Showing 11 changed files with 66 additions and 19 deletions
ui/src/app/api/entity.service.js
ui/src/app/common/dashboard-utils.service.js
ui/src/app/common/types.constant.js
ui/src/app/dashboard/dashboard-settings.controller.js
ui/src/app/dashboard/dashboard-toolbar.directive.js
ui/src/app/dashboard/dashboard.controller.js
ui/src/app/dashboard/dashboard.tpl.html
ui/src/app/entity/entity-filter-view.directive.js
ui/src/app/entity/entity-filter.directive.js
ui/src/app/entity/entity-filter.tpl.html
ui/src/app/locale/locale.constant.js
--- a/ui/src/app/api/entity.service.js
View file @d236f62
+++ b/ui/src/app/api/entity.service.js
View file @d236f62
@@ -425,6 +425,17 @@ function EntityService($http, $q, $filter, $translate, $log, userService, device
         }
         var stateEntityId = getStateEntityId(filter, stateParams);
         switch (filter.type) {
+            case types.aliasFilterType.singleEntity.value:
+                getEntity(filter.singleEntity.entityType, filter.singleEntity.id).then(
+                    function success(entity) {
+                        result.entities = entitiesToEntitiesInfo([entity]);
+                        deferred.resolve(result);
+                    },
+                    function fail() {
+                        deferred.reject();
+                    }
+                );
+                break;
             case types.aliasFilterType.entityList.value:
                 getEntities(filter.entityType, filter.entityList).then(
                     function success(entities) {
@@ -600,6 +611,8 @@ function EntityService($http, $q, $filter, $translate, $log, userService, device
         var filter = entityAlias.filter;
         if (filterAliasFilterTypeByEntityTypes(filter.type, entityTypes)) {
             switch (filter.type) {
+                case types.aliasFilterType.singleEntity.value:
+                    return entityTypes.indexOf(filter.singleEntity.entityType) > -1 ? true : false;
                 case types.aliasFilterType.entityList.value:
                     return entityTypes.indexOf(filter.entityType) > -1 ? true : false;
                 case types.aliasFilterType.entityName.value:
@@ -642,6 +655,8 @@ function EntityService($http, $q, $filter, $translate, $log, userService, device
     function filterAliasFilterTypeByEntityType(aliasFilterType, entityType) {
         switch (aliasFilterType) {
+            case types.aliasFilterType.singleEntity.value:
+                return true;
             case types.aliasFilterType.entityList.value:
                 return true;
             case types.aliasFilterType.entityName.value:
--- a/ui/src/app/common/dashboard-utils.service.js
View file @d236f62
+++ b/ui/src/app/common/dashboard-utils.service.js
View file @d236f62
@@ -203,7 +203,7 @@ function DashboardUtils(types, utils, timeService) {
         }
         if (angular.isUndefined(dashboard.configuration.states)) {
             dashboard.configuration.states = {
-                'default': createDefaultState('Default', true)
+                'default': createDefaultState(dashboard.title, true)
             };
             var mainLayout = dashboard.configuration.states['default'].layouts['main'];
@@ -272,16 +272,16 @@ function DashboardUtils(types, utils, timeService) {
         }
         if (angular.isUndefined(dashboard.configuration.settings)) {
             dashboard.configuration.settings = {};
-            dashboard.configuration.settings.stateControllerId = 'default';
-            dashboard.configuration.settings.showTitle = true;
+            dashboard.configuration.settings.stateControllerId = 'entity';
+            dashboard.configuration.settings.showTitle = false;
             dashboard.configuration.settings.showDashboardsSelect = true;
             dashboard.configuration.settings.showEntitiesSelect = true;
             dashboard.configuration.settings.showDashboardTimewindow = true;
             dashboard.configuration.settings.showDashboardExport = true;
-            dashboard.configuration.settings.toolbarAlwaysOpen = false;
+            dashboard.configuration.settings.toolbarAlwaysOpen = true;
         } else {
             if (angular.isUndefined(dashboard.configuration.settings.stateControllerId)) {
-                dashboard.configuration.settings.stateControllerId = 'default';
+                dashboard.configuration.settings.stateControllerId = 'entity';
             }
         }
         if (angular.isDefined(dashboard.configuration.gridSettings)) {
@@ -344,9 +344,8 @@ function DashboardUtils(types, utils, timeService) {
     function createSingleEntityFilter(entityType, entityId) {
         return {
-            type: types.aliasFilterType.entityList.value,
-            entityList: [entityId],
-            entityType: entityType,
+            type: types.aliasFilterType.singleEntity.value,
+            singleEntity: { entityType: entityType, id: entityId },
             resolveMultiple: false
         };
     }
--- a/ui/src/app/common/types.constant.js
View file @d236f62
+++ b/ui/src/app/common/types.constant.js
View file @d236f62
@@ -157,6 +157,10 @@ export default angular.module('thingsboard.types', [])
                 }
             },
             aliasFilterType: {
+                singleEntity: {
+                    value: 'singleEntity',
+                    name: 'alias.filter-type-single-entity'
+                },
                 entityList: {
                     value: 'entityList',
                     name: 'alias.filter-type-entity-list'
--- a/ui/src/app/dashboard/dashboard-settings.controller.js
View file @d236f62
+++ b/ui/src/app/dashboard/dashboard-settings.controller.js
View file @d236f62
@@ -33,11 +33,11 @@ export default function DashboardSettingsController($scope, $mdDialog, statesCon
     if (vm.settings) {
         if (angular.isUndefined(vm.settings.stateControllerId)) {
-            vm.settings.stateControllerId = 'default';
+            vm.settings.stateControllerId = 'entity';
         }
         if (angular.isUndefined(vm.settings.showTitle)) {
-            vm.settings.showTitle = true;
+            vm.settings.showTitle = false;
         }
         if (angular.isUndefined(vm.settings.titleColor)) {
@@ -61,7 +61,7 @@ export default function DashboardSettingsController($scope, $mdDialog, statesCon
         }
         if (angular.isUndefined(vm.settings.toolbarAlwaysOpen)) {
-            vm.settings.toolbarAlwaysOpen = false;
+            vm.settings.toolbarAlwaysOpen = true;
         }
     }
--- a/ui/src/app/dashboard/dashboard-toolbar.directive.js
View file @d236f62
+++ b/ui/src/app/dashboard/dashboard-toolbar.directive.js
View file @d236f62
@@ -51,10 +51,17 @@ function DashboardToolbarController($scope, $element, $timeout, mdFabToolbarAnim
     vm.mdFabToolbarElement = angular.element($element[0].querySelector('md-fab-toolbar'));
-    $timeout(function() {
-        vm.mdFabBackgroundElement = angular.element(vm.mdFabToolbarElement[0].querySelector('.md-fab-toolbar-background'));
-        vm.mdFabTriggerElement = angular.element(vm.mdFabToolbarElement[0].querySelector('md-fab-trigger button'));
-    });
+    function initElements() {
+        $timeout(function() {
+            vm.mdFabBackgroundElement = angular.element(vm.mdFabToolbarElement[0].querySelector('.md-fab-toolbar-background'));
+            vm.mdFabTriggerElement = angular.element(vm.mdFabToolbarElement[0].querySelector('md-fab-trigger button'));
+            if (!vm.mdFabBackgroundElement || !vm.mdFabBackgroundElement[0]) {
+                initElements();
+            } else {
+                triggerFabResize();
+            }
+        });
+    }
     addResizeListener(vm.mdFabToolbarElement[0], triggerFabResize); // eslint-disable-line no-undef
@@ -62,7 +69,12 @@ function DashboardToolbarController($scope, $element, $timeout, mdFabToolbarAnim
         removeResizeListener(vm.mdFabToolbarElement[0], triggerFabResize); // eslint-disable-line no-undef
     });
+    initElements();
+
     function triggerFabResize() {
+        if (!vm.mdFabBackgroundElement || !vm.mdFabBackgroundElement[0]) {
+            return;
+        }
         var ctrl = vm.mdFabToolbarElement.controller('mdFabToolbar');
         if (ctrl.isOpen) {
             if (!vm.mdFabBackgroundElement[0].offsetWidth) {
--- a/ui/src/app/dashboard/dashboard.controller.js
View file @d236f62
+++ b/ui/src/app/dashboard/dashboard.controller.js
View file @d236f62
@@ -757,7 +757,7 @@ export default function DashboardController(types, utils, dashboardUtils, widget
             angular.isDefined(vm.dashboard.configuration.settings.toolbarAlwaysOpen)) {
             return vm.dashboard.configuration.settings.toolbarAlwaysOpen;
         } else {
-            return false;
+            return true;
         }
     }
@@ -766,7 +766,7 @@ export default function DashboardController(types, utils, dashboardUtils, widget
             angular.isDefined(vm.dashboard.configuration.settings.showTitle)) {
             return vm.dashboard.configuration.settings.showTitle;
         } else {
-            return true;
+            return false;
         }
     }
--- a/ui/src/app/dashboard/dashboard.tpl.html
View file @d236f62
+++ b/ui/src/app/dashboard/dashboard.tpl.html
View file @d236f62
@@ -16,7 +16,7 @@
 -->
 <md-content flex tb-expand-fullscreen="vm.widgetEditMode || vm.iframeMode || forceFullscreen" expand-button-id="dashboard-expand-button"
-            hide-expand-button="vm.widgetEditMode || vm.iframeMode || forceFullscreen" expand-tooltip-direction="bottom">
+            hide-expand-button="vm.widgetEditMode || vm.iframeMode || forceFullscreen" expand-tooltip-direction="bottom" ng-if="vm.dashboard">
     <section class="tb-dashboard-toolbar" ng-show="vm.showDashboardToolbar()"
              ng-class="{ 'tb-dashboard-toolbar-opened': vm.toolbarOpened, 'tb-dashboard-toolbar-closed': !vm.toolbarOpened }">
         <tb-dashboard-toolbar ng-show="!vm.widgetEditMode" force-fullscreen="forceFullscreen"
--- a/ui/src/app/entity/entity-filter-view.directive.js
View file @d236f62
+++ b/ui/src/app/entity/entity-filter-view.directive.js
View file @d236f62
@@ -43,6 +43,10 @@ export default function EntityFilterViewDirective($compile, $templateCache, $q, 
                 var entityType;
                 var prefix;
                 switch (scope.filter.type) {
+                    case types.aliasFilterType.singleEntity.value:
+                        entityType = scope.filter.singleEntity.entityType;
+                        scope.filterDisplayValue = $translate.instant(types.entityTypeTranslations[entityType].list, {count: 1}, 'messageformat');
+                        break;
                     case types.aliasFilterType.entityList.value:
                         entityType = scope.filter.entityType;
                         var count = scope.filter.entityList.length;
--- a/ui/src/app/entity/entity-filter.directive.js
View file @d236f62
+++ b/ui/src/app/entity/entity-filter.directive.js
View file @d236f62
@@ -43,8 +43,12 @@ export default function EntityFilterDirective($compile, $templateCache, $q, $doc
         function updateFilter() {
             var filter = {};
             filter.type = scope.filter.type;
-            filter.resolveMultiple = scope.filter.resolveMultiple;
+            filter.resolveMultiple = true;
             switch (filter.type) {
+                case types.aliasFilterType.singleEntity.value:
+                    filter.singleEntity = null;
+                    filter.resolveMultiple = false;
+                    break;
                 case types.aliasFilterType.entityList.value:
                     filter.entityType = null;
                     filter.entityList = [];
@@ -56,6 +60,7 @@ export default function EntityFilterDirective($compile, $templateCache, $q, $doc
                 case types.aliasFilterType.stateEntity.value:
                     filter.stateEntityParamName = null;
                     filter.defaultStateEntity = null;
+                    filter.resolveMultiple = false;
                     break;
                 case types.aliasFilterType.assetType.value:
                     filter.assetType = null;
--- a/ui/src/app/entity/entity-filter.tpl.html
View file @d236f62
+++ b/ui/src/app/entity/entity-filter.tpl.html
View file @d236f62
@@ -28,6 +28,13 @@
             <div ng-message="required" translate>alias.filter-type-required</div>
         </div>
     </md-input-container>
+    <section layout="column" ng-if="filter.type == types.aliasFilterType.singleEntity.value" id="singleEntityFilter">
+        <tb-entity-select flex
+                          the-form="theForm"
+                          tb-required="true"
+                          ng-model="filter.singleEntity">
+        </tb-entity-select>
+    </section>
     <section layout="column" ng-if="filter.type == types.aliasFilterType.entityList.value" id="entityListFilter">
         <tb-entity-type-select
                 ng-model="filter.entityType"
--- a/ui/src/app/locale/locale.constant.js
View file @d236f62
+++ b/ui/src/app/locale/locale.constant.js
View file @d236f62
@@ -163,6 +163,7 @@ export default angular.module('thingsboard.locale', [])
                     "name": "Alias name",
                     "name-required": "Alias name is required",
                     "duplicate-alias": "Alias with same name is already exists.",
+                    "filter-type-single-entity": "Single entity",
                     "filter-type-entity-list": "Entity list",
                     "filter-type-entity-name": "Entity name",
                     "filter-type-state-entity": "Entity from dashboard state",