@section('title', 'Withdraw History')
<div>
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <div class="row mb-2">
                        <div class="col-md-4">
                            <div class="search-box mr-2 mb-2 d-inline-block">
                                <div class="position-relative">
                                    <h4>Withdraw History</h4>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-8">
                            {{-- <div class="text-sm-right">
                                <button type="button" class="btn btn-success btn-rounded waves-effect waves-light mb-2 mr-2" wire:click="productUnitInfoModal"><i class="mdi mdi-plus mr-1"></i>Unit Info</button>
                            </div> --}}

                            <div class="row">
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="basicpill-firstname-input">From Date</label>
                                        <input type="date" class="form-control" wire:model.debounce.150ms="from_date" />
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="basicpill-firstname-input">To Date</label>
                                        <input type="date" class="form-control" wire:model.debounce.150ms="to_date" />
                                    </div>
                                </div>

                                <div class="col-md-4">
                                    <div wire:ignore class="form-group">
                                        <label for="basicpill-firstname-input">Agent</label>
                                        <select class="form-control form-select select2 updateTable"
                                                name="vendor_wise_search select2" id="vendor_wise_search" wire:model.debounce.150ms="vendor_wise_search">
                                            <option value="">Select Agent</option>
                                            @foreach ($referl_agents as $item)
                                                <option value="{{ $item->id }}">
                                                    {{ $item->business_name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div><!-- end col-->
                    </div>

                    <div  class="table-responsive">
                        <div  class="table-responsive">
                            <table class="table table-bordered dt-responsive nowrap" id="claimHistoryTable" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                                <thead>
                                <tr>
                                    <th>SL</th>
                                    <th>User</th>
                                    <th>Transaction ID</th>
                                    <th>Image</th>
                                    <th>Amount</th>
                                    <th>Payment Method</th>
                                    <th>Account</th>
                                    <th>Comments</th>
                                    <th>Request Date</th>
{{--                                    <th>Action</th>--}}
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($datas as $k => $data)
                                    <tr>
                                        <td>{{$k + 1}}</td>
                                        <td>{{$data->user?->Contact?->business_name}}</td>
                                        <td>{{$data->transaction_id}}</td>
                                        <td>
                                        @if($data->image != "")
                                            <a href="{{asset('storage/transction/'.$data->image)}}" target="_blank">Download</a>
                                            @else
                                            N/A
                                        @endif
                                        </td>
                                        <td>{{$data->requested_amount}}</td>
                                        <td>{{$data->paymentMethod?->types}}</td>
                                        <td>{{$data->paymentMethod?->ac_account}}</td>
                                        <td>{{$data->comments}}</td>
                                        <td>{{date('d-m-Y',strtotime($data->created_at))}}</td>
{{--                                        <td>--}}
{{--                                            <button class="btn btn-primary btn-sm" onclick="callEdit({{$data->id}})"><i class="bx bx-check font-size-18"></i></button>--}}
{{--                                        </td>--}}
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                            {{ $datas->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--  Modal content for the above example -->
    <div wire:ignore.self class="modal fade" id="productUnitInfoModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title mt-0" id="myLargeModalLabel">Update Payment Information</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form wire:submit.prevent="savePaymentInformation">
                    <div class="modal-body">

                        @if (session()->has('message'))
                            <div class="alert alert-success">
                                {{ session('message') }}
                            </div>
                        @endif

                        <div class="row">

                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label for="basicpill-firstname-input">Transaction Id <span>*</span></label>
                                    <input class="form-control" type="text" wire:model.lazy="transction_id" placeholder="Transaction ID">
                                    @error('transction_id') <span class="error">{{ $message }}</span> @enderror
                                </div>
                            </div>

                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label for="basicpill-firstname-input">Comments</label>
                                    <textarea class="form-control" wire:model.lazy="comments" placeholder="Enter Comments"></textarea>
                                </div>
                            </div>

                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label for="basicpill-firstname-input">Image</label>
                                    <input class="form-control" type="file" wire:model="image">
                                    @error('image') <span class="error">{{ $message }}</span> @enderror
                                </div>
                            </div>

                            <div class="col-lg-12">
                                <div class="form-group">
                                    <label for="basicpill-firstname-input">Status</label>
                                    <select class="form-control" name="status" wire:model.lazy="status">
                                        <option value="Success">Success</option>
                                        <option value="Rejected">Rejected</option>
                                    </select>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary" >Submit</button>
                    </div>
                </form>
            </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->

    {{-- Start Delete Modal --}}
    <div class="modal fade" id="DeletePopup" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-md modal-confirm">
            <div class="modal-content">
                <div class="modal-header flex-column">
                    <div class="icon-box">
                        <i class="material-icons">&#xE5CD;</i>
                    </div>
                    <h4 class="modal-title w-100">Are you sure?</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">
                    <p>Do you really want to delete this records?</p>
                </div>
                <div class="modal-footer justify-content-center">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                    <button class="btn btn-danger" wire:click="ConfirmDelete">Delete</button>
                </div>
            </div>
        </div>
    </div>
    {{-- End Delete Modal --}}
</div>
@push('scripts')
    <script>
        $(document).ready(function() {
            $('#vendor_wise_search').select2();
            $('#vendor_wise_search').on('change', function(e) {
                console.log("change status....");
                var data = $('#vendor_wise_search').select2("val");
            @this.set('vendor_wise_search', data);
            });
        });

        function callEdit(id) {
            //@this.call('unitEdit', id);
            @this.set('selected_id',id);
            //console.log("console you id" + id);
            $('#productUnitInfoModal').modal('show');
        }

    </script>
@endpush