fix: v1.3.1 - 四项优化
1. VRAM/内存进度条改为仅 sticky 置顶显示 - 去掉页面内重复的 vram-display 进度条 - 只保留顶部 sticky bar,滚动时始终可见 2. 去掉参数修改标记 - 不再用红色线框标记已更改的参数 3. 命令区域简化 - 去掉独立的「复制命令」和「重新生成」按钮 - 复制按钮改为命令文本框右下角悬空小按钮 4. h2 标题 margin-top 改为 0
This commit is contained in:
+13
-21
@@ -183,8 +183,7 @@ function renderParams() {
|
||||
|
||||
function renderParamItem(p) {
|
||||
const val = state.paramValues[p.param_key];
|
||||
const isMod = isParamModified(p, val);
|
||||
const mc = isMod ? 'modified' : '';
|
||||
const mc = '';
|
||||
const vb = p.affects_vram ? '<span class="vram-badge">⚡显存</span>' : '';
|
||||
// Show both short and long flag
|
||||
const shortFlag = p.short_flag || '';
|
||||
@@ -221,8 +220,7 @@ function isParamModified(p, val) {
|
||||
|
||||
function setParam(key, value) {
|
||||
state.paramValues[key] = value;
|
||||
const item = document.querySelector(`.param-item[data-key="${key}"]`);
|
||||
if (item) { const p = state.params.find(p => p.param_key === key); if (p && isParamModified(p, value)) item.classList.add('modified'); else item.classList.remove('modified'); }
|
||||
// No visual modification marker per user request
|
||||
generateCommand(); updateEstimate();
|
||||
}
|
||||
|
||||
@@ -259,25 +257,13 @@ function collectParamsForEstimate() {
|
||||
}
|
||||
|
||||
function renderVramDisplay(data) {
|
||||
const bar = document.getElementById('vram-bar'), label = document.getElementById('vram-label'), bd = document.getElementById('vram-breakdown');
|
||||
if (!data.total_vram_available_mb) { bar.style.width = '0%'; label.textContent = '请选择GPU'; bd.innerHTML = ''; return; }
|
||||
const pct = data.usage_percent || 0;
|
||||
bar.style.width = Math.min(pct, 100) + '%';
|
||||
bar.className = 'vram-bar' + (pct > 90 ? ' danger' : pct > 75 ? ' warning' : '');
|
||||
label.textContent = `VRAM: ${data.total_gb}GB / ${data.total_vram_available_gb}GB (${pct}%)`;
|
||||
bd.innerHTML = `<div class="breakdown-item"><span class="label">模型权重</span><span class="value">${data.weights_gb}GB</span></div><div class="breakdown-item"><span class="label">KV缓存</span><span class="value">${data.kv_cache_gb}GB</span></div><div class="breakdown-item"><span class="label">计算/开销</span><span class="value">${(data.compute_mb/1024).toFixed(2)}GB</span></div><div class="breakdown-item"><span class="label">CUDA开销</span><span class="value">${(data.cuda_overhead_mb/1024).toFixed(2)}GB</span></div>`;
|
||||
// Update sticky bar instead of inline display
|
||||
updateStickyBar(data, parseFloat(document.getElementById('sys-memory').value) || 0, (parseFloat(document.getElementById('sys-memory').value) || 0) === 0);
|
||||
}
|
||||
|
||||
function renderRamDisplay(data, sysGb, isUnlimited) {
|
||||
const bar = document.getElementById('ram-bar'), label = document.getElementById('ram-label'), bd = document.getElementById('ram-breakdown');
|
||||
if (isUnlimited) { bar.style.width = '0%'; label.textContent = `内存: ${data.cpu_total_gb}GB (无限制)`; }
|
||||
else {
|
||||
const pct = data.cpu_usage_percent || 0;
|
||||
bar.style.width = Math.min(pct, 100) + '%';
|
||||
bar.className = 'vram-bar ram-bar' + (pct > 90 ? ' danger' : pct > 75 ? ' warning' : '');
|
||||
label.textContent = `内存: ${data.cpu_total_gb}GB / ${sysGb}GB (${pct}%)`;
|
||||
}
|
||||
bd.innerHTML = `<div class="breakdown-item"><span class="label">CPU模型权重</span><span class="value">${data.cpu_weights_gb}GB</span></div><div class="breakdown-item"><span class="label">CPU KV缓存</span><span class="value">${(data.cpu_kv_cache_mb/1024).toFixed(2)}GB</span></div>`;
|
||||
// Update sticky ram bar instead of inline display
|
||||
// (sticky bar is already updated in updateStickyBar)
|
||||
}
|
||||
|
||||
// ===== Sticky top bar =====
|
||||
@@ -386,7 +372,13 @@ function copyCommand() {
|
||||
const ta = document.createElement('textarea');
|
||||
ta.value = text; ta.style.position = 'fixed'; ta.style.left = '-9999px';
|
||||
document.body.appendChild(ta); ta.select();
|
||||
try { document.execCommand('copy'); const btn = document.querySelector('.btn-copy'); const o = btn.textContent; btn.textContent = '✅ 已复制!'; setTimeout(() => btn.textContent = o, 2000); } catch(e) { alert('复制失败,请手动选择文本复制'); }
|
||||
try {
|
||||
document.execCommand('copy');
|
||||
const btn = document.getElementById('copy-btn');
|
||||
btn.textContent = '✅ 已复制';
|
||||
btn.classList.add('copied');
|
||||
setTimeout(() => { btn.textContent = '📋 复制'; btn.classList.remove('copied'); }, 2000);
|
||||
} catch(e) { alert('复制失败,请手动选择文本复制'); }
|
||||
document.body.removeChild(ta);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user