Daniel/usa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 优化自适应界面

Browse Source
This commit is contained in:
Daniel
2026-03-02 18:39:29 +08:00
parent 4e91018752
commit 13ca470cad
16 changed files with 145 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/pages/Dashboard.tsx
View File

@@ -24,7 +24,7 @@ export function Dashboard() {
}, [])
return (
<div className="flex h-screen w-full max-w-full min-h-0 flex-col overflow-hidden bg-military-dark font-orbitron">
<div className="landscape-scaler flex h-screen w-full max-w-full min-h-0 flex-col overflow-hidden bg-military-dark font-orbitron">
{lastError && (
<div className="shrink-0 bg-amber-500/20 px-4 py-2 text-center text-sm text-amber-400">
{lastError}（使用本地缓存，请确保 API + WebSocket 已启动：npm run api）
@@ -34,20 +34,20 @@ export function Dashboard() {
<TimelinePanel />
<div className="flex min-h-0 min-w-0 flex-1 flex-col overflow-auto overflow-x-hidden xl:flex-row xl:overflow-hidden">
{/* 竖屏/小屏：地图(100%宽) → 战损 → 左 → 右。横屏≥1280px：左|中|右 */}
{/* xl：左|中|右。竖屏：地图→战损→美国基地→伊朗基地→左→右 */}
<main className="flex w-full min-h-[280px] shrink-0 flex-col overflow-hidden xl:order-2 xl:min-h-0 xl:min-w-0 xl:flex-1 xl:shrink">
<div className="h-[45vmin] min-h-[220px] w-full shrink-0 xl:min-h-0 xl:flex-1">
<div className="h-[45vmin] min-h-[180px] w-full shrink-0 xl:min-h-0 xl:flex-1">
<WarMap />
</div>
<div className="flex shrink-0 flex-col gap-2 overflow-x-auto border-t border-military-border bg-military-panel/95 px-3 py-2 xl:flex-row xl:items-stretch xl:overflow-visible xl:px-4">
<BaseStatusPanel keyLocations={situation.usForces.keyLocations} className="shrink-0 xl:min-w-[200px] xl:border-r xl:border-military-border xl:pr-4" />
<CombatLossesPanel
usLosses={situation.usForces.combatLosses}
iranLosses={situation.iranForces.combatLosses}
conflictStats={situation.conflictStats}
civilianTotal={situation.civilianCasualtiesTotal}
className="min-w-0 flex-1 py-1"
className="min-w-0 flex-1 shrink-0 py-1"
/>
<BaseStatusPanel keyLocations={situation.usForces.keyLocations} className="shrink-0 xl:min-w-[200px] xl:border-r xl:border-military-border xl:pr-4" />
<IranBaseStatusPanel
keyLocations={situation.iranForces.keyLocations}
className="min-w-0 shrink-0 xl:min-w-[200px]"