From 307414d981a2a55317c1422bbcefa9cb837bbc66 Mon Sep 17 00:00:00 2001 From: bat1120 Date: Tue, 5 May 2026 03:16:59 +0900 Subject: [PATCH] =?UTF-8?q?fix(abm):=20=EB=8F=99=20fallback=20+=20?= =?UTF-8?q?=ED=90=81=EB=8B=B9=ED=90=81=EB=8B=B9=20UI=20+=20=EA=B0=99?= =?UTF-8?q?=EC=9D=80=20spot=20=EC=9E=AC=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20?= =?UTF-8?q?=EC=8B=9C=EB=82=98=EB=A6=AC=EC=98=A4=20form?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 헤더 "ABM 페르소나 행동 시뮬 (—)" 표시 버그 fix: focusSpot.label || targetDistrict || '—' 로 fallback chain (?? → || 변경, empty string 도 처리). AbmTab/AbmPersonaMap/AbmFloatingWidget 3 곳. - 같은 spot 재클릭 시 progress 만 떠서 시나리오 변경 못 하던 문제 fix: isRunningCurrentSpot 분기 제거 → 항상 시나리오 form 노출. 사용자가 같은 spot 에 날씨/요일 다른 변형 enqueue 가능. 진행 상태는 우하단 queue panel + AbmFloatingWidget 으로 노출. - 퐁당퐁당 UI (page→panel→card alternating, AnalyzeGroup 패턴 정합): * AbmGroup: bg-secondary → bg-card border (제일 밖 = 흰색) * AbmTab map view + AbmPersonaMap 외곽: bg-card → bg-secondary (gray panel) * 좌측 결과 패널 (col-start-1) + 우하단 (col-start-2 row-start-2): bg-secondary → bg-card border (흰색 inner cards) DB 변경: 0 신규 endpoint: 0 Co-Authored-By: Claude Opus 4.7 (1M context) --- docs/retrospective/2026-05-05.md | 5 ++++ frontend/src/components/AbmPersonaMap.tsx | 30 +++++-------------- .../dashboard/groups/AbmGroup.tsx | 2 +- .../dashboard/tabs/AbmTab.tsx | 5 ++-- .../simulation/AbmFloatingWidget.tsx | 2 +- 5 files changed, 17 insertions(+), 27 deletions(-) diff --git a/docs/retrospective/2026-05-05.md b/docs/retrospective/2026-05-05.md index 27d2d7e8..6867375c 100644 --- a/docs/retrospective/2026-05-05.md +++ b/docs/retrospective/2026-05-05.md @@ -397,4 +397,9 @@ 6 files changed, 686 insertions(+), 387 deletions(-) ``` +--- + +## 03:06:28 세션 완료 + + --- diff --git a/frontend/src/components/AbmPersonaMap.tsx b/frontend/src/components/AbmPersonaMap.tsx index 1beef9be..f911d296 100644 --- a/frontend/src/components/AbmPersonaMap.tsx +++ b/frontend/src/components/AbmPersonaMap.tsx @@ -3,13 +3,10 @@ import { Play, Cloud, Calendar, DollarSign, Sliders, Loader2 } from 'lucide-reac import VacancySpotMarker from './VacancySpotMarker'; import VacancyStatsPanel from './VacancyStatsPanel'; import PersonaCard, { type PersonaCardData } from './PersonaCard'; -import AbmProgressPanel from './AbmProgressPanel'; import { FormField } from './ui/FormField'; import { SectionLabel } from './ui/SectionLabel'; import type { SpotDongStats } from './abm/SpotInfoCard'; -import { PersonaPreviewStream } from './abm/PersonaPreviewStream'; import { AbmQueuePanel } from './abm/AbmQueuePanel'; -import { useAbmStore } from '../stores/abmStore'; // 스팟 노드 스키마 — 백엔드 /mapo/spots/{dong} 에서 동적 조회 (하드코딩 없음) interface StoreNode { @@ -418,7 +415,7 @@ export default function AbmPersonaMap({ vacancyPseSummary = null, competitors, onPersonaClick, - businessType, + businessType: _businessType, dongStats: _dongStats, }: AbmPersonaMapProps) { const mapContainerRef = useRef(null); @@ -569,17 +566,9 @@ export default function AbmPersonaMap({ wanderActiveRef.current = !abmResult; }, [abmResult]); - // 현재 진행 중 시뮬의 spot — focusSpot 과 다르면 사용자가 다른 spot 보는 중 (queue 추가 의도). - // 사용자 피드백 (2026-05-05): 시뮬 진행 중 다른 spot 클릭하면 progress panel 만 떠서 - // 시나리오 form 못 봄 → 진행 중 spot 과 focusSpot 다를 때만 progress 표시 (같은 spot 일 때만). - const runningParams = useAbmStore((s) => s.params); - const isRunningCurrentSpot = - abmLoading && - !!focusSpot && - !!runningParams?.spot_lat && - !!runningParams?.spot_lon && - Math.abs((runningParams.spot_lat ?? 0) - focusSpot.lat) < 1e-5 && - Math.abs((runningParams.spot_lon ?? 0) - focusSpot.lon) < 1e-5; + // 사용자 피드백 (2026-05-05): spot 클릭 시 진행 중이라도 항상 시나리오 form 표시 + // (날씨/요일 변경해서 추가 enqueue 가능). 진행 상태는 우하단 queue 패널 + AbmFloatingWidget + // 으로 노출. progress panel 자체 분기 제거. // vacancy 모드 — 4 endpoint fetch 결과 (mode='vacancy' 시만 사용) const [vacancyTrajectory, setVacancyTrajectory] = useState([]); @@ -2838,7 +2827,7 @@ export default function AbmPersonaMap({ - {focusSpot?.label ?? '—'} + {focusSpot?.label || targetDistrict || '—'} · 진행 중... @@ -2994,7 +2983,7 @@ export default function AbmPersonaMap({ {/* 우하 (col 2, row 2). AbmQueuePanel 항상 표시 (사용자 피드백 2026-05-05) — abmResult 있을 때도 queue 가 보이도록. metric 4-card 는 좌측 결과 패널에 있음. */} -
+
{/* 결과 시 metric 4-card 는 그대로 유지하면서 우측 1/3 에 queue panel 추가. */} {abmResult ? (
@@ -3145,7 +3134,7 @@ export default function AbmPersonaMap({ )}
{/* 좌측 결과 패널 — col 1, row span 2 (전체 높이) */} -
+
{/* 백그라운드 무드 조명 — 보라 tint 제거 (canvas/analyze panel 과 동일 톤 유지) */}
{abmResult ? ( @@ -3555,11 +3544,6 @@ export default function AbmPersonaMap({
)}
- ) : isRunningCurrentSpot ? ( -
- - -
) : abmError ? (

{abmError}

diff --git a/frontend/src/components/SimulationResult/dashboard/groups/AbmGroup.tsx b/frontend/src/components/SimulationResult/dashboard/groups/AbmGroup.tsx index 08fa7034..ec408f68 100644 --- a/frontend/src/components/SimulationResult/dashboard/groups/AbmGroup.tsx +++ b/frontend/src/components/SimulationResult/dashboard/groups/AbmGroup.tsx @@ -16,7 +16,7 @@ interface Props { export function AbmGroup({ simResult, brandName, businessType }: Props) { return ( -
+
); diff --git a/frontend/src/components/SimulationResult/dashboard/tabs/AbmTab.tsx b/frontend/src/components/SimulationResult/dashboard/tabs/AbmTab.tsx index ae88b367..40b0f548 100644 --- a/frontend/src/components/SimulationResult/dashboard/tabs/AbmTab.tsx +++ b/frontend/src/components/SimulationResult/dashboard/tabs/AbmTab.tsx @@ -246,7 +246,7 @@ export function AbmTab({ simResult, brandName, businessType, storeArea }: Props) ) : ( <> ABM 페르소나 행동 시뮬 ( - {focusSpot?.label ?? '—'}) + {focusSpot?.label || targetDistrict || '—'}) )} @@ -271,7 +271,8 @@ export function AbmTab({ simResult, brandName, businessType, storeArea }: Props)
)} - {/* 지도 / ABM 뷰 */} + {/* 지도 / ABM 뷰 — 퐁당퐁당: AbmGroup(card white) → 여기 panel(secondary gray) + → 안 inner cards(card white). 사용자 피드백 (2026-05-05): 제일 밖 white. */} {mode === 'map' ? (
diff --git a/frontend/src/components/simulation/AbmFloatingWidget.tsx b/frontend/src/components/simulation/AbmFloatingWidget.tsx index 438fe005..bf435e5d 100644 --- a/frontend/src/components/simulation/AbmFloatingWidget.tsx +++ b/frontend/src/components/simulation/AbmFloatingWidget.tsx @@ -168,7 +168,7 @@ export function AbmFloatingWidget() {
- {focusSpot?.label ?? '—'} · {stage} + {focusSpot?.label || '마포구'} · {stage} ETA ~{etaSec}s