diff --git a/frontend/src/components/monitor/dashboard/HostMonitorDashboard.tsx b/frontend/src/components/monitor/dashboard/HostMonitorDashboard.tsx
deleted file mode 100644
index fcce414..0000000
--- a/frontend/src/components/monitor/dashboard/HostMonitorDashboard.tsx
+++ /dev/null
@@ -1,496 +0,0 @@
-// 主机监控大屏 — Grafana 风格：统计卡片 + 资源条状图 + 可排序列表 // Logan.Li
-// 参照: Grafana node-dashboard.json (表格+时序) / kubernetes-dashboard.json (bargauge+阈值)
-import { useState, useEffect, useCallback } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import {
-  Server,
-  Cpu,
-  HardDrive,
-  Activity,
-  Monitor,
-  Bell,
-  ArrowUpDown,
-  ArrowUp,
-  ArrowDown,
-  RefreshCw,
-  Search,
-  ChevronLeft,
-  ChevronRight,
-  Wifi,
-  WifiOff,
-} from 'lucide-react';
-
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Badge } from '@/components/ui/badge';
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
-import {
-  Select, SelectContent, SelectItem, SelectTrigger, SelectValue
-} from '@/components/ui/select';
-import { serverApi } from '@/api';
-import type { JsonData } from '@/types/common';
-
-type SortField = 'hostname' | 'ip' | 'agent_version' | 'agent_status' | 'cpu_usage' | 'memory_usage' | 'disk_usage' | 'region';
-type SortDir = 'asc' | 'desc';
-
-function getUsageBar(val: number) {
-  const v = val || 0;
-  const color = v > 85 ? 'bg-red-500' : v > 60 ? 'bg-amber-500' : 'bg-emerald-500';
-  return (
-    <div className="flex items-center gap-1.5 min-w-[80px]">
-      <div className="flex-1 h-1.5 rounded-full bg-[var(--dg-bg-active)]/50 overflow-hidden">
-        <div className={`h-full rounded-full ${color}`} style={{ width: `${Math.min(v, 100)}%` }} />
-      </div>
-      <span className="text-xs font-mono w-10 text-right text-[var(--dg-text-primary)]">{v.toFixed(0)}%</span>
-    </div>
-  );
-}
-
-export default function HostMonitorDashboard() {
-  const { t } = useTranslation(['monitor', 'common']);
-  const navigate = useNavigate();
-  const [hosts, setHosts] = useState<JsonData[]>([]);
-  const [total, setTotal] = useState(0);
-  const [page, setPage] = useState(1);
-  const [pageSize, setPageSize] = useState(10);
-  const [search, setSearch] = useState('');
-  const [loading, setLoading] = useState(true);
-  const [refreshing, setRefreshing] = useState(false);
-
-  // 排序状态
-  const [sortField, setSortField] = useState<SortField>('hostname');
-  const [sortDir, setSortDir] = useState<SortDir>('asc');
-
-  // 统计
-  const [stats, setStats] = useState<{ online: number; offline: number; total: number }>({ online: 0, offline: 0, total: 0 });
-
-  const loadData = useCallback(async (isRefresh = false) => {
-    if (isRefresh) setRefreshing(true);
-    else setLoading(true);
-    try {
-      const params: JsonData = { page, page_size: pageSize };
-      if (search.trim()) params.keyword = search.trim();
-      const res = await serverApi.getServers(params);
-      const list = (res as JsonData)?.list || [];
-      setHosts(list);
-      setTotal((res as JsonData)?.total || 0);
-
-      // 统计
-      const online = list.filter((h: JsonData) => h.agent_status === 'online').length;
-      setStats({ online, offline: list.length - online, total: (res as JsonData)?.total || 0 });
-    } catch {
-      setHosts([]);
-      setTotal(0);
-    } finally {
-      setLoading(false);
-      setRefreshing(false);
-    }
-  }, [page, pageSize, search]);
-
-  useEffect(() => { loadData(); }, [loadData]);
-
-  // 排序后的数据
-  const sorted = [...hosts].sort((a: JsonData, b: JsonData) => {
-    let va: JsonData | undefined, vb: JsonData | undefined;
-    if (sortField === 'region') {
-      va = (a.region?.name || a.region?.Name || '').toLowerCase();
-      vb = (b.region?.name || b.region?.Name || '').toLowerCase();
-    } else if (sortField === 'agent_status') {
-      va = a.agent_status || 'offline';
-      vb = b.agent_status || 'offline';
-    } else if (sortField === 'agent_version') {
-      va = a.agent_version || '';
-      vb = b.agent_version || '';
-    } else {
-      va = a[sortField] || '';
-      vb = b[sortField] || '';
-    }
-
-    if (typeof va === 'number' && typeof vb === 'number') {
-      return sortDir === 'asc' ? va - vb : vb - va;
-    }
-    const sa = String(va).toLowerCase();
-    const sb = String(vb).toLowerCase();
-    if (sa < sb) return sortDir === 'asc' ? -1 : 1;
-    if (sa > sb) return sortDir === 'asc' ? 1 : -1;
-    return 0;
-  });
-
-  const handleSort = (field: SortField) => {
-    if (sortField === field) {
-      setSortDir(d => d === 'asc' ? 'desc' : 'asc');
-    } else {
-      setSortField(field);
-      setSortDir('asc');
-    }
-  };
-
-  const SortIcon = ({ field }: { field: SortField }) => {
-    if (sortField !== field) return <ArrowUpDown className="w-3 h-3 dg-text-muted" />;
-    return sortDir === 'asc'
-      ? <ArrowUp className="w-3 h-3 dg-text-blue" />
-      : <ArrowDown className="w-3 h-3 dg-text-blue" />;
-  };
-
-  const totalPages = Math.ceil(total / pageSize);
-
-  const handleSearch = () => {
-    setPage(1);
-    loadData();
-  };
-
-  // 状态标签颜色
-  const statusBadge = (status: string) => {
-    if (status === 'online') return <Badge className="bg-emerald-500/20 dg-text-green border-emerald-500/30 text-[11px]">{t('common:online')}</Badge>;
-    if (status === 'running') return <Badge className="bg-blue-500/20 dg-text-blue border-blue-500/30 text-[11px]">{t('common:running')}</Badge>;
-    if (status === 'stopped') return <Badge className="bg-[var(--dg-bg-active)]/20 dg-text-secondary border-[var(--dg-border)] text-[11px]">{t('common:stopped')}</Badge>;
-    return <Badge variant="outline" className="text-[11px] dg-text-muted">{status || '--'}</Badge>;
-  };
-
-  return (
-    <div className="space-y-4">
-      {/* 统计卡片 — Grafana Quick Facts 风格 (参照 JVM Dashboard) */}
-      <div className="grid grid-cols-6 gap-3">
-        <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-          <CardContent className="p-3 flex items-center gap-2.5">
-            <div className="p-1.5 rounded-lg bg-blue-500/10"><Server className="h-4 w-4 dg-text-blue" /></div>
-            <div>
-              <div className="text-xl font-bold text-[var(--dg-text-primary)]">{stats.total}</div>
-              <div className="text-[10px] text-[var(--dg-text-muted)]">{t('monitor:hostDashboard.hostTotal')}</div>
-            </div>
-          </CardContent>
-        </Card>
-        <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-          <CardContent className="p-3 flex items-center gap-2.5">
-            <div className="p-1.5 rounded-lg bg-emerald-500/10"><Wifi className="h-4 w-4 dg-text-green" /></div>
-            <div>
-              <div className="text-xl font-bold dg-text-green">{stats.online}</div>
-              <div className="text-[10px] text-[var(--dg-text-muted)]">{t('monitor:hostDashboard.agentOnline')}</div>
-            </div>
-          </CardContent>
-        </Card>
-        <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-          <CardContent className="p-3 flex items-center gap-2.5">
-            <div className="p-1.5 rounded-lg bg-[var(--dg-bg-active)]/10"><WifiOff className="h-4 w-4 dg-text-secondary" /></div>
-            <div>
-              <div className="text-xl font-bold dg-text-secondary">{stats.offline}</div>
-              <div className="text-[10px] text-[var(--dg-text-muted)]">{t('common:offline')}</div>
-            </div>
-          </CardContent>
-        </Card>
-        {(() => {
-          const onlines = hosts.filter((h: JsonData) => h.agent_status === 'online');
-          const avgCpu = onlines.length > 0 ? onlines.reduce((s: number, h: JsonData) => s + (h.cpu_usage || 0), 0) / onlines.length : 0;
-          const avgMem = onlines.length > 0 ? onlines.reduce((s: number, h: JsonData) => s + (h.memory_usage || 0), 0) / onlines.length : 0;
-          const cpuColor = avgCpu > 85 ? 'dg-text-red' : avgCpu > 60 ? 'dg-text-yellow' : 'dg-text-green';
-          const memColor = avgMem > 85 ? 'dg-text-red' : avgMem > 60 ? 'dg-text-yellow' : 'dg-text-green';
-          return (<>
-            <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-              <CardContent className="p-3 flex items-center gap-2.5">
-                <div className="p-1.5 rounded-lg bg-red-500/10"><Cpu className="h-4 w-4 dg-text-red" /></div>
-                <div>
-                  <div className={`text-xl font-bold ${cpuColor}`}>{avgCpu.toFixed(1)}<span className="text-sm">%</span></div>
-                  <div className="text-[10px] text-[var(--dg-text-muted)]">{t('monitor:hostDashboard.avgCpu')}</div>
-                </div>
-              </CardContent>
-            </Card>
-            <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-              <CardContent className="p-3 flex items-center gap-2.5">
-                <div className="p-1.5 rounded-lg bg-amber-500/10"><Server className="h-4 w-4 dg-text-yellow" /></div>
-                <div>
-                  <div className={`text-xl font-bold ${memColor}`}>{avgMem.toFixed(1)}<span className="text-sm">%</span></div>
-                  <div className="text-[10px] text-[var(--dg-text-muted)]">{t('monitor:hostDashboard.avgMemory')}</div>
-                </div>
-              </CardContent>
-            </Card>
-          </>);
-        })()}
-      </div>
-
-      {/* 资源条状图 — Grafana Bargauge 风格 (参照 K8s Node CPU/Memory Ratio) */}
-      {hosts.filter((h: JsonData) => h.agent_status === 'online').length > 0 && (
-        <div className="grid grid-cols-2 gap-3">
-          {/* CPU 排行 */}
-          <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-            <CardHeader className="pb-2">
-              <CardTitle className="text-sm flex items-center gap-2 text-[var(--dg-text-primary)]">
-                <Cpu className="h-4 w-4 dg-text-red" />
-                {t('monitor:hostDashboard.cpuTop5')}
-                <Badge variant="outline" className="text-[10px] bg-red-500/10 dg-text-red border-red-500/30">{t('monitor:hostDashboard.threshold')}</Badge>
-              </CardTitle>
-            </CardHeader>
-            <CardContent className="space-y-2">
-              {[...hosts]
-                .filter((h: JsonData) => h.agent_status === 'online')
-                .sort((a: JsonData, b: JsonData) => (b.cpu_usage || 0) - (a.cpu_usage || 0))
-                .slice(0, 5)
-                .map((h: JsonData) => {
-                  const val = h.cpu_usage || 0;
-                  return (
-                    <div key={h.id} className="flex items-center gap-2">
-                      <span className="text-xs text-[var(--dg-text-secondary)] w-20 truncate" title={h.hostname}>{h.hostname}</span>
-                      <div className="flex-1 h-4 rounded bg-[var(--dg-bg-active)]/50 overflow-hidden">
-                        <div
-                          className="h-full rounded transition-all"
-                          style={{
-                            width: `${Math.min(val, 100)}%`,
-                            background: val >= 85
-                              ? 'linear-gradient(90deg, #ef4444, #f87171)'
-                              : val >= 60
-                              ? 'linear-gradient(90deg, #f59e0b, #fbbf24)'
-                              : 'linear-gradient(90deg, #10b981, #34d399)'
-                          }}
-                        />
-                      </div>
-                      <span className={`text-xs font-mono w-10 text-right ${
-                        val >= 85 ? 'dg-text-red' : val >= 60 ? 'dg-text-yellow' : 'dg-text-green'
-                      }`}>{val.toFixed(1)}%</span>
-                    </div>
-                  );
-                })}
-            </CardContent>
-          </Card>
-
-          {/* 内存排行 */}
-          <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-            <CardHeader className="pb-2">
-              <CardTitle className="text-sm flex items-center gap-2 text-[var(--dg-text-primary)]">
-                <Server className="h-4 w-4 dg-text-yellow" />
-                {t('monitor:hostDashboard.memTop5')}
-                <Badge variant="outline" className="text-[10px] bg-amber-500/10 dg-text-yellow border-amber-500/30">{t('monitor:hostDashboard.threshold')}</Badge>
-              </CardTitle>
-            </CardHeader>
-            <CardContent className="space-y-2">
-              {[...hosts]
-                .filter((h: JsonData) => h.agent_status === 'online')
-                .sort((a: JsonData, b: JsonData) => (b.memory_usage || 0) - (a.memory_usage || 0))
-                .slice(0, 5)
-                .map((h: JsonData) => {
-                  const val = h.memory_usage || 0;
-                  return (
-                    <div key={h.id} className="flex items-center gap-2">
-                      <span className="text-xs text-[var(--dg-text-secondary)] w-20 truncate" title={h.hostname}>{h.hostname}</span>
-                      <div className="flex-1 h-4 rounded bg-[var(--dg-bg-active)]/50 overflow-hidden">
-                        <div
-                          className="h-full rounded transition-all"
-                          style={{
-                            width: `${Math.min(val, 100)}%`,
-                            background: val >= 85
-                              ? 'linear-gradient(90deg, #ef4444, #f87171)'
-                              : val >= 60
-                              ? 'linear-gradient(90deg, #f59e0b, #fbbf24)'
-                              : 'linear-gradient(90deg, #10b981, #34d399)'
-                          }}
-                        />
-                      </div>
-                      <span className={`text-xs font-mono w-10 text-right ${
-                        val >= 85 ? 'dg-text-red' : val >= 60 ? 'dg-text-yellow' : 'dg-text-green'
-                      }`}>{val.toFixed(1)}%</span>
-                    </div>
-                  );
-                })}
-            </CardContent>
-          </Card>
-        </div>
-      )}
-
-      {/* 表格卡片 */}
-      <Card className="bg-[var(--dg-bg-secondary)] border-[var(--dg-border)]">
-        <CardHeader className="pb-3">
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-2">
-              <Activity className="h-5 w-5 dg-text-green" />
-              <CardTitle className="text-base text-[var(--dg-text-primary)]">{t('monitor:hostDashboard.listTitle')}</CardTitle>
-              <Badge variant="outline" className="text-xs bg-emerald-500/10 dg-text-green border-emerald-500/30">{t('monitor:hostDashboard.realtime')}</Badge>
-            </div>
-            <div className="flex items-center gap-2">
-              <div className="relative">
-                <Search className="absolute left-2.5 top-1/2 -translate-y-1/2 h-4 w-4 dg-text-muted" />
-                <Input
-                  className="w-[200px] pl-8 h-8 text-sm bg-[var(--dg-bg-primary)]"
-                  placeholder={t('monitor:hostDashboard.searchPlaceholder')}
-                  value={search}
-                  onChange={(e) => setSearch(e.target.value)}
-                  onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
-                />
-              </div>
-              <Button variant="outline" size="sm" onClick={() => loadData(true)} disabled={refreshing}>
-                <RefreshCw className={`h-4 w-4 mr-1 ${refreshing ? 'animate-spin' : ''}`} />
-                {t('common:refresh')}
-              </Button>
-            </div>
-          </div>
-        </CardHeader>
-        <CardContent className="p-0">
-          {loading ? (
-            <div className="py-16 text-center text-[var(--dg-text-muted)]">
-              <Activity className="h-8 w-8 mx-auto mb-2 animate-spin dg-text-green" />
-              <p className="text-sm">{t('common:loading')}</p>
-            </div>
-          ) : sorted.length === 0 ? (
-            <div className="py-16 text-center text-[var(--dg-text-muted)]">
-              <Server className="h-10 w-10 mx-auto mb-2 dg-text-muted" />
-              <p className="text-sm">{t('monitor:hostDashboard.noData')}</p>
-              <p className="text-xs mt-1">{t('monitor:hostDashboard.noDataDesc')}</p>
-            </div>
-          ) : (
-            <>
-              <div className="overflow-x-auto">
-                <table className="w-full">
-                  <thead>
-                    <tr className="border-b border-[var(--dg-border)]">
-                      {[
-                        { key: 'hostname', label: t('monitor:hostDashboard.colHostId'), w: '' },
-                        { key: 'agent_version', label: t('monitor:hostDashboard.colAgentVersion'), w: 'w-[100px]' },
-                        { key: 'agent_status', label: t('monitor:hostDashboard.colAgentStatus'), w: 'w-[90px]' },
-                        { key: 'cpu_usage', label: 'CPU', w: 'w-[130px]' },
-                        { key: 'memory_usage', label: t('monitor:hostMetric.memory'), w: 'w-[130px]' },
-                        { key: 'disk_usage', label: t('monitor:hostMetric.disk'), w: 'w-[130px]' },
-                        { key: 'region', label: t('monitor:hostDashboard.colRegion'), w: 'w-[120px]' },
-                        { key: 'ip', label: t('monitor:hostDashboard.colIp'), w: 'w-[140px]' },
-                      ].map(col => (
-                        <th
-                          key={col.key}
-                          className={`text-left px-3 py-2.5 text-xs font-medium text-[var(--dg-text-muted)] cursor-pointer select-none hover:text-[var(--dg-text-primary)] transition-colors ${col.w}`}
-                          onClick={() => handleSort(col.key as SortField)}
-                        >
-                          <div className="flex items-center gap-1">
-                            {col.label}
-                            <SortIcon field={col.key as SortField} />
-                          </div>
-                        </th>
-                      ))}
-                      <th className="text-left px-3 py-2.5 text-xs font-medium text-[var(--dg-text-muted)]">{t('common:actions')}</th>
-                    </tr>
-                  </thead>
-                  <tbody>
-                    {sorted.map((h: JsonData) => (
-                      <tr key={h.id} className="border-b border-[var(--dg-border)]/50 hover:bg-[var(--dg-bg-tertiary)]/50 transition-colors">
-                        {/* 主机名/ID */}
-                        <td className="px-3 py-2">
-                          <div className="flex items-center gap-2">
-                            <div className={`w-2 h-2 rounded-full flex-shrink-0 ${h.agent_status === 'online' ? 'bg-emerald-400' : h.status === 'running' ? 'bg-blue-400' : 'bg-[var(--dg-bg-active)]'}`} />
-                            <div>
-                              <div className="text-sm font-medium text-[var(--dg-text-primary)]">{h.hostname}</div>
-                              <div className="text-[10px] text-[var(--dg-text-muted)]">ID: {h.id}</div>
-                            </div>
-                          </div>
-                        </td>
-                        {/* Agent 版本 */}
-                        <td className="px-3 py-2">
-                          <code className="text-xs text-blue-300">{h.agent_version || '--'}</code>
-                        </td>
-                        {/* Agent 状态 */}
-                        <td className="px-3 py-2">
-                          {statusBadge(h.agent_status)}
-                        </td>
-                        {/* CPU 使用率 */}
-                        <td className="px-3 py-2">
-                          <div className="flex items-center gap-1.5">
-                            <Cpu className="h-3 w-3 dg-text-red flex-shrink-0" />
-                            {getUsageBar(h.cpu_usage)}
-                          </div>
-                        </td>
-                        {/* 内存使用率 */}
-                        <td className="px-3 py-2">
-                          <div className="flex items-center gap-1.5">
-                            <Server className="h-3 w-3 dg-text-yellow flex-shrink-0" />
-                            {getUsageBar(h.memory_usage)}
-                          </div>
-                        </td>
-                        {/* 磁盘使用率 */}
-                        <td className="px-3 py-2">
-                          <div className="flex items-center gap-1.5">
-                            <HardDrive className="h-3 w-3 dg-text-orange flex-shrink-0" />
-                            {getUsageBar(h.disk_usage)}
-                          </div>
-                        </td>
-                        {/* 所在区域 */}
-                        <td className="px-3 py-2">
-                          <span className="text-xs text-[var(--dg-text-secondary)]">
-                            {h.region?.name || h.region?.Name || (h.region ? h.region : '--')}
-                          </span>
-                        </td>
-                        {/* IP 地址 */}
-                        <td className="px-3 py-2">
-                          <code className="text-xs text-[var(--dg-text-secondary)] font-mono">{h.ip || '--'}</code>
-                        </td>
-                        {/* 操作栏 */}
-                        <td className="px-3 py-2">
-                          <div className="flex items-center gap-1">
-                            <Button
-                              variant="ghost"
-                              size="sm"
-                              className="h-7 text-xs dg-text-blue hover:text-blue-300 hover:bg-blue-500/10"
-                              onClick={() => navigate(`/monitor-center?host=${encodeURIComponent(h.hostname)}`)}
-                              title={t('monitor:hostDashboard.viewMonitorChart')}
-                            >
-                              <Monitor className="h-3 w-3 mr-1" />
-                              {t('monitor:hostDashboard.monitor')}
-                            </Button>
-                            <Button
-                              variant="ghost"
-                              size="sm"
-                              className="h-7 text-xs dg-text-yellow hover:text-amber-300 hover:bg-amber-500/10"
-                              onClick={() => navigate(`/alerts?hostname=${encodeURIComponent(h.hostname)}`)}
-                              title={t('monitor:hostDashboard.viewAlertRules')}
-                            >
-                              <Bell className="h-3 w-3 mr-1" />
-                              {t('monitor:hostDashboard.alert')}
-                            </Button>
-                          </div>
-                        </td>
-                      </tr>
-                    ))}
-                  </tbody>
-                </table>
-              </div>
-
-              {/* 分页 */}
-              <div className="flex items-center justify-between px-4 py-3 border-t border-[var(--dg-border)]">
-                <div className="flex items-center gap-2 text-xs text-[var(--dg-text-muted)]">
-                  <span>{t('monitor:hostDashboard.perPage')}</span>
-                  <Select value={String(pageSize)} onValueChange={(v) => { setPageSize(Number(v)); setPage(1); }}>
-                    <SelectTrigger className="h-7 w-[60px] text-xs">
-                      <SelectValue />
-                    </SelectTrigger>
-                    <SelectContent>
-                      <SelectItem value="10">10</SelectItem>
-                      <SelectItem value="20">20</SelectItem>
-                      <SelectItem value="30">30</SelectItem>
-                    </SelectContent>
-                  </Select>
-                  <span>{t('monitor:hostDashboard.totalCount', { count: total })}</span>
-                </div>
-                <div className="flex items-center gap-1">
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    className="h-7 text-xs"
-                    disabled={page <= 1}
-                    onClick={() => setPage(p => p - 1)}
-                  >
-                    <ChevronLeft className="h-4 w-4" />
-                  </Button>
-                  <span className="text-xs text-[var(--dg-text-secondary)] px-2">
-                    {page} / {Math.max(totalPages, 1)}
-                  </span>
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    className="h-7 text-xs"
-                    disabled={page >= totalPages}
-                    onClick={() => setPage(p => p + 1)}
-                  >
-                    <ChevronRight className="h-4 w-4" />
-                  </Button>
-                </div>
-              </div>
-            </>
-          )}
-        </CardContent>
-      </Card>
-    </div>
-  );
-}