@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>Summary Payment Channel</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{ route('dashboard') }}">Dashboard</a></li>
                        <li><a href="{{ route('summary_payment') }}">Summary Payment Channel</a></li>
                        <li class="active">List</li>
                    </ol>
                </div>

                <div class="col-xs-12">
                    <div class="x_panel">
                        <form class="form-horizontal">
                            <div class="form-group">
                                <label class="col-sm-3 control-label">Start date :</label>
                                <div class="col-sm-9">
                                    <input class="form-control" type="date" name="start" value="{{ $request['start'] }}" />
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">End date :</label>
                                <div class="col-sm-9">
                                    <input class="form-control" type="date" name="end" value="{{ $request['end'] }}" />
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-3 control-label">Payment Channel :</label>
                                <div class="col-sm-9">                                    
                                    @foreach($payment_channels as $payment_channel)
                                        <label style="margin-right:10px;">
                                            <input type="checkbox" value="{{ $payment_channel->id }}" name="channels[]" 
                                                @if(in_array($payment_channel->id, $request['payment_channels'])) checked @endif
                                            >
                                            {{ $payment_channel->label }}
                                        </label>
                                    @endforeach
                                </div>
                            </div>

                            @if($error_message)
                                <div class="form-group">
                                    <div class="col-sm-9 col-sm-offset-3">
                                        <div class="alert alert-danger" role="alert"><strong>Oh snap!</strong> {{ $error_message }}</div>
                                    </div>
                                </div>
                            @endif

                            <div class="form-group">
                                <div class="col-sm-offset-3 col-sm-9">
                                    <div class="loading hidden"><i class="fa fa fa-spinner fa-pulse"></i></div>
                                    <div class="submit">
                                        <button type="submit" class="btn btn-default"><i class="fa fa-search" aria-hidden="true"></i> Search</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>

                    @if($transactions)
                        <div class="x_panel">
                            <div class="x_content">
                                <div class="row">
                                    <div class="col-xs-3 text-center">
                                        <h4>Transaction count</h4>
                                        <canvas id="chart_count" height="200"></canvas>
                                    </div>
                                    <div class="col-xs-3 text-center">
                                        <h4>Transaction nominal</h4>
                                        <canvas id="chart_nominal" height="200"></canvas>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="x_panel">
                            <div class="x_content">
                                <div class="text-right">
                                    <a href="{{ route('summary_payment_download') . '?' . $_SERVER['QUERY_STRING'] }}" target="_blank" class="btn btn-default"><i class="fa fa-download" aria-hidden="true"></i> Download data</a>
                                </div>

                                <table class="table table-bordered table-striped">
                                    <tr>
                                        <th class="text-center">No</th>
                                        <th class="text-center">Payment channel</th>
                                        <th class="text-center">Count</th>
                                        <th class="text-center">Total Tax</th>
                                        <th class="text-center">Total Service Fee</th>
                                        <th class="text-center">Total Discount</th>
                                        <th class="text-center">Total Net</th>
                                        <th class="text-center">Total Gross</th>
                                        <th class="text-center">Average Gross</th>
                                    </tr>
                                    @php
                                        $total_transaction = 0;
                                        $total_tax = 0;
                                        $total_service_fee = 0;
                                        $total_discount_count = 0;
                                        $total_net_count = 0;
                                        $total_sum = 0;
                                        $total_avg = 0;
                                    @endphp
                                    @forelse($transactions as $transaction)
                                    @php
                                        $total_transaction += $transaction->transaction_count;
                                        $total_tax += $transaction->total_tax;
                                        $total_service_fee += $transaction->total_service_fee;
                                        $total_discount_count += $transaction->total_discount;
                                        $total_net_count += $transaction->total_net;
                                        $total_sum += $transaction->transaction_sum;
                                        $total_avg += $transaction->transaction_avg;
                                    @endphp
                                        <tr>
                                            <td class="text-center">{{ $loop->iteration }}</td>
                                            <td class="text-center">{{ $transaction->payment_channel->label }}</td>
                                            <td class="text-right">{{ number_format($transaction->transaction_count) }}</td>
                                            <td class="text-right">Rp. {{ number_format($transaction->total_tax) }}</td>
                                            <td class="text-right">Rp. {{ number_format($transaction->total_service_fee) }}</td>
                                            <td class="text-right">Rp. {{ number_format($transaction->total_discount) }}</td>
                                            <td class="text-right">Rp. {{ number_format($transaction->total_net) }}</td>
                                            <td class="text-right">Rp. {{ number_format(round($transaction->transaction_sum)) }}</td>
                                            <td class="text-right">Rp. {{ number_format(round($transaction->transaction_avg)) }}</td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="text-center">No data</td>
                                        </tr>
                                    @endforelse
                                    <tfoot>
                                            <td colspan="2">Total</td>
                                            <td class="text-right"><strong>{{ number_format($total_transaction) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_tax,2) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_service_fee,2) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_discount_count,2) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_net_count,2) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_sum,2) }}</strong></td>
                                            <td class="text-right"><strong>Rp {{ number_format($total_avg,2) }}</strong></td>
                                    </tfoot>
                                </table>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection

@if($transactions)
    @section('scripts')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js" integrity="sha256-R4pqcOYV8lt7snxMQO/HSbVCFRPMdrhAFMH+vr9giYI=" crossorigin="anonymous"></script>
    <script type="text/javascript">
        function create_chart_count()
        {
            @php
                $label = [];
                $count = [];
                $color = [];
                foreach($transactions as $transaction) {
                    $label[] = $transaction->payment_channel->label;
                    $count[] = $transaction->transaction_count;
                    $color[] = 'rgba('.rand(0,255).', '.rand(0,255).', '.rand(0,255).')';
                }
            @endphp

            var ctx = document.getElementById('chart_count').getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: {!! json_encode($label) !!},
                    datasets: [{
                        label: 'Count transaction',
                        data: {!! json_encode($count) !!},                        
                        borderWidth: 1,
                        backgroundColor: {!! json_encode($color) !!}, 
                    }]
                },
                options: {
                    legend: {
                        display: true,
                        labels: {
                            position: 'right'
                        }
                    }
                }
            });
        }
        function create_chart_nominal()
        {
            @php
                $label = [];
                $count = [];
                $color = [];
                foreach($transactions as $transaction) {
                    $label[] = $transaction->payment_channel->label;
                    $count[] = $transaction->transaction_sum;
                    $color[] = 'rgba('.rand(0,255).', '.rand(0,255).', '.rand(0,255).')';
                }
            @endphp

            var ctx = document.getElementById('chart_nominal').getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: {!! json_encode($label) !!},
                    datasets: [{
                        label: 'Count transaction',
                        data: {!! json_encode($count) !!},                        
                        borderWidth: 1,
                        backgroundColor: {!! json_encode($color) !!}, 
                    }]
                },
                options: {
                    legend: {
                        display: true,
                        labels: {
                            position: 'right'
                        }
                    }
                }
            });
        }
        $(document).ready(function() {
            create_chart_count();
            create_chart_nominal();
        });
    </script>
    @endsection
@endif