@extends('user.layouts.app')
@section('breadcrumb-first', $breadcrumb->first)
@section('breadcrumb-second', $breadcrumb->second)
@section('content')
<div class="row">
	<div class="col-lg-12">
        @include('user.account.balance_log.filter')
        <div class="row">
            <div class="col-lg-4">
                <div class="card stats-widget card m-b-30">
                    <div class="card-body">
                        <div class="float-left">
                            <span class="label label-warning mb-3">Total</span>
                            <h5 class="mt-2">
                                <div id="report_total">
                                    Rp {{ number_format($total['total'],0,',','.') }} ({{ number_format($total['count'],0,',','.') }})
                                </div>
                            </h5>
                        </div>
                        <div class="float-right">
                            <div class="avatar-xs">
                                <span class="avatar-title rounded-circle bg-custom">
                                    <i class="mdi mdi-credit-card-outline"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="card stats-widget card m-b-30">
                    <div class="card-body">
                        <div class="float-left">
                            <span class="label label-warning mb-3">Masuk/Tambah</span>
                            <h5 class="mt-2">
                                <div id="report_plus">
                                    Rp {{ number_format($plus['total'],0,',','.') }} ({{ number_format($plus['count'],0,',','.') }})
                                </div>
                            </h5>
                        </div>
                        <div class="float-right">
                            <div class="avatar-xs">
                                <span class="avatar-title rounded-circle bg-custom">
                                    <i class="mdi mdi-credit-card-outline"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-lg-4">
                <div class="card stats-widget card m-b-30">
                    <div class="card-body">
                        <div class="float-left">
                            <span class="label label-warning mb-3">Keluar/Kurang</span>
                            <h5 class="mt-2">
                                <div id="report_minus">
                                    Rp {{ number_format($minus['total'],0,',','.') }} ({{ number_format($minus['count'],0,',','.') }})
                                </div>
                            </h5>
                        </div>
                        <div class="float-right">
                            <div class="avatar-xs">
                                <span class="avatar-title rounded-circle bg-custom">
                                    <i class="mdi mdi-credit-card-outline"></i>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="card card-custom">
            <div class="card-body">
                <div class="table-responsive">
                    {!! $dataTable->table(['class' => 'table table-striped table-borderless table-hover mb-0'], false) !!}
                </div>
			</div>
		</div>
	</div>
</div>
{!! $dataTable->scripts() !!}
<script>
    $(document).ready(function () {
        document.getElementById("data-table").children[0].className = "thead-light";
        $('#filter_form').on('submit', function(element) {
            element.preventDefault();
            getReport()
            $('#preloader').fadeIn('slow');
            $.when(window.LaravelDataTables["data-table"].page.len($('#filter_row').val()).draw()).done(function() {
                $('#preloader').fadeOut('slow');
            });
        });
        $('#filter_form').on('reset', function(element) {
            $('[data-toggle="select2"], select, input').val(null).trigger('change');
            $('#filter_row').val('10').trigger('change');
            getReport()
            $('#preloader').fadeIn('slow');
            $.when(window.LaravelDataTables["data-table"].page.len('10').draw()).done(function() {
                $('#preloader').fadeOut('slow');
            });
        });
        function getReport() {
            $.ajax({
                type: "GET",
                url: "{{ url('account/log/balance/report') }}",
                data: {
                    start_date : $('#filter_start_date').val(),
                    end_date   : $('#filter_end_date').val(),
                    type       : $('#filter_type').val(),
                    action     : $('#filter_action').val(),
                    search     : $('#search').val(),
                },
                dataType: "json",
                success: function(response) {
                    $('#report_total').html(response.total);
                    $('#report_plus').html(response.plus);
                    $('#report_minus').html(response.minus);
                }, error: function() {
                    swal.fire("Gagal!", "Terjadi kesalahan.", "error");
                }
            });
        }
    });
</script>
@endsection