dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dashboard lauout improvements.

Browse Source
This commit is contained in:
Igor Kulikov 2017-06-20 12:25:51 +03:00
parent 4e8c05f670
commit 25af06f25d
2 changed files with 37 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
ui/src/app/components/dashboard.directive.js
View File

@ -181,6 +181,8 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
vm.widgetBackgroundColor = widgetBackgroundColor; vm.widgetBackgroundColor = widgetBackgroundColor;
vm.widgetPadding = widgetPadding; vm.widgetPadding = widgetPadding;
vm.showWidgetTitle = showWidgetTitle; vm.showWidgetTitle = showWidgetTitle;
vm.hasWidgetTitleTemplate = hasWidgetTitleTemplate;
vm.widgetTitleTemplate = widgetTitleTemplate;
vm.showWidgetTitlePanel = showWidgetTitlePanel; vm.showWidgetTitlePanel = showWidgetTitlePanel;
vm.showWidgetActions = showWidgetActions; vm.showWidgetActions = showWidgetActions;
vm.widgetTitleStyle = widgetTitleStyle; vm.widgetTitleStyle = widgetTitleStyle;
@ -239,6 +241,7 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
} }
$scope.$watchCollection('vm.widgets', function () { $scope.$watchCollection('vm.widgets', function () {
sortWidgets();
var ids = []; var ids = [];
for (var i=0;i<vm.widgets.length;i++) { for (var i=0;i<vm.widgets.length;i++) {
var widget = vm.widgets[i]; var widget = vm.widgets[i];
@ -422,8 +425,13 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
function widgetOrder(widget) { function widgetOrder(widget) {
var order; var order;
if (vm.widgetLayouts && vm.widgetLayouts[widget.id]) { if (vm.widgetLayouts && vm.widgetLayouts[widget.id]) {
order = vm.widgetLayouts[widget.id].mobileOrder; if (angular.isDefined(vm.widgetLayouts[widget.id].mobileOrder)
} else if (widget.config.mobileOrder) { && vm.widgetLayouts[widget.id].mobileOrder >= 0) {
order = vm.widgetLayouts[widget.id].mobileOrder;
} else {
order = vm.widgetLayouts[widget.id].row;
}
} else if (angular.isDefined(widget.config.mobileOrder) && widget.config.mobileOrder >= 0) {
order = widget.config.mobileOrder; order = widget.config.mobileOrder;
} else { } else {
order = widget.row; order = widget.row;
@ -432,6 +440,12 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
} }
$scope.$on('widgetPositionChanged', function () { $scope.$on('widgetPositionChanged', function () {
sortWidgets();
});
loadStDiff();
function sortWidgets() {
vm.widgets.sort(function (widget1, widget2) { vm.widgets.sort(function (widget1, widget2) {
var row1 = widgetOrder(widget1); var row1 = widgetOrder(widget1);
var row2 = widgetOrder(widget2); var row2 = widgetOrder(widget2);
@ -441,9 +455,7 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
} }
return res; return res;
}); });
}); }
loadStDiff();
function reload() { function reload() {
loadStDiff(); loadStDiff();
@ -809,12 +821,30 @@ function DashboardController($scope, $rootScope, $element, $timeout, $mdMedia, $
} }
} }
function hasWidgetTitleTemplate(widget) {
var ctx = widgetContext(widget);
if (ctx && ctx.widgetTitleTemplate) {
return true;
} else {
return false;
}
}
function widgetTitleTemplate(widget) {
var ctx = widgetContext(widget);
if (ctx && ctx.widgetTitleTemplate) {
return ctx.widgetTitleTemplate;
} else {
return '';
}
}
function showWidgetTitlePanel(widget) { function showWidgetTitlePanel(widget) {
var ctx = widgetContext(widget); var ctx = widgetContext(widget);
if (ctx && ctx.hideTitlePanel) { if (ctx && ctx.hideTitlePanel) {
return false; return false;
} else { } else {
return showWidgetTitle(widget) || hasTimewindow(widget); return hasWidgetTitleTemplate(widget) || showWidgetTitle(widget) || hasTimewindow(widget);
} }
} }

1
ui/src/app/components/dashboard.tpl.html
View File

@ -47,6 +47,7 @@
backgroundColor: vm.widgetBackgroundColor(widget), backgroundColor: vm.widgetBackgroundColor(widget),
padding: vm.widgetPadding(widget)}"> padding: vm.widgetPadding(widget)}">
<div class="tb-widget-title" layout="column" layout-align="center start" ng-show="vm.showWidgetTitlePanel(widget)"> <div class="tb-widget-title" layout="column" layout-align="center start" ng-show="vm.showWidgetTitlePanel(widget)">
<div ng-if="vm.hasWidgetTitleTemplate(widget)" ng-include="vm.widgetTitleTemplate(widget)"></div>
<span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{vm.widgetTitle(widget)}}</span> <span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{vm.widgetTitle(widget)}}</span>
<tb-timewindow aggregation="{{vm.hasAggregation(widget)}}" ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow> <tb-timewindow aggregation="{{vm.hasAggregation(widget)}}" ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow>
</div> </div>