tsai
/
thingsboard
mirror of https://github.com/thingsboard/thingsboard.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge pull request #1524 from vvlladd28/bugs/widget_longed_title 

fix widget title longed
pull/1807/head
Igor Kulikov 7 years ago
committed by GitHub
parent
227c22e3cb 4d050b3c93
commit
6826ca8b8b
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 72 additions and 66 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 14
      ui/src/app/components/dashboard.scss
  2. 124
      ui/src/app/components/dashboard.tpl.html

14
ui/src/app/components/dashboard.scss
View File

@ -24,12 +24,19 @@ div.tb-widget {
transition: all .2s ease-in-out; transition: all .2s ease-in-out;
.tb-widget-title { .tb-widget-header{
max-height: 60px; display: flex;
align-items: start;
justify-content: space-between;
}
.tb-widget-title {
display: block;
max-height: 75px;
padding-top: 5px; padding-top: 5px;
padding-left: 5px; padding-left: 5px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis;
tb-timewindow { tb-timewindow {
font-size: 14px; font-size: 14px;
@ -38,9 +45,6 @@ div.tb-widget {
} }
.tb-widget-actions { .tb-widget-actions {
position: absolute;
top: 8px;
right: 8px;
z-index: 19; z-index: 19;
margin: 0; margin: 0;

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

@ -44,66 +44,68 @@
ng-click="vm.widgetClicked($event, widget)" ng-click="vm.widgetClicked($event, widget)"
tb-contextmenu="vm.openWidgetContextMenu($event, widget, $mdOpenMousepointMenu)" tb-contextmenu="vm.openWidgetContextMenu($event, widget, $mdOpenMousepointMenu)"
ng-style="vm.widgetStyle(widget)"> ng-style="vm.widgetStyle(widget)">
<div class="tb-widget-title" layout="column" layout-align="center start" ng-show="vm.showWidgetTitlePanel(widget)"> <div class="tb-widget-header">
<div ng-if="vm.hasWidgetTitleTemplate(widget)" ng-include="vm.widgetTitleTemplate(widget)"></div> <div class="tb-widget-title" layout="column" layout-align="center start" ng-show="vm.showWidgetTitlePanel(widget)">
<span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{vm.widgetTitle(widget)}}</span> <div ng-if="vm.hasWidgetTitleTemplate(widget)" ng-include="vm.widgetTitleTemplate(widget)"></div>
<tb-timewindow aggregation="{{vm.hasAggregation(widget)}}" ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow> <span ng-show="vm.showWidgetTitle(widget)" ng-style="vm.widgetTitleStyle(widget)" class="md-subhead">{{vm.widgetTitle(widget)}}</span>
</div> <tb-timewindow aggregation="{{vm.hasAggregation(widget)}}" ng-if="vm.hasTimewindow(widget)" ng-model="widget.config.timewindow"></tb-timewindow>
<div class="tb-widget-actions" layout="row" layout-align="start center" ng-show="vm.showWidgetActions(widget)" tb-mousedown="$event.stopPropagation()"> </div>
<md-button ng-repeat="action in vm.customWidgetHeaderActions(widget)" <div class="tb-widget-actions" layout="row" layout-align="start center" ng-show="vm.showWidgetActions(widget)" tb-mousedown="$event.stopPropagation()">
aria-label="{{action.displayName}}" <md-button ng-repeat="action in vm.customWidgetHeaderActions(widget)"
ng-show="!vm.isEdit" aria-label="{{action.displayName}}"
ng-click="action.onAction($event)" ng-show="!vm.isEdit"
class="md-icon-button"> ng-click="action.onAction($event)"
<md-tooltip md-direction="{{vm.isWidgetExpanded ? 'bottom' : 'top'}}"> class="md-icon-button">
{{action.displayName}} <md-tooltip md-direction="{{vm.isWidgetExpanded ? 'bottom' : 'top'}}">
</md-tooltip> {{action.displayName}}
<ng-md-icon size="20" icon="{{action.icon}}"></ng-md-icon> </md-tooltip>
</md-button> <ng-md-icon size="20" icon="{{action.icon}}"></ng-md-icon>
<md-button ng-repeat="action in vm.widgetActions(widget)" </md-button>
aria-label="{{ action.name | translate }}" <md-button ng-repeat="action in vm.widgetActions(widget)"
ng-show="!vm.isEdit && action.show" aria-label="{{ action.name | translate }}"
ng-click="action.onAction($event)" ng-show="!vm.isEdit && action.show"
class="md-icon-button"> ng-click="action.onAction($event)"
<md-tooltip md-direction="{{vm.isWidgetExpanded ? 'bottom' : 'top'}}"> class="md-icon-button">
{{ action.name | translate }} <md-tooltip md-direction="{{vm.isWidgetExpanded ? 'bottom' : 'top'}}">
</md-tooltip> {{ action.name | translate }}
<ng-md-icon size="20" icon="{{action.icon}}"></ng-md-icon> </md-tooltip>
</md-button> <ng-md-icon size="20" icon="{{action.icon}}"></ng-md-icon>
<md-button id="expand-button" </md-button>
ng-show="!vm.isEdit && vm.enableWidgetFullscreen(widget)" <md-button id="expand-button"
aria-label="{{ 'fullscreen.fullscreen' | translate }}" ng-show="!vm.isEdit && vm.enableWidgetFullscreen(widget)"
class="md-icon-button"></md-button> aria-label="{{ 'fullscreen.fullscreen' | translate }}"
<md-button ng-show="vm.isEditActionEnabled && !vm.isWidgetExpanded" class="md-icon-button"></md-button>
ng-disabled="vm.loading()" <md-button ng-show="vm.isEditActionEnabled && !vm.isWidgetExpanded"
class="md-icon-button" ng-disabled="vm.loading()"
ng-click="vm.editWidget($event, widget)" class="md-icon-button"
aria-label="{{ 'widget.edit' | translate }}"> ng-click="vm.editWidget($event, widget)"
<md-tooltip md-direction="top"> aria-label="{{ 'widget.edit' | translate }}">
{{ 'widget.edit' | translate }} <md-tooltip md-direction="top">
</md-tooltip> {{ 'widget.edit' | translate }}
<ng-md-icon size="20" icon="edit"></ng-md-icon> </md-tooltip>
</md-button> <ng-md-icon size="20" icon="edit"></ng-md-icon>
<md-button ng-show="vm.isExportActionEnabled && !vm.isWidgetExpanded" </md-button>
ng-disabled="vm.loading()" <md-button ng-show="vm.isExportActionEnabled && !vm.isWidgetExpanded"
class="md-icon-button" ng-disabled="vm.loading()"
ng-click="vm.exportWidget($event, widget)" class="md-icon-button"
aria-label="{{ 'widget.export' | translate }}"> ng-click="vm.exportWidget($event, widget)"
<md-tooltip md-direction="top"> aria-label="{{ 'widget.export' | translate }}">
{{ 'widget.export' | translate }} <md-tooltip md-direction="top">
</md-tooltip> {{ 'widget.export' | translate }}
<ng-md-icon size="20" icon="file_download"></ng-md-icon> </md-tooltip>
</md-button> <ng-md-icon size="20" icon="file_download"></ng-md-icon>
<md-button ng-show="vm.isRemoveActionEnabled && !vm.isWidgetExpanded" </md-button>
ng-disabled="vm.loading()" <md-button ng-show="vm.isRemoveActionEnabled && !vm.isWidgetExpanded"
class="md-icon-button" ng-disabled="vm.loading()"
ng-click="vm.removeWidget($event, widget)" class="md-icon-button"
aria-label="{{ 'widget.remove' | translate }}"> ng-click="vm.removeWidget($event, widget)"
<md-tooltip md-direction="top"> aria-label="{{ 'widget.remove' | translate }}">
{{ 'widget.remove' | translate }} <md-tooltip md-direction="top">
</md-tooltip> {{ 'widget.remove' | translate }}
<ng-md-icon size="20" icon="close"></ng-md-icon> </md-tooltip>
</md-button> <ng-md-icon size="20" icon="close"></ng-md-icon>
</md-button>
</div>
</div> </div>
<div flex layout="column" class="tb-widget-content"> <div flex layout="column" class="tb-widget-content">
<div flex tb-widget <div flex tb-widget
@ -143,4 +145,4 @@
</md-button> </md-button>
</md-menu-item> </md-menu-item>
</md-menu-content> </md-menu-content>
</md-menu> </md-menu>

Write Preview
Loading…
Cancel
Save