优化界面布局
This commit is contained in:
@@ -117,6 +117,7 @@
|
||||
globeCard: document.getElementById('globeCard'),
|
||||
btnExpandGlobe: document.getElementById('btnExpandGlobe'),
|
||||
btnRefreshNetwork: document.getElementById('btnRefreshNetwork'),
|
||||
btnGlobalRefresh: document.getElementById('btnGlobalRefresh'),
|
||||
showServerIpInput: document.getElementById('showServerIpInput'),
|
||||
ipMetricNameInput: document.getElementById('ipMetricNameInput'),
|
||||
ipLabelNameInput: document.getElementById('ipLabelNameInput'),
|
||||
@@ -291,7 +292,6 @@
|
||||
if (dom.modalClose) dom.modalClose.addEventListener('click', closeSettings);
|
||||
if (dom.btnTest) dom.btnTest.addEventListener('click', testConnection);
|
||||
if (dom.btnAdd) dom.btnAdd.addEventListener('click', addSource);
|
||||
if (dom.btnRefreshNetwork) dom.btnRefreshNetwork.addEventListener('click', fetchNetworkHistory);
|
||||
|
||||
// Auth & Login
|
||||
if (dom.btnLogin) dom.btnLogin.addEventListener('click', openLoginModal);
|
||||
@@ -477,23 +477,28 @@
|
||||
});
|
||||
}
|
||||
|
||||
const handleGlobalRefresh = async (btn) => {
|
||||
const icon = btn.querySelector('svg');
|
||||
if (icon) icon.style.animation = 'spin 0.8s ease-in-out';
|
||||
|
||||
await Promise.all([
|
||||
fetchNetworkHistory(true),
|
||||
fetchMetrics(true)
|
||||
]);
|
||||
|
||||
if (icon) {
|
||||
setTimeout(() => {
|
||||
icon.style.animation = '';
|
||||
}, 800);
|
||||
}
|
||||
};
|
||||
|
||||
if (dom.btnRefreshNetwork) {
|
||||
dom.btnRefreshNetwork.addEventListener('click', async () => {
|
||||
const icon = dom.btnRefreshNetwork.querySelector('svg');
|
||||
if (icon) icon.style.animation = 'spin 0.8s ease-in-out';
|
||||
|
||||
// Force refresh all Prometheus 24h data and overview
|
||||
await Promise.all([
|
||||
fetchNetworkHistory(true),
|
||||
fetchMetrics(true)
|
||||
]);
|
||||
|
||||
if (icon) {
|
||||
setTimeout(() => {
|
||||
icon.style.animation = '';
|
||||
}, 800);
|
||||
}
|
||||
});
|
||||
dom.btnRefreshNetwork.addEventListener('click', () => handleGlobalRefresh(dom.btnRefreshNetwork));
|
||||
}
|
||||
|
||||
if (dom.btnGlobalRefresh) {
|
||||
dom.btnGlobalRefresh.addEventListener('click', () => handleGlobalRefresh(dom.btnGlobalRefresh));
|
||||
}
|
||||
|
||||
// Keyboard shortcut
|
||||
@@ -798,38 +803,21 @@
|
||||
function updateUserUI(username) {
|
||||
if (username) {
|
||||
user = username;
|
||||
dom.btnSettings.style.display = 'flex';
|
||||
if (dom.btnSettings) dom.btnSettings.style.display = 'flex';
|
||||
if (dom.btnGlobalRefresh) dom.btnGlobalRefresh.style.display = 'flex';
|
||||
|
||||
dom.userSection.innerHTML = `
|
||||
<div class="user-info">
|
||||
<span class="username">${escapeHtml(username)}</span>
|
||||
<button class="btn btn-logout" id="btnLogout">退出</button>
|
||||
<button class="btn-refresh-global" id="btnGlobalRefresh" title="全局数据刷新">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
`;
|
||||
document.getElementById('btnLogout').addEventListener('click', handleLogout);
|
||||
document.getElementById('btnGlobalRefresh').addEventListener('click', async () => {
|
||||
const btn = document.getElementById('btnGlobalRefresh');
|
||||
const icon = btn.querySelector('svg');
|
||||
if (icon) icon.style.animation = 'spin 0.8s ease-in-out';
|
||||
|
||||
await Promise.all([
|
||||
fetchNetworkHistory(true),
|
||||
fetchMetrics(true)
|
||||
]);
|
||||
|
||||
if (icon) {
|
||||
setTimeout(() => {
|
||||
icon.style.animation = '';
|
||||
}, 800);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
user = null;
|
||||
dom.btnSettings.style.display = 'none';
|
||||
if (dom.btnSettings) dom.btnSettings.style.display = 'none';
|
||||
if (dom.btnGlobalRefresh) dom.btnGlobalRefresh.style.display = 'none';
|
||||
|
||||
dom.userSection.innerHTML = `<button class="btn btn-login" id="btnLogin">登录</button>`;
|
||||
document.getElementById('btnLogin').addEventListener('click', openLoginModal);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user