40 lines
1016 B
TypeScript
40 lines
1016 B
TypeScript
"use client";
|
|
|
|
import clsx from "clsx";
|
|
import { useDashboardStore } from "@/hooks/useDashboardStore";
|
|
|
|
export function HeaderBar() {
|
|
const store = useDashboardStore();
|
|
|
|
return (
|
|
<header className="header">
|
|
<div className="brand">
|
|
<h1>PolyWeather</h1>
|
|
<span className="subtitle">天气衍生品智能分析</span>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
className="info-btn"
|
|
title="查看系统技术说明"
|
|
aria-label="查看系统技术说明"
|
|
onClick={store.openGuide}
|
|
>
|
|
技术说明
|
|
</button>
|
|
<div className="live-badge" id="liveBadge">
|
|
<span className="pulse-dot" />
|
|
<span>实时</span>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
className={clsx("refresh-btn", store.loadingState.refresh && "spinning")}
|
|
title="刷新所有数据"
|
|
aria-label="刷新所有数据"
|
|
onClick={() => void store.refreshAll()}
|
|
>
|
|
↻
|
|
</button>
|
|
</header>
|
|
);
|
|
}
|