jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Rework the disk usage code

Browse Source
This commit is contained in:
Johannes Zellner
2022-10-12 16:26:09 +02:00
parent 51ecb708c7
commit 82f915ac1c
3 changed files with 73 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/system.html
+2 -2
View File
@@ -69,12 +69,12 @@
<span class="pull-right small" ng-hide="disk.available && disk.size">{{ 'system.diskUsage.notAvailableYet' | tr }}</span>
</h3>
<div class="progress">
<div class="progress-bar" ng-repeat="content in disk.contains" style="width: {{ content.usage / disk.size * 100 }}%; background-color: {{ content.color }};" uib-tooltip="{{ content.label + ' ' + (content.usage | prettyDiskSize) }}"></div>
<div class="progress-bar" ng-repeat="content in disk.contents" style="width: {{ content.usage / disk.size * 100 }}%; background-color: {{ content.color }};" uib-tooltip="{{ content.label + ' ' + (content.usage | prettyDiskSize) }}"></div>
</div>
<br/>
<p>{{ 'system.diskUsage.diskContent' | tr:{ filesystem: disk.filesystem, mountpoint: disk.mountpoint } }}:</p>
<ul>
<li ng-repeat="content in disk.contains">
<li ng-repeat="content in disk.contents">
<span ng-show="content.type === 'standard'">{{ content.label }} <span class="color-indicator" style="background-color: {{ content.color }};">&nbsp;</span> <small class="text-muted">{{ content.usage | prettyDiskSize }}</small></span>
<span ng-show="content.type === 'app'"><a href="https://{{ content.app.fqdn }}" target="_blank">{{ content.app.label || content.app.fqdn }}</a> <span class="color-indicator" style="background-color: {{ content.color }};">&nbsp;</span> <small class="text-muted">{{ content.usage | prettyDiskSize }}</small></span>
<span ng-show="content.type === 'volume'"><a href="/#/volumes">{{ content.volume.name }}</a> <span class="color-indicator" style="background-color: {{ content.color }};">&nbsp;</span> <small class="text-muted">{{ content.usage | prettyDiskSize }}</small></span>
src/views/system.js
+36 -32
View File
@@ -35,44 +35,48 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
refresh: function () {
$scope.disks.busy = true;
var result;
$scope.disks.disks = result.disks; // [ { filesystem, type, size, used, available, capacity, mountpoint }]
Client.refreshDiskUsage(function (error, result) {
if (error) return console.error('Failed to refresh disk usage.', error);
$scope.disks.disks.forEach(function (disk) {
var usageOther = disk.occupied;
// [ { filesystem, type, size, used, available, capacity, mountpoint }]
$scope.disks.disks = Object.keys(result).map(function (k) { return result[k]; });
colorIndex = 0;
disk.contains.forEach(function (content) {
content.color = getNextColor();
$scope.disks.disks.forEach(function (disk) {
var usageOther = disk.occupied;
if (content.type === 'app') content.app = Client.getInstalledAppsByAppId()[content.id];
if (content.type === 'volume') content.volume = $scope.volumesById(content.id);
colorIndex = 0;
disk.contents.forEach(function (content) {
content.color = getNextColor();
usageOther -= content.usage;
if (content.type === 'app') content.app = Client.getInstalledAppsByAppId()[content.id];
if (content.type === 'volume') content.volume = $scope.volumesById[content.id];
usageOther -= content.usage;
});
disk.contents.sort(function (x, y) { return y.usage - x.usage; }); // sort by usage
if ($scope.disks.disks[0] === disk) { // the root mount point is the first disk. keep this 'contains' in the end
disk.contents.push({
type: 'standard',
label: 'Everything else (Ubuntu, Swap, etc)',
id: 'other',
color: '#27CE65',
usage: usageOther
});
} else {
disk.contents.push({
type: 'standard',
label: 'Used',
id: 'other',
color: '#27CE65',
usage: usageOther
});
}
});
disk.contains.sort(function (x, y) { return y.usage - x.usage; }); // sort by usage
if ($scope.disks.disks[0] === disk) { // the root mount point is the first disk. keep this 'contains' in the end
disk.contains.push({
type: 'standard',
label: 'Everything else (Ubuntu, Swap, etc)',
id: 'other',
color: '#27CE65',
usage: usageOther
});
} else {
disk.contains.push({
type: 'standard',
label: 'Used',
id: 'other',
color: '#27CE65',
usage: usageOther
});
}
$scope.disks.busy = false;
});
$scope.disks.busy = false;
}
};
@@ -220,7 +224,7 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
volumes.forEach(function (v) { $scope.volumesById[v.id] = v; });
$scope.graphs.refresh();
// $scope.disks.refresh();
$scope.disks.refresh();
});
});
});