@extends('admin.layout')

@section('title', 'Detail Properti')

@section('content')
<div class="container-fluid">
    <!-- Page Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1 class="h3 mb-0 text-gray-800">
            <i class="fas fa-home me-2"></i>Detail Properti
        </h1>
        <div>
            <a href="{{ route('admin.properties.edit', $property) }}" class="btn btn-warning me-2">
                <i class="fas fa-edit me-1"></i>Edit
            </a>
            <a href="{{ route('admin.properties.index') }}" class="btn btn-outline-secondary">
                <i class="fas fa-arrow-left me-1"></i>Kembali
            </a>
        </div>
    </div>

    <!-- Property Details -->
    <div class="row">
        <!-- Images Carousel -->
        <div class="col-lg-6">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">Gambar Properti</h6>
                </div>
                <div class="card-body">
                    @php($images = is_array($property->images) ? $property->images : [])
                    @if(count($images) > 0)
                        <div id="propertyImagesCarousel" class="carousel slide" data-bs-ride="carousel">
                            <div class="carousel-inner">
                                @foreach($images as $index => $image)
                                    @php(
                                        $src = (is_string($image) && (str_starts_with($image, 'http://') || str_starts_with($image, 'https://')))
                                            ? $image
                                            : (file_exists(public_path('storage/'.$image))
                                                ? asset('storage/'.$image)
                                                : 'https://images.unsplash.com/photo-1505693416388-ac5ce068fe85?w=1200&q=80&auto=format&fit=crop')
                                    )
                                    <div class="carousel-item {{ $index === 0 ? 'active' : '' }}">
                                        <img src="{{ $src }}" class="d-block w-100" alt="{{ $property->title }}" style="height: 300px; object-fit: cover;">
                                    </div>
                                @endforeach
                            </div>
                            @if(count($images) > 1)
                                <button class="carousel-control-prev" type="button" data-bs-target="#propertyImagesCarousel" data-bs-slide="prev">
                                    <span class="carousel-control-prev-icon"></span>
                                </button>
                                <button class="carousel-control-next" type="button" data-bs-target="#propertyImagesCarousel" data-bs-slide="next">
                                    <span class="carousel-control-next-icon"></span>
                                </button>
                            @endif
                        </div>
                    @else
                        <div class="text-center py-5">
                            <i class="fas fa-home fa-3x text-muted mb-3"></i>
                            <p class="text-muted">Tidak ada gambar</p>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Basic Information -->
        <div class="col-lg-6">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">Informasi Dasar</h6>
                </div>
                <div class="card-body">
                    <table class="table table-borderless">
                        <tr>
                            <td width="30%"><strong>Judul</strong></td>
                            <td>: {{ $property->title }}</td>
                        </tr>
                        <tr>
                            <td><strong>Status</strong></td>
                            <td>: 
                                @if($property->is_active)
                                    <span class="badge bg-success">Aktif</span>
                                @else
                                    <span class="badge bg-danger">Tidak Aktif</span>
                                @endif
                            </td>
                        </tr>
                        <tr>
                            <td><strong>Ketersediaan</strong></td>
                            <td>: 
                                @if($property->is_available)
                                    <span class="badge bg-success">Tersedia</span>
                                @else
                                    <span class="badge bg-warning">Tidak Tersedia</span>
                                @endif
                            </td>
                        </tr>
                        <tr>
                            <td><strong>Tipe</strong></td>
                            <td>: {{ ucfirst($property->property_type) }}</td>
                        </tr>
                        <tr>
                            <td><strong>Alamat</strong></td>
                            <td>: {{ $property->address }}, {{ $property->city }}, {{ $property->country }}</td>
                        </tr>
                        <tr>
                            <td><strong>Luas Tanah</strong></td>
                            <td>: {{ $property->land_area_sqm }} m²</td>
                        </tr>
                        <tr>
                            <td><strong>Luas Bangunan</strong></td>
                            <td>: {{ $property->building_area_sqm }} m²</td>
                        </tr>
                        <tr>
                            <td><strong>Kamar Tidur</strong></td>
                            <td>: {{ $property->bedrooms }}</td>
                        </tr>
                        <tr>
                            <td><strong>Kamar Mandi</strong></td>
                            <td>: {{ $property->bathrooms }}</td>
                        </tr>
                        <tr>
                            <td><strong>Lantai</strong></td>
                            <td>: {{ $property->floors }}</td>
                        </tr>
                        <tr>
                            <td><strong>Garasi</strong></td>
                            <td>: {{ $property->garage_spaces }}</td>
                        </tr>
                        <tr>
                            <td><strong>Status Furnitur</strong></td>
                            <td>: {{ str_replace('_',' ', ucfirst($property->furnishing_status)) }}</td>
                        </tr>
                        <tr>
                            <td><strong>Tahun Dibangun</strong></td>
                            <td>: {{ $property->year_built }}</td>
                        </tr>
                        <tr>
                            <td><strong>Harga/Bulan</strong></td>
                            <td>: Rp {{ number_format($property->base_price_per_month, 0, ',', '.') }}</td>
                        </tr>
                        <tr>
                            <td><strong>Harga/Tahun</strong></td>
                            <td>: Rp {{ number_format($property->base_price_per_year, 0, ',', '.') }}</td>
                        </tr>
                        <tr>
                            <td><strong>Minimal Sewa</strong></td>
                            <td>: {{ $property->minimum_rental_period }} bulan</td>
                        </tr>
                        <tr>
                            <td><strong>Maksimal Sewa</strong></td>
                            <td>: {{ $property->maximum_rental_period }} bulan</td>
                        </tr>
                        <tr>
                            <td><strong>Dibuat</strong></td>
                            <td>: {{ $property->created_at->format('d M Y H:i') }}</td>
                        </tr>
                        <tr>
                            <td><strong>Diupdate</strong></td>
                            <td>: {{ $property->updated_at->format('d M Y H:i') }}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <!-- Description -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">Deskripsi</h6>
                </div>
                <div class="card-body">
                    @if($property->description)
                        <p class="mb-0">{{ $property->description }}</p>
                    @else
                        <p class="text-muted mb-0">Tidak ada deskripsi</p>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <!-- Amenities -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow mb-4">
                <div class="card-header">
                    <h6 class="m-0 font-weight-bold text-primary">Fasilitas</h6>
                </div>
                <div class="card-body">
                    @if($property->amenities && count($property->amenities) > 0)
                        <div class="row">
                            @foreach($property->amenities as $amenity)
                                <div class="col-md-3 col-sm-6 mb-2">
                                    <div class="d-flex align-items-center">
                                        <i class="fas fa-check-circle text-success me-2"></i>
                                        <span>{{ $amenity }}</span>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @else
                        <p class="text-muted mb-0">Tidak ada fasilitas</p>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <!-- Action Buttons -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <form action="{{ route('admin.properties.destroy', $property) }}" method="POST" class="d-inline">
                            @csrf
                            @method('DELETE')
                            <button type="submit" class="btn btn-danger" onclick="return confirm('Apakah Anda yakin ingin menghapus properti ini?')">
                                <i class="fas fa-trash me-1"></i>Hapus Properti
                            </button>
                        </form>
                        <div>
                            <a href="{{ route('admin.properties.edit', $property) }}" class="btn btn-warning me-2">
                                <i class="fas fa-edit me-1"></i>Edit Properti
                            </a>
                            <a href="{{ route('admin.properties.index') }}" class="btn btn-outline-secondary">
                                <i class="fas fa-arrow-left me-1"></i>Kembali ke Daftar
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection