Add generic tables

Change-Id: I515d59ee5c7026bc95c229f26c6897c1ee97cab3
This commit is contained in:
Vincent Fournier 2015-08-14 16:36:32 -04:00
parent 547da5b17c
commit e02eedb965
6 changed files with 159 additions and 20 deletions

View File

@ -227,7 +227,8 @@
"filter": {
"services": {},
"hosts": {},
"events": {}
"events": {},
"commands": {}
}
}
},
@ -281,6 +282,11 @@
"provider": "config",
"endpoint": "hosts",
"filter": "allHostConfigTemplate"
},
"commands": {
"provider": "config",
"endpoint": "commands",
"filter": "all"
}
}
}

View File

@ -855,5 +855,87 @@
]
}
]
},
"commands": {
"template": "page",
"components": [
{
"type": "panel",
"components": [
{
"type": "title",
"attributes": {
"title": "Commands"
}
},
{
"type": "actionbar",
"attributes": {
"tableId": [
0
]
},
"components": [
{
"type": "actionbar-recheck",
"attributes": {}
},
{
"type": "actionbar-more",
"attributes": {}
},
{
"type": "actionbar-search-filter",
"attributes": {}
}
]
},
{
"type": "table",
"attributes": {
"tableId": 0,
"headerFollow": true,
"inputSource": "commands",
"isWrappable": false,
"noRepeatCell": "",
"checkColumn": false,
"pagingbar": true,
"cellUrls": {
"command_name": {
"view": "command",
"params": [
"command_name"
]
}
}
}
}
]
}
]
},
"command": {
"template": "page",
"components": [
{
"type": "panel",
"components": [
{
"type": "container",
"components": [
{
"type": "info",
"attributes": {
"datamodel": {
"Command": "command"
}
}
}
]
}
]
}
]
}
}

View File

@ -1,17 +1,22 @@
<div>
<header class="main__content__header clearfix">
<h2 data-ng-show="title" class="main__content__title">{{title}}</h2>
</header>
<table class="data-table">
<thead class="moving-thead">
<tr>
<th data-ng-show="checkColumn" class="data-table__checkbox">
<md-checkbox aria-label='Check all' ng-model="isCheckAll" ng-change="onCheckChange()"></md-checkbox>
</th>
<th ng-repeat="i in cellIndexes" class="data-table__{{cellsName[i]}}">
<span data-ng-hide="allCells">
<th ng-repeat="i in cellIndexes" class="data-table__{{cellsName[i]}}">
{{cellsText[i]}}
<i class="ico-up-dir"></i>
</th>
</th>
</span>
<span data-ng-show="allCells">
<th ng-repeat="(key, value) in columns" class="data-table__host">
{{key}}
<i class="ico-up-dir"></i>
</th>
</span>
</tr>
</thead>
@ -20,22 +25,46 @@
<th data-ng-show="checkColumn" class="data-table__checkbox">
<md-checkbox aria-label='Check all' ng-model="isCheckAll" ng-change="onCheckChange()"></md-checkbox>
</th>
<th ng-repeat="i in cellIndexes" class="data-table__{{cellsName[i]}}">
<span data-ng-hide="allCells">
<th ng-repeat="i in cellIndexes" class="data-table__{{cellsName[i]}}">
{{cellsText[i]}}
<i class="ico-up-dir"></i>
</th>
</th>
</span>
<span data-ng-show="allCells">
<th ng-repeat="(key, value) in columns" class="data-table__host">
{{key}}
<i class="ico-up-dir"></i>
</th>
</span>
</tr>
</thead>
<tbody class="{{entry.child_class}}"
ng-repeat="(groupByKey, groupByItems) in entries | groupBy:'host_name'">
<tr ng-repeat="entry in groupByItems | noRepeat:this | wrappableStyle:this">
<td data-ng-show="checkColumn">
<tbody data-ng-if="!allCells" class="{{entry.child_class}}"
ng-repeat="(groupByKey, groupByItems) in entries | groupBy:'host_name'">
<tr ng-repeat="entry in groupByItems | noRepeat:this | wrappableStyle:this">
<td data-ng-show="checkColumn">
<md-checkbox aria-label='Check' ng-model="entry.is_checked"></md-checkbox>
</td>
<td bansho-cell cell-name="{{cell}}" ng-repeat="cell in cellsName"></td>
</tr>
</tbody>
<tbody data-ng-if="allCells" class="{{entry.child_class}}">
<tr ng-repeat="(key, entry) in entries">
<td data-ng-show="checkColumn">
<md-checkbox aria-label='Check' ng-model="entry.is_checked"></md-checkbox>
</td>
<td bansho-cell cell-name="{{cell}}" ng-repeat="cell in cellsName"></td>
</tr>
<td ng-repeat="(key, value) in columns">
<a data-ng-show="cellUrls[key]"
ng-click="createUrl(entry, cellUrls[key])">
{{entry[key]}}
</a>
<span data-ng-hide="cellUrls[key]">
{{entry[key]}}
</span>
</td>
</tr>
</tbody>
</table>
<bansho-pagingbar data-ng-if="pagingbar" options="options"></bansho-pagingbar>
</div>
</div>

