@extends('layouts.master')
@section('title', 'Withdrawals Dashboard')

@section('breadcrumb-text')
    <div class="row w-100 m-0 p-0">
        <div class="col-12 col-md-6 col-lg-6 col-xl-6 col-sm-12 m-0 p-0">
            <h1 class="w-100">{{__('Withdrawals Dashboard')}}</h1>
        </div>
        <div class="col-12 col-md-6 col-lg-6 col-xl-6 col-sm-12 m-0 p-0 d-flex justify-content-end">
            @can('withdrawal-view')
                <a type="button" class="btn btn-sm btn-primary text-white mr-1" href="{{ route('admin.withdrawal.index', ['status' => "pending"]) }}" data-toggle="tooltip" data-placement="top" title="Pending">{!! renderIconHtml('pending') !!}{{__('Pending')}}</a>
                <a type="button" class="btn btn-sm btn-primary text-white mr-1" href="{{ route('admin.withdrawal.index', ['status' => "approved"]) }}" data-toggle="tooltip" data-placement="top" title="Approved">{!! renderIconHtml('approve') !!}{{__('Approved')}}</a>
                <a type="button" class="btn btn-sm btn-primary text-white mr-1" href="{{ route('admin.withdrawal.index', ['status' => "rejected"]) }}" data-toggle="tooltip" data-placement="top" title="Rejected">{!! renderIconHtml('reject') !!}{{__('Rejected')}}</a>
                <a type="button" class="btn btn-sm btn-primary text-white mr-1" href="{{ url('admin/withdrawal/downloaded-csv') }}" data-toggle="tooltip" data-placement="top" title="Downloaded CSV">{!! renderIconHtml('download') !!}{{__('Downloaded CSV')}}</a>
            @endcan
        </div>
    </div>
@endsection

