59 lines
2.2 KiB
PHP
59 lines
2.2 KiB
PHP
@extends('themes.base.layout')
|
|
@section('title', trans('gallery.statistics.title'))
|
|
|
|
@section('breadcrumb')
|
|
<li class="breadcrumb-item"><a href="{{ route('home') }}"><i class="fa fa-fw fa-home"></i></a></li>
|
|
<li class="breadcrumb-item active">@lang('gallery.statistics.title')</li>
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col">
|
|
<h1>@lang('gallery.statistics.title')</h1>
|
|
<div class="alert alert-info" style="margin-bottom: 30px;">
|
|
<i class="fa fa-fw fa-info"></i> @lang('gallery.statistics.intro', ['gallery_name' => UserConfig::get('app_name')])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="card">
|
|
<div class="card-header">@lang('gallery.statistics.cameras')</div>
|
|
<div class="card-body text-center" id="cameras-graph">
|
|
<canvas id="cameras-chart" style="display: none;"></canvas>
|
|
<img class="loading" src="{{ asset('ripple.svg') }}"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
{{-- TODO: include ChartJS locally --}}
|
|
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.bundle.min.js"></script>
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
$.get('{{ route('statistics.cameras') }}', function(result)
|
|
{
|
|
$('.loading', '#cameras-graph').hide();
|
|
$('canvas', '#cameras-graph').show();
|
|
var myPieChart = new Chart($('#cameras-chart'),
|
|
{
|
|
type: 'pie',
|
|
data: {
|
|
datasets: [
|
|
{
|
|
backgroundColor: result.backgrounds,
|
|
data: result.data
|
|
}
|
|
],
|
|
labels: result.labels
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
@endpush |