{% extends "base.html" %}
{% block title %}{{ layout.t("common.wallboxes") }}{% endblock %}
{% block content %}
<h1>{{ layout.t("common.wallboxes") }}</h1>
<details class="card">
    <summary>{{ layout.t("wb.new") }}</summary>
    <form method="post" action="/wallboxes/new" class="row">
        <label>ChargePointId <input name="charge_point_id" required></label>
        <label>{{ layout.t("common.name") }} <input name="name" required></label>
        <label>{{ layout.t("common.location") }} <input name="location"></label>
        <button class="primary" type="submit">{{ layout.t("common.create") }}</button>
    </form>
    <p class="hint">{{ layout.t("wb.hint_connect") }} <code>ws://…/ocpp/&lt;ChargePointId&gt;</code>.</p>
</details>

<table class="data">
    <thead>
        <tr><th>{{ layout.t("common.name") }}</th><th>ChargePointId</th><th>{{ layout.t("common.location") }}</th><th>OCPP</th><th>{{ layout.t("common.online") }}</th><th>{{ layout.t("wb.last_heartbeat") }}</th><th></th></tr>
    </thead>
    <tbody>
    {% for row in wallboxes %}
        <tr>
            <td><a href="/wallboxes/{{ row.wb.id }}">{{ row.wb.name }}</a></td>
            <td><code>{{ row.wb.charge_point_id }}</code></td>
            <td>{{ row.wb.location.as_deref().unwrap_or("") }}</td>
            <td>{{ row.wb.ocpp_version.as_deref().unwrap_or("—") }}</td>
            <td>{% if row.online %}<span class="ok">●</span> {{ layout.t("common.online") }}{% else %}<span class="off">●</span> {{ layout.t("common.offline") }}{% endif %}</td>
            <td>{{ row.wb.last_heartbeat.as_deref().unwrap_or("—") }}</td>
            <td>
                <form method="post" action="/wallboxes/{{ row.wb.id }}/delete" onsubmit="return confirm('{{ layout.t("wb.delete_confirm") }}')">
                    <button class="linkbtn danger">{{ layout.t("common.delete") }}</button>
                </form>
            </td>
        </tr>
    {% endfor %}
    {% if wallboxes.is_empty() %}
        <tr><td colspan="7" class="empty">{{ layout.t("wb.none") }}</td></tr>
    {% endif %}
    </tbody>
</table>
{% endblock %}