Add directive for downtime
This commit is contained in:
Vincent Fournier
parent
81df96c208
commit
c00ee9410d
@ -361,11 +361,16 @@ angular.module('bansho.live', [])
|
||||
};
|
||||
|
||||
var downtime = function (host_name, service_description, attrs) {
|
||||
var data = {};
|
||||
attrs.host_name = host_name;
|
||||
if (service_description !== undefined) {
|
||||
attrs.service_description = service_description;
|
||||
}
|
||||
|
||||
angular.forEach(attrs, function (key, value) {
|
||||
console.log(key + "; " + value);
|
||||
});
|
||||
return $http({
|
||||
url: '/surveil/v2/actions/downtime/',
|
||||
method: 'POST',
|
||||
data: attrs
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
|
||||
@ -1,141 +1,139 @@
|
||||
<menu class="filters" ng-controller="TableActionbarCtrl">
|
||||
<ul class="filters__list clearfix">
|
||||
<li class="filters__item filters__item--problems">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersProblems"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersProblems">
|
||||
<span>{{ actionbarFilters.activeFilter.text }}</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersProblems">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem" ng-repeat="actionbarFilter in actionbarFilters.possibleFilters" ng-click="activateFilter($index)">
|
||||
<a class="filters__link state--current" ng-if="actionbarFilter === actionbarFilters.activeFilter">{{ actionbarFilter.text }}</a>
|
||||
<a class="filters__link" ng-if="actionbarFilter !== actionbarFilters.activeFilter">{{ actionbarFilter.text }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item filters__item--recheck">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Recheck</span>
|
||||
<i class="ico-arrows-cw"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--acknowledge"
|
||||
data-mover="true">
|
||||
<button class="filters__button" type="button" ng-click="ackFormIsOpen = !ackFormIsOpen">
|
||||
<span class="visuallyhidden">Acknowledge</span>
|
||||
<i class="ico-thumbs-up"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--downtime"
|
||||
data-mover="true">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Downtime</span>
|
||||
<i class="ico-clock"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--more clearfix">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersMore"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersMore">
|
||||
<span>More</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersMore">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More I</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More II</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More III</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item clearfix">
|
||||
<input id=filter__search" type="search" ng-model="actionbarFilters.searchFilter"/>{{ actionbarFilters.searchFilter }}
|
||||
</li>
|
||||
<li class="filters__item filters__item--settings">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersSettings"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersSettings">
|
||||
<span class="visuallyhidden">Filters Settings</span>
|
||||
<i class="ico-cog"></i>
|
||||
</button>
|
||||
|
||||
<div class="filters__panel collapse" id="filtersSettings">
|
||||
<ul class="filters__sublist">
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="filters__list clearfix">
|
||||
<li class="filters__item filters__item--problems">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersProblems"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersProblems">
|
||||
<span>{{ actionbarFilters.activeFilter.text }}</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
<!-- Acknowledgement form -->
|
||||
<div ng-show="ackFormIsOpen">
|
||||
<div>
|
||||
<h4 id="acknowledgeModalLabel">Acknowlege</h4>
|
||||
</div>
|
||||
<div>
|
||||
<form>
|
||||
<div>
|
||||
<label for="author">Author :</label>
|
||||
<input type="text" id="acknowledge-author" ng-model="acknowledgeData.author">
|
||||
</div>
|
||||
<div>
|
||||
<label for="sticky">Sticky :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-sticky"
|
||||
ng-model="acknowledgeData.sticky"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div>
|
||||
<div>
|
||||
<label for="notify">Notify :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-notify"
|
||||
ng-model="acknowledgeData.notify"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div >
|
||||
<div>
|
||||
<label for="persistent">Persistent :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-persistent"
|
||||
ng-model="acknowledgeData.persistent"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div>
|
||||
<div>
|
||||
<label for="comment">Comment :</label>
|
||||
<input type="message-text" id="acknowledge-comment" ng-model="acknowledgeData.comment">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" ng-click="ackFormIsOpen = !ackFormIsOpen">Close</button>
|
||||
<button type="button" ng-click="acknowledgeProblems()">Send</button>
|
||||
</div>
|
||||
<div class="filters__panel collapse" id="filtersProblems">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem" ng-repeat="actionbarFilter in actionbarFilters.possibleFilters" ng-click="activateFilter($index)">
|
||||
<a class="filters__link state--current" ng-if="actionbarFilter === actionbarFilters.activeFilter">{{ actionbarFilter.text }}</a>
|
||||
<a class="filters__link" ng-if="actionbarFilter !== actionbarFilters.activeFilter">{{ actionbarFilter.text }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item filters__item--recheck">
|
||||
<button class="filters__button" type="button">
|
||||
<span class="visuallyhidden">Recheck</span>
|
||||
<i class="ico-arrows-cw"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--acknowledge" data-mover="true">
|
||||
<button class="filters__button" type="button" ng-click="ackFormIsOpen = !ackFormIsOpen">
|
||||
<span class="visuallyhidden">Acknowledge</span>
|
||||
<i class="ico-thumbs-up"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--downtime" data-mover="true">
|
||||
<button class="filters__button" type="button" ng-click="isDowntimeShown = !isDowntimeShown">
|
||||
<span class="visuallyhidden">Downtime</span>
|
||||
<i class="ico-clock"></i>
|
||||
</button>
|
||||
</li>
|
||||
<li class="filters__item filters__item--more clearfix">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersMore"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersMore">
|
||||
<span>More</span>
|
||||
<i class="ico-down-dir"></i>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
<div class="filters__panel collapse" id="filtersMore">
|
||||
<ul class="filters__sublist">
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More I</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More II</a>
|
||||
</li>
|
||||
<li class="filters__subitem">
|
||||
<a class="filters__link" href="#">More III</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li class="filters__item clearfix">
|
||||
<input id=filter__search" type="search" ng-model="actionbarFilters.searchFilter"/>{{ actionbarFilters.searchFilter }}
|
||||
</li>
|
||||
<li class="filters__item filters__item--settings">
|
||||
<button class="filters__button"
|
||||
type="button"
|
||||
data-toggle="collapse"
|
||||
data-target="#filtersSettings"
|
||||
aria-expanded="false"
|
||||
aria-controls="filtersSettings">
|
||||
<span class="visuallyhidden">Filters Settings</span>
|
||||
<i class="ico-cog"></i>
|
||||
</button>
|
||||
|
||||
<bansho-downtime_form data-ng-show="isDowntimeShown" is-shown="isDowntimeShown" selected-hosts="selected"></bansho-downtime_form>
|
||||
<div class="filters__panel collapse" id="filtersSettings">
|
||||
<ul class="filters__sublist">
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
<li>...</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Acknowledgement form -->
|
||||
<div ng-show="ackFormIsOpen">
|
||||
<div>
|
||||
<h4 id="acknowledgeModalLabel">Acknowlege</h4>
|
||||
</div>
|
||||
<div>
|
||||
<form>
|
||||
<div>
|
||||
<label for="author">Author :</label>
|
||||
<input type="text" id="acknowledge-author" ng-model="acknowledgeData.author">
|
||||
</div>
|
||||
<div>
|
||||
<label for="sticky">Sticky :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-sticky"
|
||||
ng-model="acknowledgeData.sticky"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div>
|
||||
<div>
|
||||
<label for="notify">Notify :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-notify"
|
||||
ng-model="acknowledgeData.notify"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div >
|
||||
<div>
|
||||
<label for="persistent">Persistent :</label>
|
||||
<input type="checkbox"
|
||||
id="acknowledge-persistent"
|
||||
ng-model="acknowledgeData.persistent"
|
||||
ng-true-value="1"
|
||||
ng-false-value="0">
|
||||
</div>
|
||||
<div>
|
||||
<label for="comment">Comment :</label>
|
||||
<input type="message-text" id="acknowledge-comment" ng-model="acknowledgeData.comment">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" ng-click="ackFormIsOpen = !ackFormIsOpen">Close</button>
|
||||
<button type="button" ng-click="acknowledgeProblems()">Send</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<bansho-downtime-form ng-show="isDowntimeShown" is-shown="isDowntimeShown" selected-hosts="selected"> </bansho-downtime_form>
|
||||
</menu>
|
||||
|
||||
@ -1,9 +1,8 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('bansho.table.actionbar', ['bansho.table',
|
||||
'bansho.live'])
|
||||
angular.module('bansho.table.actionbar', ['bansho.table', 'bansho.live'])
|
||||
|
||||
.factory('actionbarFilters', function () {
|
||||
.service('actionbarFilters', function () {
|
||||
var actionbarFilters = {
|
||||
activeFilter: {},
|
||||
possibleFilters: [
|
||||
@ -54,8 +53,7 @@ angular.module('bansho.table.actionbar', ['bansho.table',
|
||||
service_description = entry.description;
|
||||
}
|
||||
|
||||
backendClient.acknowledge(entry.host_name, service_description, $scope.acknowledgeData)
|
||||
.error(function (data) {
|
||||
backendClient.acknowledge(entry.host_name, service_description, $scope.acknowledgeData).error(function (data) {
|
||||
throw new Error('Acknowledge request failed');
|
||||
});
|
||||
}
|
||||
@ -107,18 +105,4 @@ angular.module('bansho.table.actionbar', ['bansho.table',
|
||||
restrict: 'E',
|
||||
templateUrl: 'components/table/actionbar/actionbar.html'
|
||||
};
|
||||
})
|
||||
|
||||
.directive('banshoDowntimeForm', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'components/table/actionbar/downtime_form.html',
|
||||
scope: {
|
||||
isShown: '=',
|
||||
selectedHosts: '='
|
||||
},
|
||||
controller: function ($scope) {
|
||||
console.log($scope.isShown)
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
49
app/components/table/actionbar/actions/actions.js
Normal file
49
app/components/table/actionbar/actions/actions.js
Normal file
@ -0,0 +1,49 @@
|
||||
'use strict';
|
||||
|
||||
angular.module('bansho.table.actionbar')
|
||||
|
||||
.directive('banshoDowntimeForm',
|
||||
['$filter', 'tablesConfig', 'actionbarFilters', 'backendClient',
|
||||
function ($filter, tablesConfig, actionbarFilters, backendClient) {
|
||||
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'components/table/actionbar/actions/downtime_form.html',
|
||||
scope: {
|
||||
isShown: '='
|
||||
},
|
||||
controller: function ($scope) {
|
||||
$scope.messages = [];
|
||||
|
||||
$scope.sendDowntime = function () {
|
||||
angular.forEach(tablesConfig, function (table) {
|
||||
var entries = $filter('filter')(table.entries, actionbarFilters.searchFilter);
|
||||
|
||||
angular.forEach(entries, function (entry) {
|
||||
var service_description = undefined;
|
||||
|
||||
if (entry.is_checked) {
|
||||
if ('description' in entry) {
|
||||
service_description = entry.description;
|
||||
}
|
||||
|
||||
console.log($scope.attrs);
|
||||
backendClient.downtime(entry.host_name, service_description, $scope.attrs).then(function (data) {
|
||||
$scope.messages.push({
|
||||
text: entry.host_name + " success ",
|
||||
type: "success"
|
||||
});
|
||||
},
|
||||
function (error) {
|
||||
$scope.messages.push({
|
||||
text: entry.host_name + " error",
|
||||
type: "error"
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}]);
|
||||
30
app/components/table/actionbar/actions/downtime_form.html
Normal file
30
app/components/table/actionbar/actions/downtime_form.html
Normal file
@ -0,0 +1,30 @@
|
||||
<div>
|
||||
<div ng-repeat="message in messages">{{message.text}} + {{message.type}}</div>
|
||||
<h4>Downtime</h4>
|
||||
<form ng-submit="sendDowntime()">
|
||||
<div>
|
||||
<label for="author">Author :</label>
|
||||
<input type="text" id="author" ng-model="attrs.author">
|
||||
</div>
|
||||
<div>
|
||||
<label for="comment">Comment :</label>
|
||||
<input type="message-text" id="comment" ng-model="attrs.comment">
|
||||
</div>
|
||||
<div>
|
||||
<label for="duration">Duration :</label>
|
||||
<input type="number" id="duration" ng-model="attrs.duration">
|
||||
</div>
|
||||
<div>
|
||||
<label for="start_time">Start time :</label>
|
||||
<input type="number" id="start_time" ng-model="attrs.start_time">
|
||||
</div>
|
||||
<div>
|
||||
<label for="end_time">End time :</label>
|
||||
<input type="number" id="end_time" ng-model="attrs.end_time">
|
||||
</div>
|
||||
<div>
|
||||
<button type="button" ng-click="isShown = !isShown">Close</button>
|
||||
<button type="submit">Send</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@ -1,10 +0,0 @@
|
||||
<div>
|
||||
<h1>Downtime form {{isShown}} </h1>
|
||||
<form>
|
||||
<div>
|
||||
<label for="author">Author :</label>
|
||||
<input type="text" id="acknowledge-author" ng-model="acknowledgeData.author">
|
||||
</div>
|
||||
<button type="button" ng-click="sendDowntime()">Send</button>
|
||||
</form>
|
||||
</div>
|
||||
@ -36,6 +36,7 @@
|
||||
<script src="components/tactical/current_health/current_health.js"></script>
|
||||
<script src="components/tactical/top_alert_producers/top_alert_producers.js"></script>
|
||||
<script src="components/table/actionbar/actionbar.js"></script>
|
||||
<script src="components/table/actionbar/actions/actions.js"></script>
|
||||
<script src="components/table/table.js"></script>
|
||||
<script src="components/table/cell_duration/cell_duration.js"></script>
|
||||
<script src="components/table/cell_host/cell_host.js"></script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user