@extends('layouts.app')

@section('content')
<div class="page-heading">
    <h3>Presensi Tendik</h3>
    <p class="text-subtitle text-muted">Halaman presensi untuk tenaga pendidik (selain guru).</p>


    <script>
        // Menampilkan alert jika ada session message
        @if(session('success'))
            Swal.fire({
                position: 'top-center',
                icon: 'success',
                title: "{{ session('success') }}",
                showConfirmButton: false,
                timer: 1500
            });
        @endif

        @if(session('error'))
            Swal.fire({
                position: 'top-center',
                icon: 'error',
                title: "{{ session('error') }}",
                showConfirmButton: false,
                timer: 3500
            });
        @endif
    </script>

    @if($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <section class="section">
        <div class="card">
            <div class="card-body">
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" id="masuk-tab" data-bs-toggle="tab" data-bs-target="#masuk" type="button" role="tab">Masuk</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="keluar-tab" data-bs-toggle="tab" data-bs-target="#keluar" type="button" role="tab">Keluar</button>
                </li>
                </ul>

                <div class="tab-content">
                    <div class="tab-pane fade show active" id="masuk" role="tabpanel">
                        <div class="m-3">
                            <form action="{{ route('presensi.tendik.masuk') }}" method="POST">
                                @csrf
                                <div class="form-group">
                                    <label class="form-label col-12" for="rfid">Scan Kartu (RFID)</label>
                                    <input type="text" name="rfid" class="form-control" placeholder="Tempelkan kartu anda" autofocus required>
                                </div>
                                <button type="submit" class="btn btn-primary mt-2">Submit Masuk</button>
                            </form>
                        </div>
                    </div>
                
                    <div class="tab-pane fade" id="keluar" role="tabpanel">
                        <div class="m-3">
                            <form action="{{ route('presensi.tendik.keluar') }}" method="POST">
                                @csrf
                                <div class="form-group">
                                    <label class="form-label col-12" for="rfid">Scan Kartu (RFID)</label>
                                    <input type="text" name="rfid" class="form-control" placeholder="Tempelkan kartu anda" autofocus required>
                                </div>
                                <button type="submit" class="btn btn-success mt-2">Submit Keluar</button>
                            </form>
                        </div>
                    </div>
                
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-body">
                <table class="table table-bordered table-striped mt-3">
                    <thead class="table-dark">
                        <tr>
                            <th>Nama</th>
                            <th>Jabatan</th>
                            <th>RFID</th>
                            <th>Jam Masuk</th>
                            <th>Status Masuk</th>
                            <th>Jam Pulang</th>
                            <th>Status Pulang</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($presensiHariIni as $presensi)
                        <tr>
                            <td>{{ $presensi->tendik->nama_tendik ?? '-' }}</td>
                            <td>{{ $presensi->level }}</td>
                            <td>{{ $presensi->rfid }}</td>
                            <td>{{ $presensi->jam_masuk ?? '-' }}</td>
                            <td>{{ ucfirst($presensi->status_in) ?? '-' }}</td>
                            <td>{{ $presensi->jam_pulang ?? '-' }}</td>
                            <td>{{ ucfirst($presensi->status_out) ?? '-' }}</td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="7" class="text-center">Belum ada presensi hari ini.</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </section>
</div>
@endsection