Show disk usage as a chart on the Host view

This commit is contained in:
Kyle Johnson 2014-11-25 16:27:38 +00:00
parent f32cb32da9
commit 9b636c89bc
2 changed files with 23 additions and 0 deletions

View File

@ -101,6 +101,19 @@ ZoneMinder.controller('ConfigController', function($scope, $http, Config) {
}); });
ZoneMinder.controller('HostController', function($scope, Host, Footer) { ZoneMinder.controller('HostController', function($scope, Host, Footer) {
Footer.getDiskPercent(function(diskPercent) {
var array = [];
angular.forEach(diskPercent.usage, function(value, key) {
var a = {
'value' : Math.floor(value),
'label' : key,
'color' : '#F7464A',
'highlight' : '#FFC870',
};
array.push(a);
});
$scope.ddata = array;
});
Host.getLoad(function(load) { Host.getLoad(function(load) {
$scope.loadData = { $scope.loadData = {

View File

@ -9,6 +9,16 @@ xhtmlHeaders( __FILE__, 'Host' );
<div class="container-fluid" ng-controller="HostController"> <div class="container-fluid" ng-controller="HostController">
<div class="row"> <div class="row">
<div class="col-md-4">
<h3>Disk Usage in Gigabytes</h3>
<div class="col-md-6">
<canvas tc-chartjs-polararea chart-data="ddata" chart-options="doptions" width="250px" height="250px" chart-legend="doughnutChart1"></canvas>
</div>
<div class="col-md-6" tc-chartjs-legend="" chart-legend="doughnutChart1"></div>
</div> <!-- End disk usage -->
<div class="col-md-4"> <div class="col-md-4">
<h3>CPU Load</h3> <h3>CPU Load</h3>