@extends('backend.layouts.app')

@section('content')

@php
$paymentHistory = \App\Models\UserPayoutsHistory::where('user_id',Auth::user()->id)->latest()->paginate(10);
$CommissionHistory = \App\Models\AffiliatePaymentHistory::with('user')->where('affiliate_id',Auth::user()->id)->latest()->paginate(10);
@endphp

<div class="aiz-titlebar text-left mt-2 mb-3">
    <div class="align-items-center">
        <h1 class="h3">{{translate('My Wallet')}}</h1>
    </div>
</div>

<div class="row gutters-10">
    <div class="col-md-4 mx-auto mb-3">
        <div class="bg-grad-1 text-white rounded-lg overflow-hidden">
            <span
                class="size-30px rounded-circle mx-auto bg-soft-primary d-flex align-items-center justify-content-center mt-3">
                <!--  <i class="las la-dollar-sign la-2x text-white"></i> -->
            </span>
            <div class="px-3 pt-3 pb-3">
                <div class="h4 fw-700 text-center">{{ single_price($wallets) }}</div>
                <div class="opacity-50 text-center">{{ translate('Wallet Balance') }}</div>
            </div>
        </div>
    </div>
    <!-- <div class="col-md-4 mx-auto mb-3">
            <div class="p-3 rounded mb-3 c-pointer text-center bg-white shadow-sm hov-shadow-lg has-transition"
                onclick="show_request_modal()">
                <span
                    class="size-60px rounded-circle mx-auto bg-secondary d-flex align-items-center justify-content-center mb-3">
                    <i class="las la-plus la-3x text-white"></i>
                </span>
                <div class="fs-18 text-primary">{{ translate('Send Withdraw Request') }}</div>
            </div>
        </div> -->
