2017-09-14 22:21:00 +03:00

124 lines
5.2 KiB
PHP

@extends('layouts.admin')
@section('title', trans('reports.summary.expense'))
@section('content')
<!-- Default box -->
<div class="box box-success">
<div class="box-header">
<div class="pull-left" style="margin-left: 23px">
<a href="{{ url('reports/expense-summary') }}?status=all"><span class="badge @if (request('status') == 'all') bg-green @else bg-default @endif">{{ trans('general.all') }}</span></a>
<a href="{{ url('reports/expense-summary') }}"><span class="badge @if (request('status') == '') bg-green @else bg-default @endif">{{ trans('bills.paid') }}</span></a>
<a href="{{ url('reports/expense-summary') }}?status=upcoming"><span class="badge @if (request('status') == 'upcoming') bg-green @else bg-default @endif">{{ trans('dashboard.payables') }}</span></a>
</div>
{!! Form::open(['url' => 'reports/expense-summary', 'role' => 'form', 'method' => 'GET']) !!}
<div class="pull-right">
{!! Form::select('year', $years, request('year', Date::now()->year), ['class' => 'form-control input-filter input-sm', 'onchange' => 'this.form.submit()']) !!}
</div>
{!! Form::close() !!}
</div>
<div class="box-body">
<div class="chart">
<canvas id="expense_graph" style="height: 246px; width: 1069px;" height="246" width="1069"></canvas>
</div>
<hr>
<div class="table table-responsive">
<table class="table table-bordered table-striped table-hover" id="tbl-report-expenses">
<thead>
<tr>
<th>{{ trans_choice('general.categories', 1) }}</th>
@foreach($dates as $date)
<th class="text-right">{{ $date }}</th>
@endforeach
</tr>
</thead>
<tbody>
@if ($expenses)
@foreach($expenses as $category_id => $category)
<tr>
<td>{{ $categories[$category_id] }}</td>
@foreach($category as $item)
<td class="text-right">@money($item['amount'], $item['currency_code'], true)</td>
@endforeach
</tr>
@endforeach
@else
<tr>
<td colspan="4">
<h5 class="text-center">{{ trans('general.no_records') }}</h5>
</td>
</tr>
@endif
</tbody>
<tfoot>
<tr>
<th>{{ trans_choice('general.totals', 1) }}</th>
@foreach($totals as $total)
<th class="text-right">@money($total['amount'], $total['currency_code'], true)</th>
@endforeach
</tr>
</tfoot>
</table>
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
@endsection
@section('js')
<script src="{{ asset('vendor/almasaeed2010/adminlte/plugins/chartjs/Chart.min.js') }}"></script>
@endsection
@section('scripts')
<script type="text/javascript">
$(document).ready(function () {
var areaChartData = {
labels: {!! json_encode(array_values($dates)) !!},
datasets: [
{
label: "{{ trans_choice('general.expenses', 2) }}",
fillColor: "#F56954",
strokeColor: "#F56954",
pointColor: "#F56954",
pointStrokeColor: "#F56954",
pointHighlightFill: "#FFF",
pointHighlightStroke: "#F56954",
data: {!! $expenses_graph !!}
}
]
};
var areaChartOptions = {
showScale: true,
scaleShowGridLines: false,
scaleGridLineColor: "rgba(0,0,0,.05)",
scaleGridLineWidth: 1,
scaleShowHorizontalLines: true,
scaleShowVerticalLines: true,
bezierCurve: true,
bezierCurveTension: 0.3,
pointDot: false,
pointDotRadius: 4,
pointDotStrokeWidth: 1,
pointHitDetectionRadius: 20,
datasetStroke: true,
datasetStrokeWidth: 2,
datasetFill: true,
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].lineColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>",
maintainAspectRatio: true,
responsive: true
};
var cashFlowDailyCanvas = $("#expense_graph").get(0).getContext("2d");
var cashFlowDaily = new Chart(cashFlowDailyCanvas);
var cashFlowDailyOptions = areaChartOptions;
cashFlowDailyOptions.datasetFill = false;
cashFlowDaily.Line(areaChartData, cashFlowDailyOptions);
});
</script>
@endsection