@extends('dashboard.layouts.main')
@section('container')
<div class="container-fluid pt-4 px-4">
    @if (session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif
    <div class="card mb-4">
        <div class="card-header">
            <div class="d-flex justify-content-between align-items-center mb-4">
                <h1 class="h3 mb-0">Daftar Kebun</h1>
                <a href="{{ route('kebun.create') }}" class="btn btn-primary">Tambah Kebun</a>
            </div>
        </div>
        <div class="card-body">
            <div class="table-responsive">
                <table class="table table-striped table-bordered">
                    <thead>
                        <tr>
                            <th scope="col">Nama</th>
                            <th scope="col">Lokasi</th>
                            <th scope="col">Deskripsi</th>
                            <th scope="col">Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($kebuns as $kebun)
                            <tr>
                                <td>{{ $kebun->name }}</td>
                                <td>{{ $kebun->location }}</td>
                                <td>{{ $kebun->deskripsi }}</td>
                                <td>
                                    <a href="#" class="btn btn-sm btn-info" data-bs-toggle="modal" data-bs-target="#detailModal{{ $kebun->id }}">
                                        <i class="bi bi-eye"></i> Detail
                                    </a>
                                    <a href="#" class="btn btn-sm btn-primary" data-bs-toggle="modal" data-bs-target="#editModal{{ $kebun->id }}">
                                        <i class="bi bi-pencil"></i> Edit
                                    </a>
                                    <a href="#" class="btn btn-sm btn-danger" data-bs-toggle="modal" data-bs-target="#deleteModal{{ $kebun->id }}">
                                        <i class="bi bi-trash"></i> Hapus
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<!-- Detail Modals -->
@foreach($kebuns as $kebun)
<div class="modal fade" id="detailModal{{ $kebun->id }}" tabindex="-1" aria-labelledby="detailModalLabel{{ $kebun->id }}" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="detailModalLabel{{ $kebun->id }}">Detail Kebun</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Nama: {{ $kebun->name }} <br>
                Lokasi: {{ $kebun->location }} <br>
                Deskripsi: {{ $kebun->deskripsi }} <br>
                Pemilik Kebun: {{ $kebun->user->name }} <br>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
            </div>
        </div>
    </div>
</div>
@endforeach

<!-- Edit Modals -->
@foreach($kebuns as $kebun)
<div class="modal fade" id="editModal{{ $kebun->id }}" tabindex="-1" aria-labelledby="editModalLabel{{ $kebun->id }}" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editModalLabel{{ $kebun->id }}">Edit Kebun</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form action="{{ route('kebun.update', $kebun->id) }}" method="POST">
                    @csrf
                    @method('PUT')
                    <div class="mb-3">
                        <label for="name" class="form-label">Nama</label>
                        <input type="text" class="form-control" id="name" name="name" value="{{ $kebun->name }}" required>
                    </div>
                    <div class="mb-3">
                        <label for="location" class="form-label">Lokasi</label>
                        <input type="text" class="form-control" id="location" name="location" value="{{ $kebun->location }}" required>
                    </div>
                    <div class="mb-3">
                        <label for="deskripsi" class="form-label">Deskripsi</label>
                        <textarea class="form-control" id="deskripsi" name="deskripsi" rows="3" required>{{ $kebun->deskripsi }}</textarea>
                    </div>
                    <button type="submit" class="btn btn-primary">Simpan</button>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
            </div>
        </div>
    </div>
</div>
@endforeach

<!-- Delete Modals -->
@foreach($kebuns as $kebun)
<div class="modal fade" id="deleteModal{{ $kebun->id }}" tabindex="-1" aria-labelledby="deleteModalLabel{{ $kebun->id }}" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="deleteModalLabel{{ $kebun->id }}">Hapus Kebun</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Apakah Anda yakin ingin menghapus kebun ini?
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button>
                <form action="{{ route('kebun.destroy', $kebun->id) }}" method="POST" class="d-inline">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Hapus</button>
                </form>
            </div>
        </div>
    </div>
</div>
@endforeach

@endsection

<script>
document.addEventListener('DOMContentLoaded', function () {
    var deleteForms = document.querySelectorAll('form.d-inline');
    deleteForms.forEach(function (form) {
        form.addEventListener('submit', function (event) {
            var confirmation = confirm('Apakah Anda yakin ingin menghapus kebun ini?');
            if (!confirmation) {
                event.preventDefault();
            }
        });
    });
});
</script>