@extends('layouts.adminLayout.dashboardLayout')
@section('styles')
    <style>
        .small {
            display: none;
        }

        .filterSection {
            margin-top: 20px;
        }

        .switch {
            position: relative;
            display: inline-block;
            width: 60px;
            height: 34px;
        }

        .switch input {
            opacity: 0;
            width: 0;
            height: 0;
        }

        .slider {
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #ccc;
            transition: 0.4s;
            border-radius: 34px;
        }

        .slider:before {
            position: absolute;
            content: "";
            height: 26px;
            width: 26px;
            border-radius: 50%;
            left: 4px;
            bottom: 4px;
            background-color: white;
            transition: 0.4s;
        }

        input:checked+.slider {
            background-color: #4CAF50;
        }

        input:checked+.slider:before {
            transform: translateX(26px);
        }

        /* Label to show status */
        #statusLabel {
            margin-left: 10px;
            margin-top: 100px;
            font-size: 18px;
        }
    </style>
@endsection
@section('content')
    <main role="main" class="flex-shrink-0">
        <div class="container custom-container">
            <div class="login-5 mt-50 mb-50">
                <div class="container-fluid">
                    <div class="row no-gutters">
                        <div class="col-sm-12">
                            <div class="container-fluid">
                                {{ Breadcrumbs::render('examList', $examList) }}
                                <div class="card">

                                    <div class="card-header d-flex align-items-center justify-content-between py-3 px-3">
                                        <h4 class="mb-0 fw-bold fs-4">Exam Master List</h4>
                                        <div class="d-flex">
                                            <a href="{{ route('admin.superdashboard') }}"
                                                class="btn btn-danger text-white fs-5 me-2">
                                                <i class="fa fa-angle-double-left" aria-hidden="true"></i> Back
                                            </a>
                                            <!-- Import Button -->
                                            <button type="button" class="btn btn-info me-2 text-white fs-5"
                                                data-bs-toggle="modal" data-bs-target="#importModal">
                                                <i class="fa fa-plus-circle"></i> Import
                                            </button>

                                            <a href="{{ route('exam.add') }}" class="btn btn-success text-white fs-5">
                                                <i class="fa fa-plus-circle"></i> Add New
                                            </a>
                                        </div>
                                    </div>

                                    <div class="card-body custom-form">

                                        <form action="{{ route('exam.index') }}" method="GET" id="perPageForm">
                                            <div
                                                class="filterSection mt-0 d-flex justify-content-between align-items-center">
                                                <div class="col-md-1 mb-2">
                                                    <span class="me-2">Show per page</span>
                                                    <select name="perPage" id="perPageSelect" class="form-select"
                                                        onchange="getloader()">
                                                        @if (isset($per_page_count) && !empty($per_page_count))
                                                            @foreach ($per_page_count as $pageKey => $pageCount)
                                                                <option value="{{ $pageKey }}"
                                                                    {{ request('perPage') == $pageKey ? 'selected' : '' }}>
                                                                    {{ $pageCount }}
                                                                </option>
                                                            @endforeach
                                                        @endif
                                                    </select>
                                                </div>

                                                <div class="col-md-2 mb-2 d-flex align-items-center gap-2">
                                                    <input type="text" name="search"
                                                        class="form-control form-control-lg" placeholder="Search..."
                                                        value="{{ request('search', old('search')) }}"
                                                        onchange="getloader()">
                                                    <a href="{{ route('exam.index') }}"
                                                        class="btn btn-danger text-white fs-5 pt-2">Reset</a>
                                                </div>

                                            </div>
                                        </form>
                                        <div class="table-responsive">
                                            <table class="table text-nowrap table-hover">
                                                <thead class="">
                                                    <tr
                                                        class="fw-semibold fs-6 text-gray-800 border-bottom-2 border-gray-200">
                                                        <th>#</th>
                                                        <th>Exam Name</th>
                                                        <th>Exam Mode</th>
                                                        <th>Exam Year</th>
                                                        <th>Duration</th>
                                                        <th>Mock Date</th>
                                                        <th>Status</th>
                                                        <th>Actions</th>
                                                    </tr>
                                                </thead>
                                                <tbody>

                                                    @if (isset($examList) && !empty($examList) && $examList->total() > 0)
                                                        @foreach ($examList as $index => $exam)
                                                            @php $statusChecked = $exam->Is_active == 1 ? 'checked' : ''; @endphp
                                                            @if($exam->mockval == 1)
                                                              @php
                                                                    // Collect all 12 dates from the $exam object
                                                                    $dateArrays = [
                                                                        $exam->Date_1, $exam->Date_2, $exam->Date_3, $exam->Date_4, $exam->Date_5, $exam->Date_6, 
                                                                        $exam->Date_7, $exam->Date_8, $exam->Date_9, $exam->Date_10, $exam->Date_11, $exam->Date_12
                                                                    ];

                                                                    $previousDates = []; 

                                                                    foreach ($dateArrays as $dateValue) {
                                                                        if (!empty($dateValue)) {
                                                                            $prevDate = date("d-m-Y", strtotime($dateValue . " -1 day"));
                                                                            $previousDates[] = $prevDate;
                                                                        }
                                                                    }

                                                                    $Mock_Date = implode(", ", $previousDates);
                                                               @endphp
                                                            @else
                                                                @php
                                                                      $Mock_Date = date('d-m-Y',strtotime($exam->Mock_Date));
                                                                @endphp
                                                            @endif 
                                                            <tr>
                                                                <td>{{ $examList->firstItem() + $index }}</td>
                                                                <td>{{ $exam->{'Exam Name'} ?? '-' }}</td>
                                                                <td>{{ config('constants.Exam_Mode')[$exam->Exam_Mode] ?? '-' }}</td>
                                                                <td>{{ $exam->Year ?? '-' }}</td>
                                                                <td>{{ $exam->Exam_Duration ?? '-' }}</td>
                                                                <td>{{ $Mock_Date }}</td>
                                                                <td>
                                                                    <label class="switch">
                                                                        <input type="checkbox" class="toggleStatus"
                                                                            data-id="{{ $exam->{'Exam Type Id'} }}"
                                                                            {{ $statusChecked }}>
                                                                        <span class="slider round"></span>
                                                                    </label>
                                                                    <span class="statusLabel"></span>
                                                                </td>
                                                                <td>
                                                                    <a href="{{ route('exam.edit', ['exam_id' => urlencode(encrypt($exam->{'Exam Type Id'}, config('constants.encryptionKey')))]) }}"
                                                                        class="btn btn-success text-white">Edit</a>
                                                                </td>
                                                            </tr>
                                                        @endforeach
                                                    @else
                                                        <tr>
                                                            <td colspan="7" class="text-center">No Data Available!</td>
                                                        </tr>
                                                    @endif
                                                </tbody>
                                            </table>

                                            <!-- Pagination links -->
                                            @if ($examList->total() > 0)
                                                <div class="d-flex justify-content-between align-items-center">
                                                    <div>
                                                        <span class="mb-0 text-muted">
                                                            Showing {{ $examList->firstItem() }} to
                                                            {{ $examList->lastItem() }}
                                                            of {{ $examList->total() }} results
                                                        </span>
                                                    </div>
                                                    <!-- Pagination (Right) -->
                                                    <div>
                                                        {{ $examList->appends(request()->query())->links('pagination::bootstrap-5') }}
                                                    </div>


                                                </div>
                                            @endif

                                        </div>

                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>

    <!-- Import Modal Start-->
    <div class="modal fade" id="importModal" tabindex="-1" aria-labelledby="importModalLabel" aria-hidden="true"
        data-bs-backdrop="static" data-bs-keyboard="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="importModalLabel">Import Data</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <form action="{{ route('exam.import') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="modal-body">
                        <label for="importFile" class="form-label">Upload CSV File:</label>
                        <input type="file" class="form-control" name="importFile" id="importFile" required>
                        <a href="{{ asset('admin/data/examMaster.xlsx') }}" download>Download Sample <i
                                class="fa fa-download fs-5 mx-1"></i> </a>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Import</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <!-- Import Modal End-->

@endsection
@section('script')
    <script>
        function getloader() {
            $('.overlay').show();
            $('#perPageForm').submit();
        }
        $(document).ready(function() {
            $('.toggleStatus').change(function() {
                var isChecked = $(this).prop('checked');
                var examTypeId = $(this).data('id');
                var toggleSwitch = $(this);
                Swal.fire({
                    title: "Are you sure?",
                    text: "Do you want to change the status?",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    confirmButtonText: "Yes, change it!"
                }).then((result) => {
                    if (!result.isConfirmed) {
                        toggleSwitch.prop('checked', !isChecked); // Revert toggle if canceled
                    } else {
                        $.ajax({
                            url: "{{ route('exam.status') }}",
                            type: 'POST',
                            data: {
                                examTypeId: examTypeId,
                                isActive: isChecked ? 1 : 0,
                                _token: '{{ csrf_token() }}'
                            },
                            success: function(response) {
                                if (response.success) {
                                    Swal.fire({
                                        title: "Success!",
                                        text: response.message,
                                        icon: "success",
                                        //timer: 2000,
                                        //showConfirmButton: true
                                    });


                                } else {
                                    Swal.fire({
                                        title: "Success!",
                                        text: response.message,
                                        icon: "success",
                                        //timer: 2000,
                                        //showConfirmButton: true
                                    });
                                }
                            },
                            error: function(xhr, status, error) {
                                alert('An error occurred. Please try again.');
                                $(this).prop('checked', !isChecked);
                                $(this).siblings('.statusLabel').text(isChecked ?
                                    'OFF' : 'ON');
                            }
                        });


                    }
                });


            });
        });
    </script>
@endsection