@extends('admin.layouts.app')
@section('title', 'Properties')

@section('content')

<div class="d-flex justify-content-between align-items-center mb-3">
    <form method="GET" class="d-flex gap-2">
        <select name="category" class="form-select form-select-sm" onchange="this.form.submit()">
            <option value="">All Categories</option>
            <option value="9m" {{ request('category') === '9m' ? 'selected' : '' }}>9m+</option>
            <option value="12.5m" {{ request('category') === '12.5m' ? 'selected' : '' }}>12.5m+</option>
            <option value="14m" {{ request('category') === '14m' ? 'selected' : '' }}>14m+</option>
            <option value="double_storey" {{ request('category') === 'double_storey' ? 'selected' : '' }}>Double Storey</option>
            <option value="property" {{ request('category') === 'property' ? 'selected' : '' }}>Property</option>
        </select>
        <input type="text" name="search" class="form-control form-control-sm" placeholder="Search title..." value="{{ request('search') }}">
        <button class="btn btn-sm btn-outline-secondary">Filter</button>
    </form>

    <a href="{{ route('admin.properties.create') }}" class="btn btn-dark btn-sm">
        <i class="bi bi-plus-lg"></i> Add Property
    </a>
</div>

<div class="card">
    <div class="table-responsive">
        <table class="table align-middle mb-0">
            <thead class="table-light">
                <tr>
                    <th>Image</th>
                    <th>Title</th>
                    <th>Category</th>
                    <th>Status</th>
                    <th>Featured</th>
                    <th>Active</th>
                    <th class="text-end">Actions</th>
                </tr>
            </thead>
            <tbody>
                @forelse($properties as $property)
                <tr>
                    <td><img src="{{ \App\Helpers\ImageHelper::url($property->main_image) }}" width="60" height="45" style="object-fit:cover;border-radius:4px;"></td>
                    <td>{{ $property->title }}</td>
                    <td>{{ \App\Models\Property::categoryLabel($property->category) }}</td>
                    <td><span class="badge bg-secondary">{{ $property->status_label }}</span></td>
                    <td>{!! $property->is_featured ? '<span class="badge bg-warning text-dark">Yes</span>' : '—' !!}</td>
                    <td>{!! $property->is_active ? '<span class="badge bg-success">Active</span>' : '<span class="badge bg-secondary">Hidden</span>' !!}</td>
                    <td class="text-end">
                        <a href="{{ route('properties.show', $property->slug) }}" target="_blank" class="btn btn-sm btn-outline-secondary"><i class="bi bi-eye"></i></a>
                        <a href="{{ route('admin.properties.edit', $property) }}" class="btn btn-sm btn-outline-primary"><i class="bi bi-pencil"></i></a>
                        <form method="POST" action="{{ route('admin.properties.destroy', $property) }}" class="d-inline" onsubmit="return confirm('Delete this property? This cannot be undone.')">
                            @csrf @method('DELETE')
                            <button class="btn btn-sm btn-outline-danger"><i class="bi bi-trash"></i></button>
                        </form>
                    </td>
                </tr>
                @empty
                <tr><td colspan="7" class="text-center py-4 text-muted">No properties found.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>

<div class="mt-3">{{ $properties->links() }}</div>

@endsection