@extends('layouts.app')
@section('content')
@if ($errors->any())
    <div class="alert alert-danger" style="background-color: #f8d7da; color: #721c24; padding: 15px; border-radius: 5px; margin-bottom: 20px;">
        <ul style="margin: 0;">
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
@if(session('success'))
    <div class="alert alert-success" style="background-color: #d4edda; color: #155724; padding: 15px; border-radius: 5px; margin-bottom: 20px;">
        {{ session('success') }}
    </div>
@endif
<div class="container-fluid py-4">
    <h2 class="text-center mb-5 fw-bold text-secondary">إعدادات العقارات المميزة</h2>
    <!-- FILTERS -->
    <div class="card border-0 shadow-sm mb-5 p-4" style="border-radius: 20px;">
        <form method="GET" action="{{ route('home.settings.index') }}" class="row g-3 align-items-end">
            <div class="col-md-2">
                <label class="form-label small fw-bold">المدينة</label>
                <select name="city_id" class="form-select custom-input">
                    <option value="">الكل</option>
                    @foreach($cities as $city)
                        <option value="{{ $city->id }}" {{ request('city_id') == $city->id ? 'selected' : '' }}>
                            {{ $city->name }}
                        </option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-2">
                <label class="form-label small fw-bold">النوع</label>
            <select name="property_type" class="form-select custom-input">
    <option value="">الكل</option>
    <option value="1" {{ request('property_type') == 1 ? 'selected' : '' }}>فلل</option>
    <option value="2" {{ request('property_type') == 2 ? 'selected' : '' }}>منتجعات</option> <!-- هذا الجديد -->
    <option value="3" {{ request('property_type') == 3 ? 'selected' : '' }}>استراحات</option>
</select>
            </div>
            <div class="col-md-2">
                <label class="form-label small fw-bold">رقم العقار</label>
                <input type="number" name="search_id" class="form-control custom-input"
                       value="{{ request('search_id') }}" placeholder="ID">
            </div>
            <div class="col-md-3">
                <label class="form-label small fw-bold">اسم العقار</label>
                <input type="text" name="search_name" class="form-control custom-input"
                       value="{{ request('search_name') }}" placeholder="ابحث بالاسم...">
            </div>
            <div class="col-md-3">
                <button type="submit" class="btn btn-success btn-modern w-100 p-2">
                    <i class="fa fa-search me-2"></i> تطبيق الفلترة
                </button>
            </div>
        </form>
    </div>
    <!-- SINGLE FORM FOR ALL UPDATES -->
    <form method="POST" action="{{ route('home.settings.bulkUpdate') }}">
        @csrf
        <div class="table-rounded bg-white">
            <table class="table table-hover align-middle text-center mb-0">
                <thead class="bg-dark text-white">
                    <tr>
                        <th class="py-3">ID</th>
                        <th class="text-start py-3">اسم العقار</th>
                        <th>المدينة</th>
                        <th>النوع</th>
                        <th>مميز؟</th>
                        <th width="150">ترتيب العرض</th>
                        <th>الإجراءات</th>
                    </tr>
                </thead>
                <tbody>
                @foreach($properties as $property)
                <tr class="{{ $property->show_in_home ? 'featured-row' : '' }}">
                    <td class="fw-bold">{{ $property->id }}</td>
                    <td class="text-start">
                        <a href="{{ route('tblPropertyDetails.show', $property->id) }}" target="_blank" class="text-decoration-none text-dark fw-bold">
                            {{ $property->title }}
                        </a>
                    </td>
                    <td>{{ $property->city->name ?? 'غير محدد' }}</td>
                    <td>
                        @php
    $types = [
        1 => ['name' => 'فلل', 'class' => 'bg-info'],
        2 => ['name' => 'منتجعات', 'class' => 'bg-success'],
        3 => ['name' => 'استراحات', 'class' => 'bg-secondary'],
        5 => ['name' => 'شاليه', 'class' => 'bg-warning'],
        6 => ['name' => 'عمارة', 'class' => 'bg-dark'],
        7 => ['name' => 'شقة', 'class' => 'bg-primary'],
        8 => ['name' => 'فندق', 'class' => 'bg-danger'],
        9 => ['name' => 'غرفة', 'class' => 'bg-light text-dark'],
    ];
@endphp
<span class="badge rounded-pill {{ $types[$property->property_type]['class'] ?? 'bg-dark' }} px-3">
    {{ $types[$property->property_type]['name'] ?? 'غير معروف' }}
</span>
                    </td>
                    <td>
                        @if($property->show_in_home)
                            <span class="text-success fw-bold"><i class="fa fa-check-circle me-1"></i>نعم</span>
                        @else
                            <span class="text-muted small">لا</span>
                        @endif
                    </td>
                    <form method="POST" action="{{ route('home.settings.update', $property->id) }}">
                        @csrf @method('PUT')
                        <td>
                            <span class="badge rounded-pill {{ $property->property_type == 1 ? 'bg-info' : 'bg-secondary' }} px-3">
                                {{ $property->property_type == 1 ? 'فلل' : 'استراحة' }}
                            </span>
                        </td>
                        <td>
                            @if($property->show_in_home)
                                <span class="text-success fw-bold">
                                    <i class="fa fa-check-circle me-1"></i>نعم
                                </span>
                            @else
                                <span class="text-muted small">لا</span>
                            @endif
                        </td>
                        <!-- HOME ORDER (ARRAY INPUT) -->
                        <td>
                          <input type="number"
       name="home_order[{{ $property->id }}]"
       value="{{ $property->home_order > 0 ? $property->home_order : '' }}"
       class="form-control custom-input mx-auto"
       style="max-width: 90px;"
       placeholder="0">
                        </td>
                        <!-- ACTIONS -->
                        <td>
                            @if($property->show_in_home)
                                <button type="button"
                                        class="btn btn-outline-danger btn-modern btn-sm remove-featured"
                                        data-id="{{ $property->id }}">
                                    إزالة
                                </button>
                            @endif
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
        <!-- SINGLE SAVE BUTTON -->
        <div class="text-center mt-4">
            <button type="submit" class="btn btn-success btn-modern px-5">
                حفظ جميع التعديلات
            </button>
        </div>
    </form>
    <!-- PAGINATION -->
    <div class="mt-4 d-flex justify-content-center">
        {{ $properties->appends(request()->query())->links() }}
    </div>
</div>
<script>
document.querySelectorAll('.remove-featured').forEach(btn => {
    btn.addEventListener('click', function () {
        const id = this.dataset.id;
        if (confirm('هل تريد إزالة هذا العقار من المميزة؟')) {
            fetch(`/home-settings/remove/${id}`, {
                method: 'POST',
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}',
                    'Accept': 'application/json'
                }
            }).then(() => location.reload());
        }
    });
});
</script>
@endsection