CodeMirror/appwrite
1
0
Fork 0
mirror of synced 2024-06-02 19:04:49 +12:00
Code Issues Projects Releases Wiki Activity

update storage usage charts

Browse source
This commit is contained in:
Damodar Lohani 2021-11-09 15:09:06 +05:45
parent 44437f5c8b
commit 654a88a95d
6 changed files with 125 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

101
app/views/console/storage/index.phtml
View file

@ -118,9 +118,106 @@
</div>
</li>
<!-- <li data-state="/console/storage/usage?project={{router.params.project}}">
<li data-state="/console/storage/usage?project={{router.params.project}}">
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '90d'"
data-service="storage.getUsage"
data-event="submit"
data-name="usage"
data-param-range="90d">
<button class="tick">90d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '90d'" disabled>90d</button>
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '30d'"
data-service="storage.getUsage"
data-event="submit"
data-name="usage">
<button class="tick">30d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '30d'" disabled>30d</button>
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '24h'"
data-service="storage.getUsage"
data-event="submit"
data-name="usage"
data-param-range="24h">
<button class="tick">24h</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '24h'" disabled>24h</button>
<h2>Usage</h2>
</li> -->
<div
data-service="storage.getUsage"
data-event="load"
data-name="usage">
<div class="box dashboard">
<div class="row responsive">
<div class="col span-12">
<div class="margin-top-negative-small margin-end-negative-large">
<div class="chart pull-end">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Total Files=filesCount,Total Buckets=bucketsCount"/>
</div>
<div class="chart-metric">
<div class="value margin-bottom-small margin-top-small">
<span class="sum" data-ls-bind="{{usage.filesStorage|statsGetLast|humanFileSize}}">0</span>
<span class="sum" data-ls-bind="{{usage.filesStorage|statsGetLast|statsTotal|humanFileUnit}}"></span>
</div>
<div class="unit margin-start-no margin-bottom-small">Storage</div>
</div>
</div>
<ul class="chart-notes margin-top-small">
<li>Total Files <span data-ls-bind="({{usage.filesCount|statsGetLast|statsTotal}})"></span></li>
<li>Total Buckets <span data-ls-bind="({{usage.bucketsCount|statsGetLast|statsTotal}})"></span></li>
</ul>
</div>
</div>
</div>
<div class="box dashboard">
<div class="row responsive">
<div class="col span-6">
<div class="value"><span class="sum" data-ls-bind="{{usage.bucketsCount|statsGetLast|statsTotal}}" data-default="0">0</span></div>
<div class="margin-top-small"><b class="text-size-small unit">Buckets</b></div>
</div>
<div class="col span-6">
<div class="value"><span class="sum" data-ls-bind="{{usage.filesCount|statsGetLast}}" data-default="0">0</span></div>
<div class="margin-top-small"><b class="text-size-small unit">Files</b></div>
</div>
</div>
</div>
<div class="box margin-bottom-small margin-top-large">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Buckets read=bucketsRead" data-height="140" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li>Buckets read</li>
</ul>
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Buckets create=bucketsCreate,Buckets update=bucketsUpdate,Buckets delete=bucketsDelete" data-height="140" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li>Buckets create</li>
<li>Buckets update</li>
<li>Buckets delete</li>
</ul>
</div>
</li>
</ul>
</div>
</div>

7
public/dist/scripts/app-all.js vendored
View file

File diff suppressed because one or more lines are too long

7
public/dist/scripts/app.js vendored
View file

File diff suppressed because one or more lines are too long

11
public/scripts/filters.js
View file

@ -167,14 +167,21 @@ window.ls.filter
return units[u];
})
.add("statsTotal", function($value) {
.add("statsTotal", function ($value) {
if (!$value) {
return 0;
}
$value = abbreviate($value, 0, false, false);
return $value === "0" ? "N/A" : $value;
return $value ?? "N/A";
})
.add("statsGetLast", function ($value) {
if (!$value || $value.length < 1) {
return 0;
}
return $value[$value.length - 1].value;
})
.add("isEmpty", function($value) {
return (!!$value);

7
public/scripts/routes.js
View file

@ -146,6 +146,13 @@ window.ls.router
scope: "console",
project: true
})
.add("/console/storage/usage", {
template: function(window) {
return window.location.pathname + window.location.search + '&version=' + APP_ENV.CACHEBUSTER;
},
scope: "console",
project: true
})
.add("/console/storage/bucket", {
template: function(window) {
return window.location.pathname + window.location.search + '&version=' + APP_ENV.CACHEBUSTER;

5
public/scripts/views/forms/chart.js
View file

@ -70,7 +70,8 @@
for (let i = 0; i < sources.length; i++) {
let label = sources[i].substring(0, sources[i].indexOf('='));
let path = sources[i].substring(sources[i].indexOf('=') + 1);
let data = container.path(path);
let usage = container.get('usage');
let data = usage[path];
let value = JSON.parse(element.value);
config.data.labels[i] = label;
@ -100,9 +101,7 @@
else {
}
chart = new Chart(child.getContext("2d"), config);
wrapper.dataset["canvas"] = true;
}
check();