{% extends "base.html" %}
{% block title %}租约{% endblock %}
{% block content %}
<div class="page-head">
    <h1>租约查询</h1>
    <form method="get" class="search-box">
        <input type="text" name="q" value="{{ q }}" placeholder="按 IP / MAC / 主机名搜索…">
        <button type="submit" class="btn">搜索</button>
    </form>
</div>

{% if leases %}
<table class="data-table">
    <thead>
        <tr>
            <th>IP</th>
            <th>MAC</th>
            <th>主机名</th>
            <th>状态</th>
            <th>开始</th>
            <th>结束</th>
            <th>剩余</th>
        </tr>
    </thead>
    <tbody>
    {% for l in leases %}
    <tr>
        <td><code>{{ l.ip }}</code></td>
        <td><code>{{ l.mac or '—' }}</code></td>
        <td>{{ l.client_hostname or '—' }}</td>
        <td>
            {% if l.binding_state == 'active' %}
                <span class="badge badge-ok">active</span>
            {% elif l.binding_state == 'free' %}
                <span class="badge">free</span>
            {% else %}
                <span class="badge badge-warn">{{ l.binding_state }}</span>
            {% endif %}
        </td>
        <td><span class="small">{{ l.starts or '—' }}</span></td>
        <td><span class="small">{{ l.ends or '—' }}</span></td>
        <td>
            {% set rem = l.remaining_seconds() %}
            {% if rem is none %}—
            {% elif rem < 0 %}已过期
            {% else %}{{ rem|format_duration }}
            {% endif %}
        </td>
    </tr>
    {% endfor %}
    </tbody>
</table>
<p class="muted small">共 {{ leases|length }} 条租约</p>
{% else %}
<div class="card empty">
    <p>暂无租约记录{% if q %}（搜索 "<code>{{ q }}</code>" 无结果）{% endif %}</p>
</div>
{% endif %}
{% endblock %}