/** * 仪表板数据 Hooks * 使用 React Query 进行数据获取和缓存管理 */ import { useQuery } from '@tanstack/react-query'; import { dashboardService } from '@/services/dashboardService'; import type { DashboardPeriod } from '@/types'; /** Query Keys */ export const dashboardKeys = { all: ['dashboard'] as const, overview: () => [...dashboardKeys.all, 'overview'] as const, stats: () => [...dashboardKeys.all, 'stats'] as const, trend: (period: DashboardPeriod) => [...dashboardKeys.all, 'trend', period] as const, region: () => [...dashboardKeys.all, 'region'] as const, activities: (limit: number) => [...dashboardKeys.all, 'activities', limit] as const, }; /** * 获取仪表板概览数据 */ export function useDashboardOverview() { return useQuery({ queryKey: dashboardKeys.overview(), queryFn: async () => { const response = await dashboardService.getOverview(); return response.data; }, staleTime: 30 * 1000, // 30秒后标记为过期 gcTime: 5 * 60 * 1000, // 5分钟后垃圾回收 }); } /** * 获取统计卡片数据 */ export function useDashboardStats() { return useQuery({ queryKey: dashboardKeys.stats(), queryFn: async () => { const response = await dashboardService.getStats(); return response.data.stats; }, staleTime: 30 * 1000, gcTime: 5 * 60 * 1000, }); } /** * 获取趋势图表数据 * @param period 时间周期 */ export function useDashboardTrend(period: DashboardPeriod = '7d') { return useQuery({ queryKey: dashboardKeys.trend(period), queryFn: async () => { const response = await dashboardService.getTrendData(period); return response.data.trend; }, staleTime: 60 * 1000, // 1分钟后标记为过期 gcTime: 5 * 60 * 1000, }); } /** * 获取区域分布数据 */ export function useDashboardRegion() { return useQuery({ queryKey: dashboardKeys.region(), queryFn: async () => { const response = await dashboardService.getRegionDistribution(); return response.data.regions; }, staleTime: 5 * 60 * 1000, // 5分钟后标记为过期 gcTime: 10 * 60 * 1000, }); } /** * 获取最近活动数据 * @param limit 返回数量限制 */ export function useDashboardActivities(limit = 5) { return useQuery({ queryKey: dashboardKeys.activities(limit), queryFn: async () => { const response = await dashboardService.getRecentActivities(limit); return response.data.activities; }, staleTime: 30 * 1000, // 30秒后标记为过期 gcTime: 5 * 60 * 1000, refetchInterval: 60 * 1000, // 每分钟自动刷新 }); }