@extends('layouts.user_dashboard_main')
@section('content')
    <div class="dashboard-recent-act-rg-card">
        <div class="recent-activity mw-100">

            <div class="list-header">
                <div class="left-info">
                    <h3>@lang('public.Transactions')</h3>
                </div>
                <div class="right-info">
                    <div class="form-group mb-0">
                        <select class="form-control select1">
                            <option>@lang('public.Last_Month')</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="recent-activity-table data-th-responsive">
                <table>
                    <thead>
                        <tr>
                            <th>@lang('public.Name')</th>
                            <th>@lang('public.Amount')</th>
                            <th>@lang('public.Date')</th>
                            <th>@lang('public.Status')</th>
                            <th class="text-center">@lang('public.Action')</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{-- @php
                    dd($all_transaction_list);
                @endphp --}}
                        @foreach ($all_transaction_list as $key => $item)
                            <tr>
                                <td data-th="Name">
                                    <figure class="user-img-w-text">
                                        <div class="img-container">
                                            <img
                                                @if ($item['status'] == 'Paid') src="{{ asset('storage/profile_images/' . $item['receiver_details']['profile_photo']) }}"  @else src="{{ asset('storage/profile_images/' . $item['sender_details']['profile_photo']) }}" @endif>
                                        </div>

                                        <figcaption>
                                            @if ($item['status'] == 'Paid')
                                                {{ $item['receiver_details']['name'] }}
                                            @else
                                                {{ $item['sender_details']['name'] }}
                                            @endif
                                        </figcaption>
                                    </figure>
                                </td>
                                <td data-th="Amount">
                                    <div class="price_value text-left">{{ $item['amount'] }}</div>
                                </td>
                                <td data-th="Date">
                                    <div class="date_value">{{ $item['date'] }}</div>
                                </td>
                                <td data-th="Status">
                                    <div class="d-flex">
                                        <div class="td-status-box paid">
                                            
                                            {{ $item['status'] }}
                                        </div>
                                    </div>
                                </td>
                                <td data-th="Action">
                                    <div class="dropdown td-more-action theme-dropdown-s1">
                                        <button class="dropdown-toggle mx-auto" type="button" id="dropdownMenuButton"
                                            data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            <img src="{{ asset('frontend/assets/images/td-more-action.svg') }}">
                                        </button>
                                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton"
                                            style="">
                                            <a class="dropdown-item" data-toggle="modal"
                                                data-target="#transactionSuccesful-alert-modal-{{ $key }}"
                                                href="#">@lang('public.Transaction_Details')</a>
                                            @if ($item['status'] == 'Paid')
                                                <a class="dropdown-item " data-toggle="modal"
                                                    data-target="#refund-modal-{{ $key }}" href="#">Request
                                                    for Refund</a>
                                            @endif
                                        </div>
                                    </div>
                                </td>
                            </tr>

                            <div class="modal transactionSuccesful-alert-modal"
                                id="transactionSuccesful-alert-modal-{{ $key }}">
                                <div class="modal-dialog">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            @if ($item['status'] == 'Withdraw')
                                                <h4>@lang('public.Withdraw_Succesful')</h4>
                                            @else
                                                <h4>@lang('public.Transaction_Succesful')</h4>
                                            @endif
                                            <h5>{{ $item['date'] }}</h5>
                                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                                        </div>

                                        <div class="modal-body">
                                            <div class="transactionSuccesful-box">
                                                <div class="receivedfrom-info">
                                                    <h3>
                                                        @if ($item['status'] == 'Paid')
                                                            @lang('public.Paid_to')
                                                        @elseif($item['status'] == 'Withdraw')
                                                            @lang('public.Withdraw_from')
                                                        @else
                                                            @lang('public.Received_from')
                                                        @endif
                                                    </h3>
                                                    <div class="recFrom-row">
                                                        <figure>
                                                            <div class="icon-container">
                                                                <img
                                                                    @if ($item['status'] == 'Paid') src="{{ asset('frontend/assets/images/up arrow.svg') }}"  @else  src="{{ asset('frontend/assets/images/arow-bottom-left.svg') }}" @endif>
                                                            </div>
                                                            <figcaption>
                                                                <h4>
                                                                    @if ($item['status'] == 'Paid')
                                                                        {{ $item['receiver_details']['name'] }}
                                                                    @else
                                                                        {{ $item['sender_details']['name'] }}
                                                                    @endif
                                                                </h4>
                                                                <h5>
                                                                    @if ($item['status'] == 'Paid')
                                                                        {{ $item['receiver_details']['country_code'] }}
                                                                        {{ $item['receiver_details']['phone'] }}
                                                                    @else
                                                                        {{ $item['sender_details']['country_code'] }}
                                                                        {{ $item['sender_details']['phone'] }}
                                                                    @endif
                                                                </h5>
                                                            </figcaption>
                                                        </figure>
                                                        <div class="price">{{ $item['amount'] }}</div>
                                                    </div>
                                                </div>



                                                <div class="transfer-info">
                                                    <h3><img
                                                            src="{{ asset('frontend/assets/images/icon-park-outline_transaction-order.svg') }}">@lang('public.Transfer_Details')
                                                    </h3>
                                                    <h4>@lang('public.Transaction_ID')</h4>
                                                    <div class="id-with-rg-icon">
                                                        <h3><b id="copy_{{ $key }}">{{ $item['id'] }}</b>
                                                        </h3>
                                                        <button type="button"
                                                            onclick="copyToClipboard('#copy_{{ $key }}')"
                                                            class="copy_btn"><img
                                                                src="{{ asset('frontend/assets/images/copy-icon.svg') }}"></button>
                                                    </div>
                                                    @if ($item['status'] != 'Withdraw')
                                                        <h4>@lang('public.Credited_to')</h4>
                                                        <div class="credit_info">
                                                            <figure>
                                                                <div class="icon-container">
                                                                    <img
                                                                        src="{{ asset('frontend/assets/images/ri_bank-line.svg') }}">
                                                                </div>
                                                                <figcaption>
                                                                    <h5>
                                                                        <span>
                                                                            @if ($item['status'] == 'Paid')
                                                                                {{ $item['receiver_details']['name'] }}
                                                                                @lang('public.Transcash_Wallet')
                                                                            @else
                                                                                {{ auth()->user()->name }}@lang('public.Transcash_Wallet')
                                                                            @endif
                                                                        </span>
                                                                        <b>+@if ($item['status'] == 'Paid')
                                                                                {{ str_replace('-', '', $item['amount']) }}
                                                                            @else
                                                                                {{ str_replace('+', '', $item['amount']) }}
                                                                            @endif </b>
                                                                    </h5>

                                                                </figcaption>
                                                            </figure>
                                                        </div>
                                                    @endif


                                                </div>
                                                <div class="actions-btns">
                                                    <a href="javascript:;" class="download-btn">
                                                        <div class="icon-container">
                                                            <img
                                                                src="{{ asset('frontend/assets/images/down-arow-btn.svg') }}">
                                                        </div>
                                                        <span>@lang('public.Download_Receipt')</span>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="modal transactionSuccesful-alert-modal" id="refund-modal-{{ $key }}">
                                <div class="modal-dialog">
                                    <div class="modal-content">
                                        <div class="modal-header" style="background: red!important">

                                            <h4>Request For Refund</h4>

                                            <button type="button" class="close" data-dismiss="modal">&times;</button>
                                        </div>

                                        <div class="modal-body">
                                            <div class="container ">
                                                <div class="row justify-content-center">
                                                    <div class="col-lg-12">

                                                        <form class="footer-row" id="refund-request" method="post"
                                                            action="{{ route('refundRequest') }}"
                                                            enctype="multipart/form-data">
                                                            @csrf
                                                            <div class="row">
                                                                <label for=""> <b>Oder Id</b> </label>
                                                                <input type="text" name="order_id" id="order_id"
                                                                    value="{{ $item['id'] }}" class="form-control"
                                                                    readonly>
                                                            </div>
                                                            <div class="row  mt-2">
                                                                <div class="col-md-6">
                                                                    <label for="your-name" class="form-label">Your
                                                                        Name</label>
                                                                    <input type="text" class="form-control"
                                                                        id="name" name="name" required>
                                                                </div>
                                                                <div class="col-md-6">
                                                                    <label for="your-email" class="form-label">Your
                                                                        Email</label>
                                                                    <input type="email" class="form-control"
                                                                        id="email" name="email" required>
                                                                </div>

                                                                <div class="col-md-6 ">
                                                                    <label for="your-subject" class="form-label">Choose
                                                                        Reason</label>
                                                                    <select class="form-control" name="reason" id="reason_option" required>
                                                                        <option value="">---Select---</option>
                                                                        <option value="1">Option 1</option>
                                                                        <option value="2">Option 2</option>
                                                                        <option value="3">Option 3</option>
                                                                    </select>
                                                                </div>
                                                                <div class="col-12">
                                                                    <label for="your-message" class="form-label">Your
                                                                        Message</label>
                                                                    <textarea class="form-control" id="message" name="message" rows="5" required></textarea>
                                                                </div>
                                                                <div class="col-12">
                                                                    <div class="row justify-content-center">
                                                                        <div class="col-md-6 mt-2">
                                                                            <button type="submit"
                                                                                class="btn btn-dark w-100 fw-bold">Send</button>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </tbody>
                </table>
            </div>

        </div>
    </div>
    @if (Session::has('modal_message_success'))
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.css">
        <script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.js">
        </script>

        <script type="text/javascript">
            $(document).ready(function() {
                Swal.fire({
                    type: "success",
                    title: "Refud request has been submitted",
                    text: "Refund will be done after Admin approval"
                })
            });
        </script>
    @endif
