@extends('layouts.app')
@section('content')
    @if (session()->has('message'))
        <div class="alert alert-success">{{ session()->get('message') }}</div>
    @endif
    @if (session()->has('error'))
        <div class="alert alert-danger">{{ session()->get('error') }}</div>
    @endif

    <div class="card forms-card">
        <div class="card-body">
            <div class="basic-form">
                <div class="outer-div">
                    <div class="srchBox_wraper justify-content-end mt-3 mb-3">
                        <div class="right-panel-btn text-left">
                            <h5>Pickup Dates</h5>
                        </div>

                    </div>

                    <div class="table-responsive custom-table-s1">
                        <table class="participant_table" width="100%">
                            <thead>
                                <tr>
                                    <th width="30%">Location</th>
                                    <th width="30%">Date & Time</th>
                                    <th width="20%">Total Applications</th>
                                    <th width="10%">Download</th>                                    
                                    <th width="20%">Print Labels</th>                                    
                                </tr>
                            </thead>

                            <tbody>
                                @forelse($pickupDateArr as $key => $value)
                                <tr>
                                    <td>{{ $value->pickup_location ?? '' }}</td>
                                    <td>Date: {{ \Carbon\Carbon::parse($value->pickup_date)->format('F j, Y') }} [Time: {{ \Carbon\Carbon::parse($value->pickup_time_begin)->format('g:i A') }} - {{ \Carbon\Carbon::parse($value->pickup_time_end)->format('g:i A') }}]</td>
                                    <td>{{ $value->applications_count  }}</td>                                   
                                    <td><button class="btn btn-info" type="button" onclick="export_list('csv', '{{ $value->id }}')">Download </button></td>     
                                    <td>
                                        <button class="btn btn-info" type="button" onclick="export_pdf_list('{{ $value->id }}', {{ $value->applications_count }})">
                                            Get PDF
                                        </button>
                                    </td>
                                    
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="3">No record found...</td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div> 
    <!-- Modal Structure -->
<div id="pdfModal" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Print Labels</h5>
                <button type="button" class="close" onclick="closeModal()">×</button>
            </div>
            <div class="modal-body" id="pdfModalBody">
                <!-- Buttons will be injected here -->
            </div>
        </div>
    </div>
</div>

@endsection
<script type="text/javascript">

    function export_list(export_type, dt){
        var date = dt ;
        var url = "{{ route('backend.pickupDatewiseExport')}}";
        location.href = url+'?pickup_date_id='+date;
    }

    function export_pdf_list(pickup_id) {
        console.log(pickup_id);
        event.preventDefault();
        const url = "{{ route('backend.generate-pickupwiseDate-pdf')}}";
        const targeturl = url + '?pickup_date_id=' + pickup_id;
        window.open(targeturl, '_blank'); // Open the URL in a new tab
        
    }
    function export_pdf_list(pickup_id, applications_count) {
    event.preventDefault();
    
    const modalBody = document.getElementById('pdfModalBody');
    modalBody.innerHTML = ''; // Clear previous buttons if any

    const itemsPerPage = 50;
    const numButtons = Math.ceil(applications_count / itemsPerPage);

    for (let i = 0; i < numButtons; i++) {
        const start = i * itemsPerPage + 1;
        const end = Math.min((i + 1) * itemsPerPage, applications_count);

        const button = document.createElement('button');
        button.classList.add('btn', 'btn-primary', 'm-1');
        button.textContent = `${start}-${end}`;
        button.onclick = function () {
            downloadPdf(pickup_id, start, end);
        };

        modalBody.appendChild(button);
    }

    // Show the modal
    document.getElementById('pdfModal').style.display = 'block';
}

function closeModal() {
    document.getElementById('pdfModal').style.display = 'none';
}

function downloadPdf(pickup_id, start, end) {
    const url = "{{ route('backend.generate-pickupwiseDate-pdf')}}";
    const targeturl = `${url}?pickup_date_id=${pickup_id}&start=${start}&end=${end}`;
    window.open(targeturl, '_blank'); // Open in a new tab
}

    
</script>