@extends('layouts.app')

@section('content')
    <div class="row" style="border-bottom: 1px solid #CCC; padding-bottom: 20px;">
        <div class="container">
            <form method="post" role="form">
                {{ csrf_field() }}
                <div class="form-group col-md-6">
                    <label>From Date</label>
                    <div data-min-view="2" data-date-format="yyyy-mm-dd" class="input-group date datetimepicker col-md-12">
                        <input size="16" type="text" value="{{ $fromdate }}" name="fromdate" id="fromdate" class="form-control" />
                        <span class="input-group-addon btn btn-primary"><i class="icon-th s7-date"></i></span>
                    </div>
                </div>
                <div class="form-group col-md-6">
                    <label>To Date</label>
                    <div data-min-view="2" data-date-format="yyyy-mm-dd" class="input-group date datetimepicker col-md-12">
                        <input size="16" type="text" value="{{ $todate }}" name="todate" id="todate" class="form-control" />
                        <span class="input-group-addon btn btn-primary"><i class="icon-th s7-date"></i></span>
                    </div>
                </div>
                <div class="text-right col-md-6">
                    <button type="submit" class="btn btn-lg btn-space btn-primary">Filter</button>
                </div>
            </form>
        </div>
    </div>



    <div class="row" style="{{ $chart_container_visibility }}">
        <div class="col-md-6">
            <div class="widget widget-fullwidth line-chart">
              <div class="widget-head">
                <span class="title">&nbsp;</span>
              </div>
              <div class="chart-container">
                <div class="counter">
                  <div class="desc">&nbsp;</div>
                </div>
                <div id="all-accounts-pie-chart"></div>
              </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="widget widget-fullwidth line-chart">
              <div class="widget-head">
                <span class="title">&nbsp;</span>
              </div>
              <div class="chart-container">
                <div class="counter">
                  <div class="desc">&nbsp;</div>
                </div>
                <div id="all-accounts-bar-chart"></div>
              </div>
            </div>
        </div>
    </div>

    <div class="row">
    <div class="table-responsive">
        <table class="table table-striped table-bordered" id="report-table">
            <thead>
                <tr>
                    <td>S/N</td>
                    <td>NUMBER OF TRANSACTIONS</td>
                    <td>TRANSACTION VALUE (&#8358;)</td>
                    <td>{{ $col_title }}</td>
                </tr>
            </thead>
            <tbody>
                @php
                    $total_amount = 0;
                    $total_count = 0;
                @endphp
                
                @foreach($data as $d)
                    <tr>
                        <td>{{ $loop->iteration }}.</td>
                        <td>{{ $d->counter }}</td>
                        <td>{{ number_format($d->amountsum, 2) }}</td>
                        <td>{{ $d->$model->description }}</td>
                    </tr>
                    @php
                        $total_count += $d->counter;
                        $total_amount += $d->amountsum;
                    @endphp

                @endforeach
            </tbody>
            <tfoot>
                <tr>
                    <td>-</td>
                    <td>{{ $total_count }}</td>
                    <td>{{ number_format($total_amount, 2) }}</td>
                    <td>All</td>
                </tr>
                <tr>
                    <td>S/N</td>
                    <td>NUMBER OF TRANSACTIONS</td>
                    <td>TRANSACTION VALUE (&#8358;)</td>
                    <td>{{ $col_title }}</td>
                </tr>
            </tfoot>
        </table>
    </div>
    </div>
<style type="text/css">
    thead, tfoot { font-weight: bold; }
</style>

@endsection