@endsection
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.33.1/sweetalert2.js">
</script>
<script>
    function copyToClipboard(element) {
        console.log('hit', element);
        var temp = $("<input>");
        $("body").append(temp);
        temp.val($(`${element}`).text()).select();
        document.execCommand("copy");
        temp.remove();
        Swal.fire('Copied!!')
    }

    
    // $('#refund-request').submit(function(event) {
    //     event.preventDefault();
    //     $order_id = $('#order_id').val();
    //     $name = $('#name').val();
    //     $email= $('#email').val();
    //     $option = $('#reason_option').val();
    //     $message = $('#message').val();
    //     console.log('option', $option);

    //     Swal.fire({
    //         title: 'Are you sure?',
    //         text: "Do you really want to refund this payment !",
    //         icon: 'warning',
    //         showCancelButton: true,
    //         confirmButtonColor: '#3085d6',
    //         cancelButtonColor: '#d33',
    //         confirmButtonText: 'Yes, submit it!'
    //     }).then((result) => {

    //         if (result.value == true) {

    //             $.ajaxSetup({
    //                 headers: {
    //                     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    //                 }
    //             });
    //             $.ajax({

    //                 url: "{{ route('refundRequest') }}",
    //                 type: "POST",
    //                 data: {
    //                     order_id: order_id,
    //                     name: $name,
    //                     email: $email,
    //                     option: $option,
    //                     message:message
    //                 },

    //                 success: function(data) {
    //                     $(".loadingScreen").removeClass('show');

    //                     console.log(data);
    //                     if (data.status == 200) {

    //                         swal({
    //                             title: "Payement Done!",
    //                             text: "Your amount has been debited from your Transcash Wallet!",
    //                             type: "success"
    //                         }).then(function() {
    //                             window.location.reload();
    //                         });


    //                     } else if (data.status == 202) {
    //                         swal({
    //                             title: "Payement Failed!",
    //                             text: "Insufficient Balance! Please Add money in Transcash Wallet",
    //                             type: "error"
    //                         }).then(function() {
    //                             window.location.reload();
    //                         });

    //                     } else {
    //                         swal({
    //                             title: "Payement Success!",
    //                             text: "Notification Can'not sent !!",
    //                             type: "success"
    //                         }).then(function() {
    //                             window.location.reload();
    //                         });

    //                     }

    //                 },
    //                 complete: function() {
    //                     $(".loadingScreen").removeClass('show');

    //                 }


    //             })
    //         }
    //     });

    // });
</script>