@extends('layouts.admin')

@section('content')
    <main role="main" class="flex-shrink-0">
        <div class="container custom-container">
            <style>
                .btn-header-link::after {
                    display: none !important;
                }

                .modal-dialog {
                    max-width: 90%;
                }
            </style>
            <div class="login-5 mt-50 mb-50">
                <div class="container-fluid">
                    <div class="row no-gutters">
                        @include('layouts.partials.left_navbar')
                        <div class="col-sm-8">
                            <div class="container">
                                <div class="card" style="max-height: 300px; min-height:242px; overflow-y: auto;">
                                    <div class="card-header">
                                        <h4 class="mb-0 p-2 fw-bold fs-3">Exams/Events </h4>
                                    </div>
                                    <div class="card-body">
                                        <div class="container">
                                            <div class="row justify-content-center custom-form" id="searchResults">
                                                <form id="exam_form" method="POST" action="{{ route('exam-dashboard') }}">
                                                    @csrf
                                                    <div class="col-md-6 col-xs-6 mx-auto mt-50">
                                                        <select class="form-select form-select-lg p-3 cursor-pointer fs-3"
                                                            id="ExamSelect" name="ExamType">
                                                            <option selected="" disabled="">--- Please Select Exam --- 
                                                            </option>
                                                                                                                    </select>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="card mt-15" style="max-height: 300px; min-height:275px; overflow-y: auto;">
                                    <div class="card-header">
                                        <h4 class="mb-0 p-2 fw-bold fs-3">Advance Payment History</h4>
                                    </div>
                                    <div class="card-body">
                                        <div class="container">
                                            <div class="row justify-content-center custom-form" id="searchResults">
                                                <div class="col-md-12">
                                                    <div class="table-responsive">
                                                        <table
                                                            class="table text-nowrap table-hover text-nowrap">
                                                            <thead class="table-light">
                                                                <tr>
                                                                    <th>Sr. No.</th>
                                                                    {{-- <th>NTA ID</th> --}}
                                                                    <th>Exam Name</th>
                                                                    <th>Center No</th>
                                                                    <th>Beneficiary Name</th>
                                                                    <th>Account No</th>
                                                                    <th>IFSC</th>
                                                                    <th>Advance Amount</th>
                                                                    <th>UTR No</th>
                                                                    <th>UTR Date</th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                @php $i = 1; @endphp
                                                                @if (!empty($AdvancedData))
                                                                    @foreach ($AdvancedData as $utr)
                                                                        <tr>
                                                                            <td>{{ $i++ }}.</td>
                                                                            {{-- <td>{{ $utr->{'NTA ID'} ?? '-' }}</td> --}}
                                                                            <td>{{ $utr->{'ExamType'} ?? '-' }}</td>
                                                                            <td>{{ $utr->{'CenterNo'} == 'NA' || $utr->{'CenterNo'} == '' ? '-' : $utr->{'CenterNo'} }}
                                                                            </td>
                                                                            <td>{{ $utr->{'BeneficiaryName'} ?? '-' }}</td>
                                                                            <td>{{ $utr->{'AccountNo'} ?? '-' }}</td>
                                                                            <td>{{ $utr->{'IFSC'} ?? '-' }}</td>
                                                                            <td>{{ $utr->{'Amount'} ?? '-' }}</td>
                                                                            <td>{{ $utr->{'UTR No'} ?? '-' }}</td>
                                                                            <td>{{ !empty($utr->{'UTR Date'}) ? date('d-m-Y', strtotime($utr->{'UTR Date'})) : '-' }}
                                                                            </td>
                                                                        </tr>
                                                                    @endforeach
                                                                @else
                                                                    <tr>
                                                                        <td colspan="9" class="text-center">No records
                                                                            found.</td>
                                                                    </tr>
                                                                @endif
                                                            </tbody>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#Search").keyup(function() {
            var serachvalue = $("#Search").val();
            $.ajax({
                url: "{{ route('serachExam') }}",
                method: 'POST',
                data: {
                    serachvalue: serachvalue,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    var resultsList = $('#searchResults');
                    $('.allResults').hide();
                    resultsList.empty();
                    $.each(response, function(index, exam) {
                        var html =
                            '<div class="col-md-4 col-xs-6 cursor-pointer submitForm" lang="1">';
                        html +=
                            '<a href="/Centralized_ERP_Billing/public/examdashboard/' +
                            exam.examtype + '">';
                        html += '<div class="single-item custom-item-1 c' + (index +
                            1) + '">';
                        html += '<div class="bg-layer"></div>';
                        html += '<div class="content_box custom-content-box">';
                        html +=
                            '<div class="icon-box"><img class="img-responsive icon-img" src="https://billing.ntaonline.in:4433/backend/web/uploads/plus.png" ></div>';
                        html += '</div>';
                        html += '<h5 class="custom-h5">' + exam.examname + '</h5>';
                        html += '</div>';
                        html += '</a>';
                        html += '</div>';
                        resultsList.append(html);
                    });
                },
                error: function(data) {
                    $('.allResults').show();
                }

            });
        });
    });
</script>
<script>
    //    $(document).ready(function() {
    //     $("#ExamSelect").change(function() {
    //         var ExamSelect = $(this).val();
    //         var url = "{{ route('exam-dashboard', ':ExamSelect') }}";
    //         url = url.replace(':ExamSelect', ExamSelect);
    //         window.location.href = url;
    //     });
    // });
    $(document).ready(function() {
        $('#ExamSelect').on('change', function() {
            if (this.value) {
                $('.overlay').show();
                $('#exam_form').submit();
            }
        })
    })
</script>