- 补实现 ProtectedRoute 空壳组件(预留接口,不启用认证逻辑) - 修复页面组件内联 style 为 CSS 类,符合样式规范 - 补充 Sidebar 菜单项激活状态测试、404 按钮可点击测试 - 回写 admin-layout spec Header 页面标题 fallback 行为 - 同步 delta specs 至主规范(admin-layout、frontend-routing、app-constants) - 归档 refactor-frontend-layout change
30 lines
938 B
TypeScript
30 lines
938 B
TypeScript
import { useQuery } from "@tanstack/react-query";
|
||
import { Space } from "tdesign-react";
|
||
|
||
import type { HealthResponse } from "../../../shared/api";
|
||
|
||
import { APP } from "../../../shared/app";
|
||
|
||
export function DashboardPage() {
|
||
const { data: health } = useQuery({
|
||
queryFn: fetchHealth,
|
||
queryKey: ["health"],
|
||
refetchInterval: 30000,
|
||
staleTime: 5000,
|
||
});
|
||
|
||
return (
|
||
<Space className="full-width-space" direction="vertical" size="large">
|
||
<h2>欢迎使用 {APP.title}</h2>
|
||
<p>在此构建你的应用。以下是 /health API 的返回数据(前后端联调示例):</p>
|
||
{health && <pre className="health-response">{JSON.stringify(health, null, 2)}</pre>}
|
||
</Space>
|
||
);
|
||
}
|
||
|
||
async function fetchHealth(): Promise<HealthResponse> {
|
||
const response = await fetch("/health");
|
||
if (!response.ok) throw new Error(`HTTP ${response.status}`);
|
||
return response.json() as Promise<HealthResponse>;
|
||
}
|