@extends('layouts.admin')

@section('title', 'Payments')

@section('breadcrumb-item')
<li class="breadcrumb-item active">Payments</li>
@endsection

@section('styles')
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<link href="https://unpkg.com/gijgo@1.9.13/css/gijgo.min.css" rel="stylesheet" type="text/css" />
<style>
    .header {
        display: none;
    }

    .msg {
        display: none;
    }
</style>
@endsection

@section('content')
<div class="card">
    <div class="card-header bg-theme">
        <p class="h5 pt-2 mb-0 float-left"><i class="fa fa-list pr-1"></i>Payments</p>
        <form action="{{ route('admin.payments') }}" method="get" class="form-inline float-right">
            <div class="form-group">
                <div class="input-group">
                    <input class="form-control search" type="text" name="q" value="{{ request()->query('q') }}"
                        placeholder="Search in Payments">
                    <div class="input-group-append">
                        <button class="btn btn-success" type="submit"><i class="fa fa-search"></i></button>
                    </div>
                    <div class="input-group-append">
                        <a class="btn btn-danger{{ request()->query('q') ? '' : ' disabled' }}"
                            href="{{ route('admin.payments') }}">
                            <i class="fa fa-eraser"></i></a>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="card-body result-view" id="print-view" style="overflow-x:auto;">
        <form method="post" id="searchfrom" action="{{ route('admin.payment.search') }}">
            @csrf
            <div class="row" style="display: none;">
                <div class="col-md-4">
                    <select class="js-example-basic-multiple col-md-12 product" name="product[]" multiple="multiple">
                        <option>Products</option>
                        @foreach (_products() as $product)
                        <option value="{{ $product->id }}">{{ $product->name }}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <br>
            <div class="row">
                <div class="col-md-3">
                    <label>Employee</label>
                    <select class="js-example-basic-single col-md-12 form-control " name="employee">
                        <option value=""></option>
                        @foreach (_employees() as $employee)
                        <option value="{{ $employee->id }}" {{ request()->employee == $employee->id ? 'selected' : ''
                            }}>{{ $employee->name }}
                        </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-3">
                    <label>Shop</label>
                    <select class="js-example-basic-single col-md-12 shop" name="shop">
                        <option value=""></option>
                        @foreach (_shops() as $shop)
                        <option value="{{ $shop->id }}" {{ request()->shop == $shop->id ? 'selected' : '' }}>{{
                            $shop->name }}  [{{ $shop->id }}] </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-3">
                    <div class="form-group">
                        <label>Areas</label>
                        <select class="form-control js-example-theme-multiple" name="area_ids[]" multiple>
                            @foreach(_areas() as $area)
                                <option value="{{ $area->id }}"
                                    {{ isset($area_ids) && in_array($area->id, $area_ids) ? 'selected' : '' }}>
                                    {{ $area->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-2 text-center" style="margin-top: 10px;">
                    @if(request()->wht_amount == null)
                        <input class="form-check-input" name="wht_amount" type="checkbox">
                    @else
                        <input class="form-check-input" name="wht_amount" checked type="checkbox">
                    @endif

                    <label class="form-check-label">
                        WHT Amount
                    </label>
                </div>
                <div class="col-md-3">
                    <label>Start Date</label>
                    {{-- @dd(request()->start_date) --}}
                    <input id="datepicker1" name="start_date" value="{{ request()->start_date}}" />
                </div>
                <div class="col-md-3">
                    <label>End Date</label>
                    <input id="datepicker2" name="end_date" value="{{ request()->end_date ?? date('d-m-Y') }}" />
                    {{-- <input id="datepicker2" name="end_date" value="{{ request()->end_date }}" /> --}}
                </div>
            </div>
            <div class="row mt-4">
                <div class="col-md-12 text-center">
                    <button class="btn btn-sm btn-success col-md-3 submit">Search</button>
                    <button class="btn btn-sm btn-success col-md-3 print">Print</button>
                    <a href="{{ route('admin.payments') }}" class="btn btn-sm btn-success col-md-3">Reload</a>
                </div>
            </div>
            <br>
            <div class="row">
                <div class="col-md-4">
                    <div class="alert alert-danger msg" role="alert">
                        Select Some Search Options.
                    </div>
                </div>
            </div>
        </form>
        <br>
        <div class="result-view" id="print-view">
            <div class="header">
                <h4 class="text-center">BRIGHT VISION</h4>
                <h6 class="text-center">SUIT # 102, FINE CENTER COMMERCIAL, BLOCK-V GULSHAN-E-IQBAL.</h6>
                <h6 class="text-center">Phone <b>:</b> 201-34155063 N.T.N : 4360989-9</h6>
                <h6 class="text-center">Email <b>:</b> info@brightvisionhealth.com</h6>
                <h4 class="text-center" style="margin-top: 5%">Received Payment Summary</h4>
                <br>
            </div>
            <table class="table table-hover table-c">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Order ID</th>
                        <th>Shop</th>
                        <th>Area</th>
                        <th>Amount</th>
                        <th>Received Cash</th>
                        <th>Cheque Amount</th>
                        <th>WHT Amount</th>
                        <th>Balance</th>
                        <th>Status</th>
                        <th>Comments</th>
                        <th>Received By</th>
                        <th>Received On</th>
                        <th class="print-t">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($payments as $index => $payment)
                    <tr>
                        @if($pagination)
                            <td>{{ $payments->firstItem() + $index }}</td>
                        @else
                            <td>{{ $loop->iteration }}</td>
                        @endif
                        <td>{{ $payment->order->id }}</td>
                        <td>{{ isset($payment->order->shop) ? $payment->order->shop->name : '' }}</td>
                        <td>{{ isset($payment->order->shop->area) ? $payment->order->shop->area->name : '' }}</td>
                        <td>
                            @if($payment->order->status == 2 || $payment->amount == null)
                                {{ $payment->order->amount }}
                            @else
                                {{ isset($payment->amount) ? $payment->amount : '0' }}
                            @endif
                        </td>
                        <td>{{ isset($payment->received_amount) && $payment->cheque_amount == null ?
                            $payment->received_amount : '0' }}</td>
                        <td>{{ $payment->cheque_amount == null ? '0' : $payment->cheque_amount }}</td>
                        <td>{{ $payment->wht_amount == null ? '0' : $payment->wht_amount }}</td>
                        <td>{{ isset($payment->balance) ? $payment->balance : '0' }}</td>
                        <td>{{ isset($payment->order->status_string) ? $payment->order->status_string : '0' }}</td>
                        <td>{{ isset($payment->comment) ? $payment->comment : 'No comment' }}</td>
                        <td>{{ isset($payment->employee) ? $payment->employee->name : '' }}</td>
                        <td>{{ $payment->created_at->format('d-M-Y') }}</td>
                        <td class="print-t">
                            <div class="btn-group">
                                <a href="{{ route('admin.payment.show', ['payment' => $payment->id]) }}"><button
                                        class="btn btn-sm btn-outline-primary"><i class="fa fa-eye"></i></button></a>
                                {{-- @include('includes.modals.delete', ['model' => 'payment', 'route' =>
                                'admin.payment.delete']) --}}
                            </div>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <th colspan="7" class="text-center">No Payments Yet</th>
                    </tr>
                    @endforelse
                </tbody>
            </table>
            {{-- <h5 class="d-inline">Total Amount: <b>{{round(_orders()->sum('amount'))}}</b></h5> --}}
            <div class="d-inline pull-right">
                <h5>Total Cash Amount: <b>{{ $payments->where('cheque_amount',null)->sum('received_amount') }}</b></h5>
                <h5>Total Cheque Amount: <b>{{ (int)$payments_cheque_total }}</b></h5>
                <h5 class="d-none">Total Received Amount: <b>{{ (int)$payments_total }}</b></h5>
            </div>
        </div>

        <div class="pagination justify-content-center mb-4">
            @if($pagination)
                {{ $payments->appends(request()->query())->links() }}
            @endif
        </div>

    </div>
</div>
@endsection

@section('scripts')
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>
<script src="https://unpkg.com/gijgo@1.9.13/js/gijgo.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function() {
            $('.js-example-theme-multiple').select2({
                theme: 'classic',
            });
            let current_datetime = new Date()
            let today = (current_datetime.getDate() + 1) + "-" + (current_datetime.getMonth() + 1) + "-" +
                current_datetime.getFullYear();
            $('.js-example-basic-single').select2();
            $('.js-example-basic-multiple').select2({
                placeholder: 'Products'
            });
            $('#datepicker1').datepicker({
                format: 'dd-mm-yyyy',
                uiLibrary: 'bootstrap4',
                maxDate: today,
            });

            $('#datepicker2').datepicker({
                format: 'dd-mm-yyyy',
                uiLibrary: 'bootstrap4',
                maxDate: today,

            });

            // Search on name column only
            $('.search').keyup(function() {
                // Search Text
                var search = $(this).val();

                // Hide all table tbody rows
                $('table tbody tr').hide();


                $('table tbody td:contains("' + search + '")').each(function() {
                    $(this).closest('tr').show();
                });
            });

            $('.submit').click(function(e) {
                e.preventDefault();
                let pro = $('.product').val();
                let area = $('.area').val();
                let shop = $('.shop').val();
                let emp = $('.employee').val();
                let date = $('#datepicker').val();

                if (pro !== 'Products' || area !== 'Area' || shop !== 'Shop' || emp !== 'Employee' ||
                    date !== '') {
                    $('#searchfrom').submit();
                } else {
                    $('.msg').show();
                    $('.msg').delay(3200).fadeOut(300);
                }
            });

            $('.print').click(function(e) {
    e.preventDefault();

    // Show header and hide elements you don't want to print
    $('.header').show();
    $('.print-t').hide();
    $('#searchfrom').hide();

    // Get the HTML content of the section you want to print
    let printContents = document.getElementById('print-view').innerHTML;
    let printWindow = window.open('', '_blank');
            printWindow.document.write('<html><head><title>Print</title>');
            printWindow.document.write('<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">');
            printWindow.document.write('</head><body>');
            printWindow.document.write(printContents);
            printWindow.document.write('</body></html>');
            printWindow.document.close();
            function printContent() {
                printWindow.print();
                printWindow.close();
            }
            setTimeout(printContent, 1000);

    // Show the hidden elements and hide the header again
    $('.header').hide();
    $('.print-t').show();
    $('#searchfrom').show();
});


        });

        // Case-insensitive searching (Note - remove the below script for Case sensitive search )
        $.expr[":"].contains = $.expr.createPseudo(function(arg) {
            return function(elem) {
                return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
            };

        });
</script>
@endsection