<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head th:replace="~{fragments :: head(${pageTitle})}"></head>
<body>
<main>
    <h1 th:replace="~{fragments :: header(${pageTitle})}"></h1>
    <div th:replace="~{fragments :: nav(${view})}"></div>
    <div class="table-wrap">
        <table id="system-table" data-api="/api/system">
            <thead>
            <tr>
                <th>Metric</th>
                <th class="num">Current</th>
                <th class="num">Min</th>
                <th class="num">Max</th>
                <th class="num">Avg</th>
            </tr>
            </thead>
            <tbody id="system-rows">
            <tr th:each="row : ${metrics.rows}" th:attr="data-metric=${row.key}">
                <td data-label="Metric" th:text="${row.label}">CPU used (cores)</td>
                <td class="num" data-label="Current" data-field="current" th:classappend="${row.currentClass}" th:text="${row.current}">0.42</td>
                <td class="num" data-label="Min" data-field="min" th:text="${row.min}">0.10</td>
                <td class="num" data-label="Max" data-field="max" th:text="${row.max}">3.20</td>
                <td class="num" data-label="Avg" data-field="avg" th:text="${row.avg}">0.80</td>
            </tr>
            </tbody>
        </table>
    </div>
    <p class="meta">
        <span>
            CPU total: <strong id="info-cpu-count" th:text="${metrics.cpuCount}">8 cores</strong>
            &nbsp;·&nbsp; RAM total: <strong id="info-ram-total" th:text="${metrics.ramTotal}">31.29 GiB</strong>
            &nbsp;·&nbsp; Disk total: <strong id="info-disk-total" th:text="${metrics.diskTotal}">465.12 GiB</strong>
            &nbsp;·&nbsp; Updated: <span id="info-updated" th:text="${metrics.updated}">12:00:00</span>
            (updated every 60s)
        </span>
        <span>(*: min/max/avg since the first server start)</span>
    </p>
</main>
<footer th:replace="~{fragments :: footer}"></footer>
<script src="/werkator.js"></script>
</body>
</html>
