44 lines
2 KiB
HTML
44 lines
2 KiB
HTML
<div id="processes-body" class="panel" hx-get="/api/processes" hx-trigger="every 3s" hx-swap="outerHTML" hx-include="#proc-controls">
|
|
<div class="muted small">showing {{ procs | length }} of {{ total }} processes</div>
|
|
<div class="table-wrap">
|
|
<table class="table">
|
|
<colgroup>
|
|
<col style="width: 64px">
|
|
<col>
|
|
<col style="width: 100px">
|
|
<col style="width: 72px">
|
|
<col style="width: 72px">
|
|
<col style="width: 92px">
|
|
<col style="width: 92px">
|
|
<col style="width: 92px">
|
|
<col style="width: 92px">
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
{% for col, label in [("pid", "PID"), ("name", "Name"), ("user", "User"), ("cpu", "CPU%"), ("mem_pct", "MEM%"), ("rss", "RSS"), ("gpu", "GPU"), ("io_read", "IO read"), ("io_write", "IO write")] %}
|
|
<th class="{% if col in ('cpu','mem_pct','rss','gpu','io_read','io_write') %}num{% endif %}">
|
|
<a href="#" class="sortlink{% if sort == col %} active{% endif %}" data-sort="{{ col }}" data-order="{% if sort == col and order == 'desc' %}asc{% else %}desc{% endif %}">{{ label }}{% if sort == col %} {{ "↓" if order == "desc" else "↑" }}{% endif %}</a>
|
|
</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for p in procs %}
|
|
<tr>
|
|
<td class="mono">{{ p.pid }}</td>
|
|
<td class="pname" title="{{ p.name }}">{{ p.name }}</td>
|
|
<td class="muted">{{ p.user }}</td>
|
|
<td class="num">{{ p.cpu | round(1) }}</td>
|
|
<td class="num">{{ p.mem_pct | round(1) }}</td>
|
|
<td class="num">{{ p.rss | humanize }}</td>
|
|
<td class="num">{% if p.gpu is not none %}{{ p.gpu }} MB{% else %}<span class="muted">—</span>{% endif %}</td>
|
|
<td class="num">{{ p.io_read | rate }}</td>
|
|
<td class="num">{{ p.io_write | rate }}</td>
|
|
</tr>
|
|
{% else %}
|
|
<tr><td colspan="9" class="muted">no processes match</td></tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|