Igor Kulikov
9 years ago
41 changed files with 937 additions and 48 deletions
@ -0,0 +1,134 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 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. |
||||
|
*/ |
||||
|
import 'brace/ext/language_tools'; |
||||
|
import 'brace/mode/json'; |
||||
|
import 'brace/theme/github'; |
||||
|
import beautify from 'js-beautify'; |
||||
|
|
||||
|
import './alarm-details-dialog.scss'; |
||||
|
|
||||
|
const js_beautify = beautify.js; |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
export default function AlarmDetailsDialogController($mdDialog, $filter, $translate, types, alarmService, alarmId, showingCallback) { |
||||
|
|
||||
|
var vm = this; |
||||
|
|
||||
|
vm.alarmId = alarmId; |
||||
|
vm.types = types; |
||||
|
vm.alarm = null; |
||||
|
|
||||
|
vm.alarmUpdated = false; |
||||
|
|
||||
|
showingCallback.onShowing = function(scope, element) { |
||||
|
updateEditorSize(element); |
||||
|
} |
||||
|
|
||||
|
vm.alarmDetailsOptions = { |
||||
|
useWrapMode: false, |
||||
|
mode: 'json', |
||||
|
showGutter: false, |
||||
|
showPrintMargin: false, |
||||
|
theme: 'github', |
||||
|
advanced: { |
||||
|
enableSnippets: false, |
||||
|
enableBasicAutocompletion: false, |
||||
|
enableLiveAutocompletion: false |
||||
|
}, |
||||
|
onLoad: function (_ace) { |
||||
|
vm.editor = _ace; |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
vm.close = close; |
||||
|
vm.acknowledge = acknowledge; |
||||
|
vm.clear = clear; |
||||
|
|
||||
|
loadAlarm(); |
||||
|
|
||||
|
function updateEditorSize(element) { |
||||
|
var newWidth = 600; |
||||
|
var newHeight = 200; |
||||
|
angular.element('#tb-alarm-details', element).height(newHeight.toString() + "px") |
||||
|
.width(newWidth.toString() + "px"); |
||||
|
vm.editor.resize(); |
||||
|
} |
||||
|
|
||||
|
function loadAlarm() { |
||||
|
alarmService.getAlarmInfo(vm.alarmId).then( |
||||
|
function success(alarm) { |
||||
|
vm.alarm = alarm; |
||||
|
loadAlarmFields(); |
||||
|
}, |
||||
|
function fail() { |
||||
|
vm.alarm = null; |
||||
|
} |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
function loadAlarmFields() { |
||||
|
vm.createdTime = $filter('date')(vm.alarm.createdTime, 'yyyy-MM-dd HH:mm:ss'); |
||||
|
vm.startTime = null; |
||||
|
if (vm.alarm.startTs) { |
||||
|
vm.startTime = $filter('date')(vm.alarm.startTs, 'yyyy-MM-dd HH:mm:ss'); |
||||
|
} |
||||
|
vm.endTime = null; |
||||
|
if (vm.alarm.endTs) { |
||||
|
vm.endTime = $filter('date')(vm.alarm.endTs, 'yyyy-MM-dd HH:mm:ss'); |
||||
|
} |
||||
|
vm.ackTime = null; |
||||
|
if (vm.alarm.ackTs) { |
||||
|
vm.ackTime = $filter('date')(vm.alarm.ackTs, 'yyyy-MM-dd HH:mm:ss') |
||||
|
} |
||||
|
vm.clearTime = null; |
||||
|
if (vm.alarm.clearTs) { |
||||
|
vm.clearTime = $filter('date')(vm.alarm.clearTs, 'yyyy-MM-dd HH:mm:ss'); |
||||
|
} |
||||
|
|
||||
|
vm.alarmSeverity = $translate.instant(types.alarmSeverity[vm.alarm.severity].name); |
||||
|
|
||||
|
vm.alarmStatus = $translate.instant('alarm.display-status.' + vm.alarm.status); |
||||
|
|
||||
|
vm.alarmDetails = null; |
||||
|
if (vm.alarm.details) { |
||||
|
vm.alarmDetails = angular.toJson(vm.alarm.details); |
||||
|
vm.alarmDetails = js_beautify(vm.alarmDetails, {indent_size: 4}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function acknowledge () { |
||||
|
alarmService.ackAlarm(vm.alarmId).then( |
||||
|
function success() { |
||||
|
vm.alarmUpdated = true; |
||||
|
loadAlarm(); |
||||
|
} |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
function clear () { |
||||
|
alarmService.clearAlarm(vm.alarmId).then( |
||||
|
function success() { |
||||
|
vm.alarmUpdated = true; |
||||
|
loadAlarm(); |
||||
|
} |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
function close () { |
||||
|
$mdDialog.hide(vm.alarmUpdated ? vm.alarm : null); |
||||
|
} |
||||
|
|
||||
|
} |
||||
@ -0,0 +1,27 @@ |
|||||
|
/** |
||||
|
* Copyright © 2016-2017 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-alarm-details-panel { |
||||
|
margin-left: 15px; |
||||
|
border: 1px solid #C0C0C0; |
||||
|
height: 100%; |
||||
|
#tb-alarm-details { |
||||
|
min-width: 600px; |
||||
|
min-height: 200px; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,107 @@ |
|||||
|
<!-- |
||||
|
|
||||
|
Copyright © 2016-2017 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. |
||||
|
|
||||
|
--> |
||||
|
<md-dialog aria-label="{{ 'alarm.alarm-details' | translate }}"> |
||||
|
<md-toolbar> |
||||
|
<div class="md-toolbar-tools"> |
||||
|
<h2 translate>alarm.alarm-details</h2> |
||||
|
<span flex></span> |
||||
|
<md-button class="md-icon-button" ng-click="vm.close()"> |
||||
|
<ng-md-icon icon="close" aria-label="{{ 'dialog.close' | translate }}"></ng-md-icon> |
||||
|
</md-button> |
||||
|
</div> |
||||
|
</md-toolbar> |
||||
|
<md-dialog-content> |
||||
|
<div class="md-dialog-content" layout="column"> |
||||
|
<div layout="row"> |
||||
|
<md-input-container class="md-block"> |
||||
|
<label translate>alarm.created-time</label> |
||||
|
<input ng-model="vm.createdTime" readonly> |
||||
|
</md-input-container> |
||||
|
<md-input-container flex class="md-block"> |
||||
|
<label translate>alarm.originator</label> |
||||
|
<input ng-model="vm.alarm.originatorName" readonly> |
||||
|
</md-input-container> |
||||
|
</div> |
||||
|
<div layout="row" ng-if="vm.startTime || vm.endTime"> |
||||
|
<md-input-container ng-if="vm.startTime" flex class="md-block"> |
||||
|
<label translate>alarm.start-time</label> |
||||
|
<input ng-model="vm.startTime" readonly> |
||||
|
</md-input-container> |
||||
|
<md-input-container ng-if="vm.endTime" flex class="md-block"> |
||||
|
<label translate>alarm.end-time</label> |
||||
|
<input ng-model="vm.endTime" readonly> |
||||
|
</md-input-container> |
||||
|
<span flex ng-if="!vm.startTime || !vm.endTime"></span> |
||||
|
</div> |
||||
|
<div layout="row" ng-if="vm.ackTime || vm.clearTime"> |
||||
|
<md-input-container ng-if="vm.ackTime" flex class="md-block"> |
||||
|
<label translate>alarm.ack-time</label> |
||||
|
<input ng-model="vm.ackTime" readonly> |
||||
|
</md-input-container> |
||||
|
<md-input-container ng-if="vm.clearTime" flex class="md-block"> |
||||
|
<label translate>alarm.clear-time</label> |
||||
|
<input ng-model="vm.clearTime" readonly> |
||||
|
</md-input-container> |
||||
|
<span flex ng-if="!vm.ackTime || !vm.clearTime"></span> |
||||
|
</div> |
||||
|
<div layout="row"> |
||||
|
<md-input-container flex class="md-block"> |
||||
|
<label translate>alarm.type</label> |
||||
|
<input ng-model="vm.alarm.type" readonly> |
||||
|
</md-input-container> |
||||
|
<md-input-container flex class="md-block"> |
||||
|
<label translate>alarm.severity</label> |
||||
|
<input class="tb-severity" ng-class="vm.types.alarmSeverity[vm.alarm.severity].class" |
||||
|
ng-model="vm.alarmSeverity" readonly> |
||||
|
</md-input-container> |
||||
|
<md-input-container flex class="md-block"> |
||||
|
<label translate>alarm.status</label> |
||||
|
<input ng-model="vm.alarmStatus" readonly> |
||||
|
</md-input-container> |
||||
|
</div> |
||||
|
<div class="md-caption" style="padding-left: 3px; padding-bottom: 10px; color: rgba(0,0,0,0.57);" translate>alarm.details</div> |
||||
|
<div flex class="tb-alarm-details-panel" layout="column"> |
||||
|
<div flex id="tb-alarm-details" readonly |
||||
|
ui-ace="vm.alarmDetailsOptions" |
||||
|
ng-model="vm.alarmDetails"> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</md-dialog-content> |
||||
|
<md-dialog-actions layout="row"> |
||||
|
<md-button ng-if="vm.alarm.status==vm.types.alarmStatus.activeUnack || |
||||
|
vm.alarm.status==vm.types.alarmStatus.clearedUnack" |
||||
|
class="md-raised md-primary" |
||||
|
ng-disabled="loading" |
||||
|
ng-click="vm.acknowledge()" |
||||
|
style="margin-right:20px;">{{ 'alarm.acknowledge' | |
||||
|
translate }} |
||||
|
</md-button> |
||||
|
<md-button ng-if="vm.alarm.status==vm.types.alarmStatus.activeAck || |
||||
|
vm.alarm.status==vm.types.alarmStatus.activeUnack" |
||||
|
class="md-raised md-primary" |
||||
|
ng-disabled="loading" |
||||
|
ng-click="vm.clear()">{{ 'alarm.clear' | |
||||
|
translate }} |
||||
|
</md-button> |
||||
|
<span flex></span> |
||||
|
<md-button ng-disabled="loading" ng-click="vm.close()" style="margin-right:20px;">{{ 'action.close' | |
||||
|
translate }} |
||||
|
</md-button> |
||||
|
</md-dialog-actions> |
||||
|
</md-dialog> |
||||
@ -0,0 +1,39 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 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. |
||||
|
*/ |
||||
|
/* eslint-disable import/no-unresolved, import/default */ |
||||
|
|
||||
|
import alarmHeaderTemplate from './alarm-header.tpl.html'; |
||||
|
|
||||
|
/* eslint-enable import/no-unresolved, import/default */ |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
export default function AlarmHeaderDirective($compile, $templateCache) { |
||||
|
|
||||
|
var linker = function (scope, element) { |
||||
|
|
||||
|
var template = $templateCache.get(alarmHeaderTemplate); |
||||
|
element.html(template); |
||||
|
$compile(element.contents())(scope); |
||||
|
|
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
restrict: "A", |
||||
|
replace: false, |
||||
|
link: linker, |
||||
|
scope: false |
||||
|
}; |
||||
|
} |
||||
@ -0,0 +1,67 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 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. |
||||
|
*/ |
||||
|
/* eslint-disable import/no-unresolved, import/default */ |
||||
|
|
||||
|
import alarmDetailsDialogTemplate from './alarm-details-dialog.tpl.html'; |
||||
|
|
||||
|
import alarmRowTemplate from './alarm-row.tpl.html'; |
||||
|
|
||||
|
/* eslint-enable import/no-unresolved, import/default */ |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
export default function AlarmRowDirective($compile, $templateCache, types, $mdDialog, $document) { |
||||
|
|
||||
|
var linker = function (scope, element, attrs) { |
||||
|
|
||||
|
var template = $templateCache.get(alarmRowTemplate); |
||||
|
element.html(template); |
||||
|
|
||||
|
scope.alarm = attrs.alarm; |
||||
|
scope.types = types; |
||||
|
|
||||
|
scope.showAlarmDetails = function($event) { |
||||
|
var onShowingCallback = { |
||||
|
onShowing: function(){} |
||||
|
} |
||||
|
$mdDialog.show({ |
||||
|
controller: 'AlarmDetailsDialogController', |
||||
|
controllerAs: 'vm', |
||||
|
templateUrl: alarmDetailsDialogTemplate, |
||||
|
locals: {alarmId: scope.alarm.id.id, showingCallback: onShowingCallback}, |
||||
|
parent: angular.element($document[0].body), |
||||
|
targetEvent: $event, |
||||
|
fullscreen: true, |
||||
|
skipHide: true, |
||||
|
onShowing: function(scope, element) { |
||||
|
onShowingCallback.onShowing(scope, element); |
||||
|
} |
||||
|
}).then(function (alarm) { |
||||
|
if (alarm) { |
||||
|
scope.alarm = alarm; |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
$compile(element.contents())(scope); |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
restrict: "A", |
||||
|
replace: false, |
||||
|
link: linker, |
||||
|
scope: false |
||||
|
}; |
||||
|
} |
||||
@ -0,0 +1,211 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 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. |
||||
|
*/ |
||||
|
import './alarm.scss'; |
||||
|
|
||||
|
/* eslint-disable import/no-unresolved, import/default */ |
||||
|
|
||||
|
import alarmTableTemplate from './alarm-table.tpl.html'; |
||||
|
|
||||
|
/* eslint-enable import/no-unresolved, import/default */ |
||||
|
|
||||
|
/*@ngInject*/ |
||||
|
export default function AlarmTableDirective($compile, $templateCache, $rootScope, types, alarmService) { |
||||
|
|
||||
|
var linker = function (scope, element) { |
||||
|
|
||||
|
var template = $templateCache.get(alarmTableTemplate); |
||||
|
|
||||
|
element.html(template); |
||||
|
|
||||
|
scope.types = types; |
||||
|
|
||||
|
scope.alarmSearchStatus = types.alarmSearchStatus.any; |
||||
|
|
||||
|
var pageSize = 20; |
||||
|
var startTime = 0; |
||||
|
var endTime = 0; |
||||
|
|
||||
|
scope.timewindow = { |
||||
|
history: { |
||||
|
timewindowMs: 24 * 60 * 60 * 1000 // 1 day
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
scope.topIndex = 0; |
||||
|
|
||||
|
scope.theAlarms = { |
||||
|
getItemAtIndex: function (index) { |
||||
|
if (index > scope.alarms.data.length) { |
||||
|
scope.theAlarms.fetchMoreItems_(index); |
||||
|
return null; |
||||
|
} |
||||
|
var item = scope.alarms.data[index]; |
||||
|
if (item) { |
||||
|
item.indexNumber = index + 1; |
||||
|
} |
||||
|
return item; |
||||
|
}, |
||||
|
|
||||
|
getLength: function () { |
||||
|
if (scope.alarms.hasNext) { |
||||
|
return scope.alarms.data.length + scope.alarms.nextPageLink.limit; |
||||
|
} else { |
||||
|
return scope.alarms.data.length; |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
fetchMoreItems_: function () { |
||||
|
if (scope.alarms.hasNext && !scope.alarms.pending) { |
||||
|
if (scope.entityType && scope.entityId && scope.alarmSearchStatus) { |
||||
|
var promise = alarmService.getAlarms(scope.entityType, scope.entityId, |
||||
|
scope.alarms.nextPageLink, scope.alarmSearchStatus, null, true, false); |
||||
|
if (promise) { |
||||
|
scope.alarms.pending = true; |
||||
|
promise.then( |
||||
|
function success(alarms) { |
||||
|
scope.alarms.data = scope.alarms.data.concat(alarms.data); |
||||
|
scope.alarms.nextPageLink = alarms.nextPageLink; |
||||
|
scope.alarms.hasNext = alarms.hasNext; |
||||
|
if (scope.alarms.hasNext) { |
||||
|
scope.alarms.nextPageLink.limit = pageSize; |
||||
|
} |
||||
|
scope.alarms.pending = false; |
||||
|
}, |
||||
|
function fail() { |
||||
|
scope.alarms.hasNext = false; |
||||
|
scope.alarms.pending = false; |
||||
|
}); |
||||
|
} else { |
||||
|
scope.alarms.hasNext = false; |
||||
|
} |
||||
|
} else { |
||||
|
scope.alarms.hasNext = false; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
scope.$watch("entityId", function(newVal, prevVal) { |
||||
|
if (newVal && !angular.equals(newVal, prevVal)) { |
||||
|
resetFilter(); |
||||
|
reload(); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
|
||||
|
function destroyWatchers() { |
||||
|
if (scope.alarmSearchStatusWatchHandle) { |
||||
|
scope.alarmSearchStatusWatchHandle(); |
||||
|
scope.alarmSearchStatusWatchHandle = null; |
||||
|
} |
||||
|
if (scope.timewindowWatchHandle) { |
||||
|
scope.timewindowWatchHandle(); |
||||
|
scope.timewindowWatchHandle = null; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function initWatchers() { |
||||
|
scope.alarmSearchStatusWatchHandle = scope.$watch("alarmSearchStatus", function(newVal, prevVal) { |
||||
|
if (newVal && !angular.equals(newVal, prevVal)) { |
||||
|
reload(); |
||||
|
} |
||||
|
}); |
||||
|
scope.timewindowWatchHandle = scope.$watch("timewindow", function(newVal, prevVal) { |
||||
|
if (newVal && !angular.equals(newVal, prevVal)) { |
||||
|
reload(); |
||||
|
} |
||||
|
}, true); |
||||
|
} |
||||
|
|
||||
|
function resetFilter() { |
||||
|
destroyWatchers(); |
||||
|
scope.timewindow = { |
||||
|
history: { |
||||
|
timewindowMs: 24 * 60 * 60 * 1000 // 1 day
|
||||
|
} |
||||
|
}; |
||||
|
scope.alarmSearchStatus = types.alarmSearchStatus.any; |
||||
|
initWatchers(); |
||||
|
} |
||||
|
|
||||
|
function updateTimeWindowRange () { |
||||
|
if (scope.timewindow.history.timewindowMs) { |
||||
|
var currentTime = (new Date).getTime(); |
||||
|
startTime = currentTime - scope.timewindow.history.timewindowMs; |
||||
|
endTime = currentTime; |
||||
|
} else { |
||||
|
startTime = scope.timewindow.history.fixedTimewindow.startTimeMs; |
||||
|
endTime = scope.timewindow.history.fixedTimewindow.endTimeMs; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function reload () { |
||||
|
scope.topIndex = 0; |
||||
|
scope.selected = []; |
||||
|
updateTimeWindowRange(); |
||||
|
scope.alarms = { |
||||
|
data: [], |
||||
|
nextPageLink: { |
||||
|
limit: pageSize, |
||||
|
startTime: startTime, |
||||
|
endTime: endTime |
||||
|
}, |
||||
|
hasNext: true, |
||||
|
pending: false |
||||
|
}; |
||||
|
scope.theAlarms.getItemAtIndex(pageSize); |
||||
|
} |
||||
|
|
||||
|
scope.noData = function() { |
||||
|
return scope.alarms.data.length == 0 && !scope.alarms.hasNext; |
||||
|
} |
||||
|
|
||||
|
scope.hasData = function() { |
||||
|
return scope.alarms.data.length > 0; |
||||
|
} |
||||
|
|
||||
|
scope.loading = function() { |
||||
|
return $rootScope.loading; |
||||
|
} |
||||
|
|
||||
|
scope.hasScroll = function() { |
||||
|
var repeatContainer = scope.repeatContainer[0]; |
||||
|
if (repeatContainer) { |
||||
|
var scrollElement = repeatContainer.children[0]; |
||||
|
if (scrollElement) { |
||||
|
return scrollElement.scrollHeight > scrollElement.clientHeight; |
||||
|
} |
||||
|
} |
||||
|
return false; |
||||
|
} |
||||
|
|
||||
|
reload(); |
||||
|
|
||||
|
initWatchers(); |
||||
|
|
||||
|
$compile(element.contents())(scope); |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
restrict: "E", |
||||
|
link: linker, |
||||
|
scope: { |
||||
|
entityType: '=', |
||||
|
entityId: '=' |
||||
|
} |
||||
|
}; |
||||
|
} |
||||
@ -0,0 +1,49 @@ |
|||||
|
<!-- |
||||
|
|
||||
|
Copyright © 2016-2017 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. |
||||
|
|
||||
|
--> |
||||
|
<md-content flex class="md-padding tb-absolute-fill" layout="column"> |
||||
|
<section layout="row"> |
||||
|
<md-input-container class="md-block" style="width: 200px;"> |
||||
|
<label translate>alarm.alarm-status</label> |
||||
|
<md-select ng-model="alarmSearchStatus" ng-disabled="loading()"> |
||||
|
<md-option ng-repeat="searchStatus in types.alarmSearchStatus" ng-value="searchStatus"> |
||||
|
{{ ('alarm.search-status.' + searchStatus) | translate }} |
||||
|
</md-option> |
||||
|
</md-select> |
||||
|
</md-input-container> |
||||
|
<tb-timewindow flex ng-model="timewindow" history-only as-button="true"></tb-timewindow> |
||||
|
</section> |
||||
|
<div flex layout="column" class="tb-alarm-container md-whiteframe-z1"> |
||||
|
<md-list flex layout="column" class="tb-alarm-table"> |
||||
|
<md-list class="tb-row tb-header" layout="row" tb-alarm-header> |
||||
|
</md-list> |
||||
|
<md-progress-linear style="max-height: 0px;" md-mode="indeterminate" ng-disabled="!loading()" |
||||
|
ng-show="loading()"></md-progress-linear> |
||||
|
<md-divider></md-divider> |
||||
|
<span translate layout-align="center center" |
||||
|
style="margin-top: 25px;" |
||||
|
class="tb-prompt" ng-show="noData()">alarm.no-alarms-prompt</span> |
||||
|
<md-virtual-repeat-container ng-show="hasData()" flex md-top-index="topIndex" tb-scope-element="repeatContainer"> |
||||
|
<md-list-item md-virtual-repeat="alarm in theAlarms" md-on-demand flex ng-style="hasScroll() ? {'margin-right':'-15px'} : {}"> |
||||
|
<md-list class="tb-row" flex layout="row" tb-alarm-row alarm="{{alarm}}"> |
||||
|
</md-list> |
||||
|
<md-divider flex></md-divider> |
||||
|
</md-list-item> |
||||
|
</md-virtual-repeat-container> |
||||
|
</md-list> |
||||
|
</div> |
||||
|
</md-content> |
||||
@ -0,0 +1,78 @@ |
|||||
|
/** |
||||
|
* Copyright © 2016-2017 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-alarm-container { |
||||
|
overflow-x: auto; |
||||
|
} |
||||
|
|
||||
|
md-list.tb-alarm-table { |
||||
|
padding: 0px; |
||||
|
min-width: 700px; |
||||
|
|
||||
|
md-list-item { |
||||
|
padding: 0px; |
||||
|
} |
||||
|
|
||||
|
.tb-row { |
||||
|
height: 48px; |
||||
|
padding: 0px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
.tb-row:hover { |
||||
|
background-color: #EEEEEE; |
||||
|
} |
||||
|
|
||||
|
.tb-header:hover { |
||||
|
background: none; |
||||
|
} |
||||
|
|
||||
|
.tb-header { |
||||
|
.tb-cell { |
||||
|
color: rgba(0,0,0,.54); |
||||
|
font-size: 12px; |
||||
|
font-weight: 700; |
||||
|
white-space: nowrap; |
||||
|
background: none; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.tb-cell { |
||||
|
padding: 0 24px; |
||||
|
margin: auto 0; |
||||
|
color: rgba(0,0,0,.87); |
||||
|
font-size: 13px; |
||||
|
vertical-align: middle; |
||||
|
text-align: left; |
||||
|
overflow: hidden; |
||||
|
.md-button { |
||||
|
padding: 0; |
||||
|
margin: 0; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.tb-cell.tb-number { |
||||
|
text-align: right; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
#tb-alarm-content { |
||||
|
min-width: 400px; |
||||
|
min-height: 50px; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
@ -0,0 +1,27 @@ |
|||||
|
/* |
||||
|
* Copyright © 2016-2017 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. |
||||
|
*/ |
||||
|
|
||||
|
import AlarmDetailsDialogController from './alarm-details-dialog.controller'; |
||||
|
import AlarmHeaderDirective from './alarm-header.directive'; |
||||
|
import AlarmRowDirective from './alarm-row.directive'; |
||||
|
import AlarmTableDirective from './alarm-table.directive'; |
||||
|
|
||||
|
export default angular.module('thingsboard.alarm', []) |
||||
|
.controller('AlarmDetailsDialogController', AlarmDetailsDialogController) |
||||
|
.directive('tbAlarmHeader', AlarmHeaderDirective) |
||||
|
.directive('tbAlarmRow', AlarmRowDirective) |
||||
|
.directive('tbAlarmTable', AlarmTableDirective) |
||||
|
.name; |
||||
Loading…
Reference in new issue