@extends('layouts.app')

@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>{{ __('xpayment::payment.headings.payment') }}</h4>
                    </div>
                </div>
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                    @can('ADD_PAYMENT')
                        <ul class="right-stats" id="mini-nav-right">
                            <a href="{{ url('payment/create') }}" class="btn btn-primary"><i class="fa fa-plus"
                                    aria-hidden="true"></i>
                                {{ __('xpayment::payment.buttons.new_payment') }}</a>
                        </ul>
                    @endcan
                </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('payment.index') }}">

                                <div class="form-inline data_list_filters">

                                    <div class="form-group">
                                        <label for="">Payment Receipt Number</label> <br>
                                        <input type="text" class="form-control" name="payment_receipt_no" value="{{request('payment_receipt_no')}}" id="searchpaymentycode"
                                            placeholder="{{ __('xpayment::payment.labels.payment_receipt_no') }}">
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-12">
                                            <br><label for="">Payment Date</label> <br>
                                            <input name="payment_date" value="{{request('payment_date')}}" style="margin-bottom: 20px;" class="form-control dates">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="">Pay Customer</label> <br>
                                        <input type="text" class="form-control" name="customer_name" value="{{request('customer_name')}}" id="searchcustomername"
                                            placeholder="{{ __('xpayment::payment.labels.payment_customer') }}">
                                    </div>
                                    <div class="form-group">
                                        <label for="rep">Select Rep</label> <br>
                                        <select name="rep_id" id="rep" class="form-control select2 select3">
                                            <option value="">Select Rep</option>
                                            @foreach ($roles as $role)
                                                <option value="{{ $role->id }}" 
                                                    @if (request('rep_id') == $role->id) selected @endif>
                                                    {{ $role->username }} - {{ $role->fname }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="form-group">
                                        <label for="">Cheque no</label> <br>
                                        <input type="text" class="form-control" name="cheque_no" value="{{request('cheque_no')}}" id="searchcustomername"
                                            placeholder="CHEQUE NO">
                                    </div>
                                    <div class="form-group">
                                        <br>
                                        <div class="btn-group" data-toggle="buttons">
                                            <label class="btn btn-primary active">
                                                <input type="radio" name="payment_status" value="" @if(request('payment_status') == '') checked @endif> All
                                            </label>
                                            <label class="btn btn-primary" id="all_status" data-toggle="tooltip"
                                                data-placement="top" title="Status">
                                                <input type="radio" name="payment_status" value="COMPLETED" @if(request('payment_status') == 'COMPLETED') checked @endif> Completed
                                            </label>
                                            <label class="btn btn-primary ">
                                                <input type="radio" name="payment_status" value="CANCELLED" @if(request('payment_status') == 'CANCELLED') checked @endif> Cancelled
                                            </label>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        &nbsp;&nbsp;<button type="submit" style="margin-top: 35px;" class="btn btn-gradient-primary waves-effect waves-light float-right mb-3">Submit</button>
                                    </div>
                                    <div class="form-group">
                                        &nbsp;&nbsp; <a href="{{ route('payment.index') }}" style="margin-top: 35px;" class="btn btn-gradient-primary waves-effect waves-light float-right mb-3">Reset</a>
                                    </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></th>
                                    <th>PAYMENT RECEIPT NUMBER</th>
                                    <th>PAYMENT METHOD</th>
                                    <th>PAY CUSTOMER</th>
                                    <th>CHEQUE NO</th>
                                    <th>PAYMENT REMARKS</th>
                                    <th>AMOUNT</th>
                                    <th>PAYMENT DATE</th>
                                    <th>STATUS</th>
                                    <th>REP</th>
                                    <th>ACTION</th>
                                </tr>
                            </thead>
                            <tbody>

                                @foreach ($payments as $payment)
                                <tr>
                                    <td>{{$payment->id}}</td>
                                    <td>{{ $payment->payment_code }}</td>
                                    <td>{{$payment->payment_method}}</td>
                                    <td>
                                        @if (isset($payment->invoice->customer->business_name))
                                            {{ $payment->invoice->customer->business_name }}
                                        @elseif ((isset($payment->customer->business_name)))
                                            {{ $payment->customer->business_name }}
                                        @else
                                            -
                                        @endif
                                         -
                                        @if (isset($payment->invoice->customer->company_name))
                                            {{ $payment->invoice->customer->company_name }}
                                        @elseif ((isset($payment->customer->company_name)))
                                            {{ $payment->customer->company_name }}
                                        @else
                                            -
                                        @endif
                                    </td>
                                    {{-- <td>{{$payment->cheque_id ?? ''}}</td> --}}
                                    <td>{{!empty($payment->cheque->payment_ref_no) ? $payment->cheque->payment_ref_no : ''}}</td>
                                    <td>{{ $payment->payment_remarks }}</td>
                                    <td>{{ App\Http\Helper::formatPrice($payment->payment_amount) }}</td>
                                    <td>{{ $payment->payment_date }}</td>
                                    <td>
                                        @if ($payment->status != 0)
                                            <span class="text-success"><strong>Completed</strong></span>
                                        @elseif ($payment->cheque_status == 2)
                                            <span class="text-danger"><strong>Cancelled</strong></span>
                                        @else
                                            <span class="text-warning"><strong>Pending</strong></span>
                                        @endif
                                    </td>
                                    <td>
                                        @if (!empty($payment->rep_id))
                                            {{-- @php
                                                $rep = Pramix\XUser\Models\User::find($payment->rep_id);
                                            @endphp
                                            {{ $rep->username or 'N/A' }} --}}

                                           @php
                                                $rep = DB::table('users')->find($payment->rep_id);
                                                // dd($rep);
                                            @endphp
                                       {{ $rep->username }}
                                        @else
                                            {{ 'N/A' }}
                                        @endif
                                    </td>
                                    <td>
                                        <button class="btn btn-warning btn-sm payment-view-button fa fa-eye" aria-hidden="true"></button>
                                        {{-- <a href="{{ url('/payment/' . $payment->id . '/edit') }}" class="btn btn-blue btn-sm fas fa-edit payment-edit-button"></a> --}}
                                        <button class="btn btn-danger btn-sm delete_payment fa fa-trash-o" aria-hidden="true"></button>
                                    </td>
                                </tr>
                            @endforeach

                            </tbody>
                        </table>
                        <div class="d-flex justify-content-end">
                            {{ $payments->appends($_GET)->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection


@section('custom_script')
    <script>
        $(document).ready(function() {



            $('#payment_list_table tbody').on('click', 'button.payment-print-button', function(e) {

                // var $btn = $(this);
                // $btn.button('loading');
                var data = {};
                var payment_id = $('#payment_id').val();
                data['id'] = payment_id;
                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;
            });

            $(document).on('click', '.payment-view-button', function(e) {

                var data = {};
                var firstTDValue = $(this).closest('tr').find('td:first').text().trim();
                data['id'] = firstTDValue;
                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;
            });
            // $(document).on('click', '.delete_payment', function(e) {
            //     var data = {};
            //     var firstTDValue = $(this).closest('tr').find('td:first').text().trim();
            //     data['id'] = firstTDValue;
            //     var parent = $(this).parents('tr');
            //     let url = "{{ route('payment.destroy', ':id') }}";
            //     url = url.replace(':id', data['id']);
            //     var delete_confirm = $.confirm({
            //         title: "Delete Payment",
            //         type: 'red',
            //         buttons: {
            //             delete: {
            //                 text: 'Delete',
            //                 btnClass: 'btn-red',
            //                 action: function() {
            //                     e.preventDefault();
            //                     var params = {};
            //                     $.ajax({
            //                         url: url,
            //                         type: 'DELETE',
            //                         dataType: 'JSON',
            //                         data: $.param(params),
            //                         success: function(response) {
            //                             if (response.status == 'error') {
            //                                 delete_confirm.close();
            //                                 notification(response);
            //                             } else {
            //                                 delete_confirm.close();
            //                                 notification(response);
            //                                location.reload();
            //                             }
            //                         },
            //                         error: function(errors) {}
            //                     });
            //                     e.preventDefault();
            //                     return false;
            //                 }
            //             },
            //             close: function() {}
            //         }
            //     });
            // });
            $(document).on('click', '.delete_payment', function(e) {
                var data = {};
                var firstTDValue = $(this).closest('tr').find('td:first').text().trim();
                data['id'] = firstTDValue;
                var parent = $(this).parents('tr');
                let url = "{{ route('payment.destroy', ':id') }}";
                url = url.replace(':id', data['id']);
                var delete_confirm = $.confirm({
                title: "Delete Payment",
                type: 'red',
                buttons: {
                delete: {
                text: 'Delete',
                btnClass: 'btn-red',
                action: function() {
                    e.preventDefault();
                    var params = {};

                    // Get CSRF token value from the page
                    var csrfToken = $('meta[name="csrf-token"]').attr('content');

                    // Include CSRF token in headers
                    $.ajaxSetup({
                        headers: {
                            'X-CSRF-TOKEN': csrfToken
                        }
                    });

                    $.ajax({
                        url: url,
                        type: 'DELETE',
                        dataType: 'JSON',
                        data: $.param(params),
                        success: function(response) {
                            if (response.status == 'error') {
                                delete_confirm.close();
                                notification(response);
                            } else {
                                delete_confirm.close();
                                notification(response);
                                location.reload();
                            }
                        },
                        error: function(errors) {}
                    });
                    e.preventDefault();
                    return false;
                }
            },
            close: function() {}
        }
    });
});

        });
    </script>
@endsection