@extends('layout.mainlayout')
@section('content')
<div class="page-wrapper">
    <div class="content">
        <div class="page-header">
            <div class="page-title">
                <h4>Certificate List</h4>
                <h6>Manage your certificates</h6>
            </div>
            <div class="page-btn">
                <a href="{{ route('certificates.create') }}" class="btn btn-added"><img src="{{ URL::asset('/build/img/icons/plus.svg') }}" alt="img" class="me-1">Add New Certificate</a>
            </div>
        </div>

        <div class="card">
            <div class="card-body">
                <div class="table-top">
                    <div class="search-set">
                        <div class="search-path">
                            <a class="btn btn-filter" id="filter_search">
                                <img src="{{ URL::asset('/build/img/icons/filter.svg') }}" alt="img">
                                <span><img src="{{ URL::asset('/build/img/icons/closes.svg') }}" alt="img"></span>
                            </a>
                        </div>
                        <div class="search-input">
                            <a class="btn btn-searchset"><img src="{{ URL::asset('/build/img/icons/search-white.svg') }}" alt="img"></a>
                        </div>
                    </div>
                </div>

                <div class="table-responsive">
                    <table class="table datatable-custom">
                        <thead>
                            <tr>
                                <th>Student Name</th>
                                <th>Reg Number</th>
                                <th>Course</th>
                                <th>Certificate No</th>
                                <th>Status</th>
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($certificates as $certificate)
                            <tr>
                                <td>{{ $certificate->student_name }}</td>
                                <td>{{ $certificate->registration_number }}</td>
                                <td>{{ $certificate->course_name }}</td>
                                <td>{{ $certificate->certificate_number }}</td>
                                <td>
                                    @if($certificate->status == 'valid')
                                        <span class="badges bg-lightgreen">Valid</span>
                                    @elseif($certificate->status == 'revoked')
                                        <span class="badges bg-lightred">Revoked</span>
                                    @else
                                        <span class="badges bg-lightyellow">{{ ucfirst($certificate->status) }}</span>
                                    @endif
                                </td>
                                <td>
                                    <a class="me-3" href="{{ route('certificates.download', $certificate->id) }}">
                                        <img src="{{ URL::asset('/build/img/icons/download.svg') }}" alt="img">
                                    </a>
                                    <a class="me-3" href="{{ route('certificates.print', $certificate->id) }}" target="_blank">
                                        <img src="{{ URL::asset('/build/img/icons/printer.svg') }}" alt="img">
                                    </a>
                                    <a class="me-3" href="{{ route('certificates.edit', $certificate->id) }}">
                                        <img src="{{ URL::asset('/build/img/icons/edit.svg') }}" alt="img">
                                    </a>
                                    <a class="me-3" href="{{ route('certificates.verify', $certificate->qr_token) }}" target="_blank">
                                        <img src="{{ URL::asset('/build/img/icons/eye.svg') }}" alt="img">
                                    </a>
                                    <form action="{{ route('certificates.destroy', $certificate->id) }}" method="POST" style="display:inline;">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="me-3 confirm-text" style="background:none;border:none;padding:0;">
                                            <img src="{{ URL::asset('/build/img/icons/delete.svg') }}" alt="img">
                                        </button>
                                    </form>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    $(document).ready(function() {
        if ($('.datatable-custom').length > 0) {
            $('.datatable-custom').DataTable({
                "bFilter": true,
                "sDom": 'fBtlpi',
                "pagingType": "numbers",
                "ordering": true,
                "language": {
                    search: ' ',
                    sLengthMenu: '_MENU_',
                    searchPlaceholder: "Search...",
                    info: "_START_ - _END_ of _TOTAL_ items",
                },
                "order": [], // Respect backend sort (latest first)
                initComplete: (settings, json) => {
                    $('.dataTables_filter').appendTo('.search-input');
                },
            });
        }
    });
</script>
@endpush