diff --git a/src/app/(main)/gear/page.tsx b/src/app/(main)/gear/page.tsx index a194e05..f39446c 100644 --- a/src/app/(main)/gear/page.tsx +++ b/src/app/(main)/gear/page.tsx @@ -10,9 +10,9 @@ import { ToolButton } from "@/components/window/ToolButton" import { Chip, Skeleton } from "@heroui/react" import { Refresh, SettingConfig } from "@icon-park/react" // import { version } from "@tauri-apps/plugin-os" -import { useEffect, useState } from "react" import { type AllSystemInfo, allSysInfo } from "tauri-plugin-system-info-api" import { invoke } from "@tauri-apps/api/core" +import useSWR, { useSWRConfig } from "swr" export default function Page() { return ( @@ -42,10 +42,12 @@ export default function Page() { } function HardwareInfo() { + const { mutate } = useSWRConfig() + return ( { - // 触发刷新事件 - window.dispatchEvent(new CustomEvent('refresh-hardware-info')) + // 使用 SWR 的 mutate 来刷新数据 + mutate("/api/hardware-info") }}> 刷新 @@ -60,54 +62,52 @@ interface ComputerInfo { CsName?: string } -function HardwareInfoContent() { - const [allSysData, setAllSysData] = useState() - const [computerInfo, setComputerInfo] = useState({}) - const [loading, setLoading] = useState(false) +interface HardwareData { + allSysData: AllSystemInfo + computerInfo: ComputerInfo +} - const fetchData = async () => { - setLoading(true) - try { - // 并行获取系统信息和 PowerShell 信息 - const [sys, computerInfoData] = await Promise.all([ - allSysInfo(), - invoke("get_computer_info").catch((error) => { - console.error("获取 PowerShell 信息失败:", error) - return {} as ComputerInfo - }) - ]) - - console.log("系统信息:", sys) - console.log("PowerShell 信息:", computerInfoData) - - if (sys?.cpus) { - console.log("CPU数据:", sys.cpus) - console.log("第一个CPU:", sys.cpus[0]) - if (sys.cpus[0]) { - console.log("CPU字段:", Object.keys(sys.cpus[0])) - } - } - setAllSysData(sys) - setComputerInfo(computerInfoData) - } catch (error) { - console.error("获取系统信息失败:", error) - } finally { - setLoading(false) +// 硬件信息 fetcher +const hardwareInfoFetcher = async (): Promise => { + // 并行获取系统信息和 PowerShell 信息 + const [sys, computerInfoData] = await Promise.all([ + allSysInfo(), + invoke("get_computer_info").catch((error) => { + console.error("获取 PowerShell 信息失败:", error) + return {} as ComputerInfo + }) + ]) + + console.log("系统信息:", sys) + console.log("PowerShell 信息:", computerInfoData) + + if (sys?.cpus) { + console.log("CPU数据:", sys.cpus) + console.log("第一个CPU:", sys.cpus[0]) + if (sys.cpus[0]) { + console.log("CPU字段:", Object.keys(sys.cpus[0])) } } + + return { + allSysData: sys, + computerInfo: computerInfoData + } +} - useEffect(() => { - void fetchData() +function HardwareInfoContent() { + const { data, isLoading } = useSWR( + "/api/hardware-info", + hardwareInfoFetcher, + { + revalidateOnFocus: false, + revalidateOnReconnect: false, + dedupingInterval: 5 * 60 * 1000, // 5分钟内相同请求去重 + } + ) - // 监听刷新事件 - const handleRefresh = () => { - void fetchData() - } - window.addEventListener('refresh-hardware-info', handleRefresh) - return () => { - window.removeEventListener('refresh-hardware-info', handleRefresh) - } - }, []) + const allSysData = data?.allSysData + const computerInfo = data?.computerInfo || {} const formatBytes = (bytes?: number) => { if (!bytes) return "未知" @@ -171,7 +171,7 @@ function HardwareInfoContent() { : null // 如果正在加载,显示 Skeleton 骨架屏 - if (loading) { + if (isLoading) { return (
{/* 系统信息 Skeleton */}