</div>
<div class="card wallet_history">
    <ul class="nav nav-tabs flex-nowrap" id="myTab" role="tablist">
        <li class="nav-item w-100" role="presentation">
            <button class="nav-link w-100 border-0 rounded-0 @if(request()->get('active_tab') == 'home' || !request()->get('active_tab')) active @endif" id="home-tab" data-toggle="tab" data-target="#home" type="button" role="tab" aria-controls="home" aria-selected="true">{{ translate('Transaction History')}}</button>
        </li>
        <li class="nav-item w-100" role="presentation">
            <button class="nav-link w-100 border-0 rounded-0 @if(request()->get('active_tab') == 'profile') active @endif" id="profile-tab" data-toggle="tab" data-target="#profile" type="button" role="tab" aria-controls="profile" aria-selected="false">{{ translate('Commission History')}}</button>
        </li>
    </ul>
    <div class="tab-content" id="myTabContent">
        <div class="tab-pane fade @if(request()->get('active_tab') == 'home' || !request()->get('active_tab')) show active @endif" id="home" role="tabpanel" aria-labelledby="home-tab">
            @if (count($paymentHistory) > 0)
            <div class="card-body">
                <div class="table-responsive"> 
                   <table class="table aiz-table mb-0">
                    <thead>
                        <tr>
                            <th class="text-right">{{ translate('Amount')}}</th>
                            <th>{{ translate('Message')}}</th>
                            <th data-breakpoints="md">{{ translate('Payment Method')}}</th>
                            <th data-breakpoints="md">{{ translate('Status')}}</th>
                            <th>{{ translate('Date')}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($paymentHistory as $key => $value)
                        <tr>
                            <td>{{single_price($value->amount) }}</td>
                            <td>{{$value->message }}</td>
                            <td>{{$value->payment_method }}</td>
                            <td><span class="badge badge-success" style="padding: 12px 25px 12px 25px;border-radius:30px;"><b>{{$value->status }}</b></span></td>
                            <td>{{ date('d-m-Y',strtotime($value->created_at)) }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                     </table>
                 </div>  
                <div class="aiz-pagination">
                    {{ $paymentHistory->appends(array_merge(request()->input(), ['active_tab' => 'home']))->links() }}
                </div>
            </div>
            @else
            <center>No Data Available</center>
            @endif
        </div>
        <div class="tab-pane fade @if(request()->get('active_tab') == 'profile') show active @endif" id="profile" role="tabpanel" aria-labelledby="profile-tab">
            @if (count($CommissionHistory) > 0)
            <div class="card-body">
                <div class="table-responsive"> 
                  <table class="table aiz-table mb-0">
                    <thead>
                        <tr>
                            <th data-breakpoints="md">{{ translate('Seller name')}}</th>
                            <th data-breakpoints="md">{{ translate('Contact number')}}</th>
                            <th data-breakpoints="md">{{ translate('Email')}}</th>
                            <th>{{ translate('Commssion Amount ')}}</th>
                            <th data-breakpoints="md">{{ translate('Seller Package')}}</th>
                            <th class="text-right">{{ translate('Amount')}}</th>
                            <th>{{ translate('Date')}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($CommissionHistory as $key => $value)
                        @php
                        $sellerId = isset($value->seller_id) ? $value->seller_id : '';
                        $sellerPackagePaymentHistory = \App\Models\SellerPackagePayment::with('seller_package')->where('user_id', $sellerId)->first();
                        @endphp
                        <tr>
                            <td>{{ isset($value->user->name) ? $value->user->name : '-' }}</td>
                            <td>{{ isset($value->user->phone) ? $value->user->phone : '-' }}</td>
                            <td>{{ isset($value->user->email) ? $value->user->email : '-' }}</td>
                            <td>{{ single_price($value->amount) }} </td>
                            <td>{{ isset($sellerPackagePaymentHistory->seller_package->name) ? $sellerPackagePaymentHistory->seller_package->name : '' }}</td>
                            <td>{{ isset($sellerPackagePaymentHistory->seller_package->amount) ? single_price($sellerPackagePaymentHistory->seller_package->amount) : '' }}</td>
                            <td>{{ date('d-m-Y', strtotime($value->created_at)) }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                </div>
                <div class="aiz-pagination">
                    {{ $CommissionHistory->appends(array_merge(request()->input(), ['active_tab' => 'profile']))->links() }}
                </div>
            </div>
            @else
            <center>No Data Available</center>
            @endif
        </div>
    </div>
</div>

@endsection


@section('modal')

<!-- money withdraw model-->
<div class="modal fade" id="request_modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">{{ translate('Send A Withdraw Request') }}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
            </div>
            <form class="" action="{{ route('money_withdraw_request.store') }}" method="post">
                @csrf
                <div class="modal-body gry-bg px-3 pt-3">
                    <div class="row">
                        <div class="col-md-3">
                            <label>{{ translate('Amount')}} <span class="text-danger">*</span></label>
                        </div>
                        <div class="col-md-9">
                            <input type="number" lang="en" class="form-control mb-3" name="amount" min="{{ get_setting('minimum_seller_amount_withdraw') }}" max="" placeholder="{{ translate('Amount') }}" required>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <label>{{ translate('Message')}}</label>
                        </div>
                        <div class="col-md-9">
                            <textarea name="message" rows="8" class="form-control mb-3"></textarea>
                        </div>
                    </div>
                    <div class="form-group text-right">
                        <button type="submit" class="btn btn-sm btn-primary">{{translate('Send')}}</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- offline payment Modal -->
<div class="modal fade" id="offline_wallet_recharge_modal" tabindex="-1" role="dialog"
    aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">{{ translate('Offline Recharge Wallet') }}</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"></button>
            </div>
            <div id="offline_wallet_recharge_modal_body"></div>
        </div>
    </div>
</div>

@endsection

@section('script')
<script type="text/javascript">
    function show_request_modal() {
        $('#request_modal').modal('show');
    }

    function show_make_wallet_recharge_modal() {
        $.post('', {
                _token: '{{ csrf_token() }}'
            },
            function(data) {
                $('#offline_wallet_recharge_modal_body').html(data);
                $('#offline_wallet_recharge_modal').modal('show');
            });
    }
</script>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const tabs = document.querySelectorAll('#myTab .nav-link');
        const hiddenField = document.createElement('input');
        hiddenField.type = 'hidden';
        hiddenField.name = 'active_tab';
        document.querySelector('.aiz-pagination form').appendChild(hiddenField);

        tabs.forEach(tab => {
            tab.addEventListener('click', function() {
                hiddenField.value = this.getAttribute('aria-controls');
            });
        });
    });

    function activeTab() {
        window.location.href = "{{ route('wallet.transactions')}}";
    }
</script>
@endsection