Placing the filter form outside the polled div (so the poll can't wipe out typed/selected values) put it before the stat-grid, since both used to live inside that same polled block — stats ended up after the filter instead of before it, as it always was. Splits the stat-grid out into its own #overview-stats div, positioned before the filter form; the actual poll target is now #overview-tables (just the two tables). Since #overview-stats no longer polls directly, /overview/fragment now also renders it as an out-of-band swap alongside the main #overview-tables response — the same hx-swap-oob idiom already used for the shared error banner — so the stat counts still refresh every tick even though they're outside the polled element. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
76 lines
3.3 KiB
HTML
76 lines
3.3 KiB
HTML
{{define "overview_stats"}}
|
|
<div class="stat-grid">
|
|
<div class="stat-card accented"><span class="value">{{.Status.TotalIPs}}</span><span class="label">всего IP</span></div>
|
|
<div class="stat-card"><span class="value">{{.Status.TotalValidators}}</span><span class="label">валидаторов</span></div>
|
|
{{range $state, $count := .Status.IPsByState}}
|
|
<div class="stat-card{{if eq $state "failed"}} bad{{else if eq $state "checking"}} accented{{end}}"><span class="value">{{$count}}</span><span class="label">{{$state}}</span></div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
|
|
{{/* Out-of-band counterpart of overview_stats, appended to every
|
|
/overview/fragment response alongside overview_tables (the actual
|
|
hx-target) — same OOB idiom as templates/layout.html's error_banner.
|
|
Needed because overview_stats lives outside the polled #overview-tables
|
|
div (see overview.html) so the DOM order can be stats -> filter form ->
|
|
tables, yet the stat counts still refresh on every poll tick. */}}
|
|
{{define "overview_stats_oob"}}<div id="overview-stats" hx-swap-oob="true">{{template "overview_stats" .}}</div>{{end}}
|
|
|
|
{{define "overview_tables"}}
|
|
<h2 class="section-title">Текущая проверка</h2>
|
|
{{if .CurrentItems}}
|
|
<div class="panel">
|
|
<div class="table-scroll">
|
|
<table>
|
|
<thead><tr><th>Адрес</th><th>Состояние</th><th>Валидатор</th><th>Попытка</th><th>Назначено</th></tr></thead>
|
|
<tbody>
|
|
{{range .CurrentItems}}
|
|
{{$b := ipBadge .State .OverallResult .FIPAssociatedAt 0}}
|
|
<tr>
|
|
<td class="addr" data-label="Адрес"><a href="/ips/{{.IPAddress}}">{{.IPAddress}}</a></td>
|
|
<td data-label="Состояние"><span class="pill {{$b.Class}}">{{$b.Label}}</span></td>
|
|
<td data-label="Валидатор">{{deref .OwnerValidatorID}}</td>
|
|
<td class="num" data-label="Попытка">{{.AttemptNumber}}</td>
|
|
<td class="num" data-label="Назначено">{{fmtTime .AssignedAt}}</td>
|
|
</tr>
|
|
{{end}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{{else}}
|
|
{{if or .Query .StatusFilter}}<p class="muted">Ничего не найдено по текущему фильтру.</p>
|
|
{{else}}<p class="muted">Сейчас нет адресов в обработке.</p>{{end}}
|
|
{{end}}
|
|
|
|
<h2 class="section-title">Последние {{.LastN}} завершённых</h2>
|
|
<div class="breakdown">
|
|
<span>pass <b>{{index .Breakdown "pass"}}</b></span>
|
|
<span>partial <b>{{index .Breakdown "partial"}}</b></span>
|
|
<span>fail <b>{{index .Breakdown "fail"}}</b></span>
|
|
<span>cancelled <b>{{index .Breakdown "cancelled"}}</b></span>
|
|
</div>
|
|
{{if .LastCompleted}}
|
|
<div class="panel">
|
|
<div class="table-scroll">
|
|
<table>
|
|
<thead><tr><th>Адрес</th><th>Итог</th><th>Завершено</th></tr></thead>
|
|
<tbody>
|
|
{{range .LastCompleted}}
|
|
{{$b := ipBadge .State .OverallResult .FIPAssociatedAt 0}}
|
|
<tr>
|
|
<td class="addr" data-label="Адрес"><a href="/ips/{{.IPAddress}}">{{.IPAddress}}</a></td>
|
|
<td data-label="Итог"><span class="pill {{$b.Class}}">{{$b.Label}}</span></td>
|
|
<td class="num" data-label="Завершено">{{fmtTime .AggregatedAt}}</td>
|
|
</tr>
|
|
{{end}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{{else}}
|
|
{{if or .Query .StatusFilter}}<p class="muted">Ничего не найдено по текущему фильтру.</p>
|
|
{{else}}<p class="muted">Пока ничего не завершено.</p>{{end}}
|
|
{{end}}
|
|
{{end}}
|