@extends('layouts.app')

@section('content')
<div class="container py-4">
<h3 class="mb-3">Kelola Data Siswa</h3>

@if(session('success'))
<div class="alert alert-success">
    {{ session('success') }}
</div>
@endif

<form method="GET"
      action="{{ route('siswa.index') }}"
      class="mb-3">

    <div class="input-group">

        <input
            type="text"
            name="cari"
            class="form-control"
            placeholder="Cari nama, username, atau nomor HP..."
            value="{{ $cari }}"
        >

        <button class="btn btn-primary">
            Cari
        </button>

        <a href="{{ route('siswa.index') }}"
           class="btn btn-secondary">
            Reset
        </a>

        <a href="{{ url('/admin/siswa/create') }}"
           class="btn btn-success">
            + Tambah Siswa
        </a>

    </div>

</form>

<div class="table-responsive">

<table id="tableSiswa"
       class="table table-bordered table-striped">

    <thead class="table-light">
    <tr>
        <th>No</th>
        <th>Nama</th>
        <th>Username</th>
        <th>JK</th>
        <th>Umur</th>
        <th>Email</th>
        <th>No HP</th>
        <th>Alamat</th>
        <th>Paket</th>
        <th>Kolam</th>
        <th>Tgl Daftar</th>
        <th width="160">Aksi</th>
    </tr>
    </thead>

    <tbody>

    @forelse($siswa as $row)

    <tr>

        <td>
            {{ $loop->iteration }}
        </td>

        <td>{{ $row->nama }}</td>

        <td>{{ $row->username }}</td>

        <td>{{ $row->jk }}</td>

        <td>{{ $row->umur }}</td>

        <td>{{ $row->email }}</td>

        <td>{{ $row->nohp }}</td>

        <td>{{ $row->alamat }}</td>

        <td>{{ $row->paket }}</td>

        <td>{{ $row->kolam }}</td>

        <td>{{ $row->tanggal_daftar }}</td>

        <td>

            <a href="{{ url('/admin/siswa/edit/'.$row->id) }}"
               class="btn btn-warning btn-sm">
                Edit
            </a>

            <form
                action="{{ route('siswa.destroy',$row->id) }}"
                method="POST"
                class="d-inline">

                @csrf
                @method('DELETE')

                <button
                    onclick="return confirm('Hapus siswa ini?')"
                    class="btn btn-danger btn-sm">

                    Hapus

                </button>

            </form>

        </td>

    </tr>

    @empty

    <tr>
        <td colspan="12" class="text-center">
            Data tidak ditemukan
        </td>
    </tr>

    @endforelse

    </tbody>

</table>

</div>
</div>
<script>
$(document).ready(function () {

    $('#tableSiswa').DataTable({

        pageLength: 10,

        lengthMenu: [
            [10, 25, 50, 100, -1],
            [10, 25, 50, 100, "Semua"]
        ],

        language: {
            search: "Cari:",
            lengthMenu: "Tampilkan _MENU_ data",
            info: "Menampilkan _START_ sampai _END_ dari _TOTAL_ data",
            paginate: {
                first: "Awal",
                last: "Akhir",
                next: "›",
                previous: "‹"
            },
            zeroRecords: "Data tidak ditemukan",
            infoEmpty: "Tidak ada data",
            infoFiltered: "(difilter dari _MAX_ data)"
        }

    });

});
</script>

@endsection