View File

@ -23,8 +23,8 @@ angular.module('bansho.table', ['bansho.datasource',
options: '='
},
templateUrl: 'components/directive/table/table.html',
controller: ['$scope', 'headerFollow', 'datasource', 'templateManager',
function ($scope, headerFollow, datasource, templateManager) {
controller: ['$scope', '$window', 'headerFollow', 'datasource', 'templateManager',
function ($scope, $window, headerFollow, datasource, templateManager) {
var conf = {},
i;
@ -34,8 +34,22 @@ angular.module('bansho.table', ['bansho.datasource',
conf.title = $scope.options.attributes.title;
conf.cells = {'text': [], 'name': []};
conf.cells.text = $scope.options.attributes.cells.text;
conf.cells.name = $scope.options.attributes.cells.name;
if ($scope.options.attributes.cells) {
$scope.allCells = false;
conf.cells.text = $scope.options.attributes.cells.text;
conf.cells.name = $scope.options.attributes.cells.name;
} else {
$scope.allCells = true;
}
$scope.cellUrls = $scope.options.attributes.cellUrls;
$scope.createUrl = function (entry, urlParam) {
var url = "/#/view?view=" + urlParam.view;
angular.forEach(urlParam.params, function (paramName) {
url += '&' + paramName + '=' + entry[paramName];
});
$window.location = url;
};
conf.inputSource = $scope.options.attributes.inputSource;
conf.isWrappable = $scope.options.attributes.isWrappable;
@ -69,6 +83,14 @@ angular.module('bansho.table', ['bansho.datasource',
datasource.registerDataChanged($scope.tableId, function (data, isCheckAll) {
$scope.isCheckAll = isCheckAll;
$scope.entries = data;
if ($scope.allCells) {
$scope.columns = {};
angular.forEach($scope.entries, function (entry) {
angular.forEach(entry, function (value, key) {
$scope.columns[key] = true;
});
});
}
});
datasource.refreshTableData($scope.tableId);
templateManager.addInterval(function refreshTable () {

View File

@ -39,6 +39,7 @@
<ul class="sidebar__sublist collapse in" id="configList">
<li class="sidebar__subitem"><a href="#/view?view=configHosts">Host</a></li>
<li class="sidebar__subitem"><a href="#/view?view=configHostsTemplate">Templates</a></li>
<li class="sidebar__subitem"><a href="#/view?view=commands">Commands</a></li>
</ul>
</li>
<li class="sidebar__item">

View File

@ -34,7 +34,6 @@ angular.module('bansho.surveil')
"commands": true
};
var queryEndpoint = function (endpoint, fields, filters, paging, callback) {
var query = surveilQuery(fields, filters[endpoint], paging),
method = 'POST',