chart title and description
This commit is contained in:
parent
57f0de5fdd
commit
35dffe9d8e
1 changed files with 45 additions and 40 deletions
|
@ -155,67 +155,72 @@
|
|||
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>
|
||||
<h3 class="margin-bottom-no">Objects</h3>
|
||||
<p class="small">Count of buckets, files and total storage used over time</p>
|
||||
<div class="box">
|
||||
<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="Total Files=filesCount,Total Buckets=bucketsCount, Total storage=filesStorage"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box dashboard">
|
||||
<ul class="chart-notes margin-top-small margin-bottom-large">
|
||||
<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>
|
||||
<li>Total Storage <span data-ls-bind="({{usage.filesStorage|statsGetLast|statsTotal}})"></span></li>
|
||||
</ul>
|
||||
<!-- <div class="box dashboard">
|
||||
<div class="row responsive">
|
||||
<div class="col span-6">
|
||||
<div class="col span-4">
|
||||
<div class="value"><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="margin-top-small"><b class="text-size-small unit">Storage</b></div>
|
||||
</div>
|
||||
<div class="col span-4">
|
||||
<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="col span-4">
|
||||
<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> -->
|
||||
|
||||
<!-- CRUDS class for graph fixed colors, use color codes from Docs for CRUD operations -->
|
||||
<h3 class="margin-bottom-no">Buckets</h3>
|
||||
<p>Count of bucket create, read, update and delete operations over time</p>
|
||||
<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 class="chart crud margin-bottom-no">
|
||||
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Buckets create=bucketsCreate,Buckets read=bucketsRead,Buckets update=bucketsUpdate,Buckets delete=bucketsDelete" data-colors="create,read,update,delete" data-height="140" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="chart-notes margin-bottom-large">
|
||||
<ul class="chart-notes crud margin-bottom-large">
|
||||
<li>Buckets create</li>
|
||||
<li>Buckets read</li>
|
||||
<li>Buckets update</li>
|
||||
<li>Buckets delete</li>
|
||||
</ul>
|
||||
|
||||
<h3 class="margin-bottom-no">Files</h3>
|
||||
<p>Count of file create, read, update and delete operations over time</p>
|
||||
<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 crud margin-bottom-no">
|
||||
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Files create=filesCreate,Files read=filesRead,Files update=filesUpdate,Files delete=filesDelete" data-colors="create,read,update,delete" data-height="140" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="chart-notes crud margin-bottom-large">
|
||||
<li>Files create</li>
|
||||
<li>Files read</li>
|
||||
<li>Files update</li>
|
||||
<li>Files delete</li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
Loading…
Reference in a new issue