fix: 修复系统图标圆角遮挡问题和 StatsBar 组件时间

This commit is contained in:
Montia37
2025-08-31 11:17:45 +08:00
parent b12094d40f
commit 79e5035aa8
3 changed files with 11 additions and 6 deletions

View File

@@ -53,7 +53,7 @@ export const NodeCard = ({ node, enableSwap }: NodeCardProps) => {
<img <img
src={getOSImage(node.os)} src={getOSImage(node.os)}
alt={node.os} alt={node.os}
className="w-6 h-6 rounded-full" className="w-6 h-6 object-contain"
loading="lazy" loading="lazy"
/> />
<CardTitle className="text-base font-bold">{node.name}</CardTitle> <CardTitle className="text-base font-bold">{node.name}</CardTitle>

View File

@@ -7,6 +7,7 @@ import {
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"; } from "@/components/ui/dropdown-menu";
import { Settings2 } from "lucide-react"; import { Settings2 } from "lucide-react";
import { useEffect, useState } from "react";
import { Switch } from "@/components/ui/switch"; import { Switch } from "@/components/ui/switch";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { formatBytes } from "@/utils"; import { formatBytes } from "@/utils";
@@ -31,7 +32,6 @@ interface StatsBarProps {
currentSpeedDown: number; currentSpeedDown: number;
}; };
loading: boolean; loading: boolean;
currentTime: Date;
} }
export const StatsBar = ({ export const StatsBar = ({
@@ -39,9 +39,16 @@ export const StatsBar = ({
setDisplayOptions, setDisplayOptions,
stats, stats,
loading, loading,
currentTime,
}: StatsBarProps) => { }: StatsBarProps) => {
const isMobile = useIsMobile(); const isMobile = useIsMobile();
const [time, setTime] = useState(new Date());
useEffect(() => {
const timer = setInterval(() => {
setTime(new Date());
}, 1000);
return () => clearInterval(timer);
}, []);
// 获取已启用的统计项列表 // 获取已启用的统计项列表
const enabledStats = Object.keys(displayOptions).filter( const enabledStats = Object.keys(displayOptions).filter(
@@ -60,7 +67,7 @@ export const StatsBar = ({
</label> </label>
<label className="font-medium -mt-2 text-md"> <label className="font-medium -mt-2 text-md">
{currentTime.toLocaleTimeString()} {time.toLocaleTimeString()}
</label> </label>
</div> </div>
</div> </div>

View File

@@ -27,7 +27,6 @@ const HomePage: React.FC<HomePageProps> = ({ viewMode, searchTerm }) => {
traffic: true, traffic: true,
speed: true, speed: true,
}); });
const [currentTime] = useState(new Date());
const combinedNodes = useMemo<NodeWithStatus[]>(() => { const combinedNodes = useMemo<NodeWithStatus[]>(() => {
if (!staticNodes) return []; if (!staticNodes) return [];
@@ -88,7 +87,6 @@ const HomePage: React.FC<HomePageProps> = ({ viewMode, searchTerm }) => {
setDisplayOptions={setDisplayOptions} setDisplayOptions={setDisplayOptions}
stats={stats} stats={stats}
loading={loading} loading={loading}
currentTime={currentTime}
/> />
)} )}