From 4a54a07989d9d7932a3f235075932b2a1728345a Mon Sep 17 00:00:00 2001 From: Mirco Pizzichini Date: Tue, 2 Jul 2019 18:44:19 +0200 Subject: [PATCH] Add the possibility to hide single timewindow fields --- ui/src/app/api/time.service.js | 7 +- ui/src/app/components/dashboard.tpl.html | 3 +- .../app/components/timeinterval.directive.js | 4 +- ui/src/app/components/timeinterval.tpl.html | 19 ++- .../components/timewindow-panel.controller.js | 3 +- .../app/components/timewindow-panel.tpl.html | 128 +++++++++++------- ui/src/app/components/timewindow.directive.js | 24 +++- .../components/widget/widget-config.tpl.html | 2 +- ui/src/app/dashboard/dashboard.tpl.html | 2 +- ui/src/app/locale/locale.constant-en_US.json | 5 +- ui/src/app/locale/locale.constant-es_ES.json | 3 +- ui/src/app/locale/locale.constant-fr_FR.json | 3 +- ui/src/app/locale/locale.constant-it_IT.json | 3 +- 13 files changed, 133 insertions(+), 73 deletions(-) diff --git a/ui/src/app/api/time.service.js b/ui/src/app/api/time.service.js index 6d6fe8b730..878d43eed8 100644 --- a/ui/src/app/api/time.service.js +++ b/ui/src/app/api/time.service.js @@ -234,7 +234,10 @@ function TimeService($translate, $http, $q, types) { var currentTime = (new Date).getTime(); var timewindow = { displayValue: "", - selectedTab: 0, + selectedTab: 0, + hideInterval: false, + hideAggregation: false, + hideAggInterval: false, realtime: { interval: SECOND, timewindowMs: MINUTE // 1 min by default @@ -381,4 +384,4 @@ function TimeService($translate, $http, $q, types) { } -} \ No newline at end of file +} diff --git a/ui/src/app/components/dashboard.tpl.html b/ui/src/app/components/dashboard.tpl.html index 6687058216..af7454a477 100644 --- a/ui/src/app/components/dashboard.tpl.html +++ b/ui/src/app/components/dashboard.tpl.html @@ -48,7 +48,8 @@
{{vm.widgetTitle(widget)}} - +
diff --git a/ui/src/app/components/timeinterval.directive.js b/ui/src/app/components/timeinterval.directive.js index 812ed3944f..882c58a762 100644 --- a/ui/src/app/components/timeinterval.directive.js +++ b/ui/src/app/components/timeinterval.directive.js @@ -231,7 +231,9 @@ function Timeinterval($compile, $templateCache, timeService) { required: '=ngRequired', min: '=?', max: '=?', - predefinedName: '=?' + predefinedName: '=?', + hideFlag: '=?', + isEdit: '=?' }, link: linker }; diff --git a/ui/src/app/components/timeinterval.tpl.html b/ui/src/app/components/timeinterval.tpl.html index ff378f3257..02bb61fc7c 100644 --- a/ui/src/app/components/timeinterval.tpl.html +++ b/ui/src/app/components/timeinterval.tpl.html @@ -16,7 +16,12 @@ -->
-
+
+ + + +
+
@@ -25,7 +30,7 @@ - + @@ -33,23 +38,23 @@ - +
-
+
- + {{interval.name}}
-
+
- +
diff --git a/ui/src/app/components/timewindow-panel.controller.js b/ui/src/app/components/timewindow-panel.controller.js index aa61a09200..092d2a9b4e 100644 --- a/ui/src/app/components/timewindow-panel.controller.js +++ b/ui/src/app/components/timewindow-panel.controller.js @@ -14,7 +14,7 @@ * limitations under the License. */ /*@ngInject*/ -export default function TimewindowPanelController(mdPanelRef, $scope, timeService, types, timewindow, historyOnly, aggregation, onTimewindowUpdate) { +export default function TimewindowPanelController(mdPanelRef, $scope, timeService, types, timewindow, historyOnly, aggregation, isEdit, onTimewindowUpdate) { var vm = this; @@ -33,6 +33,7 @@ export default function TimewindowPanelController(mdPanelRef, $scope, timeServic vm.maxHistoryAggInterval = maxHistoryAggInterval; vm.minDatapointsLimit = minDatapointsLimit; vm.maxDatapointsLimit = maxDatapointsLimit; + vm.isEdit = isEdit; if (vm.historyOnly) { vm.timewindow.selectedTab = 1; diff --git a/ui/src/app/components/timewindow-panel.tpl.html b/ui/src/app/components/timewindow-panel.tpl.html index 8416a1bf86..98608c994a 100644 --- a/ui/src/app/components/timewindow-panel.tpl.html +++ b/ui/src/app/components/timewindow-panel.tpl.html @@ -22,62 +22,92 @@ - - - - -
- -
- - -
- timewindow.time-period - -
- - - +
+
+ + + +
+
+ + + +
+ +
+ + +
+ timewindow.time-period + +
+ + + +
+
- - - - - {{type.name | translate}} - - - - - aggregation.limit - - - - - - - +
+
+ + + +
+
+ + + + + {{type.name | translate}} + + + +
+
+
+
+ + + +
+
+ + aggregation.limit + + + + + + +
+
+ - +
@@ -93,4 +123,4 @@
- \ No newline at end of file + diff --git a/ui/src/app/components/timewindow.directive.js b/ui/src/app/components/timewindow.directive.js index 67b23a65a5..70342abd11 100644 --- a/ui/src/app/components/timewindow.directive.js +++ b/ui/src/app/components/timewindow.directive.js @@ -42,7 +42,10 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM var linker = function (scope, element, attrs, ngModelCtrl) { /* tbTimewindow (ng-model) - * { + * { + * hideInterval: false, + * hideAggregation: false, + * hideAggInterval: false, * realtime: { * interval: 0, * timewindowMs: 0 @@ -64,6 +67,8 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM scope.historyOnly = angular.isDefined(attrs.historyOnly); + scope.isEdit = attrs.isEdit === 'true'; + scope.aggregation = scope.$eval(attrs.aggregation); scope.isToolbar = angular.isDefined(attrs.isToolbar); @@ -135,7 +140,8 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM locals: { 'timewindow': angular.copy(scope.model), 'historyOnly': scope.historyOnly, - 'aggregation': scope.aggregation, + 'aggregation': scope.aggregation, + 'isEdit': scope.isEdit, 'onTimewindowUpdate': function (timewindow) { scope.model = timewindow; scope.updateView(); @@ -176,7 +182,10 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM value.aggregation = { type: model.aggregation.type, limit: model.aggregation.limit - }; + }; + value.hideInterval = model.hideInterval; + value.hideAggregation = model.hideAggregation; + value.hideAggInterval = model.hideAggInterval; ngModelCtrl.$setViewValue(value); scope.updateDisplayValue(); } @@ -230,6 +239,9 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM } model.aggregation.limit = value.aggregation.limit || Math.floor(timeService.getMaxDatapointsLimit() / 2); } + model.hideInterval = value.hideInterval; + model.hideAggregation = value.hideAggregation; + model.hideAggInterval = value.hideAggInterval; } scope.updateDisplayValue(); }; @@ -242,7 +254,9 @@ function Timewindow($compile, $templateCache, $filter, $mdPanel, $document, $mdM require: "^ngModel", scope: { asButton: '=asButton', - disabled:'=ngDisabled' + disabled:'=ngDisabled', + isEdit: '=?' + }, link: linker }; @@ -279,4 +293,4 @@ function MillisecondsToTimeString($translate) { return timeString; } } -/* eslint-enable angular/angularelement */ \ No newline at end of file +/* eslint-enable angular/angularelement */ diff --git a/ui/src/app/components/widget/widget-config.tpl.html b/ui/src/app/components/widget/widget-config.tpl.html index ea439ce8bf..c20551dc10 100644 --- a/ui/src/app/components/widget/widget-config.tpl.html +++ b/ui/src/app/components/widget/widget-config.tpl.html @@ -34,7 +34,7 @@
widget-config.timewindow + is-edit="true" flex ng-model="timewindow">
file_download diff --git a/ui/src/app/locale/locale.constant-en_US.json b/ui/src/app/locale/locale.constant-en_US.json index 9e2d3041e3..8b75368f01 100644 --- a/ui/src/app/locale/locale.constant-en_US.json +++ b/ui/src/app/locale/locale.constant-en_US.json @@ -1392,7 +1392,8 @@ "edit": "Edit timewindow", "date-range": "Date range", "last": "Last", - "time-period": "Time period" + "time-period": "Time period", + "hide": "Hide" }, "user": { "user": "User", @@ -1694,4 +1695,4 @@ "cs_CZ": "Czech" } } -} \ No newline at end of file +} diff --git a/ui/src/app/locale/locale.constant-es_ES.json b/ui/src/app/locale/locale.constant-es_ES.json index 0d76e8b566..4a3dde92f3 100644 --- a/ui/src/app/locale/locale.constant-es_ES.json +++ b/ui/src/app/locale/locale.constant-es_ES.json @@ -1342,7 +1342,8 @@ "edit": "Editar ventana de tiempo", "date-range": "Rango de fecha", "last": "Último(s)", - "time-period": "Período de tiempo" + "time-period": "Período de tiempo", + "hide": "Ocultar" }, "user": { "user": "Usuario", diff --git a/ui/src/app/locale/locale.constant-fr_FR.json b/ui/src/app/locale/locale.constant-fr_FR.json index 036e10efa4..8f1f1a7a4e 100644 --- a/ui/src/app/locale/locale.constant-fr_FR.json +++ b/ui/src/app/locale/locale.constant-fr_FR.json @@ -1262,7 +1262,8 @@ "period": "de {{startTime}} à {{endTime}}", "realtime": "Temps réel", "seconds": "{seconds, plural, 0 {second} 1 {1 second} other {# seconds}}", - "time-period": "Période" + "time-period": "Période", + "hide": "Masquer" }, "user": { "activation-email-sent-message": "L'e-mail d'activation a été envoyé avec succès!", diff --git a/ui/src/app/locale/locale.constant-it_IT.json b/ui/src/app/locale/locale.constant-it_IT.json index b53bdbf558..ee965b715f 100644 --- a/ui/src/app/locale/locale.constant-it_IT.json +++ b/ui/src/app/locale/locale.constant-it_IT.json @@ -1347,7 +1347,8 @@ "edit": "Modifica intervallo temporale", "date-range": "Intervallo date", "last": "Ultimo", - "time-period": "Intervallo temporale" + "time-period": "Intervallo temporale", + "hide": "Nascondi" }, "user": { "user": "Utente",