Fix Overview layout: stats panel, filter panel, then tables (in that order)
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>
This commit is contained in:
1 parent
281c9188a2
commit
3e33841ada
9 files changed
+72
-15
No files matched your search
@@ -24,20 +24,24 @@
|
||||
<h1>Обзор</h1>
|
||||
</div>
|
||||
|
||||
<form id="overview-filter" class="panel" onsubmit="return false">
|
||||
<div id="overview-stats">
|
||||
{{template "overview_stats" .}}
|
||||
</div>
|
||||
|
||||
<form id="overview-filter" class="panel" onsubmit="return false" style="margin-top:16px">
|
||||
<div class="panel-body field-row">
|
||||
<div class="field" style="flex:1 1 260px">
|
||||
<label for="overview-q">Поиск по IP</label>
|
||||
<input type="search" id="overview-q" name="q" value="{{.Query}}" placeholder="203.0.113.10"
|
||||
hx-get="/overview/fragment" hx-target="#overview-live" hx-swap="innerHTML"
|
||||
hx-get="/overview/fragment" hx-target="#overview-tables" hx-swap="innerHTML"
|
||||
hx-include="#overview-filter" hx-trigger="input changed delay:300ms"
|
||||
hx-sync="#overview-live:queue last">
|
||||
hx-sync="#overview-tables:queue last">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="overview-status">Статус</label>
|
||||
<select id="overview-status" name="status"
|
||||
hx-get="/overview/fragment" hx-target="#overview-live" hx-swap="innerHTML"
|
||||
hx-include="#overview-filter" hx-trigger="change" hx-sync="#overview-live:queue last">
|
||||
hx-get="/overview/fragment" hx-target="#overview-tables" hx-swap="innerHTML"
|
||||
hx-include="#overview-filter" hx-trigger="change" hx-sync="#overview-tables:queue last">
|
||||
<option value="">Все</option>
|
||||
<option value="pass" {{if eq .StatusFilter "pass"}}selected{{end}}>pass</option>
|
||||
<option value="partial" {{if eq .StatusFilter "partial"}}selected{{end}}>partial</option>
|
||||
@@ -51,8 +55,8 @@
|
||||
не показываются.</p>
|
||||
</form>
|
||||
|
||||
<div id="overview-live" hx-get="/overview/fragment" hx-trigger="every {{.PollSeconds}}s"
|
||||
hx-include="#overview-filter" hx-sync="#overview-live:queue last" hx-swap="innerHTML">
|
||||
{{template "overview_fragment" .}}
|
||||
<div id="overview-tables" hx-get="/overview/fragment" hx-trigger="every {{.PollSeconds}}s"
|
||||
hx-include="#overview-filter" hx-sync="#overview-tables:queue last" hx-swap="innerHTML">
|
||||
{{template "overview_tables" .}}
|
||||
</div>
|
||||
{{end}}
|
||||
Reference in new issue
Block a user