@extends('layouts.admin')

@section('title', 'Data Kelas')
@section('page_title', 'Data Kelas')

@section('content')
    <section class="admin-page-header">
        <div>
            <h3>Data Kelas</h3>
            <p>Kelola daftar kelas yang digunakan pada jadwal pelajaran.</p>
        </div>

        <a href="#tambah-kelas" class="btn-add" style="text-decoration: none;">
            <i class="fa-solid fa-plus"></i> Tambah Kelas
        </a>
    </section>

    <div class="table-card">
        <table>
            <thead>
                <tr>
                    <th style="width: 80px;">No</th>
                    <th>Nama Kelas</th>
                    <th>Dibuat</th>
                    <th style="width: 180px;">Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($kelas as $item)
                    <tr>
                        <td>{{ $loop->iteration }}</td>
                        <td>
                            <span class="table-title">{{ $item->nama_kelas }}</span>
                        </td>
                        <td>{{ $item->created_at?->format('d M Y') }}</td>
                        <td>
                            <div class="table-actions">
                                <a class="btn-small btn-small-edit" href="#edit-kelas-{{ $item->id }}">
                                    <i class="fa-solid fa-pen"></i> Edit
                                </a>

                                <form class="delete-form" action="{{ route('admin.kelas.destroy', $item) }}" method="POST" onsubmit="return confirm('Hapus kelas ini?')">
                                    @csrf
                                    @method('DELETE')
                                    <button class="btn-small btn-small-danger" type="submit">
                                        <i class="fa-solid fa-trash"></i> Hapus
                                    </button>
                                </form>
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="4" class="empty-state">Belum ada data kelas.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="modal-overlay" id="tambah-kelas">
        <div class="modal-content">
            <div class="modal-header">
                <h3>Tambah Kelas</h3>
                <a class="close-btn" href="{{ route('admin.kelas.index') }}"><i class="fa-solid fa-xmark"></i></a>
            </div>

            <form action="{{ route('admin.kelas.store') }}" method="POST">
                @csrf
                <div class="form-group">
                    <label for="nama_kelas">Nama Kelas</label>
                    <input id="nama_kelas" type="text" name="nama_kelas" value="{{ old('nama_kelas') }}" placeholder="Contoh: 5A" required>
                    @error('nama_kelas') <div class="field-error">{{ $message }}</div> @enderror
                </div>

                <div class="modal-footer">
                    <a href="{{ route('admin.kelas.index') }}" class="btn-cancel" style="text-decoration: none;">Batal</a>
                    <button type="submit" class="btn-save"><i class="fa-solid fa-check"></i> Simpan</button>
                </div>
            </form>
        </div>
    </div>

    @foreach ($kelas as $item)
        <div class="modal-overlay" id="edit-kelas-{{ $item->id }}">
            <div class="modal-content">
                <div class="modal-header">
                    <h3>Edit Kelas</h3>
                    <a class="close-btn" href="{{ route('admin.kelas.index') }}"><i class="fa-solid fa-xmark"></i></a>
                </div>

                <form action="{{ route('admin.kelas.update', $item) }}" method="POST">
                    @csrf
                    @method('PUT')
                    <div class="form-group">
                        <label for="nama_kelas_{{ $item->id }}">Nama Kelas</label>
                        <input id="nama_kelas_{{ $item->id }}" type="text" name="nama_kelas" value="{{ old('nama_kelas', $item->nama_kelas) }}" required>
                    </div>

                    <div class="modal-footer">
                        <a href="{{ route('admin.kelas.index') }}" class="btn-cancel" style="text-decoration: none;">Batal</a>
                        <button type="submit" class="btn-save"><i class="fa-solid fa-check"></i> Simpan Perubahan</button>
                    </div>
                </form>
            </div>
        </div>
    @endforeach
@endsection
