Files

100 lines
5.0 KiB
HTML

{% extends "base.html" %}
{% block title %}Propiedades — Casa Hunter FL{% endblock %}
{% block content %}
<div class="d-flex justify-content-between align-items-center mb-3">
<h4 class="fw-bold mb-0" style="color:var(--primary)"><i class="fas fa-building me-2" style="color:var(--accent)"></i>Propiedades en Oportunidad</h4>
<button class="btn btn-accent btn-sm" onclick="runScan()"><i class="fas fa-sync me-1"></i>Actualizar</button>
</div>
<!-- Filters -->
<div class="card mb-4">
<div class="card-body py-2">
<form method="get" class="row g-2 align-items-end">
<div class="col-6 col-md-3">
<label class="form-label small fw-bold mb-1">Ciudad</label>
<input type="text" name="city" class="form-control form-control-sm" placeholder="Vero Beach..." value="{{ city_filter }}">
</div>
<div class="col-6 col-md-3">
<label class="form-label small fw-bold mb-1">Fuente</label>
<select name="source" class="form-select form-select-sm">
<option value="">Todas</option>
{% for s in sources %}<option value="{{ s }}" {% if s==current_source %}selected{% endif %}>{{ s }}</option>{% endfor %}
</select>
</div>
<div class="col-6 col-md-2">
<label class="form-label small fw-bold mb-1">Score mín.</label>
<select name="min_score" class="form-select form-select-sm">
<option value="0">Todos</option>
<option value="70">70+</option>
<option value="80">80+</option>
<option value="90">90+</option>
</select>
</div>
<div class="col-6 col-md-2">
<label class="form-label small fw-bold mb-1">Ordenar</label>
<select name="sort" class="form-select form-select-sm">
<option value="score" {% if current_sort=='score' %}selected{% endif %}>Mejor score</option>
<option value="price_asc" {% if current_sort=='price_asc' %}selected{% endif %}>Precio ↑</option>
<option value="price_desc" {% if current_sort=='price_desc' %}selected{% endif %}>Precio ↓</option>
<option value="newest" {% if current_sort=='newest' %}selected{% endif %}>Más reciente</option>
</select>
</div>
<div class="col-6 col-md-1">
<button type="submit" class="btn btn-primary btn-sm w-100"><i class="fas fa-filter"></i></button>
</div>
<div class="col-6 col-md-1">
<a href="/properties?favorites=1" class="btn btn-outline-warning btn-sm w-100"><i class="fas fa-star"></i></a>
</div>
</form>
</div>
</div>
{% if properties %}
<p class="text-muted small mb-3"><strong>{{ properties|length }}</strong> propiedades encontradas</p>
<div class="row g-3">
{% for p in properties %}
<div class="col-12 col-md-6 col-xl-4">
<div class="card h-100 {% if p.is_favorite %}border-warning{% endif %}">
{% if p.image_url %}
<img src="{{ p.image_url }}" class="card-img-top" style="height:150px;object-fit:cover;border-radius:12px 12px 0 0" alt="">
{% else %}
<div style="height:80px;background:linear-gradient(135deg,#1a3a5c,#2d6a9f);border-radius:12px 12px 0 0;display:flex;align-items:center;justify-content:center">
<i class="fas fa-home fa-2x text-white opacity-50"></i>
</div>
{% endif %}
<div class="card-body">
<div class="d-flex justify-content-between mb-2">
<span class="source-tag">{{ p.source }}</span>
<span class="score-badge {% if p.score >= 75 %}score-high{% elif p.score >= 50 %}score-mid{% else %}score-low{% endif %}">{{ p.score }}/100</span>
</div>
<div class="prop-price mb-1">${{ "{:,.0f}".format(p.price) }}</div>
<p class="text-muted small mb-1">{{ p.address }}</p>
<p class="text-muted small mb-2">{{ p.city }}{% if p.county %}, {{ p.county }}{% endif %}</p>
<div class="d-flex gap-2 text-muted small mb-3">
{% if p.beds %}<span><i class="fas fa-bed me-1"></i>{{ p.beds }}</span>{% endif %}
{% if p.baths %}<span><i class="fas fa-bath me-1"></i>{{ p.baths }}</span>{% endif %}
{% if p.sqft %}<span><i class="fas fa-ruler-combined me-1"></i>{{ p.sqft }}sf</span>{% endif %}
</div>
<div class="d-flex gap-1">
<a href="/property/{{ p.id }}" class="btn btn-primary btn-sm flex-fill">Ver Detalle</a>
{% if p.url %}<a href="{{ p.url }}" target="_blank" class="btn btn-outline-secondary btn-sm"><i class="fas fa-external-link-alt"></i></a>{% endif %}
{% if p.is_favorite %}<span class="btn btn-warning btn-sm"><i class="fas fa-star"></i></span>{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="card text-center py-5">
<div class="card-body">
<i class="fas fa-search fa-3x mb-3" style="color:var(--accent)"></i>
<h5>No hay propiedades</h5>
<p class="text-muted">Haz clic en Buscar Ahora para encontrar oportunidades</p>
<button class="btn btn-primary" onclick="runScan()"><i class="fas fa-sync me-2"></i>Buscar Ahora</button>
</div>
</div>
{% endif %}
{% endblock %}