@extends('layouts.app')
@section('include_css')
<style>
    .dates {
        height: 35px;
    }
</style>
@endsection
@section('content')
<input type="hidden" name="page" id="page" value="{{ $page ?? '' }}">
<div class="dashboard-wrapper">
    <div class="top-bar clearfix">
        <div class="row gutter">
            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                <div class="page-title">
                    <h4>Cheques List</h4>
                </div>
            </div>
            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">

            </div>
        </div>
    </div>
    <div class="main-container">
        <div class="row gutter">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="card">
                    <div class="card-body">
                        <form action="{{ route('cheque_payment.view') }}">

                            <!-- <div class="form-inline data_list_filters"> -->
                            <div class="row gutter">
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="">Pay Customer</label> <br>

                                        <input type="text" name="customer_name" class="form-control"
                                            id="searchcustomername" placeholder="PAY CUSTOMER"
                                            value="{{ request('customer_name') }}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="">Cheque return Ref no</label> <br>

                                        <input type="text" name="cheque_return_ref_no" class="form-control"
                                            id="searchcustomername" placeholder="PAY CUSTOMER"
                                            value="{{ request('cheque_return_ref_no') }}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="">Invoice Number</label> <br>
                                        <input type="text" class="form-control" name="invoice_no"
                                            value="{{ request('invoice_no') }}"
                                            placeholder="{{ __('xpayment::payment.labels.payment_customer') }}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="">Received Date</label><br>
                                        <input name="received_date" value="{{ request('received_date') }}"
                                            style="margin-bottom: 20px;" class="form-control dates">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label for="">Cheque Date</label><br>
                                        <input name="cheque_date" value="{{ request('cheque_date') }}"
                                            style="margin-bottom: 20px;" class="form-control dates">
                                    </div>
                                </div>
                            </div>
                            <div class="row gutter mt-3">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <div class="btn-group btn-group-toggle" data-toggle="buttons">
                                            <label class="btn btn-success @if (request('payment_status') === '' || request('payment_status') === 'on') active @endif">
                                                <input type="radio" name="payment_status" @if (request('payment_status')==='' || request('payment_status')==='on' ) checked @endif> All
                                            </label>
                                            <label class="btn btn-success" id="all_status" data-toggle="tooltip"
                                                data-placement="top">
                                                <input type="radio" name="payment_status" value="Pending"
                                                    @if (request('payment_status')=='Pending' ) checked @endif> Pending
                                            </label>
                                            <label class="btn btn-success" id="all_status" data-toggle="tooltip"
                                                data-placement="top">
                                                <input type="radio" name="payment_status" value="Cleared"
                                                    @if (request('payment_status')=='Cleared' ) checked @endif> Cleared
                                            </label>
                                            <label class="btn btn-success ">
                                                <input type="radio" name="payment_status" value="Reject"
                                                    @if (request('payment_status')=='Reject' ) checked @endif> Rejected
                                            </label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-inline submit-and-clear-buttons-div">
                                    <div class="form-group ml-1">
                                        <button type="submit"
                                            class="btn btn-gradient-primary waves-effect waves-light float-right mb-3">Submit</button>
                                    </div>
                                    <div class="form-group ml-1">
                                        <a href="{{ route('cheque_payment.view') }}"
                                            class="btn btn-gradient-primary waves-effect waves-light float-right mb-3">Reset</a>
                                    </div>
                                </div>
                            </div>
                        </form>

                    </div>

                </div>
                <div class="table-responsive">
                    <table id="payment_list_table" class="table table-striped table-bordered no-margin" cellspacing="0"
                        width="100%">
                        <thead>
                            <tr>
                                <th hidden></th>
                                <th>Customer</th>
                                <th>Cheque NO</th>
                                <th>Received Date</th>
                                <th>Cheque Date</th>
                                <th>Payment Type</th>
                                <th>Cheque Return Ref Number</th>
                                <th>Cheque Return Date</th>
                                <th>{{ __('xpayment::payment.labels.payment_amount') }}</th>
                                <th>{{ __('xpayment::payment.labels.payment_status') }}</th>
                                <th>{{ __('common.labels.action') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($cheques as $cheque)
                            <tr>

                                <td hidden>{{ $cheque->id }}</td>
                                <td>{{ $cheque->customer->company_name }}</td>
                                <td>{{ $cheque->payment_ref_no }}</td>
                                <td>{{ $cheque->payment_date }}</td>
                                <td>{{ $cheque->cheque_date }}</td>
                                <td>{{ $cheque->cheque_payment_type }}</td>
                                <td>{{ $cheque->cheque_rtn_ref_no ?? 'N/A' }}</td>
                                <td>{{ $cheque->cheque_return_date }}</td>
                                <td>{{ App\Http\Helper::formatPrice($cheque->payment_amount) }}</td>
                                <td>
                                    @if ($cheque->status == 0)
                                    <span class="text-default"><strong>Pending</strong></span>
                                    @elseif ($cheque->status == 2)
                                    <span class="text-danger"><strong>Reject</strong></span>
                                    @else
                                    <span class="text-success"><strong>Cleared</strong></span>
                                    @endif
                                </td>
                                <td>
                                    @php
                                    $approve_or_reject_cheque_payment_permission = false;
                                    if (Auth::user()->can('MANAGE_CHEQUE_PAYMENT')) {
                                    $approve_or_reject_cheque_payment_permission = true;
                                    }
                                    @endphp
                                    @if ($approve_or_reject_cheque_payment_permission)
                                    @if ($cheque->status == 0)
                                    <button
                                        class="btn btn-success btn-sm payment-approve-button fa fa-check"
                                        aria-hidden="true"></button>
                                    <button class="btn btn-danger btn-sm payment-delete-button fas fa-times"
                                        aria-hidden="true"></button>
                                    @elseif ($cheque->status == 1)
                                    <button class="btn btn-danger btn-sm payment-delete-button fas fa-times"
                                        aria-hidden="true"></button>
                                    @endif
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                    <div class="d-flex justify-content-end">
                        {{ $cheques->appends($_GET)->links() }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('custom_script')
<script>
    $(document).ready(function() {
        // window.onbeforeunload = function() {
        //     return "Are you sure you want to leave?";
        // };
        $('#all_status').tooltip('show');


        $('#payment_list_table tbody').on('click', 'button.payment-print-button', function(e) {
            var $btn = $(this);
            $btn.button('loading');
            var data = payment_list_table.row($(this).parents('tr')).data();
            var params = {
                invoice_id: data['invoice_id'],
                record_payment_id: data['id']
            };
            $.ajax({
                url: BASE + 'invoice/print_payment',
                type: 'POST',
                dataType: 'JSON',
                data: $.param(params),
                success: function(response) {
                    if (response.status == 'success') {
                        window.open(response.url);
                        $btn.button('reset');

                    } else {
                        notification(response);
                        $btn.button('reset');
                        return false;
                    }
                },
                error: function(xhr, ajaxOptions, thrownError) {
                    notificationError(xhr, ajaxOptions, thrownError);
                }
            });
            return false;
        });
        $('#payment_list_table tbody').on('click', 'button.payment-edit-button', function(e) {
            var data = payment_list_table.row($(this).parents('tr')).data();
            window.payment_model = $.confirm({
                title: '',
                draggable: true,
                boxWidth: '80%',
                closeIcon: true,
                useBootstrap: false,
                buttons: {
                    close: function() {}
                },
                content: 'url:' + BASE + 'payment/view/' + data['id'],
                onContentReady: function() {},
                columnClass: 'medium',
            });
            return false;
        })
        $('#payment_list_table tbody').on('click', 'button.payment-delete-button', function(e) {
            var data = {};
            var firstTDValue = $(this).closest('tr').find('td:first').text().trim();
            data['id'] = firstTDValue;
            $.confirm({
                title: 'Cheque Reject!',
                content: 'Are you sure?!',
                buttons: {
                    cancel: function() {},
                    delete: {
                        text: 'Reject',
                        btnClass: 'btn-danger',
                        keys: ['enter', 'shift'],
                        action: function() {
                            var payment_details = $('#payment_list_table :input')
                                .serialize();
                            var params = {
                                cheque_id: data['id']
                            };
                            $.ajax({
                                url: BASE + 'payment/reject_payment',
                                type: 'POST',
                                dataType: 'JSON',
                                data: $.param(params),
                                success: function(response) {
                                    if (response.status == 'success') {
                                        // payment_list_table.ajax.reload();
                                        location.reload();
                                    } else {
                                        notification(response);
                                        return false;
                                    }
                                },
                                error: function(xhr, ajaxOptions, thrownError) {
                                    notificationError(xhr, ajaxOptions,
                                        thrownError);
                                }
                            });
                        }
                    }
                }
            });
        });
        $('#payment_list_table tbody').on('click', 'button.payment-approve-button', function(e) {
            var data = payment_list_table.row($(this).parents('tr')).data();
            $.confirm({
                title: 'Cheque Approve!',
                content: 'Are you sure?',
                buttons: {
                    cancel: function() {},
                    approve: {
                        text: 'Approve',
                        btnClass: 'btn-success',
                        keys: ['enter', 'shift'],
                        action: function() {


                            var params = {
                                cheque_id: data['id']
                            };
                            $.ajax({
                                url: BASE + 'payment/approve_payment',
                                type: 'POST',
                                dataType: 'JSON',
                                data: $.param(params),
                                success: function(response) {
                                    if (response.status == 'success') {
                                        payment_list_table.ajax.reload();
                                    } else {
                                        notification(response);
                                        return false;
                                    }
                                },
                                error: function(xhr, ajaxOptions, thrownError) {
                                    notificationError(xhr, ajaxOptions,
                                        thrownError);
                                }
                            });
                        }
                    }
                }
            });
        });

        function updateAllCheques() {
            $.ajax({
                method: 'POST',
                url: "{{ route('payments.update_all_cheques') }}",
                success: function(response) {
                    payment_list_table.ajax.reload();
                }
            });
        }
        updateAllCheques();
    });
</script>
@endsection