Show traffic monthly summary

This commit is contained in:
Deon George
2021-03-12 21:08:40 +11:00
parent a301fa7fc0
commit fee4b5802e
6 changed files with 128 additions and 11 deletions

View File

@@ -75,7 +75,9 @@
@endif
@if ($o->hasUsage())
<div class="tab-pane fade show" id="traffic" role="tabpanel">
@include('u.service.widgets.'.$o->stype.'.usagegraph',['o'=>$o->type])
@if ($o->type->usage(30)->count())
@include('u.service.widgets.'.$o->stype.'.usagegraph',['o'=>$o->type])
@endif
</div>
@endif
<div class="tab-pane fade" id="invoices" role="tabpanel">

View File

@@ -71,4 +71,4 @@
</tr>
</table>
</div>
</div>
</div>

View File

@@ -4,7 +4,29 @@
</div>
<div class="card-body">
<div id="graph"></div>
<div class="row">
<div class="col-3">
<table class="table table-sm">
<thead>
<tr>
<th>Period</th>
<th class="text-right">Traffic</th>
</tr>
</thead>
<tbody>
@foreach ($o->usage_summary(6) as $key => $oo)
<tr>
<td>{{ $key }}</td>
<td class="text-right">{{ number_format($oo/1024,2) }}</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="col-9">
<div id="graph"></div>
</div>
</div>
</div>
</div>
@@ -15,6 +37,14 @@
@js('//code.highcharts.com/modules/exporting.js','highcharts-export','highcharts')
@js('//code.highcharts.com/modules/offline-exporting.js','highcharts-export-offline','highcharts-export')
<script>
const timezone = new Date().getTimezoneOffset()
Highcharts.setOptions({
global: {
timezoneOffset: timezone
}
});
Highcharts.chart('graph', {
chart: {
type: 'areaspline'
@@ -55,7 +85,7 @@
},
series: [{
name: 'Traffic',
data: {!! $o->usage(30)->map(function($item) { return ['x'=>$item->date->timestamp*1000,'y'=>$item->up_peak+$item->down_peak+$item->up_offpeak+$item->down_offpeak];}) !!}
data: {!! $o->usage(30)->map(function($item) { return ['x'=>$item->date->timestamp*1000,'y'=>$item->total];}) !!}
}]
});
</script>