{% extends 'base.html.twig' %}

{% block title %}Résultats de la recherche{% endblock %}

{% block body %}
    <div class="container-fluid">
        <h1 class="my-4">Résultats de la recherche</h1>

        {% if properties is empty %}
            <p>Aucun résultat trouvé.</p>
        {% else %}
            <div class="property-list">
                {% for property in properties %}
                    <div class="row property-item my-5 ml-3">
                        <div class="col-12 col-md-4"> 
                            {% if property.images|length > 0 %}
                                <img class="img-fluid rounded" style="height:290px;width:-webkit-fill-available;" src="{{ asset('images/properties/' ~ property.images[0].imagename) }}" alt="{{ property.title }}">
                            {% else %}
                                <img class="img-fluid" src="https://via.placeholder.com/300x300?text=No+Image" alt="No image available">
                            {% endif %}
                        </div>
                        <div class="col-12 col-md-8">
                            <h2>
                                <a href="{{ path('app_properties_show', { 'id': property.id }) }}">
                                    {{ property.title }} &#149 {{ property.housingType.name }} &#149 {{ property.category.name }}
                                    {% if property.subType is not empty %}
                                        &#149 {{ property.subType.name }}
                                    {% endif %}
                                </a>
                            </h2>
                            {% if property.category.name matches '/location/i' and property.subType is not empty %}
                            		<h2 id="price" class=" text-danger h3">{{ property.rent }} €/mois</h2>
                        	{% else %}
                            		<h2 id="price" class=" text-danger h3">{{ property.price|number_format }} €</h2>
                        	{% endif %}
                            
                            <p class="lead"> {{ property.address.city }}</p>
                            <p class="lead">{{ property.harea }} m²</p>
                            <p class="lead">{{ property.yearBuilt|date('Y') }}</p>
                        </div>
                    </div>
		<hr class="text-danger bg-danger w-75">
                {% endfor %}
            </div>
        {% endif %}
	
    </div>
{% endblock %}