少于10时折叠筛选

This commit is contained in:
cppla
2026-07-02 12:02:36 +08:00
parent e0aae47efc
commit bbec425c51
2 changed files with 8 additions and 2 deletions
+1 -1
View File
@@ -35,7 +35,7 @@
<section class="ops-overview" id="overviewCards" aria-label="运行概览"></section> <section class="ops-overview" id="overviewCards" aria-label="运行概览"></section>
<section class="ops-toolbar" id="serversToolbar" aria-label="主机筛选"> <section class="ops-toolbar" id="serversToolbar" aria-label="主机筛选" style="display:none;">
<label class="search-field"> <label class="search-field">
<span>搜索</span> <span>搜索</span>
<input id="serverSearch" type="search" autocomplete="off" placeholder="节点 / 地区 / 系统 / 主机名" /> <input id="serverSearch" type="search" autocomplete="off" placeholder="节点 / 地区 / 系统 / 主机名" />
+7 -1
View File
@@ -201,6 +201,7 @@ function visibleServers(){
function render(){ function render(){
$('notice').style.display = 'none'; $('notice').style.display = 'none';
normalizeServersToolbarState();
renderOverview(); renderOverview();
renderOsOptions(); renderOsOptions();
renderServers(); renderServers();
@@ -242,6 +243,11 @@ function alertStats(){
return stats; return stats;
} }
function normalizeServersToolbarState(){
const show = S.activeTab === 'servers' && S.servers.length > 10;
$('serversToolbar').style.display = show ? 'flex' : 'none';
}
function renderOsOptions(){ function renderOsOptions(){
const select = $('osFilter'); const select = $('osFilter');
const labels = [...new Set(S.servers.map(s => osLabel(s.os)).filter(Boolean))].sort((a,b)=>a.localeCompare(b,'zh-CN')); const labels = [...new Set(S.servers.map(s => osLabel(s.os)).filter(Boolean))].sort((a,b)=>a.localeCompare(b,'zh-CN'));
@@ -540,7 +546,7 @@ function bindTabs(){
S.activeTab = tab; S.activeTab = tab;
document.querySelectorAll('.nav button').forEach(btn => btn.classList.toggle('active', btn === e.target)); document.querySelectorAll('.nav button').forEach(btn => btn.classList.toggle('active', btn === e.target));
document.querySelectorAll('.panel').forEach(panel => panel.classList.toggle('active', panel.id === 'panel-' + tab)); document.querySelectorAll('.panel').forEach(panel => panel.classList.toggle('active', panel.id === 'panel-' + tab));
$('serversToolbar').style.display = tab === 'servers' ? 'flex' : 'none'; normalizeServersToolbarState();
if(tab === 'config') ensureAdminChecked(); if(tab === 'config') ensureAdminChecked();
}); });
} }