2569718930@qq.com
2b1d7c0b65
The dashboard had several oversized orchestration, component, and CSS files that made product-copy changes and mobile/performance work risky. This refactor preserves behavior while splitting scan terminal CSS, opportunity helpers, future forecast panels, history/detail charts, and probability/model sections into smaller ownership boundaries. Constraint: No user-visible version bump because this batch is architecture and performance cleanup, not a release announcement. Rejected: Rewrite dashboard state management in the same batch | too broad for a safe upload after CSS and component splitting. Confidence: high Scope-risk: moderate Reversibility: clean Directive: Keep new component/CSS boundaries instead of moving product copy back into the large dashboard files. Tested: npm run build; npm run test:business; git diff --check Not-tested: Browser visual smoke test after push
81 lines
2.4 KiB
TypeScript
81 lines
2.4 KiB
TypeScript
"use client";
|
|
|
|
import type { useDashboardStore } from "@/hooks/useDashboardStore";
|
|
import type { useI18n } from "@/hooks/useI18n";
|
|
import type { getFutureModalView } from "@/lib/dashboard-utils";
|
|
import {
|
|
FutureModelForecastPanel,
|
|
FutureProbabilityPanel,
|
|
FutureTemperaturePathChart,
|
|
} from "./FutureForecastModalPanels";
|
|
|
|
type DashboardDetail = NonNullable<
|
|
ReturnType<typeof useDashboardStore>["selectedDetail"]
|
|
>;
|
|
type FutureModalView = ReturnType<typeof getFutureModalView>;
|
|
type TranslationFn = ReturnType<typeof useI18n>["t"];
|
|
|
|
export function FutureForecastForwardView({
|
|
dateStr,
|
|
detail,
|
|
t,
|
|
view,
|
|
}: {
|
|
dateStr: string;
|
|
detail: DashboardDetail;
|
|
t: TranslationFn;
|
|
view: FutureModalView;
|
|
}) {
|
|
return (
|
|
<>
|
|
<div className="history-stats">
|
|
<div className="h-stat-card">
|
|
<span className="label">{t("future.targetForecast")}</span>
|
|
<span className="val">
|
|
{view.forecastEntry?.max_temp ?? "--"}
|
|
{detail.temp_symbol}
|
|
</span>
|
|
</div>
|
|
<div className="h-stat-card">
|
|
<span className="label">{t("future.deb")}</span>
|
|
<span className="val">
|
|
{view.deb ?? "--"}
|
|
{detail.temp_symbol}
|
|
</span>
|
|
</div>
|
|
<div className="h-stat-card">
|
|
<span className="label">{t("future.mu")}</span>
|
|
<span className="val">
|
|
{view.mu != null
|
|
? `${view.mu.toFixed(1)}${detail.temp_symbol}`
|
|
: "--"}
|
|
</span>
|
|
</div>
|
|
<div className="h-stat-card">
|
|
<span className="label">{t("future.score")}</span>
|
|
<span className="val">
|
|
{view.front.score > 0 ? "+" : ""}
|
|
{view.front.score}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<section className="future-modal-section">
|
|
<h3>{t("future.targetTempTrend")}</h3>
|
|
<FutureTemperaturePathChart dateStr={dateStr} forceToday={false} />
|
|
</section>
|
|
|
|
<div className="future-modal-grid">
|
|
<section className="future-modal-section">
|
|
<h3>{t("future.probability")}</h3>
|
|
<FutureProbabilityPanel detail={detail} targetDate={dateStr} hideTitle />
|
|
</section>
|
|
<section className="future-modal-section">
|
|
<h3>{t("future.models")}</h3>
|
|
<FutureModelForecastPanel detail={detail} targetDate={dateStr} hideTitle />
|
|
</section>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|