From 6232d8e4f280af3c7e05fc9955a269490b11a383 Mon Sep 17 00:00:00 2001
From: dushixiang <dushixiang@typesafe.cn>
Date: Mon, 15 Dec 2025 19:09:13 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20ICON=20=E5=92=8C=20?=
 =?UTF-8?q?=E7=B3=BB=E7=BB=9F=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/api/monitor.ts              |  5 -----
 web/src/components/PublicHeader.tsx | 25 +++++++++++++++++++------
 web/src/pages/Public/ServerList.tsx | 25 ++++++++++---------------
 3 files changed, 29 insertions(+), 26 deletions(-)

diff --git a/web/src/api/monitor.ts b/web/src/api/monitor.ts
index 403239a..09624dd 100644
--- a/web/src/api/monitor.ts
+++ b/web/src/api/monitor.ts
@@ -44,11 +44,6 @@ export const getMonitorAgentStats = (id: string) => {
     return get<AgentMonitorStat[]>(`/monitors/${encodeURIComponent(id)}/agents`);
 };
 
-// 公开接口 - 获取监控详情（整合版，包含stats和agents）
-export const getMonitorDetail = (id: string) => {
-    return get<MonitorDetail>(`/monitors/${encodeURIComponent(id)}`);
-};
-
 // VictoriaMetrics 时序数据点
 export interface MetricDataPoint {
     timestamp: number;  // 毫秒时间戳
diff --git a/web/src/components/PublicHeader.tsx b/web/src/components/PublicHeader.tsx
index d62c734..3912e17 100644
--- a/web/src/components/PublicHeader.tsx
+++ b/web/src/components/PublicHeader.tsx
@@ -1,5 +1,5 @@
 import {useEffect, useState} from 'react';
-import {Activity, LogIn, ServerIcon, Settings, Menu, X} from 'lucide-react';
+import {Activity, LogIn, Menu, ServerIcon, Settings, X} from 'lucide-react';
 import {getCurrentUser} from '../api/auth';
 import {Link, useLocation} from "react-router-dom";
 
@@ -47,6 +47,18 @@ const PublicHeader = () => {
         activeTab = 'monitors';
     }
 
+    // let systemName = window.SystemConfig?.SystemNameZh;
+    let systemName = "Best Zhen";
+
+    let leftName = '';
+    let rightName = '';
+    
+    if (systemName) {
+        const mid = Math.floor(systemName.length / 2);
+        leftName = systemName.substring(0, mid);
+        rightName = systemName.substring(mid);
+    }
+
     return (
         <>
             <header className="border-b border-cyan-900/50 bg-[#05050a]/80 backdrop-blur-xl sticky top-0  z-40">
@@ -66,7 +78,7 @@ const PublicHeader = () => {
                                 </div>
                                 <div>
                                     <h1 className="text-2xl font-black tracking-widest text-transparent bg-clip-text bg-gradient-to-r from-cyan-400 via-blue-400 to-purple-400 uppercase italic">
-                                        {window.SystemConfig?.SystemNameEn}
+                                        {leftName}<span className="text-white">{rightName}</span>
                                     </h1>
                                     <p className="text-[10px] text-cyan-500/60 font-mono tracking-[0.3em] uppercase">
                                         {window.SystemConfig?.SystemNameZh}
@@ -150,7 +162,8 @@ const PublicHeader = () => {
 
             {/* Mobile Menu */}
             {mobileMenuOpen && (
-                <div className="md:hidden fixed inset-0 top-20 bg-[#05050a]/95 backdrop-blur-xl z-30 animate-in slide-in-from-top">
+                <div
+                    className="md:hidden fixed inset-0 top-20 bg-[#05050a]/95 backdrop-blur-xl z-30 animate-in slide-in-from-top">
                     <div className="flex flex-col p-4 gap-4">
                         {/* Mobile Navigation */}
                         {[
@@ -164,9 +177,9 @@ const PublicHeader = () => {
                                 className={`
                                     flex items-center gap-3 p-4 rounded-lg border transition-all
                                     ${activeTab === tab.id
-                                        ? 'bg-cyan-500/20 border-cyan-500/50 text-cyan-400'
-                                        : 'bg-cyan-500/5 border-cyan-500/20 text-slate-400 hover:bg-cyan-500/10 hover:border-cyan-500/30'
-                                    }
+                                    ? 'bg-cyan-500/20 border-cyan-500/50 text-cyan-400'
+                                    : 'bg-cyan-500/5 border-cyan-500/20 text-slate-400 hover:bg-cyan-500/10 hover:border-cyan-500/30'
+                                }
                                 `}
                             >
                                 <tab.icon className="w-5 h-5"/>
diff --git a/web/src/pages/Public/ServerList.tsx b/web/src/pages/Public/ServerList.tsx
index 21ad8e2..6122795 100644
--- a/web/src/pages/Public/ServerList.tsx
+++ b/web/src/pages/Public/ServerList.tsx
@@ -6,14 +6,14 @@ import {
     ArrowDown,
     ArrowUp,
     Calendar,
-    CheckCircle2,
     Cpu,
     Filter,
     HardDrive,
+    LinkIcon,
     Loader2,
     MemoryStick,
     Server,
-    XCircle
+    UnlinkIcon
 } from 'lucide-react';
 import {getPublicTags, listAgents} from '@/api/agent.ts';
 import type {Agent, LatestMetrics} from '@/types';
@@ -95,11 +95,6 @@ const ServerList = () => {
         refetchInterval: 30000,
     });
 
-    // 根据选中的标签过滤服务器
-    const filteredAgents = selectedTag
-        ? agents.filter(agent => agent.tags?.includes(selectedTag))
-        : agents;
-
     // 计算统计数据
     const stats = useMemo(() => {
         const total = agents.length;
@@ -173,13 +168,13 @@ const ServerList = () => {
                 <StatCard
                     title="在线设备"
                     value={stats.online}
-                    icon={CheckCircle2}
+                    icon={LinkIcon}
                     color="emerald"
                 />
                 <StatCard
                     title="离线设备"
                     value={stats.offline}
-                    icon={XCircle}
+                    icon={UnlinkIcon}
                     color="rose"
                 />
                 <NetworkStatCard
@@ -193,7 +188,8 @@ const ServerList = () => {
             {/* 标签过滤器 */}
             {allTags.length > 1 && (
                 <div className="flex flex-wrap gap-1.5 sm:gap-2 items-center">
-                    <div className="text-[10px] sm:text-xs font-mono text-cyan-600 flex items-center gap-1.5 sm:gap-2 mr-1 sm:mr-2">
+                    <div
+                        className="text-[10px] sm:text-xs font-mono text-cyan-600 flex items-center gap-1.5 sm:gap-2 mr-1 sm:mr-2">
                         <Filter className="w-3 h-3"/>
                         <span className="hidden sm:inline">FILTERS:</span>
                     </div>
@@ -234,14 +230,15 @@ const ServerList = () => {
             ) : (
                 <>
                     {/* 桌面端表格布局 */}
-                    <div className="hidden md:block bg-[#0a0b10]/90 border border-cyan-900/50 rounded-md overflow-hidden shadow-2xl backdrop-blur-sm">
+                    <div
+                        className="hidden md:block bg-[#0a0b10]/90 border border-cyan-900/50 rounded-md overflow-hidden shadow-2xl backdrop-blur-sm">
                         <table className="w-full text-left border-collapse">
                             <thead>
                             <tr className="bg-black/40 text-[10px] font-mono uppercase tracking-widest text-cyan-600 border-b border-cyan-900/50">
                                 <th className="p-4 font-normal w-[300px]">System Identity</th>
                                 <th className="p-4 font-normal">Resource Telemetry</th>
                                 <th className="p-4 font-normal w-[200px]">Network I/O</th>
-                                <th className="p-4 font-normal w-[180px]">Meta / Status</th>
+                                <th className="p-4 font-normal w-[180px]">Meta / Tags</th>
                             </tr>
                             </thead>
                             <tbody className="divide-y divide-cyan-900/30">
@@ -334,7 +331,7 @@ const ServerList = () => {
                                                     <span>OUT: {formatSpeed(upload)}</span>
                                                 </span>
                                             </div>
-                                            {server.trafficLimit > 0 ? (
+                                            {server.trafficLimit > 0 && (
                                                 <div className="w-32">
                                                     <div
                                                         className="flex justify-between text-[9px] text-cyan-700 mb-0.5">
@@ -346,8 +343,6 @@ const ServerList = () => {
                                                              style={{width: `${((server.trafficUsed || 0) / server.trafficLimit) * 100}%`}}></div>
                                                     </div>
                                                 </div>
-                                            ) : (
-                                                <div className="text-[10px] text-cyan-800 italic">-- NO METERING --</div>
                                             )}
                                         </td>