{% extends "base.html" %}
{% block content %}

<h2 class="history-title">Riwayat Lokasi Terbaru</h2>
<p class="date">Today, {{ date if date else "November 26, 2024" }}</p>

<div class="history-list">
    {% if history %}
    {% for vehicle, queue, slot in history %}
    <div class="history-card">
        <div class="history-plate">{{ vehicle.plate_no }}</div>
        <div class="history-details">
            {{ vehicle.model if vehicle.model else 'N/A' }} - {{ vehicle.color if vehicle.color else 'N/A' }}
            <br>
            <strong>Slot:</strong> {{ slot.slot_code }} |
            <strong>Status:</strong>
            {% if queue.status == 'OPEN' %}
            <span style="color: green; font-weight: bold;">IN</span>
            {% else %}
            <span style="color: red; font-weight: bold;">OUT</span>
            {% endif %}
            <br>
            <small>{{ queue.time_in.strftime('%d %B %Y, %I:%M %p') }}</small>
        </div>
    </div>
    {% endfor %}
    {% else %}
    <div class="history-card">
        <div class="history-plate">Tidak ada data</div>
        <div class="history-details">Belum ada kendaraan yang terdaftar</div>
    </div>
    {% endif %}
</div>

{% endblock %}