투자관리 화면 수정

frontend/src/components/paper/PaperLeftSettingsTab.tsx

@@ -1,9 +1,12 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { useAppSettings } from '../../hooks/useAppSettings';
-import { resetPaperAccount } from '../../utils/backendApi';
+import { resetPaperAccount, type PaperAllocationDto } from '../../utils/backendApi';
 import PaperSplitPanel from './PaperSplitPanel';
+import PaperSymbolStageSettings from './PaperSymbolStageSettings';
 
 interface Props {
+  selectedMarket?: string;
+  allocations?: PaperAllocationDto[];
   onSettingsSaved?: () => void;
   onAccountReset?: () => void;
   onOpenSettings?: () => void;
@@ -16,8 +19,18 @@ const SettingsFieldRow: React.FC<{ label: string; children: React.ReactNode }> =
   </div>
 );
 
-const PaperLeftSettingsTab: React.FC<Props> = ({ onSettingsSaved, onAccountReset, onOpenSettings }) => {
+const PaperLeftSettingsTab: React.FC<Props> = ({
+  selectedMarket,
+  allocations = [],
+  onSettingsSaved,
+  onAccountReset,
+  onOpenSettings,
+}) => {
   const { defaults, save, isLoaded } = useAppSettings();
+  const selectedAlloc = useMemo(
+    () => allocations.find(a => a.symbol === selectedMarket),
+    [allocations, selectedMarket],
+  );
 
   if (!isLoaded) {
     return <p className="ptd-muted">설정 로딩…</p>;
@@ -78,7 +91,17 @@ const PaperLeftSettingsTab: React.FC<Props> = ({ onSettingsSaved, onAccountReset
   );
 
   const bottom = (
-    <div className="ptd-settings-panel ptd-settings-panel--account">
+    <div className="ptd-settings-panel ptd-settings-panel--account ptd-settings-panel--stages">
+      {selectedMarket ? (
+        <PaperSymbolStageSettings
+          symbol={selectedMarket}
+          allocation={selectedAlloc}
+          onSaved={onSettingsSaved}
+        />
+      ) : (
+        <p className="ptd-muted ptd-item-card-empty">중앙 투자금 관리에서 종목을 선택하면 분할 매매 단계를 설정할 수 있습니다.</p>
+      )}
+      <div className="ptd-settings-panel-divider" aria-hidden />
       <div className="vtd-target-item ptd-item-card ptd-settings-card">
         <div className="ptd-item-card-metrics">
           <SettingsFieldRow label="초기 자본 (KRW)">
@@ -135,7 +158,7 @@ const PaperLeftSettingsTab: React.FC<Props> = ({ onSettingsSaved, onAccountReset
     <PaperSplitPanel
       className="ptd-split-panel--left"
       topTitle="운영 · 자동매매"
-      bottomTitle="계좌 · 비용"
+      bottomTitle="종목별 분할 매매 · 계좌"
       top={top}
       bottom={bottom}
     />