{% extends "admin.html" %}

{% block admin_content %}
<section class="admin-section" aria-labelledby="devices-heading">
  <div class="admin-section-heading">
    <div>
      <h2 id="devices-heading">{% if is_en %}Signed-in devices{% else %}登录设备{% endif %}</h2>
      <p>{% if is_en %}Review account sessions and revoke a single session when needed.{% else %}查看全部账号的登录会话，需要时只撤销指定会话。{% endif %}</p>
    </div>
  </div>
  <form class="admin-toolbar admin-session-filter" method="get" action="/admin/devices">
    {% if is_en %}<input type="hidden" name="lang" value="en">{% endif %}
    <label class="admin-field">{% if is_en %}Account UUID{% else %}账号 UUID{% endif %}<input name="account_id" value="{{ account_filter }}" autocomplete="off" placeholder="{% if is_en %}Leave blank for all accounts{% else %}留空查看全部账号{% endif %}"></label>
    <button class="button button-primary" type="submit">{% if is_en %}Filter{% else %}筛选{% endif %}</button>
  </form>
  {% if let Some(message) = load_error %}<div class="admin-feedback" data-tone="error" role="alert"><p>{{ message }}</p></div>{% endif %}
  {% if rows.is_empty() && load_error.is_none() %}<div class="admin-empty"><strong>{% if is_en %}No matching sessions{% else %}没有匹配的登录会话{% endif %}</strong></div>{% endif %}
  {% if !rows.is_empty() %}
  <div class="admin-table-wrap admin-session-table-wrap">
    <table class="admin-table admin-session-table">
      <thead><tr>
        <th>{% if is_en %}Device{% else %}设备{% endif %}</th>
        <th>{% if is_en %}Status{% else %}状态{% endif %}</th>
        <th>{% if is_en %}Last login IP{% else %}最近登录 IP{% endif %}</th>
        <th>{% if is_en %}Client{% else %}客户端{% endif %}</th>
        <th>{% if is_en %}Last active{% else %}最近活动{% endif %}</th>
        <th>{% if is_en %}Valid until{% else %}有效期{% endif %}</th>
        <th>{% if is_en %}Action{% else %}操作{% endif %}</th>
      </tr></thead>
      <tbody>
        {% for row in rows %}
        <tr class="admin-session-row">
          <td data-label="{% if is_en %}Device{% else %}设备{% endif %}"><strong>{{ row.device_name }}</strong><small>{% if is_en %}Account{% else %}账号{% endif %} {{ row.account_label }}</small><small class="admin-mono">{{ row.account_id }}</small></td>
          <td data-label="{% if is_en %}Status{% else %}状态{% endif %}">
            <span class="status-badge" data-tone="{% if row.online %}success{% else %}neutral{% endif %}">{% if row.online %}{% if is_en %}Online{% else %}在线{% endif %}{% else %}{% if is_en %}Offline{% else %}不在线{% endif %}{% endif %}</span>
            {% if row.is_current %}<span class="status-badge admin-current-badge">{% if is_en %}Current device{% else %}当前设备{% endif %}</span>{% endif %}
          </td>
          <td class="admin-mono" data-label="{% if is_en %}Last login IP{% else %}最近登录 IP{% endif %}">{{ row.last_login_ip }}</td>
          <td data-label="{% if is_en %}Client{% else %}客户端{% endif %}">{{ row.client_version }}</td>
          <td class="admin-mono" data-label="{% if is_en %}Last active{% else %}最近活动{% endif %}">{{ row.last_seen_at }}</td>
          <td class="admin-mono" data-label="{% if is_en %}Valid until{% else %}有效期{% endif %}">{{ row.idle_expires_at }}</td>
          <td data-label="{% if is_en %}Action{% else %}操作{% endif %}">{% if row.can_delete %}<form class="admin-actions" action="/admin/sessions/{{ row.session_id }}/delete" method="post" hx-post="/admin/sessions/{{ row.session_id }}/delete" hx-target="#admin-global-feedback" hx-swap="innerHTML" hx-confirm="{% if is_en %}Permanently delete this login session? The device registration will remain.{% else %}永久删除这个登录会话？设备注册信息会保留。{% endif %}"><input type="hidden" name="csrf_token" value="{{ csrf_token }}">{% if is_en %}<input type="hidden" name="lang" value="en">{% endif %}<button class="button button-danger" type="submit">{% if is_en %}Delete{% else %}删除{% endif %}</button></form>{% else %}—{% endif %}</td>
        </tr>
        <tr class="admin-session-detail-row">
          <td colspan="7">
            <details class="session-details">
              <summary>{% if is_en %}View details{% else %}查看详情{% endif %}</summary>
              <dl class="session-detail-grid">
                <div><dt>{% if is_en %}Session ID{% else %}会话 ID{% endif %}</dt><dd>{{ row.session_id }}</dd></div>
                <div><dt>{% if is_en %}Account ID{% else %}账号 ID{% endif %}</dt><dd>{{ row.account_id }}</dd></div>
                <div><dt>{% if is_en %}Device ID{% else %}设备 ID{% endif %}</dt><dd>{{ row.device_id }}</dd></div>
                <div><dt>{% if is_en %}Fingerprint{% else %}设备指纹{% endif %}</dt><dd>{{ row.device_fingerprint }}</dd></div>
                <div><dt>{% if is_en %}Created{% else %}创建时间{% endif %}</dt><dd>{{ row.created_at }}</dd></div>
                <div><dt>{% if is_en %}Last active{% else %}最近活动{% endif %}</dt><dd>{{ row.last_seen_at }}</dd></div>
                <div><dt>{% if is_en %}Idle expiry{% else %}闲置过期{% endif %}</dt><dd>{{ row.idle_expires_at }}</dd></div>
                <div><dt>{% if is_en %}Absolute expiry{% else %}绝对过期{% endif %}</dt><dd>{{ row.absolute_expires_at }}</dd></div>
                <div><dt>{% if is_en %}Revoked at{% else %}撤销时间{% endif %}</dt><dd>{{ row.revoked_at }}</dd></div>
                <div class="session-detail-wide"><dt>{% if is_en %}Full user agent{% else %}完整 User-Agent{% endif %}</dt><dd>{{ row.user_agent }}</dd></div>
              </dl>
            </details>
          </td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% endif %}
  {% if load_error.is_none() %}<nav class="admin-pagination" aria-label="{% if is_en %}Session pagination{% else %}会话分页{% endif %}">{% if let Some(href) = previous_href %}<a class="button button-secondary" href="{{ href }}">{% if is_en %}Previous{% else %}上一页{% endif %}</a>{% endif %}<span>{% if is_en %}Page{% else %}第{% endif %} {{ page_number }} · {{ total }} {% if is_en %}sessions{% else %}个会话{% endif %}</span>{% if let Some(href) = next_href %}<a class="button button-secondary" href="{{ href }}">{% if is_en %}Next{% else %}下一页{% endif %}</a>{% endif %}</nav>{% endif %}
</section>
{% endblock %}