Spaces:
Running
Running
Z User commited on
Commit ·
eeb4fb1
1
Parent(s): befdabc
redesign: mobile-first dashboard v3
Browse files- dashboard.html +340 -245
dashboard.html
CHANGED
|
@@ -2,203 +2,278 @@
|
|
| 2 |
<html lang="zh-CN">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
-
<meta name="viewport" content="width=device-width,
|
| 6 |
-
<
|
| 7 |
-
<
|
| 8 |
-
<
|
| 9 |
<style>
|
| 10 |
-
*{margin:0;padding:0;box-sizing:border-box}
|
| 11 |
:root{
|
| 12 |
-
--bg:#
|
| 13 |
-
--border:
|
| 14 |
-
--
|
| 15 |
-
--
|
| 16 |
-
--
|
| 17 |
-
--
|
|
|
|
|
|
|
|
|
|
| 18 |
}
|
| 19 |
-
|
| 20 |
-
body{
|
| 21 |
-
::-webkit-
|
| 22 |
-
::-webkit-scrollbar
|
| 23 |
-
::-webkit-scrollbar-thumb{background:
|
| 24 |
-
|
| 25 |
-
|
| 26 |
-
|
| 27 |
-
|
| 28 |
-
|
| 29 |
-
.
|
| 30 |
-
.brand
|
| 31 |
-
.
|
| 32 |
-
.
|
| 33 |
-
.
|
| 34 |
-
|
| 35 |
-
.
|
| 36 |
-
|
| 37 |
-
.
|
| 38 |
-
.
|
| 39 |
-
|
| 40 |
-
|
| 41 |
-
|
| 42 |
-
|
| 43 |
-
.
|
| 44 |
-
.
|
| 45 |
-
|
| 46 |
-
|
| 47 |
-
.
|
| 48 |
-
.
|
| 49 |
-
.
|
| 50 |
-
.
|
| 51 |
-
.
|
| 52 |
-
|
| 53 |
-
|
| 54 |
-
.
|
| 55 |
-
|
| 56 |
-
|
| 57 |
-
.
|
| 58 |
-
.
|
| 59 |
-
.
|
| 60 |
-
.
|
| 61 |
-
.
|
| 62 |
-
.
|
| 63 |
-
.
|
| 64 |
-
|
| 65 |
-
|
| 66 |
-
.
|
| 67 |
-
.
|
| 68 |
-
.
|
| 69 |
-
.
|
| 70 |
-
|
| 71 |
-
|
| 72 |
-
.
|
| 73 |
-
|
| 74 |
-
|
| 75 |
-
|
| 76 |
-
.log-
|
| 77 |
-
.log-
|
| 78 |
-
.log-
|
| 79 |
-
.
|
| 80 |
-
.
|
| 81 |
-
.
|
| 82 |
-
.
|
| 83 |
-
|
| 84 |
-
|
| 85 |
-
.
|
| 86 |
-
.
|
| 87 |
-
.
|
| 88 |
-
.log-
|
| 89 |
-
.
|
| 90 |
-
.ll{font-weight:600;flex-shrink:0;width:48px;text-align:right;user-select:none;font-size:.68rem}
|
| 91 |
-
.ll.I{color:var(--g)}.ll.W{color:var(--y)}.ll.E{color:var(--r)}.ll.D{color:var(--t3)}
|
| 92 |
-
.lm{color:var(--t2);word-break:break-all;flex:1}
|
| 93 |
-
.lm.hl{color:var(--c)}
|
| 94 |
-
.lm.err{color:var(--r)}
|
| 95 |
-
.log-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--t3);font-size:.8rem}
|
| 96 |
-
.log-empty::before{content:'';display:block;width:80px;height:80px;border-radius:50%;border:2px dashed var(--border);margin-bottom:12px;background:radial-gradient(circle,var(--bg3),transparent);animation:spin 20s linear infinite}
|
| 97 |
@keyframes spin{to{transform:rotate(360deg)}}
|
| 98 |
-
|
| 99 |
-
|
| 100 |
-
|
| 101 |
-
|
| 102 |
-
|
| 103 |
-
.
|
| 104 |
-
|
| 105 |
-
.
|
| 106 |
-
.
|
| 107 |
-
.
|
| 108 |
-
|
| 109 |
-
|
| 110 |
-
|
| 111 |
-
.
|
| 112 |
-
|
| 113 |
-
|
| 114 |
-
|
| 115 |
-
|
| 116 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 117 |
}
|
| 118 |
</style>
|
| 119 |
</head>
|
| 120 |
<body>
|
| 121 |
<div class="toast-box" id="tb"></div>
|
| 122 |
-
<div class="
|
| 123 |
-
|
| 124 |
-
<!--
|
| 125 |
-
<div class="
|
| 126 |
-
<div class="brand">
|
| 127 |
-
<svg viewBox="0 0 24 24" fill="none" stroke="var(--
|
| 128 |
-
Hermes
|
| 129 |
-
<span class="
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 130 |
</div>
|
| 131 |
-
<div class="dot-live" id="dot"></div>
|
| 132 |
-
<div class="topbar-stat">运行 <b id="uptime">--</b></div>
|
| 133 |
-
<div class="topbar-stat">内存 <b id="ram">--</b></div>
|
| 134 |
-
<div class="topbar-stat">进程 <b id="pid">--</b></div>
|
| 135 |
-
<div class="topbar-spacer"></div>
|
| 136 |
-
<button class="topbar-btn" onclick="doRestart()">↻ 重启</button>
|
| 137 |
-
<button class="topbar-btn" onclick="doClear()">清除日志</button>
|
| 138 |
-
<button class="topbar-btn danger" onclick="doReset()">重置配置</button>
|
| 139 |
</div>
|
| 140 |
|
| 141 |
-
<!--
|
| 142 |
-
<div class="
|
| 143 |
-
|
| 144 |
-
<!--
|
| 145 |
-
<div class="
|
| 146 |
-
<div class="
|
| 147 |
-
|
| 148 |
-
|
| 149 |
-
|
| 150 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 151 |
</div>
|
| 152 |
|
| 153 |
-
<!--
|
| 154 |
-
<div class="
|
| 155 |
-
<div class="
|
| 156 |
-
|
| 157 |
-
|
| 158 |
-
|
| 159 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 160 |
</div>
|
| 161 |
</div>
|
| 162 |
|
| 163 |
-
<!--
|
| 164 |
-
<div class="
|
| 165 |
-
<div class="
|
| 166 |
-
|
| 167 |
-
|
| 168 |
-
|
| 169 |
-
|
| 170 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 171 |
</div>
|
| 172 |
|
| 173 |
-
<!--
|
| 174 |
-
<div class="
|
| 175 |
-
<div class="
|
| 176 |
-
|
|
|
|
|
|
|
| 177 |
</div>
|
| 178 |
|
| 179 |
</div>
|
| 180 |
|
| 181 |
-
<!--
|
| 182 |
-
<div class="
|
| 183 |
-
<div class="
|
| 184 |
-
<
|
| 185 |
-
<
|
| 186 |
-
<button class="lf on" id="fI" onclick="togF('I')">信息</button>
|
| 187 |
-
<button class="lf on" id="fW" onclick="togF('W')">警告</button>
|
| 188 |
-
<button class="lf on" id="fE" onclick="togF('E')">错误</button>
|
| 189 |
-
<div class="lf-divider"></div>
|
| 190 |
-
<button class="lf on" id="fAuto" onclick="togAuto()">自动滚动</button>
|
| 191 |
-
<button class="lf" onclick="togAuto();document.getElementById('log-scroll').scrollTop=99999">↓ 到底部</button>
|
| 192 |
-
</div>
|
| 193 |
</div>
|
| 194 |
-
<div class="
|
| 195 |
-
<
|
| 196 |
-
|
| 197 |
-
</div>
|
| 198 |
</div>
|
| 199 |
-
<div class="
|
| 200 |
-
<
|
| 201 |
-
<span
|
|
|
|
|
|
|
|
|
|
|
|
|
| 202 |
</div>
|
| 203 |
</div>
|
| 204 |
|
|
@@ -210,8 +285,6 @@ let autoScroll=true, totalLogs=0;
|
|
| 210 |
const filters={I:true,W:true,E:true};
|
| 211 |
const logBuf=[];
|
| 212 |
const MAX=800;
|
| 213 |
-
|
| 214 |
-
// 免费模型列表
|
| 215 |
const MODELS=[
|
| 216 |
{v:'inclusionai/ling-2.6-1t:free',l:'Ling 2.6 (免费)'},
|
| 217 |
{v:'inclusionai/ling-2.6-flash:free',l:'Ling 2.6 Flash (免费)'},
|
|
@@ -223,141 +296,163 @@ const MODELS=[
|
|
| 223 |
{v:'nvidia/nemotron-3-super-120b-a12b:free',l:'Nemotron 3 Super (免费)'},
|
| 224 |
];
|
| 225 |
|
| 226 |
-
//
|
| 227 |
(function(){
|
| 228 |
const sel=document.getElementById('msel');
|
| 229 |
MODELS.forEach(m=>{const o=document.createElement('option');o.value=m.v;o.textContent=m.l;sel.appendChild(o)});
|
| 230 |
})();
|
| 231 |
|
| 232 |
-
//
|
| 233 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 234 |
|
| 235 |
-
//
|
| 236 |
-
function fmtUp(ms){
|
| 237 |
|
| 238 |
-
// HTML
|
| 239 |
-
function esc(s){
|
| 240 |
|
| 241 |
-
// ── SSE
|
| 242 |
function connectSSE(){
|
| 243 |
-
|
| 244 |
-
es.onmessage=e
|
| 245 |
-
es.onerror=()
|
| 246 |
}
|
| 247 |
|
| 248 |
function addLog(l){
|
| 249 |
-
|
| 250 |
if(!totalLogs)sc.innerHTML='';
|
| 251 |
totalLogs++;logBuf.push(l);
|
| 252 |
if(logBuf.length>MAX)logBuf.shift();
|
| 253 |
-
|
| 254 |
-
|
| 255 |
-
|
| 256 |
-
|
| 257 |
div.className='log-line';div.dataset.f=fk;
|
| 258 |
if(!filters[fk])div.style.display='none';
|
| 259 |
-
|
| 260 |
-
|
| 261 |
-
|
| 262 |
-
div.innerHTML=
|
| 263 |
sc.appendChild(div);
|
| 264 |
while(sc.children.length>MAX)sc.removeChild(sc.firstChild);
|
| 265 |
if(autoScroll)sc.scrollTop=sc.scrollHeight;
|
| 266 |
document.getElementById('log-count').textContent=totalLogs+' 条日志';
|
| 267 |
}
|
| 268 |
|
| 269 |
-
// ──
|
| 270 |
async function poll(){
|
| 271 |
try{
|
| 272 |
-
|
| 273 |
-
//
|
| 274 |
-
document.getElementById('dot').className='
|
| 275 |
document.getElementById('uptime').textContent=fmtUp(d.uptime_ms||0);
|
| 276 |
document.getElementById('ram').textContent=d.ram||'--';
|
| 277 |
-
|
| 278 |
-
|
| 279 |
-
document.getElementById('x-
|
| 280 |
-
document.getElementById('x-
|
| 281 |
-
document.getElementById('x-
|
| 282 |
-
document.getElementById('x-
|
| 283 |
-
document.getElementById('x-
|
| 284 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 285 |
if(d.config){
|
| 286 |
-
document.getElementById('x-
|
| 287 |
-
document.getElementById('x-term').textContent=d.config.terminal==='local'?'本地':'远程';
|
| 288 |
-
document.getElementById('x-tz').textContent=d.config.timezone||'Asia/Shanghai';
|
| 289 |
document.getElementById('x-turns').textContent=d.config.max_turns||'90';
|
| 290 |
document.getElementById('x-comp').textContent=d.config.compress?'已开启':'已关闭';
|
| 291 |
-
document.getElementById('x-comp').style.color=d.config.compress?'var(--
|
| 292 |
document.getElementById('x-mem').textContent=d.config.memory==='none'?'未配置':'已配置';
|
| 293 |
-
document.getElementById('x-mem').style.color=d.config.memory!=='none'?'var(--
|
| 294 |
-
|
|
|
|
|
|
|
| 295 |
if(d.model){
|
| 296 |
-
|
| 297 |
-
|
| 298 |
-
for(
|
| 299 |
-
if(!found){
|
| 300 |
sel.value=d.model;
|
| 301 |
}
|
| 302 |
}
|
| 303 |
document.getElementById('log-time').textContent=new Date().toLocaleTimeString('zh-CN');
|
| 304 |
-
}catch{}
|
| 305 |
}
|
| 306 |
|
| 307 |
-
// ──
|
| 308 |
async function loadSess(){
|
| 309 |
try{
|
| 310 |
-
|
| 311 |
-
|
| 312 |
-
if(!list||!list.length){el.innerHTML='<div class="empty
|
| 313 |
-
el.innerHTML=list.slice(0,10).map(s
|
| 314 |
-
<div class="
|
| 315 |
-
|
| 316 |
-
|
| 317 |
-
<div class="s-name">${esc(s.name||s.id)}</div>
|
| 318 |
-
<div class="s-meta">${esc(s.platform||'')} · ${s.messages||0} 条 · ${esc(s.last||'')}</div>
|
| 319 |
-
</div>
|
| 320 |
-
</div>`).join('');
|
| 321 |
-
}catch{}
|
| 322 |
}
|
| 323 |
|
| 324 |
-
// ──
|
| 325 |
async function doRestart(){
|
| 326 |
toast('正在重启网关…','info');
|
| 327 |
-
try{
|
| 328 |
}
|
| 329 |
async function doClear(){
|
| 330 |
totalLogs=0;logBuf.length=0;
|
| 331 |
-
document.getElementById('log-scroll').innerHTML='<div class="log-empty">已清除</div>';
|
| 332 |
document.getElementById('log-count').textContent='0 条日志';
|
| 333 |
toast('日志已清除','ok');
|
| 334 |
}
|
| 335 |
async function doReset(){
|
| 336 |
-
|
| 337 |
-
|
| 338 |
-
|
|
|
|
| 339 |
}
|
| 340 |
async function doSwitch(){
|
| 341 |
-
|
| 342 |
toast('正在切换模型…','info');
|
| 343 |
try{
|
| 344 |
-
|
| 345 |
-
|
| 346 |
-
toast(d.ok?'
|
| 347 |
if(d.ok)setTimeout(poll,1000);
|
| 348 |
-
}catch{toast('请求失败','err')}
|
| 349 |
}
|
| 350 |
|
| 351 |
-
// ──
|
| 352 |
function togF(k){
|
| 353 |
filters[k]=!filters[k];
|
| 354 |
-
|
| 355 |
btn.classList.toggle('on',filters[k]);
|
| 356 |
-
document.querySelectorAll('#log-scroll .log-line')
|
|
|
|
| 357 |
}
|
| 358 |
function togAuto(){autoScroll=!autoScroll;document.getElementById('fAuto').classList.toggle('on',autoScroll)}
|
|
|
|
| 359 |
|
| 360 |
-
// ──
|
| 361 |
poll();setInterval(poll,5000);setInterval(loadSess,30000);loadSess();connectSSE();
|
| 362 |
</script>
|
| 363 |
</body>
|
|
|
|
| 2 |
<html lang="zh-CN">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
+
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
|
| 6 |
+
<meta name="apple-mobile-web-app-capable" content="yes">
|
| 7 |
+
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
| 8 |
+
<title>Hermes</title>
|
| 9 |
<style>
|
|
|
|
| 10 |
:root{
|
| 11 |
+
--bg:#0a0c10;--card:rgba(255,255,255,.03);--card-h:rgba(255,255,255,.06);
|
| 12 |
+
--border:rgba(255,255,255,.06);--border-a:rgba(255,255,255,.12);
|
| 13 |
+
--tx:#e8eaf0;--tx2:#7a8394;--tx3:#444d5e;
|
| 14 |
+
--accent:#00e5a0;--accent2:rgba(0,229,160,.12);
|
| 15 |
+
--blue:#4d9fff;--purple:#a78bfa;--red:#ff5c72;--yellow:#ffbe30;--cyan:#22d3ee;--orange:#fb923c;
|
| 16 |
+
--radius:14px;--radius-sm:10px;
|
| 17 |
+
--safe-top:env(safe-area-inset-top,0px);
|
| 18 |
+
--safe-bot:env(safe-area-inset-bottom,0px);
|
| 19 |
+
--tab-h:56px;
|
| 20 |
}
|
| 21 |
+
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
|
| 22 |
+
html,body{height:100%;overflow:hidden}
|
| 23 |
+
body{font-family:-apple-system,"SF Pro Display","Noto Sans SC","PingFang SC","Helvetica Neue",sans-serif;background:var(--bg);color:var(--tx);font-size:15px;-webkit-font-smoothing:antialiased}
|
| 24 |
+
::-webkit-scrollbar{width:3px}
|
| 25 |
+
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:3px}
|
| 26 |
+
|
| 27 |
+
/* ── Shell ── */
|
| 28 |
+
.shell{display:flex;flex-direction:column;height:100%;height:100dvh;padding-top:var(--safe-top);padding-bottom:var(--safe-bot)}
|
| 29 |
+
|
| 30 |
+
/* ── Header ── */
|
| 31 |
+
.hdr{display:flex;align-items:center;padding:10px 16px;gap:10px;flex-shrink:0;border-bottom:1px solid var(--border)}
|
| 32 |
+
.hdr-brand{font-weight:700;font-size:17px;letter-spacing:-.3px;display:flex;align-items:center;gap:8px}
|
| 33 |
+
.hdr-brand svg{width:20px;height:20px}
|
| 34 |
+
.hdr-tag{font-size:10px;padding:2px 7px;border-radius:6px;background:var(--accent2);color:var(--accent);font-weight:600;letter-spacing:.3px}
|
| 35 |
+
.hdr-right{margin-left:auto;display:flex;align-items:center;gap:12px}
|
| 36 |
+
.hdr-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px var(--accent);animation:blink 2s ease infinite}
|
| 37 |
+
.hdr-dot.off{background:var(--red);box-shadow:0 0 6px var(--red)}
|
| 38 |
+
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
|
| 39 |
+
.hdr-stat{font-size:11px;color:var(--tx2);font-variant-numeric:tabular-nums}
|
| 40 |
+
.hdr-stat b{color:var(--tx);font-weight:600}
|
| 41 |
+
|
| 42 |
+
/* ── Panels ── */
|
| 43 |
+
.panels{flex:1;position:relative;overflow:hidden}
|
| 44 |
+
.panel{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;transform:translateY(6px);-webkit-overflow-scrolling:touch}
|
| 45 |
+
.panel.on{opacity:1;pointer-events:auto;transform:translateY(0)}
|
| 46 |
+
.panel-pad{padding:16px}
|
| 47 |
+
|
| 48 |
+
/* ── Tab Bar ── */
|
| 49 |
+
.tabs{display:flex;align-items:stretch;height:var(--tab-h);flex-shrink:0;background:rgba(12,14,20,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border);padding-bottom:2px}
|
| 50 |
+
.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer;color:var(--tx3);transition:color .15s;position:relative}
|
| 51 |
+
.tab svg{width:21px;height:21px;transition:transform .15s}
|
| 52 |
+
.tab span{font-size:10px;font-weight:500}
|
| 53 |
+
.tab.on{color:var(--accent)}
|
| 54 |
+
.tab.on svg{transform:scale(1.1)}
|
| 55 |
+
.tab::before{content:'';position:absolute;top:-1px;left:25%;right:25%;height:2px;border-radius:1px;background:var(--accent);opacity:0;transition:opacity .15s}
|
| 56 |
+
.tab.on::before{opacity:1}
|
| 57 |
+
|
| 58 |
+
/* ── Cards ── */
|
| 59 |
+
.cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
|
| 60 |
+
.card{padding:14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);transition:background .12s}
|
| 61 |
+
.card:active{background:var(--card-h)}
|
| 62 |
+
.card-label{font-size:11px;color:var(--tx3);font-weight:500;margin-bottom:6px}
|
| 63 |
+
.card-val{font-size:15px;font-weight:700;font-family:"SF Mono",Menlo,Monaco,Consolas,monospace;display:flex;align-items:center;gap:6px;word-break:break-all}
|
| 64 |
+
.card-sub{font-size:10px;color:var(--tx3);margin-top:4px;font-family:"SF Mono",Menlo,Monaco,Consolas,monospace}
|
| 65 |
+
.card.accent .card-val{color:var(--accent)}
|
| 66 |
+
.card.blue .card-val{color:var(--blue)}
|
| 67 |
+
.card.purple .card-val{color:var(--purple)}
|
| 68 |
+
.card.yellow .card-val{color:var(--yellow)}
|
| 69 |
+
.card.cyan .card-val{color:var(--cyan)}
|
| 70 |
+
.card.orange .card-val{color:var(--orange)}
|
| 71 |
+
.card-wide{grid-column:1/-1}
|
| 72 |
+
|
| 73 |
+
/* ── Section ── */
|
| 74 |
+
.sec-title{font-size:12px;color:var(--tx3);font-weight:600;text-transform:uppercase;letter-spacing:1px;margin:20px 0 10px;display:flex;align-items:center;gap:6px}
|
| 75 |
+
.sec-title::after{content:'';flex:1;height:1px;background:var(--border)}
|
| 76 |
+
|
| 77 |
+
/* ── Log Panel ── */
|
| 78 |
+
.log-toolbar{display:flex;align-items:center;gap:6px;padding:8px 16px;flex-shrink:0;border-bottom:1px solid var(--border);flex-wrap:wrap}
|
| 79 |
+
.log-chip{height:28px;padding:0 10px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--tx3);font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .12s;display:flex;align-items:center;gap:4px;white-space:nowrap}
|
| 80 |
+
.log-chip.on{background:var(--accent2);border-color:rgba(0,229,160,.2);color:var(--accent)}
|
| 81 |
+
.log-chip.space{flex:0}
|
| 82 |
+
.log-scroll{flex:1;overflow-y:auto;padding:8px 12px;font-family:"SF Mono",Menlo,Monaco,Consolas,monospace;font-size:12px;line-height:1.8;-webkit-overflow-scrolling:touch}
|
| 83 |
+
.log-line{display:flex;gap:8px;padding:1px 4px;border-radius:4px}
|
| 84 |
+
.log-line:active{background:rgba(255,255,255,.03)}
|
| 85 |
+
.lt{color:var(--tx3);flex-shrink:0;font-size:10px;min-width:52px;padding-top:2px}
|
| 86 |
+
.ll{font-weight:600;flex-shrink:0;width:28px;text-align:right;font-size:10px;padding-top:2px}
|
| 87 |
+
.ll.I{color:var(--accent)}.ll.W{color:var(--yellow)}.ll.E{color:var(--red)}.ll.D{color:var(--tx3)}
|
| 88 |
+
.lm{color:var(--tx2);word-break:break-all;flex:1;line-height:1.7}
|
| 89 |
+
.lm.hl{color:var(--cyan)}.lm.err{color:var(--red)}
|
| 90 |
+
.log-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--tx3);font-size:13px;gap:12px;font-family:inherit}
|
| 91 |
+
.log-empty-ring{width:60px;height:60px;border-radius:50%;border:2px dashed var(--border-a);animation:spin 25s linear infinite;opacity:.5}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 92 |
@keyframes spin{to{transform:rotate(360deg)}}
|
| 93 |
+
.log-footer{display:flex;align-items:center;justify-content:space-between;padding:5px 16px;border-top:1px solid var(--border);flex-shrink:0;font-size:10px;color:var(--tx3);font-family:"SF Mono",Menlo,monospace}
|
| 94 |
+
|
| 95 |
+
/* ── Model Panel ── */
|
| 96 |
+
.model-pick{width:100%;padding:12px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--tx);font-size:13px;font-family:"SF Mono",Menlo,Monaco,Consolas,monospace;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%237a8394'%3E%3Cpath d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;margin-bottom:10px}
|
| 97 |
+
.model-pick:focus{outline:none;border-color:var(--blue)}
|
| 98 |
+
.model-pick option{background:#14161c;color:var(--tx)}
|
| 99 |
+
|
| 100 |
+
.btn{height:44px;border-radius:var(--radius-sm);border:none;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .12s;display:flex;align-items:center;justify-content:center;gap:6px;width:100%}
|
| 101 |
+
.btn:active{opacity:.8}
|
| 102 |
+
.btn-g{background:var(--accent);color:#0a0c10}
|
| 103 |
+
.btn-g:active{background:#00cc8e}
|
| 104 |
+
.btn-o{background:transparent;border:1px solid var(--border-a);color:var(--tx2)}
|
| 105 |
+
.btn-o:active{background:var(--card-h)}
|
| 106 |
+
.btn-r{background:transparent;border:1px solid rgba(255,92,114,.2);color:var(--red)}
|
| 107 |
+
.btn-r:active{background:rgba(255,92,114,.06)}
|
| 108 |
+
.btn-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
|
| 109 |
+
.btn-sm{height:38px;font-size:13px}
|
| 110 |
+
|
| 111 |
+
/* ── Config List ── */
|
| 112 |
+
.cfg-list{display:flex;flex-direction:column;gap:1px;background:var(--border);border-radius:var(--radius-sm);overflow:hidden}
|
| 113 |
+
.cfg-row{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;background:var(--bg);font-size:13px}
|
| 114 |
+
.cfg-row:first-child{border-radius:var(--radius-sm) var(--radius-sm) 0 0}
|
| 115 |
+
.cfg-row:last-child{border-radius:0 0 var(--radius-sm) var(--radius-sm)}
|
| 116 |
+
.cfg-k{color:var(--tx2);font-weight:500}
|
| 117 |
+
.cfg-v{color:var(--tx);font-family:"SF Mono",Menlo,Monaco,Consolas,monospace;font-size:12px;text-align:right;max-width:55%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
| 118 |
+
|
| 119 |
+
/* ── Sessions ── */
|
| 120 |
+
.s-item{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;transition:background .12s}
|
| 121 |
+
.s-item:active{background:var(--card-h)}
|
| 122 |
+
.s-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0;box-shadow:0 0 4px var(--accent)}
|
| 123 |
+
.s-dot.idle{background:var(--tx3);box-shadow:none}
|
| 124 |
+
.s-info{flex:1;min-width:0}
|
| 125 |
+
.s-name{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
| 126 |
+
.s-meta{font-size:11px;color:var(--tx3);margin-top:2px}
|
| 127 |
+
.s-count{font-size:12px;color:var(--tx3);font-family:"SF Mono",Menlo,monospace;flex-shrink:0}
|
| 128 |
+
.empty{text-align:center;color:var(--tx3);font-size:13px;padding:40px 0}
|
| 129 |
+
|
| 130 |
+
/* ── Action Sheet ── */
|
| 131 |
+
.actions{display:flex;flex-direction:column;gap:8px;padding:16px}
|
| 132 |
+
.actions .sec-title{margin-top:0}
|
| 133 |
+
|
| 134 |
+
/* ── Toast ── */
|
| 135 |
+
.toast-box{position:fixed;top:calc(var(--safe-top) + 10px);left:16px;right:16px;z-index:100;display:flex;flex-direction:column;gap:6px;pointer-events:none}
|
| 136 |
+
.toast{padding:12px 16px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:toastIn .25s ease}
|
| 137 |
+
.toast.ok{background:rgba(0,229,160,.12);border:1px solid rgba(0,229,160,.2);color:var(--accent)}
|
| 138 |
+
.toast.err{background:rgba(255,92,114,.12);border:1px solid rgba(255,92,114,.2);color:var(--red)}
|
| 139 |
+
.toast.info{background:rgba(77,159,255,.12);border:1px solid rgba(77,159,255,.2);color:var(--blue)}
|
| 140 |
+
@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
|
| 141 |
+
|
| 142 |
+
/* ── Confirm Dialog ── */
|
| 143 |
+
.dialog-mask{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;padding:0 16px 20px;animation:maskIn .2s ease}
|
| 144 |
+
@keyframes maskIn{from{opacity:0}to{opacity:1}}
|
| 145 |
+
.dialog-sheet{width:100%;max-width:400px;background:#1a1d26;border:1px solid var(--border-a);border-radius:16px;padding:20px;animation:sheetUp .25s ease}
|
| 146 |
+
@keyframes sheetUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
|
| 147 |
+
.dialog-title{font-size:16px;font-weight:700;margin-bottom:8px}
|
| 148 |
+
.dialog-msg{font-size:13px;color:var(--tx2);margin-bottom:20px;line-height:1.6}
|
| 149 |
+
.dialog-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
|
| 150 |
+
|
| 151 |
+
/* ── Desktop enhance ── */
|
| 152 |
+
@media(min-width:600px){
|
| 153 |
+
.cards{grid-template-columns:1fr 1fr 1fr}
|
| 154 |
+
.panel-pad{max-width:640px;margin:0 auto;padding:20px 0}
|
| 155 |
+
.log-scroll{padding:12px 20px}
|
| 156 |
+
.log-toolbar{padding:8px 20px}
|
| 157 |
}
|
| 158 |
</style>
|
| 159 |
</head>
|
| 160 |
<body>
|
| 161 |
<div class="toast-box" id="tb"></div>
|
| 162 |
+
<div class="shell">
|
| 163 |
+
|
| 164 |
+
<!-- Header -->
|
| 165 |
+
<div class="hdr">
|
| 166 |
+
<div class="hdr-brand">
|
| 167 |
+
<svg viewBox="0 0 24 24" fill="none" stroke="var(--accent)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>
|
| 168 |
+
Hermes
|
| 169 |
+
<span class="hdr-tag">LIVE</span>
|
| 170 |
+
</div>
|
| 171 |
+
<div class="hdr-right">
|
| 172 |
+
<div class="hdr-dot" id="dot"></div>
|
| 173 |
+
<div class="hdr-stat">运行 <b id="uptime">--</b></div>
|
| 174 |
+
<div class="hdr-stat">内存 <b id="ram">--</b></div>
|
| 175 |
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 176 |
</div>
|
| 177 |
|
| 178 |
+
<!-- Panels -->
|
| 179 |
+
<div class="panels">
|
| 180 |
+
|
| 181 |
+
<!-- Tab 0: Log -->
|
| 182 |
+
<div class="panel on" id="p-log">
|
| 183 |
+
<div class="log-toolbar">
|
| 184 |
+
<button class="log-chip on" id="fI" onclick="togF('I')">● 信息</button>
|
| 185 |
+
<button class="log-chip on" id="fW" onclick="togF('W')">● 警告</button>
|
| 186 |
+
<button class="log-chip on" id="fE" onclick="togF('E')">● 错误</button>
|
| 187 |
+
<button class="log-chip space"></button>
|
| 188 |
+
<button class="log-chip on" id="fAuto" onclick="togAuto()">自动滚动</button>
|
| 189 |
+
<button class="log-chip" onclick="goBot()">↓ 底部</button>
|
| 190 |
+
</div>
|
| 191 |
+
<div class="log-scroll" id="log-scroll">
|
| 192 |
+
<div class="log-empty"><div class="log-empty-ring"></div>等待日志…</div>
|
| 193 |
+
</div>
|
| 194 |
+
<div class="log-footer">
|
| 195 |
+
<span id="log-count">0 条日志</span>
|
| 196 |
+
<span id="log-time"></span>
|
| 197 |
+
</div>
|
| 198 |
</div>
|
| 199 |
|
| 200 |
+
<!-- Tab 1: Status -->
|
| 201 |
+
<div class="panel" id="p-status">
|
| 202 |
+
<div class="panel-pad">
|
| 203 |
+
<div class="sec-title">系统状态</div>
|
| 204 |
+
<div class="cards">
|
| 205 |
+
<div class="card accent"><div class="card-label">运行时间</div><div class="card-val" id="x-up2">--</div></div>
|
| 206 |
+
<div class="card blue"><div class="card-label">内存占用</div><div class="card-val" id="x-ram2">--</div></div>
|
| 207 |
+
<div class="card purple"><div class="card-label">进程 PID</div><div class="card-val" id="x-pid2">--</div></div>
|
| 208 |
+
<div class="card cyan"><div class="card-label">活跃会话</div><div class="card-val" id="x-sess2">0</div></div>
|
| 209 |
+
<div class="card cyan"><div class="card-label">连接平台</div><div class="card-val" id="x-plat2">飞书</div><div class="card-sub" id="x-plat-s2">WebSocket</div></div>
|
| 210 |
+
<div class="card orange"><div class="card-label">当前模型</div><div class="card-val" id="x-model2">--</div><div class="card-sub">OpenRouter</div></div>
|
| 211 |
+
</div>
|
| 212 |
+
|
| 213 |
+
<div class="sec-title">配置详情</div>
|
| 214 |
+
<div class="cfg-list">
|
| 215 |
+
<div class="cfg-row"><span class="cfg-k">连接模式</span><span class="cfg-v" id="x-conn">WebSocket</span></div>
|
| 216 |
+
<div class="cfg-row"><span class="cfg-k">最大轮数</span><span class="cfg-v" id="x-turns">90</span></div>
|
| 217 |
+
<div class="cfg-row"><span class="cfg-k">上下文压缩</span><span class="cfg-v" id="x-comp">--</span></div>
|
| 218 |
+
<div class="cfg-row"><span class="cfg-k">记忆系统</span><span class="cfg-v" id="x-mem">--</span></div>
|
| 219 |
+
<div class="cfg-row"><span class="cfg-k">终端类型</span><span class="cfg-v" id="x-term">--</span></div>
|
| 220 |
+
<div class="cfg-row"><span class="cfg-k">时区</span><span class="cfg-v" id="x-tz">Asia/Shanghai</span></div>
|
| 221 |
+
</div>
|
| 222 |
+
|
| 223 |
+
<div class="sec-title">快捷操作</div>
|
| 224 |
+
<div class="actions">
|
| 225 |
+
<button class="btn btn-g" onclick="doRestart()">↻ 重启网关</button>
|
| 226 |
+
<div class="btn-row">
|
| 227 |
+
<button class="btn btn-o btn-sm" onclick="doClear()">清除日志</button>
|
| 228 |
+
<button class="btn btn-r btn-sm" onclick="doReset()">重置配置</button>
|
| 229 |
+
</div>
|
| 230 |
+
</div>
|
| 231 |
</div>
|
| 232 |
</div>
|
| 233 |
|
| 234 |
+
<!-- Tab 2: Model -->
|
| 235 |
+
<div class="panel" id="p-model">
|
| 236 |
+
<div class="panel-pad">
|
| 237 |
+
<div class="sec-title">模型选择</div>
|
| 238 |
+
<select class="model-pick" id="msel"></select>
|
| 239 |
+
<button class="btn btn-g" onclick="doSwitch()">切换模型</button>
|
| 240 |
+
|
| 241 |
+
<div class="sec-title">模型信息</div>
|
| 242 |
+
<div class="cfg-list">
|
| 243 |
+
<div class="cfg-row"><span class="cfg-k">当前模型</span><span class="cfg-v" id="x-cur-model">--</span></div>
|
| 244 |
+
<div class="cfg-row"><span class="cfg-k">提供商</span><span class="cfg-v">OpenRouter</span></div>
|
| 245 |
+
<div class="cfg-row"><span class="cfg-k">状态</span><span class="cfg-v" id="x-model-status" style="color:var(--accent)">运行中</span></div>
|
| 246 |
+
</div>
|
| 247 |
+
</div>
|
| 248 |
</div>
|
| 249 |
|
| 250 |
+
<!-- Tab 3: Sessions -->
|
| 251 |
+
<div class="panel" id="p-sess">
|
| 252 |
+
<div class="panel-pad">
|
| 253 |
+
<div class="sec-title" style="margin-top:0">近期会话</div>
|
| 254 |
+
<div id="sess-list"><div class="empty">暂无会话记录</div></div>
|
| 255 |
+
</div>
|
| 256 |
</div>
|
| 257 |
|
| 258 |
</div>
|
| 259 |
|
| 260 |
+
<!-- Tab Bar -->
|
| 261 |
+
<div class="tabs">
|
| 262 |
+
<div class="tab on" data-t="0" onclick="switchTab(0)">
|
| 263 |
+
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 19.5A2.5 2.5 0 016.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 014 19.5v-15A2.5 2.5 0 016.5 2z"/><line x1="8" y1="7" x2="16" y2="7"/><line x1="8" y1="11" x2="14" y2="11"/></svg>
|
| 264 |
+
<span>日志</span>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 265 |
</div>
|
| 266 |
+
<div class="tab" data-t="1" onclick="switchTab(1)">
|
| 267 |
+
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z"/></svg>
|
| 268 |
+
<span>状态</span>
|
|
|
|
| 269 |
</div>
|
| 270 |
+
<div class="tab" data-t="2" onclick="switchTab(2)">
|
| 271 |
+
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>
|
| 272 |
+
<span>模型</span>
|
| 273 |
+
</div>
|
| 274 |
+
<div class="tab" data-t="3" onclick="switchTab(3)">
|
| 275 |
+
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 00-3-3.87"/><path d="M16 3.13a4 4 0 010 7.75"/></svg>
|
| 276 |
+
<span>会话</span>
|
| 277 |
</div>
|
| 278 |
</div>
|
| 279 |
|
|
|
|
| 285 |
const filters={I:true,W:true,E:true};
|
| 286 |
const logBuf=[];
|
| 287 |
const MAX=800;
|
|
|
|
|
|
|
| 288 |
const MODELS=[
|
| 289 |
{v:'inclusionai/ling-2.6-1t:free',l:'Ling 2.6 (免费)'},
|
| 290 |
{v:'inclusionai/ling-2.6-flash:free',l:'Ling 2.6 Flash (免费)'},
|
|
|
|
| 296 |
{v:'nvidia/nemotron-3-super-120b-a12b:free',l:'Nemotron 3 Super (免费)'},
|
| 297 |
];
|
| 298 |
|
| 299 |
+
// Init model dropdown
|
| 300 |
(function(){
|
| 301 |
const sel=document.getElementById('msel');
|
| 302 |
MODELS.forEach(m=>{const o=document.createElement('option');o.value=m.v;o.textContent=m.l;sel.appendChild(o)});
|
| 303 |
})();
|
| 304 |
|
| 305 |
+
// Tab switching
|
| 306 |
+
const panels=['p-log','p-status','p-model','p-sess'];
|
| 307 |
+
function switchTab(i){
|
| 308 |
+
document.querySelectorAll('.tab').forEach((t,idx)=>t.classList.toggle('on',idx===i));
|
| 309 |
+
panels.forEach((id,idx)=>document.getElementById(id).classList.toggle('on',idx===i));
|
| 310 |
+
if(i===3)loadSess();
|
| 311 |
+
}
|
| 312 |
+
|
| 313 |
+
// Toast
|
| 314 |
+
function toast(m,t){t=t||'info';const e=document.createElement('div');e.className='toast '+t;e.textContent=m;document.getElementById('tb').appendChild(e);setTimeout(function(){e.remove()},3500)}
|
| 315 |
+
|
| 316 |
+
// Confirm dialog (replaces native confirm)
|
| 317 |
+
function askConfirm(title,msg,onYes){
|
| 318 |
+
const mask=document.createElement('div');
|
| 319 |
+
mask.className='dialog-mask';
|
| 320 |
+
mask.innerHTML='<div class="dialog-sheet"><div class="dialog-title">'+title+'</div><div class="dialog-msg">'+msg+'</div><div class="dialog-btns"><button class="btn btn-o" id="d-no">取消</button><button class="btn btn-r" id="d-yes">确认</button></div></div>';
|
| 321 |
+
document.body.appendChild(mask);
|
| 322 |
+
document.getElementById('d-no').onclick=function(){mask.remove()};
|
| 323 |
+
document.getElementById('d-yes').onclick=function(){mask.remove();onYes()};
|
| 324 |
+
mask.onclick=function(e){if(e.target===mask)mask.remove()};
|
| 325 |
+
}
|
| 326 |
|
| 327 |
+
// Format uptime
|
| 328 |
+
function fmtUp(ms){var s=Math.floor(ms/1000),d=Math.floor(s/86400),h=Math.floor(s%86400/3600),m=Math.floor(s%3600/60),ss=s%60;if(d>0)return d+'天'+h+'时'+m+'分';if(h>0)return h+'时'+m+'分'+ss+'秒';return m+'分'+ss+'秒'}
|
| 329 |
|
| 330 |
+
// Escape HTML
|
| 331 |
+
function esc(s){var d=document.createElement('div');d.textContent=s;return d.innerHTML}
|
| 332 |
|
| 333 |
+
// ── SSE ──
|
| 334 |
function connectSSE(){
|
| 335 |
+
var es=new EventSource(A+'/api/logs/stream');
|
| 336 |
+
es.onmessage=function(e){try{var a=JSON.parse(e.data);if(Array.isArray(a))a.forEach(addLog)}catch(x){}};
|
| 337 |
+
es.onerror=function(){setTimeout(connectSSE,3000)};
|
| 338 |
}
|
| 339 |
|
| 340 |
function addLog(l){
|
| 341 |
+
var sc=document.getElementById('log-scroll');
|
| 342 |
if(!totalLogs)sc.innerHTML='';
|
| 343 |
totalLogs++;logBuf.push(l);
|
| 344 |
if(logBuf.length>MAX)logBuf.shift();
|
| 345 |
+
var lv=(l.level||'info').toUpperCase();
|
| 346 |
+
var map={INFO:'I',WARN:'W',WARNING:'W',ERROR:'E',DEBUG:'D'};
|
| 347 |
+
var fk=map[lv]||'I';
|
| 348 |
+
var div=document.createElement('div');
|
| 349 |
div.className='log-line';div.dataset.f=fk;
|
| 350 |
if(!filters[fk])div.style.display='none';
|
| 351 |
+
var hl=(l.msg||'').toLowerCase();
|
| 352 |
+
var isHL=hl.indexOf('feishu')>-1||hl.indexOf('\u98de\u4e66')>-1||hl.indexOf('connect')>-1||hl.indexOf('\u6536\u5230')>-1||hl.indexOf('\u56de\u590d')>-1;
|
| 353 |
+
var isErr=fk==='E';
|
| 354 |
+
div.innerHTML='<span class="lt">'+esc(l.time||'')+'</span><span class="ll '+fk+'">'+(l.level||'INFO').substring(0,5)+'</span><span class="lm'+(isHL?' hl':'')+(isErr?' err':'')+'">'+esc(l.msg||'')+'</span>';
|
| 355 |
sc.appendChild(div);
|
| 356 |
while(sc.children.length>MAX)sc.removeChild(sc.firstChild);
|
| 357 |
if(autoScroll)sc.scrollTop=sc.scrollHeight;
|
| 358 |
document.getElementById('log-count').textContent=totalLogs+' 条日志';
|
| 359 |
}
|
| 360 |
|
| 361 |
+
// ── Status Polling ──
|
| 362 |
async function poll(){
|
| 363 |
try{
|
| 364 |
+
var r=await fetch(A+'/api/status');var d=await r.json();
|
| 365 |
+
// Header
|
| 366 |
+
document.getElementById('dot').className='hdr-dot'+(d.running?'':' off');
|
| 367 |
document.getElementById('uptime').textContent=fmtUp(d.uptime_ms||0);
|
| 368 |
document.getElementById('ram').textContent=d.ram||'--';
|
| 369 |
+
// Status panel
|
| 370 |
+
document.getElementById('x-up2').textContent=fmtUp(d.uptime_ms||0);
|
| 371 |
+
document.getElementById('x-ram2').textContent=d.ram||'--';
|
| 372 |
+
document.getElementById('x-pid2').textContent=d.pid||'--';
|
| 373 |
+
document.getElementById('x-sess2').textContent=d.sessions||0;
|
| 374 |
+
document.getElementById('x-plat2').textContent=d.platform||'飞书';
|
| 375 |
+
document.getElementById('x-plat-s2').textContent=d.platform_mode||'WebSocket';
|
| 376 |
+
var modelName=(d.model||'--').split('/').pop();
|
| 377 |
+
document.getElementById('x-model2').textContent=modelName.length>25?modelName.substring(0,25)+'…':modelName;
|
| 378 |
+
document.getElementById('x-cur-model').textContent=modelName.length>35?modelName.substring(0,35)+'…':modelName;
|
| 379 |
+
document.getElementById('x-model-status').textContent=d.running?'运行中':'已停止';
|
| 380 |
+
document.getElementById('x-model-status').style.color=d.running?'var(--accent)':'var(--red)';
|
| 381 |
+
// Config
|
| 382 |
if(d.config){
|
| 383 |
+
document.getElementById('x-conn').textContent=d.platform_mode||'WebSocket';
|
|
|
|
|
|
|
| 384 |
document.getElementById('x-turns').textContent=d.config.max_turns||'90';
|
| 385 |
document.getElementById('x-comp').textContent=d.config.compress?'已开启':'已关闭';
|
| 386 |
+
document.getElementById('x-comp').style.color=d.config.compress?'var(--accent)':'var(--tx3)';
|
| 387 |
document.getElementById('x-mem').textContent=d.config.memory==='none'?'未配置':'已配置';
|
| 388 |
+
document.getElementById('x-mem').style.color=d.config.memory!=='none'?'var(--accent)':'var(--tx3)';
|
| 389 |
+
document.getElementById('x-term').textContent=d.config.terminal==='local'?'本地':'远程';
|
| 390 |
+
document.getElementById('x-tz').textContent=d.config.timezone||'Asia/Shanghai';
|
| 391 |
+
// Sync model selector
|
| 392 |
if(d.model){
|
| 393 |
+
var sel=document.getElementById('msel');
|
| 394 |
+
var found=false;
|
| 395 |
+
for(var i=0;i<sel.options.length;i++){if(sel.options[i].value===d.model){found=true;break}}
|
| 396 |
+
if(!found){var o=document.createElement('option');o.value=d.model;o.textContent=d.model;sel.prepend(o)}
|
| 397 |
sel.value=d.model;
|
| 398 |
}
|
| 399 |
}
|
| 400 |
document.getElementById('log-time').textContent=new Date().toLocaleTimeString('zh-CN');
|
| 401 |
+
}catch(x){}
|
| 402 |
}
|
| 403 |
|
| 404 |
+
// ── Sessions ──
|
| 405 |
async function loadSess(){
|
| 406 |
try{
|
| 407 |
+
var r=await fetch(A+'/api/sessions');var list=await r.json();
|
| 408 |
+
var el=document.getElementById('sess-list');
|
| 409 |
+
if(!list||!list.length){el.innerHTML='<div class="empty">暂无会话记录</div>';return}
|
| 410 |
+
el.innerHTML=list.slice(0,10).map(function(s){
|
| 411 |
+
return '<div class="s-item"><span class="s-dot'+(s.active?'':' idle')+'"></span><div class="s-info"><div class="s-name">'+esc(s.name||s.id)+'</div><div class="s-meta">'+esc(s.platform||'')+' · '+s.messages+' 条 · '+esc(s.last||'')+'</div></div><div class="s-count">'+s.messages+'</div></div>';
|
| 412 |
+
}).join('');
|
| 413 |
+
}catch(x){}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 414 |
}
|
| 415 |
|
| 416 |
+
// ── Actions ──
|
| 417 |
async function doRestart(){
|
| 418 |
toast('正在重启网关…','info');
|
| 419 |
+
try{var r=await fetch(A+'/api/restart',{method:'POST'});var d=await r.json();toast(d.ok?'重启成功':'重启失败: '+(d.error||''),d.ok?'ok':'err')}catch(x){toast('请求失败','err')}
|
| 420 |
}
|
| 421 |
async function doClear(){
|
| 422 |
totalLogs=0;logBuf.length=0;
|
| 423 |
+
document.getElementById('log-scroll').innerHTML='<div class="log-empty"><div class="log-empty-ring"></div>已清除</div>';
|
| 424 |
document.getElementById('log-count').textContent='0 条日志';
|
| 425 |
toast('日志已清除','ok');
|
| 426 |
}
|
| 427 |
async function doReset(){
|
| 428 |
+
askConfirm('重置配置','所有设置将恢复为默认值，此操作不可撤销。',async function(){
|
| 429 |
+
toast('正在重置…','info');
|
| 430 |
+
try{var r=await fetch(A+'/api/reset',{method:'POST'});var d=await r.json();toast(d.ok?'重置完成':'失败: '+(d.error||''),d.ok?'ok':'err')}catch(x){toast('请求失败','err')}
|
| 431 |
+
});
|
| 432 |
}
|
| 433 |
async function doSwitch(){
|
| 434 |
+
var m=document.getElementById('msel').value;
|
| 435 |
toast('正在切换模型…','info');
|
| 436 |
try{
|
| 437 |
+
var r=await fetch(A+'/api/model',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({model:m})});
|
| 438 |
+
var d=await r.json();
|
| 439 |
+
toast(d.ok?'已切换至 '+m.split('/').pop():'切换失败: '+(d.error||''),d.ok?'ok':'err');
|
| 440 |
if(d.ok)setTimeout(poll,1000);
|
| 441 |
+
}catch(x){toast('请求失败','err')}
|
| 442 |
}
|
| 443 |
|
| 444 |
+
// ── Filters ──
|
| 445 |
function togF(k){
|
| 446 |
filters[k]=!filters[k];
|
| 447 |
+
var btn=document.getElementById('f'+k);
|
| 448 |
btn.classList.toggle('on',filters[k]);
|
| 449 |
+
var lines=document.querySelectorAll('#log-scroll .log-line');
|
| 450 |
+
for(var i=0;i<lines.length;i++){lines[i].style.display=filters[lines[i].dataset.f]?'':'none'}
|
| 451 |
}
|
| 452 |
function togAuto(){autoScroll=!autoScroll;document.getElementById('fAuto').classList.toggle('on',autoScroll)}
|
| 453 |
+
function goBot(){var s=document.getElementById('log-scroll');s.scrollTop=s.scrollHeight}
|
| 454 |
|
| 455 |
+
// ── Boot ──
|
| 456 |
poll();setInterval(poll,5000);setInterval(loadSess,30000);loadSess();connectSSE();
|
| 457 |
</script>
|
| 458 |
</body>
|