@extends('layouts.dashboard')

@section('title', 'Level Berenang')

@section('content')
<div class="rounded-lg bg-white p-5 shadow-sm">
    <form method="POST" action="{{ route('admin.swimming-levels.store') }}" class="grid gap-3 md:grid-cols-[1fr_1fr_120px_140px_auto]">
        @csrf
        <input name="name" placeholder="Nama level" class="rounded-lg border border-slate-300 px-3 py-2" required>
        <input name="description" placeholder="Deskripsi" class="rounded-lg border border-slate-300 px-3 py-2">
        <input name="order_number" type="number" min="1" value="1" class="rounded-lg border border-slate-300 px-3 py-2" required>
        <select name="status" class="rounded-lg border border-slate-300 px-3 py-2"><option value="active">active</option><option value="inactive">inactive</option></select>
        <button class="rounded-lg bg-sky-700 px-4 py-2 font-bold text-white">Tambah</button>
    </form>
</div>
<div class="mt-6 grid gap-3">
@foreach($levels as $level)
    <form method="POST" action="{{ route('admin.swimming-levels.update', $level) }}" class="grid gap-3 rounded-lg bg-white p-4 shadow-sm md:grid-cols-[1fr_1fr_120px_140px_auto]">
        @csrf @method('PUT')
        <input name="name" value="{{ $level->name }}" class="rounded-lg border border-slate-300 px-3 py-2">
        <input name="description" value="{{ $level->description }}" class="rounded-lg border border-slate-300 px-3 py-2">
        <input name="order_number" type="number" value="{{ $level->order_number }}" class="rounded-lg border border-slate-300 px-3 py-2">
        <select name="status" class="rounded-lg border border-slate-300 px-3 py-2"><option value="active" @selected($level->status==='active')>active</option><option value="inactive" @selected($level->status==='inactive')>inactive</option></select>
        <button class="rounded-lg bg-slate-900 px-4 py-2 font-bold text-white">Simpan</button>
    </form>
@endforeach
</div>
<div class="mt-4">{{ $levels->links() }}</div>
@endsection