@jheavenknows/bluerouter 5.3.14 → 5.3.16

package/app/.next-cli-build/static/chunks/app/(dashboard)/dashboard/resource-monitor/{template-eecb5d00bb376ac8.js → template-ad7c5f7bdb0dfe45.js}

@@ -1,68 +1,69 @@
-(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[770],{6202:(e,r,t)=>{"use strict";t.r(r),t.d(r,{default:()=>v});var a=t(95155),i=t(12115);let o="button[data-resource-server-id]",n="resource-vllm-metric-guide",s="resource-monitor-live-metrics";function l(e){let r=Number(e)||0;return .001>Math.abs(r-Math.round(r))?String(Math.round(r)):r.toFixed(1)}function c(e){let r=Number(e);return Number.isFinite(r)?Math.max(0,Math.min(100,r)):0}function u(e){let r=Number(e);return Number.isFinite(r)?r:null}function d(e){return String(e??"").replaceAll("&","&amp;").replaceAll("<","&lt;").replaceAll(">","&gt;").replaceAll('"',"&quot;").replaceAll("'","&#039;")}function p(e,r,t,a="primary"){let i=c(r);return`
-    <div class="resource-live-bar resource-live-bar-${a}">
+(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[770],{6202:(e,r,t)=>{"use strict";t.r(r),t.d(r,{default:()=>x});var o=t(95155),a=t(12115);let n="button[data-resource-server-id]",i="resource-vllm-metric-guide",s="resource-monitor-live-metrics";function l(e){let r=Number(e)||0;return .001>Math.abs(r-Math.round(r))?String(Math.round(r)):r.toFixed(1)}function c(e){let r=Number(e);return Number.isFinite(r)?Math.max(0,Math.min(100,r)):0}function u(e){let r=Number(e);return Number.isFinite(r)?r:null}function d(e){let r=u(e);return null===r?"—":`${r.toFixed(1)} tok/s`}function p(e){return String(e??"").replaceAll("&","&amp;").replaceAll("<","&lt;").replaceAll(">","&gt;").replaceAll('"',"&quot;").replaceAll("'","&#039;")}function m(e,r,t,o="primary"){let a=c(r);return`
+    <div class="resource-live-bar resource-live-bar-${o}">
       <div class="resource-live-bar-head">
-        <span>${d(e)}</span>
-        <strong>${d(t)}</strong>
+        <span>${p(e)}</span>
+        <strong>${p(t)}</strong>
       </div>
       <div class="resource-live-bar-track" aria-hidden="true">
-        <span class="resource-live-bar-fill" style="width:${i.toFixed(1)}%"></span>
+        <span class="resource-live-bar-fill" style="width:${a.toFixed(1)}%"></span>
       </div>
     </div>
-  `}function m(e){let r=e.containerName?`${e.containerName}${e.containerId?` (${e.containerId})`:""}`:`:${e.port??"?"}`,t=e.endpoint||"",a=Array.isArray(e.models)?e.models.filter(Boolean):[];if(!1===e.metricsAvailable)return`
+  `}function g(e){let r=e.containerName?`${e.containerName}${e.containerId?` (${e.containerId})`:""}`:`:${e.port??"?"}`,t=e.endpoint||"",o=Array.isArray(e.models)?e.models.filter(Boolean):[];if(!1===e.metricsAvailable)return`
       <div class="resource-vllm-instance resource-vllm-instance-muted">
-        <div class="resource-vllm-instance-title">${d(r)}</div>
-        <div class="resource-vllm-instance-sub">${t?`${d(t)} \xb7 `:""}chưa đọc được /metrics</div>
+        <div class="resource-vllm-instance-title">${p(r)}</div>
+        <div class="resource-vllm-instance-sub">${t?`${p(t)} \xb7 `:""}chưa đọc được /metrics</div>
       </div>
-    `;let i=u(e.kvCacheUsagePercent),o=Object.prototype.hasOwnProperty.call(e||{},"waitingCapacity")||Object.prototype.hasOwnProperty.call(e||{},"waitingDeferred");return`
+    `;let a=u(e.kvCacheUsagePercent),n=d(e.outputTokensPerSecond);return`
     <div class="resource-vllm-instance">
       <div class="resource-vllm-instance-head">
-        <span class="resource-vllm-instance-title">${d(r)}</span>
-        ${a.length?`<span class="resource-vllm-model">${d(a.join(", "))}</span>`:""}
+        <span class="resource-vllm-instance-title">${p(r)}</span>
+        ${o.length?`<span class="resource-vllm-model">${p(o.join(", "))}</span>`:""}
       </div>
-      ${t?`<div class="resource-vllm-instance-sub">${d(t)}</div>`:""}
-      <div class="resource-vllm-instance-stats">
-        <span>R <b>${d(l(e.running))}</b></span>
-        <span>W <b>${d(l(e.waiting))}</b></span>
-        ${o?`<span>Cap <b>${d(l(e.waitingCapacity))}</b></span><span>Def <b>${d(l(e.waitingDeferred))}</b></span>`:""}
-        <span>KV <b>${null===i?"—":`${i.toFixed(1)}%`}</b></span>
-        <span>Pre <b>${d(l(e.preemptions))}</b></span>
+      ${t?`<div class="resource-vllm-instance-sub">${p(t)}</div>`:""}
+      <div class="resource-vllm-instance-stats" title="Output l\xe0 throughput token sinh ra trung b\xecnh trượt theo tối đa 3 ph\xfat gần nhất">
+        <span>R <b>${p(l(e.running))}</b></span>
+        <span>W <b>${p(l(e.waiting))}</b></span>
+        <span>KV <b>${null===a?"—":`${a.toFixed(1)}%`}</b></span>
+        <span>Pre <b>${p(l(e.preemptions))}</b></span>
+        <span class="resource-vllm-throughput">⚡ Out <b>${p(n)}</b></span>
       </div>
     </div>
-  `}function g(){document.getElementById(n)?.remove()}function v({children:e}){let r=(0,i.useRef)([]),t=(0,i.useRef)(new Map);return(0,i.useEffect)(()=>{let e=!1,a=null,i=null,v=()=>{let e=r.current;if(!e.length)return void g();let a=new Map(e.map(e=>[String(e.id),e])),i=Date.now();for(let e of document.querySelectorAll(o)){let r=String(e.dataset.resourceServerId||""),o=a.get(r),n=t.current.get(r),g=function(e,r=0){let t=e?.lastStatus;if(!t)return null;let a=t.vllm;if(!a)return{state:"upgrade",summary:"vLLM metrics \xb7 cần cập nhật agent",detail:"Agent hiện tại chưa c\xf3 vLLM monitor. Mở Sửa server v\xe0 c\xe0i lại agent một lần.",showReasons:!1,instances:[],count:0,metricsCount:0,discoveryLabel:"",pressureDetail:""};let i=Array.isArray(a.instances)?a.instances:[],o=a.summary||{},n=Number(o.instanceCount??i.length)||0,s=Number(o.metricsInstanceCount??n)||0,c=Number(o.running)||0,u=Number(o.waiting)||0,d=Number(o.waitingCapacity)||0,p=Number(o.waitingDeferred)||0,m=Object.prototype.hasOwnProperty.call(o||{},"waitingCapacity")||Object.prototype.hasOwnProperty.call(o||{},"waitingDeferred")||i.some(e=>Object.prototype.hasOwnProperty.call(e||{},"waitingCapacity")||Object.prototype.hasOwnProperty.call(e||{},"waitingDeferred")),g=Number(o.preemptions)||0,v=Number.isFinite(Number(o.kvCacheUsagePercent))?Number(o.kvCacheUsagePercent):null,b="docker"===a.discovery?"Docker-aware discovery":"Socket fallback discovery";if(!n)return{state:"none",summary:"vLLM \xb7 0 instance đang chạy",detail:"docker"===a.discovery?"Agent đ\xe3 kiểm tra Docker nhưng chưa ph\xe1t hiện container vLLM đang chạy.":"Agent chưa ph\xe1t hiện endpoint /metrics của vLLM tr\xean host.",showReasons:!1,instances:i,count:n,metricsCount:s,running:c,waiting:u,waitingCapacity:d,waitingDeferred:p,preemptions:g,kv:v,discoveryLabel:b,pressureDetail:"Kh\xf4ng c\xf3 queue pressure"};let x=i.map(e=>{let r=e.containerName?`${e.containerName}${e.containerId?` (${e.containerId})`:""}`:`:${e.port}`;if(!1===e.metricsAvailable)return`${r} \xb7 đang chạy nhưng chưa đọc được /metrics`;let t=Number.isFinite(Number(e.kvCacheUsagePercent))?`${Number(e.kvCacheUsagePercent).toFixed(1)}%`:"—",a=Array.isArray(e.models)&&e.models.length?` \xb7 ${e.models.join(", ")}`:"",i=e.endpoint?` \xb7 ${e.endpoint}`:"",o=Object.prototype.hasOwnProperty.call(e,"waitingCapacity")||Object.prototype.hasOwnProperty.call(e,"waitingDeferred")?` \xb7 Capacity ${l(e.waitingCapacity)} \xb7 Deferred ${l(e.waitingDeferred)}`:"";return`${r}${i} \xb7 Running ${l(e.running)} \xb7 Waiting ${l(e.waiting)}${o} \xb7 KV ${t} \xb7 Preempt ${l(e.preemptions)}${a}`}),h=s<n,f=d>0&&r>=8e3,w=d>0&&!f,y=h?"partial":f?"pressure":w?"transient":null!==v&&v>=90?"hot":"active",$=h?`${n} vLLM (${s} metrics)`:`${n} vLLM`,k=m&&u>0,M=k?`
-Capacity ${l(d)} \xb7 Deferred ${l(p)}`:"",C=f?`Capacity pressure li\xean tục ${Math.max(1,Math.round(r/1e3))}s`:w?"Capacity waiting mới xuất hiện; chưa coi l\xe0 overload":u>0?"Waiting hiện tại chưa tạo capacity pressure":"Kh\xf4ng c\xf3 queue pressure";return{state:y,summary:`${$} \xb7 Running ${l(c)} \xb7 Waiting ${l(u)}${M}
-KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7 ${n} instance`,C,...x].join("\n"),showReasons:k,instances:i,count:n,metricsCount:s,running:c,waiting:u,waitingCapacity:d,waitingDeferred:p,preemptions:g,kv:v,discoveryLabel:b,pressureDetail:C}}(o,n?Math.max(0,i-n):0);if(!o){e.querySelector(`.${s}`)?.remove(),delete e.dataset.vllmState,delete e.dataset.vllmReasons,delete e.dataset.resourceLiveSignature;continue}g?(e.dataset.vllmState=g.state,e.dataset.vllmReasons=g.showReasons?"1":"0"):(delete e.dataset.vllmState,delete e.dataset.vllmReasons),e.dataset.vllmBaseTitle||(e.dataset.vllmBaseTitle=e.title||"Linux host"),e.title=e.dataset.vllmBaseTitle,function(e,r,t){let a,i;if(!r?.lastStatus){e.querySelector(`.${s}`)?.remove(),delete e.dataset.resourceLiveSignature;return}let o=`${function(e){if(!e)return"";if("upgrade"===e.state||"none"===e.state)return`
-      <section class="resource-live-section resource-vllm-block" data-state="${d(e.state)}">
+  `}function v(){document.getElementById(i)?.remove()}function x({children:e}){let r=(0,a.useRef)([]),t=(0,a.useRef)(new Map);return(0,a.useEffect)(()=>{let e=!1,o=null,a=null,x=()=>{let e=r.current;if(!e.length)return void v();let o=new Map(e.map(e=>[String(e.id),e])),a=Date.now();for(let e of document.querySelectorAll(n)){let r=String(e.dataset.resourceServerId||""),n=o.get(r),i=t.current.get(r),v=function(e,r=0){let t=e?.lastStatus;if(!t)return null;let o=t.vllm;if(!o)return{state:"upgrade",summary:"vLLM metrics \xb7 cần cập nhật agent",detail:"Agent hiện tại chưa c\xf3 vLLM monitor. Mở Sửa server v\xe0 c\xe0i lại agent một lần.",showReasons:!1,instances:[],count:0,metricsCount:0,discoveryLabel:"",pressureDetail:"",outputTokensPerSecond:null};let a=Array.isArray(o.instances)?o.instances:[],n=o.summary||{},i=Number(n.instanceCount??a.length)||0,s=Number(n.metricsInstanceCount??i)||0,c=Number(n.running)||0,p=Number(n.waiting)||0,m=Number(n.waitingCapacity)||0,g=Number(n.waitingDeferred)||0,v=Object.prototype.hasOwnProperty.call(n||{},"waitingCapacity")||Object.prototype.hasOwnProperty.call(n||{},"waitingDeferred")||a.some(e=>Object.prototype.hasOwnProperty.call(e||{},"waitingCapacity")||Object.prototype.hasOwnProperty.call(e||{},"waitingDeferred")),x=Number(n.preemptions)||0,b=u(n.outputTokensPerSecond),h=Number.isFinite(Number(n.kvCacheUsagePercent))?Number(n.kvCacheUsagePercent):null,f="docker"===o.discovery?"Docker-aware discovery":"Socket fallback discovery";if(!i)return{state:"none",summary:"vLLM \xb7 0 instance đang chạy",detail:"docker"===o.discovery?"Agent đ\xe3 kiểm tra Docker nhưng chưa ph\xe1t hiện container vLLM đang chạy.":"Agent chưa ph\xe1t hiện endpoint /metrics của vLLM tr\xean host.",showReasons:!1,instances:a,count:i,metricsCount:s,running:c,waiting:p,waitingCapacity:m,waitingDeferred:g,preemptions:x,kv:h,outputTokensPerSecond:b,discoveryLabel:f,pressureDetail:"Kh\xf4ng c\xf3 queue pressure"};let w=a.map(e=>{let r=e.containerName?`${e.containerName}${e.containerId?` (${e.containerId})`:""}`:`:${e.port}`;if(!1===e.metricsAvailable)return`${r} \xb7 đang chạy nhưng chưa đọc được /metrics`;let t=Number.isFinite(Number(e.kvCacheUsagePercent))?`${Number(e.kvCacheUsagePercent).toFixed(1)}%`:"—",o=Array.isArray(e.models)&&e.models.length?` \xb7 ${e.models.join(", ")}`:"",a=e.endpoint?` \xb7 ${e.endpoint}`:"",n=Object.prototype.hasOwnProperty.call(e,"waitingCapacity")||Object.prototype.hasOwnProperty.call(e,"waitingDeferred")?` \xb7 Capacity ${l(e.waitingCapacity)} \xb7 Deferred ${l(e.waitingDeferred)}`:"";return`${r}${a} \xb7 Running ${l(e.running)} \xb7 Waiting ${l(e.waiting)}${n} \xb7 KV ${t} \xb7 Preempt ${l(e.preemptions)} \xb7 Output ${d(e.outputTokensPerSecond)}${o}`}),y=s<i,$=m>0&&r>=8e3,k=m>0&&!$,M=y?"partial":$?"pressure":k?"transient":null!==h&&h>=90?"hot":"active",S=y?`${i} vLLM (${s} metrics)`:`${i} vLLM`,L=v&&p>0,C=L?`
+Capacity ${l(m)} \xb7 Deferred ${l(g)}`:"",P=$?`Capacity pressure li\xean tục ${Math.max(1,Math.round(r/1e3))}s`:k?"Capacity waiting mới xuất hiện; chưa coi l\xe0 overload":p>0?"Waiting hiện tại chưa tạo capacity pressure":"Kh\xf4ng c\xf3 queue pressure";return{state:M,summary:`${S} \xb7 Running ${l(c)} \xb7 Waiting ${l(p)}${C}
+KV ${null===h?"—":`${h.toFixed(1)}%`} \xb7 Preempt ${l(x)} \xb7 Output ${d(b)}`,detail:[`${f} \xb7 ${i} instance`,P,...w].join("\n"),showReasons:L,instances:a,count:i,metricsCount:s,running:c,waiting:p,waitingCapacity:m,waitingDeferred:g,preemptions:x,kv:h,outputTokensPerSecond:b,discoveryLabel:f,pressureDetail:P}}(n,i?Math.max(0,a-i):0);if(!n){e.querySelector(`.${s}`)?.remove(),delete e.dataset.vllmState,delete e.dataset.vllmReasons,delete e.dataset.resourceLiveSignature;continue}v?(e.dataset.vllmState=v.state,e.dataset.vllmReasons=v.showReasons?"1":"0"):(delete e.dataset.vllmState,delete e.dataset.vllmReasons),e.dataset.vllmBaseTitle||(e.dataset.vllmBaseTitle=e.title||"Linux host"),e.title=e.dataset.vllmBaseTitle,function(e,r,t){let o,a;if(!r?.lastStatus){e.querySelector(`.${s}`)?.remove(),delete e.dataset.resourceLiveSignature;return}let n=`${function(e){if(!e)return"";if("upgrade"===e.state||"none"===e.state)return`
+      <section class="resource-live-section resource-vllm-block" data-state="${p(e.state)}">
         <div class="resource-live-section-head">
           <span class="resource-live-section-title"><span class="resource-live-state-dot"></span>vLLM</span>
-          <span class="resource-live-muted">${d(e.summary)}</span>
+          <span class="resource-live-muted">${p(e.summary)}</span>
         </div>
-        <div class="resource-live-caption">${d(e.detail)}</div>
+        <div class="resource-live-caption">${p(e.detail)}</div>
       </section>
-    `;let r=e.showReasons?`<span>Capacity <b>${d(l(e.waitingCapacity))}</b></span><span>Deferred <b>${d(l(e.waitingDeferred))}</b></span>`:"";return`
-    <section class="resource-live-section resource-vllm-block" data-state="${d(e.state)}">
+    `;let r=e.showReasons?`<span>Capacity <b>${p(l(e.waitingCapacity))}</b></span><span>Deferred <b>${p(l(e.waitingDeferred))}</b></span>`:"";return`
+    <section class="resource-live-section resource-vllm-block" data-state="${p(e.state)}">
       <div class="resource-live-section-head">
         <span class="resource-live-section-title"><span class="resource-live-state-dot"></span>vLLM</span>
         <span class="resource-live-badge">${e.metricsCount<e.count?`${e.metricsCount}/${e.count} metrics`:`${e.count} instance`}</span>
       </div>
       <div class="resource-vllm-summary-grid">
-        <span>Running <b>${d(l(e.running))}</b></span>
-        <span>Waiting <b>${d(l(e.waiting))}</b></span>
+        <span>Running <b>${p(l(e.running))}</b></span>
+        <span>Waiting <b>${p(l(e.waiting))}</b></span>
         ${r}
-        <span>Preempt <b>${d(l(e.preemptions))}</b></span>
+        <span>Preempt <b>${p(l(e.preemptions))}</b></span>
+        <span class="resource-vllm-throughput">⚡ Out <b>${p(d(e.outputTokensPerSecond))}</b></span>
       </div>
-      ${null===e.kv?"":p("KV cache",e.kv,`${e.kv.toFixed(1)}%`,e.kv>=90?"warning":"emerald")}
-      <div class="resource-live-caption">${d(e.discoveryLabel)} \xb7 ${d(e.pressureDetail)}</div>
-      ${e.instances.length?`<div class="resource-vllm-instances">${e.instances.map(m).join("")}</div>`:""}
+      ${null===e.kv?"":m("KV cache",e.kv,`${e.kv.toFixed(1)}%`,e.kv>=90?"warning":"emerald")}
+      <div class="resource-live-caption">${p(e.discoveryLabel)} \xb7 ${p(e.pressureDetail)}</div>
+      ${e.instances.length?`<div class="resource-vllm-instances">${e.instances.map(g).join("")}</div>`:""}
     </section>
-  `}(t)}${function(e){let r=Array.isArray(e?.lastStatus?.gpus)?e.lastStatus.gpus:[];if(!r.length)return"";let t=r.map(e=>{let r=c(e.usagePercent),t=c(e.memoryUsagePercent),a=u(e.powerDrawW),i=u(e.powerLimitW),o=null!==a&&i&&i>0?c(a/i*100):0,n=u(e.temperatureC),s=null===a?"—":i&&i>0?`${a.toFixed(+(a<10))} / ${i.toFixed(0)} W`:`${a.toFixed(+(a<10))} W`;return`
+  `}(t)}${function(e){let r=Array.isArray(e?.lastStatus?.gpus)?e.lastStatus.gpus:[];if(!r.length)return"";let t=r.map(e=>{let r=c(e.usagePercent),t=c(e.memoryUsagePercent),o=u(e.powerDrawW),a=u(e.powerLimitW),n=null!==o&&a&&a>0?c(o/a*100):0,i=u(e.temperatureC),s=null===o?"—":a&&a>0?`${o.toFixed(+(o<10))} / ${a.toFixed(0)} W`:`${o.toFixed(+(o<10))} W`;return`
       <div class="resource-gpu-row">
         <div class="resource-gpu-head">
-          <span class="resource-gpu-name">GPU ${d(e.index??"?")}</span>
-          <span class="resource-gpu-temp"><span class="material-symbols-outlined" aria-hidden="true">device_thermostat</span>${null===n?"—":`${n.toFixed(0)}\xb0C`}</span>
+          <span class="resource-gpu-name">GPU ${p(e.index??"?")}</span>
+          <span class="resource-gpu-temp"><span class="material-symbols-outlined" aria-hidden="true">device_thermostat</span>${null===i?"—":`${i.toFixed(0)}\xb0C`}</span>
         </div>
-        ${p("GPU load",r,`${r.toFixed(+(r<10))}%`,r>=90?"warning":"emerald")}
-        ${p("VRAM",t,`${t.toFixed(1)}%`,t>=95?"warning":"cyan")}
-        ${i&&i>0?p("Power",o,s,o>=95?"warning":"violet"):`<div class="resource-live-value-row"><span>Power</span><strong>${d(s)}</strong></div>`}
+        ${m("GPU load",r,`${r.toFixed(+(r<10))}%`,r>=90?"warning":"emerald")}
+        ${m("VRAM",t,`${t.toFixed(1)}%`,t>=95?"warning":"cyan")}
+        ${a&&a>0?m("Power",n,s,n>=95?"warning":"violet"):`<div class="resource-live-value-row"><span>Power</span><strong>${p(s)}</strong></div>`}
       </div>
     `}).join("");return`
     <section class="resource-live-section resource-gpu-block">
@@ -72,7 +73,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
       </div>
       <div class="resource-gpu-list">${t}</div>
     </section>
-  `}(r)}`;if(!o){e.querySelector(`.${s}`)?.remove(),delete e.dataset.resourceLiveSignature;return}let n=(a=((r?.lastStatus||{}).gpus||[]).map(e=>[e.index,e.usagePercent,e.memoryUsagePercent,e.temperatureC,e.powerDrawW,e.powerLimitW]),i=(t?.instances||[]).map(e=>[e.containerName,e.containerId,e.endpoint,e.running,e.waiting,e.waitingCapacity,e.waitingDeferred,e.kvCacheUsagePercent,e.preemptions,e.metricsAvailable,e.models]),JSON.stringify([r?.lastStatusAt,t?.state,t?.running,t?.waiting,t?.waitingCapacity,t?.waitingDeferred,t?.preemptions,t?.kv,t?.pressureDetail,i,a]));if(e.dataset.resourceLiveSignature===n)return;let g=e.querySelector(`.${s}`);g||((g=document.createElement("div")).className=s,g.setAttribute("aria-label","Realtime vLLM v\xe0 GPU metrics"),e.appendChild(g)),g.innerHTML=o,e.dataset.resourceLiveSignature=n}(e,o,g)}!function(){let e=document.querySelector(o),r=e?.closest(".scroll-thin-x");if(!r)return g();let t=document.getElementById(n);if(t){t.previousElementSibling!==r&&r.insertAdjacentElement("afterend",t);return}let a=document.createElement("section");a.id=n,a.className="resource-vllm-metric-guide",a.setAttribute("aria-label","Giải th\xedch chỉ số vLLM"),a.innerHTML=`
+  `}(r)}`;if(!n){e.querySelector(`.${s}`)?.remove(),delete e.dataset.resourceLiveSignature;return}let i=(o=((r?.lastStatus||{}).gpus||[]).map(e=>[e.index,e.usagePercent,e.memoryUsagePercent,e.temperatureC,e.powerDrawW,e.powerLimitW]),a=(t?.instances||[]).map(e=>[e.containerName,e.containerId,e.endpoint,e.running,e.waiting,e.waitingCapacity,e.waitingDeferred,e.kvCacheUsagePercent,e.preemptions,e.outputTokensPerSecond,e.metricsAvailable,e.models]),JSON.stringify([r?.lastStatusAt,t?.state,t?.running,t?.waiting,t?.waitingCapacity,t?.waitingDeferred,t?.preemptions,t?.kv,t?.outputTokensPerSecond,t?.pressureDetail,a,o]));if(e.dataset.resourceLiveSignature===i)return;let v=e.querySelector(`.${s}`);v||((v=document.createElement("div")).className=s,v.setAttribute("aria-label","Realtime vLLM v\xe0 GPU metrics"),e.appendChild(v)),v.innerHTML=n,e.dataset.resourceLiveSignature=i}(e,n,v)}!function(){let e=document.querySelector(n),r=e?.closest(".scroll-thin-x");if(!r)return v();let t=document.getElementById(i);if(t){t.previousElementSibling!==r&&r.insertAdjacentElement("afterend",t);return}let o=document.createElement("section");o.id=i,o.className="resource-vllm-metric-guide",o.setAttribute("aria-label","Giải th\xedch chỉ số vLLM"),o.innerHTML=`
     <div class="resource-vllm-guide-heading">
       <span class="material-symbols-outlined resource-vllm-guide-icon" aria-hidden="true">info</span>
       <div>
@@ -105,14 +106,18 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
         <strong>Preempt</strong>
         <span>Counter t\xedch lũy số lần request phải nhường t\xe0i nguy\xean; tốc độ tăng quan trọng hơn tổng số.</span>
       </div>
+      <div class="resource-vllm-guide-item">
+        <strong>⚡ Output</strong>
+        <span>Tổng output token/gi\xe2y theo rolling average tối đa 3 ph\xfat của từng instance; khi agent mới khởi động sẽ d\xf9ng khoảng dữ liệu đ\xe3 c\xf3.</span>
+      </div>
     </div>
     <div class="resource-vllm-guide-note">
       <span class="material-symbols-outlined" aria-hidden="true">monitoring</span>
-      <span><strong>Đọc cảnh b\xe1o:</strong> Waiting tho\xe1ng qua vẫn b\xecnh thường. Dashboard chỉ coi <strong>Capacity &gt; 0 li\xean tục từ 8 gi\xe2y</strong> l\xe0 pressure; KV cao hoặc Preempt tăng li\xean tục cũng cần theo d\xf5i.</span>
+      <span><strong>Đọc cảnh b\xe1o:</strong> Waiting tho\xe1ng qua vẫn b\xecnh thường. Dashboard chỉ coi <strong>Capacity &gt; 0 li\xean tục từ 8 gi\xe2y</strong> l\xe0 pressure; KV cao hoặc Preempt tăng li\xean tục cũng cần theo d\xf5i. Output tok/s 3 ph\xfat d\xf9ng để đ\xe1nh gi\xe1 throughput ổn định khi tăng slot/concurrency.</span>
     </div>
-  `,r.insertAdjacentElement("afterend",a)}()},b=async()=>{try{let a=await fetch("/api/resource-monitor?snapshot=1",{cache:"no-store"}),i=await a.json().catch(()=>({}));if(!a.ok||e)return;let o=Array.isArray(i.servers)?i.servers:[];r.current=o;let n=Date.now(),s=new Set;for(let e of o){let r=String(e?.id||"");r&&(s.add(r),(Number(e?.lastStatus?.vllm?.summary?.waitingCapacity)||0)>0?t.current.has(r)||t.current.set(r,n):t.current.delete(r))}for(let e of t.current.keys())s.has(e)||t.current.delete(e);v()}catch{}},x=new MutationObserver(()=>{i&&window.clearTimeout(i),i=window.setTimeout(v,80)});x.observe(document.body,{childList:!0,subtree:!0}),a=window.setInterval(b,4e3);let h=window.setTimeout(b,500);return()=>{e=!0,x.disconnect(),window.clearInterval(a),window.clearTimeout(h),i&&window.clearTimeout(i),g(),document.querySelectorAll(`.${s}`).forEach(e=>e.remove())}},[]),(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)("style",{children:`
+  `,r.insertAdjacentElement("afterend",o)}()},b=async()=>{try{let o=await fetch("/api/resource-monitor?snapshot=1",{cache:"no-store"}),a=await o.json().catch(()=>({}));if(!o.ok||e)return;let n=Array.isArray(a.servers)?a.servers:[];r.current=n;let i=Date.now(),s=new Set;for(let e of n){let r=String(e?.id||"");r&&(s.add(r),(Number(e?.lastStatus?.vllm?.summary?.waitingCapacity)||0)>0?t.current.has(r)||t.current.set(r,i):t.current.delete(r))}for(let e of t.current.keys())s.has(e)||t.current.delete(e);x()}catch{}},h=new MutationObserver(()=>{a&&window.clearTimeout(a),a=window.setTimeout(x,80)});h.observe(document.body,{childList:!0,subtree:!0}),o=window.setInterval(b,4e3);let f=window.setTimeout(b,500);return()=>{e=!0,h.disconnect(),window.clearInterval(o),window.clearTimeout(f),a&&window.clearTimeout(a),v(),document.querySelectorAll(`.${s}`).forEach(e=>e.remove())}},[]),(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)("style",{children:`
         .resource-monitor-sortable-host {
-          min-width: 332px !important;
+          min-width: 360px !important;
           overflow: hidden;
         }
         .resource-monitor-live-metrics {
@@ -130,7 +135,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           border: 1px solid var(--color-border-subtle);
           border-radius: 12px;
           background: color-mix(in srgb, var(--color-surface-2) 62%, var(--color-surface));
-          padding: 9px 10px;
+          padding: 10px 11px;
         }
         .resource-live-section-head {
           display: flex;
@@ -138,7 +143,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           align-items: center;
           justify-content: space-between;
           gap: 8px;
-          margin-bottom: 7px;
+          margin-bottom: 8px;
         }
         .resource-live-section-title {
           display: inline-flex;
@@ -146,13 +151,13 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           align-items: center;
           gap: 6px;
           color: var(--color-text-main);
-          font-size: 11px;
+          font-size: 12px;
           font-weight: 750;
           letter-spacing: .01em;
         }
         .resource-live-section-icon {
           color: #10b981;
-          font-size: 15px;
+          font-size: 16px;
         }
         .resource-live-state-dot {
           width: 7px;
@@ -183,26 +188,26 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           background: var(--color-surface);
           padding: 2px 7px;
           color: var(--color-text-muted);
-          font-size: 9.5px;
+          font-size: 10.5px;
           font-weight: 700;
         }
         .resource-live-muted {
           min-width: 0;
           overflow: hidden;
           color: var(--color-text-subtle);
-          font-size: 9.5px;
+          font-size: 10.5px;
           text-overflow: ellipsis;
           white-space: nowrap;
         }
         .resource-vllm-summary-grid {
           display: flex;
           flex-wrap: wrap;
-          gap: 4px 7px;
-          margin-bottom: 7px;
+          gap: 5px 8px;
+          margin-bottom: 8px;
           color: var(--color-text-muted);
           font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
-          font-size: 9.5px;
-          line-height: 1.35;
+          font-size: 10.5px;
+          line-height: 1.4;
         }
         .resource-vllm-summary-grid span {
           white-space: nowrap;
@@ -211,21 +216,32 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           color: var(--color-text-main);
           font-weight: 750;
         }
+        .resource-vllm-throughput {
+          color: #7c3aed;
+          font-weight: 700;
+        }
+        .resource-vllm-throughput b {
+          color: #6d28d9 !important;
+        }
+        .dark .resource-vllm-throughput,
+        .dark .resource-vllm-throughput b {
+          color: #c4b5fd !important;
+        }
         .resource-live-caption {
-          margin-top: 6px;
+          margin-top: 7px;
           color: var(--color-text-subtle);
-          font-size: 9px;
-          line-height: 1.35;
+          font-size: 10px;
+          line-height: 1.4;
         }
         .resource-vllm-instances {
           display: grid;
-          gap: 5px;
-          margin-top: 7px;
+          gap: 6px;
+          margin-top: 8px;
         }
         .resource-vllm-instance {
           min-width: 0;
           border-top: 1px dashed var(--color-border-subtle);
-          padding-top: 6px;
+          padding-top: 7px;
         }
         .resource-vllm-instance:first-child {
           border-top: 0;
@@ -243,7 +259,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           overflow: hidden;
           color: var(--color-text-main);
           font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
-          font-size: 9.5px;
+          font-size: 10.5px;
           font-weight: 700;
           text-overflow: ellipsis;
           white-space: nowrap;
@@ -255,28 +271,36 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           background: color-mix(in srgb, var(--color-brand-500) 8%, transparent);
           padding: 2px 6px;
           color: var(--color-primary);
-          font-size: 8.5px;
+          font-size: 9.5px;
           font-weight: 650;
           text-overflow: ellipsis;
           white-space: nowrap;
         }
         .resource-vllm-instance-sub {
-          margin-top: 2px;
+          margin-top: 3px;
           overflow: hidden;
           color: var(--color-text-subtle);
           font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
-          font-size: 8.5px;
+          font-size: 9.5px;
           text-overflow: ellipsis;
           white-space: nowrap;
         }
         .resource-vllm-instance-stats {
           display: flex;
-          flex-wrap: wrap;
-          gap: 3px 7px;
-          margin-top: 4px;
+          min-width: 0;
+          flex-wrap: nowrap;
+          align-items: center;
+          justify-content: space-between;
+          gap: 5px;
+          margin-top: 5px;
+          overflow: hidden;
           color: var(--color-text-muted);
           font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
-          font-size: 8.8px;
+          font-size: 9.5px;
+          white-space: nowrap;
+        }
+        .resource-vllm-instance-stats span {
+          flex: 0 0 auto;
         }
         .resource-vllm-instance-stats b {
           color: var(--color-text-main);
@@ -286,7 +310,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           color: var(--color-text-subtle);
         }
         .resource-live-bar + .resource-live-bar {
-          margin-top: 6px;
+          margin-top: 7px;
         }
         .resource-live-bar-head,
         .resource-live-value-row {
@@ -294,10 +318,10 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           align-items: center;
           justify-content: space-between;
           gap: 8px;
-          margin-bottom: 3px;
+          margin-bottom: 4px;
           color: var(--color-text-muted);
-          font-size: 9px;
-          line-height: 1.2;
+          font-size: 10px;
+          line-height: 1.25;
         }
         .resource-live-bar-head strong,
         .resource-live-value-row strong {
@@ -326,25 +350,25 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
         .resource-live-bar-warning { --resource-bar-color: #f59e0b; }
         .resource-gpu-list {
           display: grid;
-          gap: 8px;
+          gap: 9px;
         }
         .resource-gpu-row {
           min-width: 0;
         }
         .resource-gpu-row + .resource-gpu-row {
           border-top: 1px dashed var(--color-border-subtle);
-          padding-top: 8px;
+          padding-top: 9px;
         }
         .resource-gpu-head {
           display: flex;
           align-items: center;
           justify-content: space-between;
           gap: 8px;
-          margin-bottom: 6px;
+          margin-bottom: 7px;
         }
         .resource-gpu-name {
           color: var(--color-text-main);
-          font-size: 9.5px;
+          font-size: 10.5px;
           font-weight: 750;
         }
         .resource-gpu-temp {
@@ -355,11 +379,11 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
           background: color-mix(in srgb, #f59e0b 8%, transparent);
           padding: 2px 6px;
           color: #b45309;
-          font-size: 9px;
+          font-size: 10px;
           font-weight: 700;
         }
         .resource-gpu-temp .material-symbols-outlined {
-          font-size: 12px;
+          font-size: 13px;
         }
         .resource-vllm-metric-guide {
           margin-top: 10px;
@@ -400,7 +424,7 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
         }
         .resource-vllm-guide-grid {
           display: grid;
-          grid-template-columns: repeat(6, minmax(0, 1fr));
+          grid-template-columns: repeat(7, minmax(0, 1fr));
           gap: 8px;
           margin-top: 12px;
         }
@@ -454,12 +478,12 @@ KV ${null===v?"—":`${v.toFixed(1)}%`} \xb7 Preempt ${l(g)}`,detail:[`${b} \xb7
         }
         @media (max-width: 1400px) {
           .resource-vllm-guide-grid {
-            grid-template-columns: repeat(3, minmax(0, 1fr));
+            grid-template-columns: repeat(4, minmax(0, 1fr));
           }
         }
         @media (max-width: 760px) {
           .resource-monitor-sortable-host {
-            min-width: min(332px, calc(100vw - 48px)) !important;
+            min-width: min(340px, calc(100vw - 48px)) !important;
           }
           .resource-vllm-guide-grid {
             grid-template-columns: repeat(2, minmax(0, 1fr));

package/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bluerouter-app",
-  "version": "5.3.14",
+  "version": "5.3.16",
   "description": "Router web dashboard",
   "private": false,
   "scripts": {

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@jheavenknows/bluerouter",
- "version": "5.3.14",
+ "version": "5.3.16",
  "description": "Bluerouter CLI - Start and manage Bluerouter server",
  "bin": {
   "bluerouter": "./cli.js"