@section('content')
<section class="main_section">
    <div class="row">
        <div class="withdrawal-dashboard-section">
            <div class="row">
                <div class="col-md-12 col-lg-12">
                    <div class="card mb-2 o-hidden">
                    <div class="card-body">
                        <h5 class="t-font-bolder">{{__('In This Month')}}</h5>
                        <div class="row d-flex justify-content-center my-3">
                            <div class="col-3 text-center">
                                <i class="i-Duplicate-Window fs-1 mb-2"></i>
                                <h4 class="text-muted mb-2">{{__('Pending')}}</h4>
                                <h3 class="t-font-boldest">€ {{ formatDisplayNumber((($withdrawalCurrentMonth[0] ?? 0) + ($withdrawalCurrentMonth[4] ?? 0))) }}</h3>
                                <a type="button" class="btn btn-sm btn-primary bg-transparent text-primary mt-2" href="{{ route('admin.withdrawal.index', ['status' => "pending"]) }}" data-toggle="tooltip" data-placement="top" title="View All">{!! renderIconHtml('viewall') !!}{{__('View All')}}</a>
                            </div>
                            <div class="col-3 text-center">
                                <i class="i-Duplicate-Window fs-1 mb-2"></i>
                                <h4 class="text-muted mb-2">{{__('In Process')}}</h4>
                                <h3 class="t-font-boldest">€ {{ formatDisplayNumber($withdrawalCurrentMonth[3] ?? 0) }}</h3>
                                <a type="button" class="btn btn-sm btn-primary bg-transparent text-primary mt-2" href="{{ route('admin.withdrawal.downloadableWithdrawal') }}" data-toggle="tooltip" data-placement="top" title="View All">{!! renderIconHtml('viewall') !!}{{__('View All')}}</a>
                            </div>
                            <div class="col-3 text-center">
                                <i class="i-Approved-Window fs-1 mb-2"></i>
                                <h4 class="text-muted mb-2">{{__('Approved')}}</h4>
                                <h3 class="t-font-boldest">€ {{ formatDisplayNumber($withdrawalCurrentMonth[1] ?? 0) }}</h3>
                                <a type="button" class="btn btn-sm btn-primary bg-transparent text-primary mt-2" href="{{ route('admin.withdrawal.index', ['status' => "approved"]) }}" data-toggle="tooltip" data-placement="top" title="View All">{!! renderIconHtml('viewall') !!}{{__('View All')}}</a>
                            </div>
                            <div class="col-3 text-center">
                                <i class="i-Block-Window fs-1 mb-2"></i>
                                <h4 class="text-muted mb-2">{{__('Rejected')}}</h4>
                                <h3 class="t-font-boldest">€ {{ formatDisplayNumber($withdrawalCurrentMonth[2] ?? 0) }}</h3>
                                <a type="button" class="btn btn-sm btn-primary bg-transparent text-primary mt-2" href="{{ route('admin.withdrawal.index', ['status' => "rejected"]) }}" data-toggle="tooltip" data-placement="top" title="View All">{!! renderIconHtml('viewall') !!}{{__('View All')}}</a>
                            </div>
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="withdrawal-dashboard-section">
            <div class="row">
                <div class="col-md-6 col-lg-6 col-sm-6">
                    <div class="card mb-2 o-hidden">
                    <div class="card-body">
                                                <div class="row">
                        <div class="col-5">
                            <h5 class="t-font-bolder">{{__('In Process')}}</h5>
                            <small class="text-muted">{{__('No. of withdrawals ') }}{{ $totalWithdrawalByStatus[3]['total_record'] ?? 0 }}</small>
                        </div>
                            <div class="col-7 text-end">
                                <h3 class="t-font-boldest">€ {{ formatDisplayNumber($totalWithdrawalByStatus[3]['total_amount'] ?? 0) }}</h3>
                            <small class="text-muted">{{ formatDisplayNumber($percentage) }}%</small>
                        </div>
                        <div class="col-12">
                            <div class="progress">
                                <div class="progress-bar bg-primary" role="progressbar" style="width: {{ $percentage }}%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                        </div>
                        </div>
                    </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-6 col-sm-6">
                    <div class="card mb-2 o-hidden">
                        <div class="card-body">
                                                        <div class="row">
                                <div class="col-5">
                                    <h5 class="t-font-bolder">{{__('Pending')}}</h5>
                                    <small class="text-muted">{{__('No. of withdrawals ') }}{{ (($totalWithdrawalByStatus[0]['total_record'] ?? 0) + ($totalWithdrawalByStatus[4]['total_record'] ?? 0)) }}</small>
                                </div>
                                <div class="col-7 text-end">
                                    <h3 class="t-font-boldest">€ {{ formatDisplayNumber($pending) }}</h3>
                                    <small class="text-muted">{{ formatDisplayNumber($percentage) }}%</small>
                                </div>
                                <div class="col-12">
                                    <div class="progress">
                                        <div class="progress-bar bg-warning" role="progressbar" style="width: {{ $percentage }}%" aria-valuenow="{{ $percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-6 col-sm-6">
                    <div class="card mb-2 o-hidden">
                        <div class="card-body">
                                                        <div class="row">
                                <div class="col-5">
                                    <h5 class="t-font-bolder">{{__('Approved')}}</h5>
                                    <small class="text-muted">{{__('No. of withdrawals ') }}{{ $totalWithdrawalByStatus[1]['total_record'] ?? 0 }}</small>
                                </div>
                                <div class="col-7 text-end">
                                    <h3 class="t-font-boldest">€ {{ formatDisplayNumber($totalWithdrawalByStatus[1]['total_amount'] ?? 0) }}</h3>
                                    <small class="text-muted">{{ formatDisplayNumber($percentage) }}%</small>
                                </div>
                                <div class="col-12">
                                    <div class="progress">
                                        <div class="progress-bar bg-success" role="progressbar" style="width: {{ $percentage }}%" aria-valuenow="{{ $percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-lg-6 col-sm-6">
                    <div class="card mb-2 o-hidden">
                        <div class="card-body">
                                                        <div class="row">
                                <div class="col-5">
                                    <h5 class="t-font-bolder">{{__('Rejected')}}</h5>
                                    <small class="text-muted">{{__('No. of withdrawals ') }}{{ $totalWithdrawalByStatus[2]['total_record'] ?? 0 }}</small>
                                </div>
                                <div class="col-7 text-end">
                                    <h3 class="t-font-boldest">€ {{ formatDisplayNumber($totalWithdrawalByStatus[2]['total_amount'] ?? 0) }}</h3>
                                    <small class="text-muted">{{ formatDisplayNumber($percentage) }}%</small>
                                </div>
                                <div class="col-12">
                                    <div class="progress">
                                        <div class="progress-bar bg-danger" role="progressbar" style="width: {{ $percentage }}%" aria-valuenow="{{ $percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12 col-md-12 col-lg-12 col-xl-6 col-sm-12">
            <div class="card">
                <div class="card-body">
                    <div class="card-title">{{__('Currency Wise Withdrawal Request')}}</div>
                            @foreach ($totalWithdrawalByCurrency as $withdrawalKey => $withdrawal)
                                @php
                                    // Calculate percentage for the current status
                                    $percentage = $totalWithdrawalAmount > 0 ? ($withdrawal->total_amount / $totalWithdrawalAmount) * 100 : 0;
                                @endphp
                                <div class="ul-widget-app__poll-list mb-4">
                                    <div class="d-flex justify-content-between">
                                        <h4>
                                            {{$withdrawal->abbreviation}}
                                        </h4>
                                            <span class="text-boldest text-20">€ {{formatDisplayNumber($withdrawal->total_amount)}}</span>
                                    </div>
                                    <div class="d-flex">
                                        <span class="text-muted text-12">
                                                {{__('Total request')}} {{$withdrawal->total_record}}
                                        </span>
                                        <span class="t-font-boldest ms-auto">{{formatDisplayNumber($percentage)}} %</span>
                                    </div>
                                    <div class="progress progress--height-2 mb-3">
                                        <div class="progress-bar bg-primary" role="progressbar" style="width: {{$percentage}}%" aria-valuenow="{{$percentage}}" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                </div>
                    @endforeach
                </div>
            </div>
        </div>

        <div class="col-12 col-md-12 col-lg-12 col-xl-6 col-sm-12">
            <div class="card mb-2">
                <div class="card-body">
                    <div class="card-title">{{__('Downloaded Withdrawal CSV')}}</div>
                    <div class="row d-flex justify-content-center">
                        <div class="col-lg-6 col-md-12 mb-4">
                            <div class="p-4 rounded d-flex align-items-center bg-primary text-white" >
                            <i class="i-Big-Data text-32 me-3"></i>
                            <div>
                                <h4 class="text-18 mb-1 text-white">{{__('Total:')}} {{ $totalWithdrawalCSV }}</h4>
                                <span class="d-block mb-2">{{__('Downloaded CSV')}}</span>
                            </div>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-12 mb-4">
                            <div class="p-4 rounded d-flex align-items-center bg-primary text-white h-100">
                            <i class="i-Data-Backup text-32 me-3"></i>
                            <div>
                                <h4 class="text-18 mb-1 text-white">{{__('Total:')}} {{ $withdrawalLogUploadedCSV }}</h4>
                                <span>{{__('Pending Upload Log')}}</span>
                            </div>
                            </div>
                        </div>
                        <a type="button" class="btn btn-sm btn-primary bg-transparent text-primary w-25" href="{{ url('admin/withdrawal/downloaded-csv') }}" data-toggle="tooltip" data-placement="top" title="View List">{!! renderIconHtml('viewall') !!}{{__('View List')}}</a>
                    </div>
                </div>
            </div>
            <div class="card">
                <div class="card-body">
                    <div class="card-title">{{__('Date Wise Pending Log Withdrawal Request')}}</div>
                    <table class="table table-bordered" id="bstable" data-toggle="table" table-for="withdrawal"
                    data-ajax="getWithdrawalByDueDate" data-side-pagination="server" data-pagination="true" data-show-button-text="true"
                    data-total-field="count" data-data-field="items" data-show-columns="true"
                    data-show-toggle="false" data-show-export="false" data-filter-control="false"
                    data-show-columns-toggle-all="false" data-sticky-header="true" data-sticky-header-offset-y="170"
                    data-icons="icons"
                    data-icons-prefix="bi" data-show-search-clear-button="true"
                    data-toolbar="#custom_toolbar_user" data-loading-template="DataTaleLoadingTemplate" data-search-on-enter-key="true">
                        <thead>
                            <tr>
                                <th data-field="counter" data-width-unit="px">{{ __('#') }}</th>
                                <th data-field="due_date" data-filter-control="" data-sortable="true"  data-filter-control-placeholder="Due Date">{{ __('Due Date') }}</th>
                                <th data-field="total_amount" data-filter-control="" data-sortable="false"  data-filter-control-placeholder="Total Amount">{{ __('Total Amount') }}</th>
                            </tr>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                    <input type="hidden" value="{{ route('admin.withdrawal.getWithdrawalByDueDate') }}" id="getWithdrawalByDueDate">
                </div>
            </div>
        </div>


    </div>
</section>
@endsection
@push('scripts')
    <script src="{{ asset('backend/js/pages-js/withdrawal.js') }}"></script>
@endpush