Compare commits
9 Commits
e42b643731
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| c998753eea | |||
| a846ab89e6 | |||
| ef392f02ed | |||
| 2543dc335d | |||
| b99d720179 | |||
| 734bc6532e | |||
| 5fd32030ab | |||
| e8d33906ba | |||
| 6533743100 |
42
src/api.js
42
src/api.js
@@ -681,3 +681,45 @@ export const refreshScreenerSnap = () => apiPost('/api/stock/screener
|
||||
export const listScreenerRuns = (limit = 30) => apiGet (`/api/stock/screener/runs?limit=${limit}`);
|
||||
export const getScreenerRun = (id) => apiGet (`/api/stock/screener/runs/${id}`);
|
||||
|
||||
// --- Lotto Weight Evolver ---
|
||||
|
||||
export async function fetchEvolverStatus() {
|
||||
const r = await fetch('/api/lotto/evolver/status');
|
||||
if (!r.ok) throw new Error(`evolver/status ${r.status}`);
|
||||
return r.json();
|
||||
}
|
||||
|
||||
export async function fetchEvolverHistory(weeks = 12) {
|
||||
const r = await fetch(`/api/lotto/evolver/history?weeks=${weeks}`);
|
||||
if (!r.ok) throw new Error(`evolver/history ${r.status}`);
|
||||
return r.json();
|
||||
}
|
||||
|
||||
export async function fetchLottoTasks({ days = 7, taskType = null } = {}) {
|
||||
const params = new URLSearchParams({ days: String(days), limit: '100' });
|
||||
if (taskType) params.set('task_type', taskType);
|
||||
const r = await fetch(`/api/agent-office/agents/lotto/tasks?${params}`);
|
||||
if (!r.ok) throw new Error(`agent-office tasks ${r.status}`);
|
||||
return r.json();
|
||||
}
|
||||
|
||||
export async function fetchLottoLogs({ days = 7 } = {}) {
|
||||
const r = await fetch(`/api/agent-office/agents/lotto/logs?limit=200`);
|
||||
if (!r.ok) throw new Error(`agent-office logs ${r.status}`);
|
||||
const data = await r.json();
|
||||
if (!days) return data;
|
||||
const cutoff = new Date(Date.now() - days * 24 * 3600 * 1000).toISOString();
|
||||
return { items: (data.items || data.logs || []).filter(l => (l.created_at || '') >= cutoff) };
|
||||
}
|
||||
|
||||
export async function triggerEvolverGenerate() {
|
||||
const r = await fetch('/api/lotto/evolver/generate-now', { method: 'POST' });
|
||||
if (!r.ok) throw new Error(`generate-now ${r.status}`);
|
||||
return r.json();
|
||||
}
|
||||
|
||||
export async function triggerEvolverEvaluate() {
|
||||
const r = await fetch('/api/lotto/evolver/evaluate-now', { method: 'POST' });
|
||||
if (!r.ok) throw new Error(`evaluate-now ${r.status}`);
|
||||
return r.json();
|
||||
}
|
||||
|
||||
@@ -59,6 +59,18 @@
|
||||
.ic-keyword-row__meta { font-size: 0.72rem; color: rgba(255,255,255,.35); white-space: nowrap; }
|
||||
.ic-keyword-row__score { font-size: 0.75rem; font-weight: 700; color: #ec4899; min-width: 36px; text-align: right; }
|
||||
|
||||
/* 키워드 페이저 (10개씩, 이전/다음) */
|
||||
.ic-keywords__pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; }
|
||||
.ic-pager-btn {
|
||||
display: inline-flex; align-items: center; justify-content: center;
|
||||
width: 36px; height: 36px; border-radius: 99px;
|
||||
border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.04);
|
||||
color: rgba(255,255,255,.7); font-size: 1.1rem; cursor: pointer; transition: all .15s;
|
||||
}
|
||||
.ic-pager-btn:hover:not(:disabled) { background: rgba(236,72,153,.18); border-color: #ec4899; color: #ec4899; }
|
||||
.ic-pager-btn:disabled { opacity: .3; cursor: not-allowed; }
|
||||
.ic-pager-info { font-size: 0.8rem; font-weight: 600; color: rgba(255,255,255,.55); min-width: 48px; text-align: center; }
|
||||
|
||||
/* 슬레이트 그리드 — 모바일 2칸 강제, 데스크탑 auto-fill */
|
||||
.ic-slates-grid {
|
||||
display: grid;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState, useEffect, useCallback, useRef } from 'react';
|
||||
import React, { useState, useEffect, useCallback, useRef, useMemo } from 'react';
|
||||
import PullToRefresh from '../../components/PullToRefresh';
|
||||
import {
|
||||
getInstaStatus,
|
||||
@@ -521,11 +521,13 @@ function TriggerPanel() {
|
||||
|
||||
/* ══════════════════════ 키워드 목록 ══════════════════════════════════════ */
|
||||
const CATEGORIES = ['전체', 'economy', 'psychology', 'celebrity'];
|
||||
const KEYWORDS_PER_PAGE = 10;
|
||||
|
||||
function KeywordsPanel({ onCreateSlate }) {
|
||||
const [category, setCategory] = useState('전체');
|
||||
const [keywords, setKeywords] = useState([]);
|
||||
const [creating, setCreating] = useState(null); // keyword_id being created
|
||||
const [page, setPage] = useState(0);
|
||||
|
||||
const load = useCallback(() => {
|
||||
const cat = category === '전체' ? undefined : category;
|
||||
@@ -533,6 +535,23 @@ function KeywordsPanel({ onCreateSlate }) {
|
||||
}, [category]);
|
||||
|
||||
useEffect(() => { load(); }, [load]);
|
||||
useEffect(() => { setPage(0); }, [category]); // 카테고리 변경 시 첫 페이지로
|
||||
|
||||
// 동일 keyword 중복 제거(최고 score 1개만 유지) + score 내림차순
|
||||
const deduped = useMemo(() => {
|
||||
const best = new Map();
|
||||
for (const kw of keywords) {
|
||||
const name = (kw.keyword || '').trim();
|
||||
if (!name) continue;
|
||||
const prev = best.get(name);
|
||||
if (!prev || (kw.score ?? 0) > (prev.score ?? 0)) best.set(name, kw);
|
||||
}
|
||||
return [...best.values()].sort((a, b) => (b.score ?? 0) - (a.score ?? 0));
|
||||
}, [keywords]);
|
||||
|
||||
const totalPages = Math.max(1, Math.ceil(deduped.length / KEYWORDS_PER_PAGE));
|
||||
const safePage = Math.min(page, totalPages - 1);
|
||||
const pageItems = deduped.slice(safePage * KEYWORDS_PER_PAGE, safePage * KEYWORDS_PER_PAGE + KEYWORDS_PER_PAGE);
|
||||
|
||||
// 부모(InstaCards)의 handleCreateSlate에 위임 — progress 배너 + 스크롤 + 자동 미리보기 공통화
|
||||
async function handleCreate(kw) {
|
||||
@@ -568,11 +587,12 @@ function KeywordsPanel({ onCreateSlate }) {
|
||||
|
||||
{/* progress 표시는 상단 ic-slate-progress 배너에서 일괄 처리 */}
|
||||
|
||||
{keywords.length === 0 ? (
|
||||
{deduped.length === 0 ? (
|
||||
<div className="ic-empty">키워드가 없습니다. 키워드 추출을 실행하세요.</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="ic-keywords">
|
||||
{keywords.map((kw) => (
|
||||
{pageItems.map((kw) => (
|
||||
<div key={kw.id} className="ic-keyword-row">
|
||||
<span className="ic-keyword-row__kw">{kw.keyword}</span>
|
||||
<span className="ic-keyword-row__meta">
|
||||
@@ -589,6 +609,25 @@ function KeywordsPanel({ onCreateSlate }) {
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{totalPages > 1 && (
|
||||
<div className="ic-keywords__pager">
|
||||
<button
|
||||
className="ic-pager-btn"
|
||||
onClick={() => setPage((p) => Math.max(0, p - 1))}
|
||||
disabled={safePage === 0}
|
||||
aria-label="이전 키워드"
|
||||
>←</button>
|
||||
<span className="ic-pager-info">{safePage + 1} / {totalPages}</span>
|
||||
<button
|
||||
className="ic-pager-btn"
|
||||
onClick={() => setPage((p) => Math.min(totalPages - 1, p + 1))}
|
||||
disabled={safePage >= totalPages - 1}
|
||||
aria-label="다음 키워드"
|
||||
>→</button>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
||||
194
src/pages/lotto/Evolver.css
Normal file
194
src/pages/lotto/Evolver.css
Normal file
@@ -0,0 +1,194 @@
|
||||
/* Evolver tab — dark theme matching Lotto.css patterns */
|
||||
|
||||
.lotto-evolver { display: flex; flex-direction: column; gap: 16px; }
|
||||
.lotto-evolver-muted { color: #94a3b8; }
|
||||
|
||||
.lotto-evolver-intro {
|
||||
display: flex; justify-content: space-between; align-items: center;
|
||||
gap: 12px; flex-wrap: wrap;
|
||||
}
|
||||
.lotto-evolver-sub { margin: 0; color: #94a3b8; font-size: 0.9rem; flex: 1; }
|
||||
.lotto-evolver-refresh {
|
||||
padding: 6px 12px;
|
||||
background: rgba(255,255,255,0.06);
|
||||
border: 1px solid rgba(255,255,255,0.1);
|
||||
border-radius: 6px;
|
||||
color: #cbd5e1;
|
||||
cursor: pointer;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.lotto-evolver-refresh:hover { background: rgba(255,255,255,0.1); }
|
||||
|
||||
/* Generic card */
|
||||
.evolver-card {
|
||||
background: rgba(255,255,255,0.04);
|
||||
border: 1px solid rgba(255,255,255,0.08);
|
||||
border-radius: 12px;
|
||||
padding: 18px 20px;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
.evolver-card h2 {
|
||||
margin: 0 0 12px;
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: #f1f5f9;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.evolver-card .badge {
|
||||
background: rgba(52,211,153,0.15);
|
||||
color: #34d399;
|
||||
padding: 2px 10px;
|
||||
border-radius: 4px;
|
||||
font-size: 0.7rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
.evolver-card.empty .muted, .evolver-card .muted { color: #64748b; }
|
||||
|
||||
.lotto-evolver-empty h3 { margin: 0 0 6px; color: #f1f5f9; }
|
||||
.lotto-evolver-empty p { color: #94a3b8; margin: 0 0 12px; }
|
||||
|
||||
/* WinnerCard */
|
||||
.winner-card .winner-meta {
|
||||
display: flex; gap: 16px; flex-wrap: wrap;
|
||||
color: #94a3b8; font-size: 0.85rem; margin-bottom: 14px;
|
||||
}
|
||||
.winner-card .winner-meta strong { color: #f1f5f9; font-weight: 600; }
|
||||
.winner-card .winner-chart { background: rgba(0,0,0,0.15); border-radius: 8px; padding: 8px; }
|
||||
|
||||
/* TrialsGrid */
|
||||
.trials-grid .grid {
|
||||
display: grid; grid-template-columns: repeat(6, 1fr);
|
||||
gap: 8px; height: 140px; align-items: end;
|
||||
}
|
||||
.trial-cell {
|
||||
border: 1px solid rgba(255,255,255,0.06);
|
||||
background: rgba(255,255,255,0.03);
|
||||
border-radius: 6px;
|
||||
padding: 8px 4px;
|
||||
display: flex; flex-direction: column;
|
||||
align-items: center; justify-content: end;
|
||||
cursor: pointer;
|
||||
height: 100%;
|
||||
color: #cbd5e1;
|
||||
transition: background 0.15s;
|
||||
}
|
||||
.trial-cell:hover { background: rgba(255,255,255,0.06); }
|
||||
.trial-cell.winner { background: rgba(52,211,153,0.12); border-color: rgba(52,211,153,0.3); }
|
||||
.trial-cell .bar {
|
||||
width: 80%;
|
||||
background: #475569;
|
||||
border-radius: 3px 3px 0 0;
|
||||
min-height: 4px;
|
||||
}
|
||||
.trial-cell.winner .bar { background: #34d399; }
|
||||
.trial-cell .label { font-size: 0.85rem; margin-top: 6px; color: #e2e8f0; }
|
||||
.trial-cell .max-correct { font-size: 0.7rem; color: #94a3b8; }
|
||||
.trial-detail {
|
||||
margin-top: 14px; padding: 12px;
|
||||
background: rgba(0,0,0,0.15);
|
||||
border-radius: 6px;
|
||||
color: #cbd5e1;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.trial-detail h3 { margin: 0 0 8px; font-size: 0.9rem; color: #f1f5f9; }
|
||||
.trial-detail ul { margin: 8px 0 0; padding-left: 18px; }
|
||||
.trial-detail li { margin-bottom: 4px; }
|
||||
|
||||
/* BaseDiff */
|
||||
.base-diff .diff-grid {
|
||||
display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
|
||||
}
|
||||
.metric-card {
|
||||
padding: 12px 8px;
|
||||
background: rgba(255,255,255,0.03);
|
||||
border: 1px solid rgba(255,255,255,0.06);
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
color: #cbd5e1;
|
||||
}
|
||||
.metric-card .metric-name {
|
||||
color: #94a3b8;
|
||||
font-size: 0.7rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
.metric-card .metric-values { margin: 6px 0; font-size: 0.8rem; }
|
||||
.metric-card .metric-values strong { color: #f1f5f9; }
|
||||
.metric-card .metric-diff { font-weight: 600; font-size: 0.8rem; }
|
||||
.metric-card.up .metric-diff, .metric-card.up-big .metric-diff { color: #34d399; }
|
||||
.metric-card.down .metric-diff, .metric-card.down-big .metric-diff { color: #f87171; }
|
||||
.metric-card.eq .metric-diff { color: #64748b; }
|
||||
|
||||
/* BaseHistory chart container */
|
||||
.base-history { background: rgba(255,255,255,0.04); }
|
||||
|
||||
/* ActivityCard — scrollable */
|
||||
.activity-card .activity-list {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
max-height: 420px;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
.activity-card .activity-list::-webkit-scrollbar { width: 6px; }
|
||||
.activity-card .activity-list::-webkit-scrollbar-thumb {
|
||||
background: rgba(255,255,255,0.15); border-radius: 3px;
|
||||
}
|
||||
.activity-item {
|
||||
display: grid;
|
||||
grid-template-columns: 24px 1fr auto;
|
||||
gap: 10px;
|
||||
padding: 10px 4px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.05);
|
||||
color: #cbd5e1;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.activity-item:last-child { border-bottom: none; }
|
||||
.activity-item .icon { font-size: 1rem; text-align: center; }
|
||||
.activity-item .body .line { color: #e2e8f0; }
|
||||
.activity-item .body strong { color: #f1f5f9; }
|
||||
.activity-item .ts {
|
||||
color: #64748b;
|
||||
font-size: 0.75rem;
|
||||
white-space: nowrap;
|
||||
align-self: center;
|
||||
}
|
||||
.activity-item .status.ok { color: #34d399; }
|
||||
.activity-item .status.err { color: #f87171; }
|
||||
.activity-item .status.pending { color: #fbbf24; }
|
||||
.activity-item .detail { color: #94a3b8; font-size: 0.78rem; margin-top: 2px; }
|
||||
|
||||
/* EvolverActions */
|
||||
.actions-card .action-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
|
||||
.actions-card button {
|
||||
padding: 8px 14px;
|
||||
background: rgba(52,211,153,0.15);
|
||||
color: #34d399;
|
||||
border: 1px solid rgba(52,211,153,0.3);
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
.actions-card button:hover:not(:disabled) { background: rgba(52,211,153,0.25); }
|
||||
.actions-card button:disabled { opacity: 0.5; cursor: wait; }
|
||||
.action-output {
|
||||
background: rgba(0,0,0,0.3);
|
||||
color: #94a3b8;
|
||||
padding: 12px;
|
||||
border-radius: 6px;
|
||||
margin-top: 12px;
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.trials-grid .grid { grid-template-columns: repeat(3, 1fr); height: auto; }
|
||||
.base-diff .diff-grid { grid-template-columns: repeat(3, 1fr); }
|
||||
.lotto-evolver-intro { flex-direction: column; align-items: stretch; }
|
||||
.activity-card .activity-list { max-height: 360px; }
|
||||
}
|
||||
7
src/pages/lotto/Evolver.jsx
Normal file
7
src/pages/lotto/Evolver.jsx
Normal file
@@ -0,0 +1,7 @@
|
||||
import React from 'react';
|
||||
import Lotto from './Lotto';
|
||||
|
||||
// /lotto/evolver URL → Lotto 페이지가 useLocation으로 활성 탭 자동 선택
|
||||
export default function Evolver() {
|
||||
return <Lotto />;
|
||||
}
|
||||
@@ -2,6 +2,7 @@ import { useCallback, useState } from 'react';
|
||||
import BriefingTab from './tabs/BriefingTab';
|
||||
import AnalysisTab from './tabs/AnalysisTab';
|
||||
import PurchaseTab from './tabs/PurchaseTab';
|
||||
import EvolverTab from './tabs/EvolverTab';
|
||||
import { useIsMobile } from '../../hooks/useIsMobile';
|
||||
import SwipeableView from '../../components/SwipeableView';
|
||||
|
||||
@@ -9,10 +10,19 @@ const TABS = [
|
||||
{ id: 'briefing', label: '🗓 이번 주 브리핑' },
|
||||
{ id: 'analysis', label: '📚 자료실 / Deep Dive' },
|
||||
{ id: 'purchase', label: '💰 구매·성과' },
|
||||
{ id: 'evolver', label: '🧬 자율 학습' },
|
||||
];
|
||||
|
||||
export default function Functions() {
|
||||
const [tab, setTab] = useState('briefing');
|
||||
function renderTab(id) {
|
||||
if (id === 'briefing') return <BriefingTab />;
|
||||
if (id === 'analysis') return <AnalysisTab />;
|
||||
if (id === 'purchase') return <PurchaseTab />;
|
||||
if (id === 'evolver') return <EvolverTab />;
|
||||
return null;
|
||||
}
|
||||
|
||||
export default function Functions({ initialTab = 'briefing' }) {
|
||||
const [tab, setTab] = useState(initialTab);
|
||||
const isMobile = useIsMobile();
|
||||
|
||||
const tabIndex = TABS.findIndex(t => t.id === tab);
|
||||
@@ -28,7 +38,7 @@ export default function Functions() {
|
||||
tabs={TABS.map(t => ({
|
||||
key: t.id,
|
||||
label: t.label,
|
||||
content: t.id === 'briefing' ? <BriefingTab /> : t.id === 'analysis' ? <AnalysisTab /> : <PurchaseTab />,
|
||||
content: renderTab(t.id),
|
||||
}))}
|
||||
activeIndex={tabIndex}
|
||||
onTabChange={handleTabChange}
|
||||
@@ -45,9 +55,7 @@ export default function Functions() {
|
||||
))}
|
||||
</nav>
|
||||
<div className="lotto-tab-body">
|
||||
{tab === 'briefing' && <BriefingTab />}
|
||||
{tab === 'analysis' && <AnalysisTab />}
|
||||
{tab === 'purchase' && <PurchaseTab />}
|
||||
{renderTab(tab)}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
@@ -1,8 +1,12 @@
|
||||
import React from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import Functions from './Functions';
|
||||
import './Lotto.css';
|
||||
|
||||
const Lotto = () => {
|
||||
const location = useLocation();
|
||||
const initialTab = location.pathname.endsWith('/evolver') ? 'evolver' : 'briefing';
|
||||
|
||||
return (
|
||||
<div className="lotto">
|
||||
<header className="lotto-header">
|
||||
@@ -15,16 +19,17 @@ const Lotto = () => {
|
||||
</p>
|
||||
</div>
|
||||
<div className="lotto-card">
|
||||
<p className="lotto-card__title">시뮬레이션 추천 시스템</p>
|
||||
<p className="lotto-card__title">자율 학습 시뮬레이션</p>
|
||||
<ul>
|
||||
<li>하루 6회 몬테카를로 시뮬레이션 자동 실행</li>
|
||||
<li>20,000개 후보를 5가지 통계 기법으로 스코어링</li>
|
||||
<li>핫·콜드·오버듀 번호 통계 분석 제공</li>
|
||||
<li>매주 6가지 가중치 시도 → 토요일 회고로 best base 학습</li>
|
||||
<li>능동 시그널 모니터링 (Sim·Drift·Confidence z-score) + 텔레그램 알림</li>
|
||||
<li>4시간마다 몬테카를로 20,000 후보 × 5종 점수 가중 평가</li>
|
||||
<li>AI 큐레이터 + 핫·콜드·오버듀 통계 분석</li>
|
||||
</ul>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<Functions />
|
||||
<Functions initialTab={initialTab} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
44
src/pages/lotto/evolver/BaseDiff.jsx
Normal file
44
src/pages/lotto/evolver/BaseDiff.jsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import React from 'react';
|
||||
|
||||
const METRIC_NAMES = ['freq', 'finger', 'gap', 'cooccur', 'divers'];
|
||||
|
||||
function diffMarker(diff) {
|
||||
if (Math.abs(diff) < 0.005) return { mark: '=', cls: 'eq' };
|
||||
if (diff > 0) return diff < 0.05 ? { mark: '↑', cls: 'up' } : { mark: '↑↑', cls: 'up-big' };
|
||||
return diff > -0.05 ? { mark: '↓', cls: 'down' } : { mark: '↓↓', cls: 'down-big' };
|
||||
}
|
||||
|
||||
export default function BaseDiff({ previousBase, newBase, updateReason }) {
|
||||
if (!previousBase || !newBase) {
|
||||
return (
|
||||
<div className="evolver-card base-diff empty">
|
||||
<h2>다음주 base 변경</h2>
|
||||
<p className="muted">아직 base 변경 이력 없음.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div className="evolver-card base-diff">
|
||||
<h2>다음주 base 변경 {updateReason && <span className="badge">{updateReason}</span>}</h2>
|
||||
<div className="diff-grid">
|
||||
{METRIC_NAMES.map((name, i) => {
|
||||
const prev = previousBase[i] || 0;
|
||||
const next = newBase[i] || 0;
|
||||
const diff = next - prev;
|
||||
const { mark, cls } = diffMarker(diff);
|
||||
return (
|
||||
<div key={name} className={`metric-card ${cls}`}>
|
||||
<div className="metric-name">{name}</div>
|
||||
<div className="metric-values">
|
||||
{prev.toFixed(2)} → <strong>{next.toFixed(2)}</strong>
|
||||
</div>
|
||||
<div className="metric-diff">
|
||||
{mark} {diff >= 0 ? '+' : ''}{(diff * 100).toFixed(0)}%p
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
48
src/pages/lotto/evolver/BaseHistory.jsx
Normal file
48
src/pages/lotto/evolver/BaseHistory.jsx
Normal file
@@ -0,0 +1,48 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer,
|
||||
} from 'recharts';
|
||||
|
||||
const METRIC_NAMES = ['freq', 'finger', 'gap', 'cooccur', 'divers'];
|
||||
const COLORS = ['#34d399', '#60a5fa', '#fbbf24', '#f43f5e', '#c084fc'];
|
||||
|
||||
export default function BaseHistory({ history }) {
|
||||
if (!history || history.length === 0) {
|
||||
return (
|
||||
<div className="evolver-card base-history empty">
|
||||
<h2>12주 Base 변화</h2>
|
||||
<p className="muted">학습 이력이 부족합니다.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const data = history
|
||||
.slice()
|
||||
.reverse()
|
||||
.map(h => {
|
||||
const w = h.weight || [0, 0, 0, 0, 0];
|
||||
return {
|
||||
date: (h.effective_from || '').slice(5),
|
||||
freq: w[0], finger: w[1], gap: w[2], cooccur: w[3], divers: w[4],
|
||||
reason: h.update_reason,
|
||||
};
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="evolver-card base-history">
|
||||
<h2>Base 변화 (최근 {history.length}주)</h2>
|
||||
<ResponsiveContainer width="100%" height={280}>
|
||||
<LineChart data={data}>
|
||||
<CartesianGrid strokeDasharray="3 3" />
|
||||
<XAxis dataKey="date" />
|
||||
<YAxis domain={[0, 0.5]} />
|
||||
<Tooltip />
|
||||
<Legend />
|
||||
{METRIC_NAMES.map((name, i) => (
|
||||
<Line key={name} type="monotone" dataKey={name} stroke={COLORS[i]} dot />
|
||||
))}
|
||||
</LineChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
src/pages/lotto/evolver/EvolverActions.jsx
Normal file
37
src/pages/lotto/evolver/EvolverActions.jsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import React, { useState } from 'react';
|
||||
import { triggerEvolverGenerate, triggerEvolverEvaluate } from '../../../api';
|
||||
|
||||
export default function EvolverActions({ onChange }) {
|
||||
const [busy, setBusy] = useState(null);
|
||||
const [out, setOut] = useState(null);
|
||||
|
||||
async function run(kind) {
|
||||
setBusy(kind);
|
||||
setOut(null);
|
||||
try {
|
||||
const fn = kind === 'generate' ? triggerEvolverGenerate : triggerEvolverEvaluate;
|
||||
const res = await fn();
|
||||
setOut(res);
|
||||
onChange && onChange();
|
||||
} catch (e) {
|
||||
setOut({ error: String(e) });
|
||||
} finally {
|
||||
setBusy(null);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="evolver-card actions-card">
|
||||
<h2>수동 트리거 (dev)</h2>
|
||||
<div className="action-buttons">
|
||||
<button disabled={!!busy} onClick={() => run('generate')}>
|
||||
{busy === 'generate' ? '생성 중...' : 'generate-now (월요일 후보 생성)'}
|
||||
</button>
|
||||
<button disabled={!!busy} onClick={() => run('evaluate')}>
|
||||
{busy === 'evaluate' ? '평가 중...' : 'evaluate-now (회고 + base 갱신)'}
|
||||
</button>
|
||||
</div>
|
||||
{out && <pre className="action-output">{JSON.stringify(out, null, 2)}</pre>}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
91
src/pages/lotto/evolver/LottoActivityTimeline.jsx
Normal file
91
src/pages/lotto/evolver/LottoActivityTimeline.jsx
Normal file
@@ -0,0 +1,91 @@
|
||||
import React from 'react';
|
||||
|
||||
const ICONS = {
|
||||
curate_weekly: '📋',
|
||||
signal_check: '🔍',
|
||||
daily_digest: '📊',
|
||||
weekly_evolution_report: '🧬',
|
||||
evolver_generate: '🌱',
|
||||
evolver_apply: '🎲',
|
||||
};
|
||||
|
||||
const STATUS_CLS = {
|
||||
succeeded: 'ok',
|
||||
failed: 'err',
|
||||
working: 'pending',
|
||||
pending: 'pending',
|
||||
};
|
||||
|
||||
function formatTaskDetail(t) {
|
||||
const r = t.result_data || {};
|
||||
switch (t.task_type) {
|
||||
case 'signal_check': return `${r.source} → ${r.overall_fire} (${r.n_results} results)`;
|
||||
case 'daily_digest': return `평가 ${r.evaluated} / 발화 ${r.fired}`;
|
||||
case 'weekly_evolution_report': return `draw=${r.draw_no} reason=${r.update_reason}`;
|
||||
case 'evolver_apply': return `${r.n_picks}세트 추출`;
|
||||
case 'evolver_generate': return `${r.trials_count} trials 생성`;
|
||||
case 'curate_weekly': return `draw=${r.draw_no || '?'} conf=${r.confidence || '?'}`;
|
||||
default: return '';
|
||||
}
|
||||
}
|
||||
|
||||
function renderItem(item) {
|
||||
const ts = (item.ts || '').replace('T', ' ').slice(0, 19);
|
||||
if (item.kind === 'task') {
|
||||
const t = item.payload;
|
||||
const icon = ICONS[t.task_type] || '⚙️';
|
||||
const cls = STATUS_CLS[t.status] || '';
|
||||
const detail = formatTaskDetail(t);
|
||||
return (
|
||||
<li key={`task-${t.id}`} className={`activity-item task ${cls}`}>
|
||||
<span className="icon">{icon}</span>
|
||||
<div className="body">
|
||||
<div className="line"><strong>{t.task_type}</strong> · <span className={`status ${cls}`}>{t.status}</span></div>
|
||||
{detail && <div className="detail">{detail}</div>}
|
||||
</div>
|
||||
<span className="ts">{ts}</span>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
if (item.kind === 'log') {
|
||||
const l = item.payload;
|
||||
return (
|
||||
<li key={`log-${l.id}`} className={`activity-item log level-${l.level}`}>
|
||||
<span className="icon">{l.level === 'error' ? '❌' : l.level === 'warning' ? '⚠️' : '·'}</span>
|
||||
<div className="body"><div className="line">{l.message}</div></div>
|
||||
<span className="ts">{ts}</span>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
if (item.kind === 'evolver') {
|
||||
const e = item.payload;
|
||||
return (
|
||||
<li key={`evolver-${e.id}`} className="activity-item evolver">
|
||||
<span className="icon">⚖️</span>
|
||||
<div className="body">
|
||||
<div className="line"><strong>weight_evolver_eval</strong> (lotto-lab)</div>
|
||||
<div className="detail">reason={e.update_reason} winner_max={e.winner_max_correct}</div>
|
||||
</div>
|
||||
<span className="ts">{ts}</span>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export default function LottoActivityTimeline({ activity = [], days = 7 }) {
|
||||
if (!activity || activity.length === 0) {
|
||||
return (
|
||||
<div className="evolver-card activity-card empty">
|
||||
<h2>최근 활동</h2>
|
||||
<p className="muted">지난 {days}일 활동 없음.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<div className="evolver-card activity-card">
|
||||
<h2>최근 {days}일 에이전트 활동 ({activity.length})</h2>
|
||||
<ul className="activity-list">{activity.map(renderItem)}</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
56
src/pages/lotto/evolver/TrialsGrid.jsx
Normal file
56
src/pages/lotto/evolver/TrialsGrid.jsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import React, { useState } from 'react';
|
||||
|
||||
const DAY_NAMES = ['월', '화', '수', '목', '금', '토'];
|
||||
|
||||
export default function TrialsGrid({ trials, perDay, winnerTrialId }) {
|
||||
const [expanded, setExpanded] = useState(null);
|
||||
|
||||
const byDow = {};
|
||||
for (const t of trials || []) byDow[t.day_of_week] = t;
|
||||
|
||||
const perDayByDow = {};
|
||||
for (const d of perDay || []) perDayByDow[d.day_of_week] = d;
|
||||
|
||||
const maxScore = Math.max(...(perDay || []).map(d => d.avg_score || 0), 0.001);
|
||||
|
||||
return (
|
||||
<div className="evolver-card trials-grid">
|
||||
<h2>이번주 6일 Trials</h2>
|
||||
<div className="grid">
|
||||
{DAY_NAMES.map((name, dow) => {
|
||||
const trial = byDow[dow];
|
||||
const day = perDayByDow[dow];
|
||||
const isWinner = trial && trial.id === winnerTrialId;
|
||||
const heightPct = day ? (day.avg_score / maxScore) * 100 : 0;
|
||||
return (
|
||||
<button
|
||||
key={dow}
|
||||
type="button"
|
||||
className={`trial-cell ${isWinner ? 'winner' : ''} ${expanded === dow ? 'expanded' : ''}`}
|
||||
onClick={() => setExpanded(expanded === dow ? null : dow)}
|
||||
>
|
||||
<div className="bar" style={{ height: `${heightPct}%` }} />
|
||||
<span className="label">{name}{isWinner && '⭐'}</span>
|
||||
{day && <span className="max-correct">max={day.max_correct}</span>}
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
{expanded !== null && byDow[expanded] && (
|
||||
<div className="trial-detail">
|
||||
<h3>{DAY_NAMES[expanded]}요일 상세</h3>
|
||||
<p>W = [{(byDow[expanded].weight || []).map(w => w.toFixed(2)).join(', ')}]</p>
|
||||
<ul>
|
||||
{(byDow[expanded].picks || []).map(p => (
|
||||
<li key={p.id}>
|
||||
{(p.numbers || []).join(', ')} —
|
||||
score {(p.meta_score || 0).toFixed(3)}
|
||||
{p.correct != null && ` · 적중 ${p.correct}개`}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
56
src/pages/lotto/evolver/WinnerCard.jsx
Normal file
56
src/pages/lotto/evolver/WinnerCard.jsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
RadarChart, PolarGrid, PolarAngleAxis, PolarRadiusAxis,
|
||||
Radar, ResponsiveContainer, Legend,
|
||||
} from 'recharts';
|
||||
|
||||
const DAY_NAMES = ['월', '화', '수', '목', '금', '토'];
|
||||
const METRIC_NAMES = ['freq', 'finger', 'gap', 'cooccur', 'divers'];
|
||||
|
||||
export default function WinnerCard({ winner, previousBase, updateReason, drawNo }) {
|
||||
if (!winner) {
|
||||
return (
|
||||
<div className="evolver-card winner-card empty">
|
||||
<h2>🏆 Winner</h2>
|
||||
<p className="muted">아직 회고 결과가 없습니다.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const dayName = DAY_NAMES[winner.day_of_week] || '?';
|
||||
const W = winner.weight || [];
|
||||
const prev = previousBase || [0.2, 0.2, 0.2, 0.2, 0.2];
|
||||
|
||||
const data = METRIC_NAMES.map((name, i) => ({
|
||||
metric: name,
|
||||
winner: W[i] || 0,
|
||||
previous: prev[i] || 0,
|
||||
}));
|
||||
|
||||
return (
|
||||
<div className="evolver-card winner-card">
|
||||
<header>
|
||||
<h2>🏆 Winner: {dayName}요일</h2>
|
||||
{updateReason && <span className="badge">{updateReason}</span>}
|
||||
</header>
|
||||
<div className="winner-meta">
|
||||
<span>최고 적중 <strong>{winner.max_correct}개</strong></span>
|
||||
<span>평균 점수 <strong>{(winner.avg_score || 0).toFixed(2)}</strong></span>
|
||||
<span>{winner.n_picks}/5 picks</span>
|
||||
{drawNo && <span>{drawNo}회차</span>}
|
||||
</div>
|
||||
<div className="winner-chart">
|
||||
<ResponsiveContainer width="100%" height={300}>
|
||||
<RadarChart data={data}>
|
||||
<PolarGrid />
|
||||
<PolarAngleAxis dataKey="metric" />
|
||||
<PolarRadiusAxis angle={90} domain={[0, 0.5]} />
|
||||
<Radar name="이번주 winner" dataKey="winner" stroke="#34d399" fill="#34d399" fillOpacity={0.4} />
|
||||
<Radar name="이전 base" dataKey="previous" stroke="#999" fill="#999" fillOpacity={0.1} />
|
||||
<Legend />
|
||||
</RadarChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
60
src/pages/lotto/evolver/useEvolverApi.js
Normal file
60
src/pages/lotto/evolver/useEvolverApi.js
Normal file
@@ -0,0 +1,60 @@
|
||||
import { useEffect, useState, useCallback } from 'react';
|
||||
import {
|
||||
fetchEvolverStatus,
|
||||
fetchEvolverHistory,
|
||||
fetchLottoTasks,
|
||||
fetchLottoLogs,
|
||||
} from '../../../api';
|
||||
|
||||
|
||||
function mergeActivityStream({ logs, tasks, evolverEvents }) {
|
||||
const stream = [];
|
||||
for (const l of logs.items || []) {
|
||||
stream.push({ ts: l.created_at, kind: 'log', payload: l });
|
||||
}
|
||||
for (const t of tasks.items || tasks.tasks || []) {
|
||||
stream.push({ ts: t.created_at, kind: 'task', payload: t });
|
||||
}
|
||||
for (const e of evolverEvents) {
|
||||
stream.push({ ts: e.created_at, kind: 'evolver', payload: e });
|
||||
}
|
||||
stream.sort((a, b) => (b.ts || '').localeCompare(a.ts || ''));
|
||||
return stream;
|
||||
}
|
||||
|
||||
|
||||
export function useEvolverApi({ days = 7, weeks = 12 } = {}) {
|
||||
const [status, setStatus] = useState(null);
|
||||
const [history, setHistory] = useState({ items: [] });
|
||||
const [activity, setActivity] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
const refetch = useCallback(async () => {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
try {
|
||||
const [s, h, t, l] = await Promise.all([
|
||||
fetchEvolverStatus(),
|
||||
fetchEvolverHistory(weeks),
|
||||
fetchLottoTasks({ days }),
|
||||
fetchLottoLogs({ days }),
|
||||
]);
|
||||
setStatus(s);
|
||||
setHistory(h);
|
||||
setActivity(mergeActivityStream({
|
||||
logs: l,
|
||||
tasks: t,
|
||||
evolverEvents: h.items || [],
|
||||
}));
|
||||
} catch (e) {
|
||||
setError(e);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [days, weeks]);
|
||||
|
||||
useEffect(() => { refetch(); }, [refetch]);
|
||||
|
||||
return { status, history, activity, loading, error, refetch };
|
||||
}
|
||||
78
src/pages/lotto/tabs/EvolverTab.jsx
Normal file
78
src/pages/lotto/tabs/EvolverTab.jsx
Normal file
@@ -0,0 +1,78 @@
|
||||
import React from 'react';
|
||||
import '../Evolver.css';
|
||||
import { useEvolverApi } from '../evolver/useEvolverApi';
|
||||
import WinnerCard from '../evolver/WinnerCard';
|
||||
import TrialsGrid from '../evolver/TrialsGrid';
|
||||
import BaseDiff from '../evolver/BaseDiff';
|
||||
import BaseHistory from '../evolver/BaseHistory';
|
||||
import LottoActivityTimeline from '../evolver/LottoActivityTimeline';
|
||||
import EvolverActions from '../evolver/EvolverActions';
|
||||
|
||||
export default function EvolverTab() {
|
||||
const { status, history, activity, loading, error, refetch } = useEvolverApi({ days: 7, weeks: 12 });
|
||||
|
||||
if (loading) return <div className="lotto-evolver"><p className="lotto-evolver-muted">로딩 중...</p></div>;
|
||||
if (error) return <div className="lotto-evolver"><p className="lotto-evolver-muted">에러: {String(error)}</p></div>;
|
||||
|
||||
const latestBase = (history.items || [])[0];
|
||||
const previousBase = (history.items || [])[1]?.weight || status?.current_base || [0.2, 0.2, 0.2, 0.2, 0.2];
|
||||
const newBase = latestBase?.weight || status?.current_base;
|
||||
|
||||
const trials = status?.trials || [];
|
||||
const winnerTrialId = latestBase?.source_trial_id;
|
||||
const winnerTrial = trials.find(t => t.id === winnerTrialId);
|
||||
const winnerInfo = winnerTrial ? {
|
||||
day_of_week: winnerTrial.day_of_week,
|
||||
weight: winnerTrial.weight,
|
||||
avg_score: latestBase?.winner_score,
|
||||
max_correct: latestBase?.winner_max_correct,
|
||||
n_picks: (winnerTrial.picks || []).length,
|
||||
} : null;
|
||||
|
||||
const perDay = trials.map(t => ({
|
||||
day_of_week: t.day_of_week,
|
||||
trial_id: t.id,
|
||||
avg_score: (t.picks || []).reduce((s, p) => s + (p.meta_score || 0), 0) / Math.max(1, (t.picks || []).length),
|
||||
max_correct: Math.max(0, ...(t.picks || []).map(p => p.correct || 0)),
|
||||
}));
|
||||
|
||||
const hasBase = (history.items || []).length > 0;
|
||||
|
||||
return (
|
||||
<div className="lotto-evolver">
|
||||
<div className="lotto-evolver-intro">
|
||||
<p className="lotto-evolver-sub">
|
||||
매주 6가지 가중치를 시도해서 best 조합을 다음주 base로 학습합니다.
|
||||
{status?.latest_draw && ` 마지막 회차: ${status.latest_draw}회.`}
|
||||
</p>
|
||||
<button className="lotto-evolver-refresh" onClick={refetch}>↻ 새로고침</button>
|
||||
</div>
|
||||
|
||||
{!hasBase ? (
|
||||
<div className="evolver-card lotto-evolver-empty">
|
||||
<h3>아직 학습 시작 전</h3>
|
||||
<p>다음 월요일 09:00에 자동 시작 또는 수동 트리거 사용.</p>
|
||||
<EvolverActions onChange={refetch} />
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<WinnerCard
|
||||
winner={winnerInfo}
|
||||
previousBase={previousBase}
|
||||
updateReason={latestBase?.update_reason}
|
||||
drawNo={status?.latest_draw}
|
||||
/>
|
||||
<TrialsGrid trials={trials} perDay={perDay} winnerTrialId={winnerTrialId} />
|
||||
<BaseDiff
|
||||
previousBase={previousBase}
|
||||
newBase={newBase}
|
||||
updateReason={latestBase?.update_reason}
|
||||
/>
|
||||
<BaseHistory history={history.items || []} />
|
||||
<LottoActivityTimeline activity={activity} days={7} />
|
||||
<EvolverActions onChange={refetch} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -3,7 +3,7 @@ import {
|
||||
getPortfolio, addPortfolio, updatePortfolio, deletePortfolio,
|
||||
upsertCash, deleteCash,
|
||||
} from '../../../api';
|
||||
import { emptyPortfolioForm } from '../stockUtils';
|
||||
import { emptyPortfolioForm, computeBrokerSummary } from '../stockUtils';
|
||||
|
||||
export default function usePortfolio() {
|
||||
const [portfolio, setPortfolio] = useState(null);
|
||||
@@ -38,7 +38,12 @@ export default function usePortfolio() {
|
||||
|
||||
/* derived */
|
||||
const portfolioHoldings = portfolio?.holdings ?? [];
|
||||
const portfolioSummary = portfolio?.summary ?? {};
|
||||
// 총 매입은 "각 종목 매입가의 단순 합(수량 미곱산)"으로 표시 (박재오 정의).
|
||||
// 백엔드 summary.total_buy(매입가×수량)는 무시하고 프론트에서 재계산해
|
||||
// 요약카드·증권사별·AI 프롬프트가 모두 같은 값을 쓰도록 통일.
|
||||
const portfolioSummary = portfolioHoldings.length
|
||||
? { ...(portfolio?.summary ?? {}), total_buy: computeBrokerSummary(portfolioHoldings).totalBuy }
|
||||
: (portfolio?.summary ?? {});
|
||||
const cashList = portfolio?.cash ?? [];
|
||||
const totalCash = portfolioSummary.total_cash ?? null;
|
||||
const totalAssets = portfolioSummary.total_assets ?? null;
|
||||
@@ -69,23 +74,7 @@ export default function usePortfolio() {
|
||||
return map;
|
||||
}, [brokerGroups]);
|
||||
|
||||
const getBrokerSummary = (items) => {
|
||||
// totalBuy: 요약 표시용 (매입가 purchase_price 기준)
|
||||
// totalCostBasis: 손익 계산용 (평균단가 avg_price 기준)
|
||||
let totalBuy = 0, totalCostBasis = 0, totalEvalAmt = 0, hasNullPrice = false;
|
||||
for (const item of items) {
|
||||
const qty = item.quantity ?? 0;
|
||||
const purchase = item.purchase_price ?? item.avg_price ?? 0;
|
||||
// 총 매입 = 종목별 매입가의 단순 합 (수량 미곱산)
|
||||
totalBuy += purchase;
|
||||
totalCostBasis += (item.avg_price ?? 0) * qty;
|
||||
if (item.eval_amount != null) totalEvalAmt += item.eval_amount;
|
||||
else hasNullPrice = true;
|
||||
}
|
||||
const totalProfit = totalEvalAmt - totalCostBasis;
|
||||
const totalProfitRate = totalCostBasis > 0 ? (totalProfit / totalCostBasis) * 100 : 0;
|
||||
return { totalBuy, totalEval: totalEvalAmt, totalProfit, totalProfitRate, hasNullPrice };
|
||||
};
|
||||
const getBrokerSummary = computeBrokerSummary;
|
||||
|
||||
/* loaders */
|
||||
const loadPortfolio = useCallback(async () => {
|
||||
|
||||
@@ -125,6 +125,25 @@ export const emptySellForm = () => ({
|
||||
sold_at: toLocalDatetimeValue(new Date().toISOString()),
|
||||
});
|
||||
|
||||
/* ── 증권사별 요약 집계 ──────────────────────────────────────────── */
|
||||
// totalBuy: 총 매입 = 각 종목 매입가(purchase_price)의 단순 합 (수량 미곱산, 박재오 정의).
|
||||
// 매입가 미설정 시 avg_price 폴백. 백엔드 total_buy(×수량)는 표시에 쓰지 않음.
|
||||
// totalCostBasis: 손익 계산용 매입원가 = SUM(avg_price × quantity) — 손익은 수량 곱산 유지.
|
||||
export const computeBrokerSummary = (items) => {
|
||||
let totalBuy = 0, totalCostBasis = 0, totalEval = 0, hasNullPrice = false;
|
||||
for (const item of items) {
|
||||
const qty = item.quantity ?? 0;
|
||||
const purchase = item.purchase_price ?? item.avg_price ?? 0;
|
||||
totalBuy += purchase;
|
||||
totalCostBasis += (item.avg_price ?? 0) * qty;
|
||||
if (item.eval_amount != null) totalEval += item.eval_amount;
|
||||
else hasNullPrice = true;
|
||||
}
|
||||
const totalProfit = totalEval - totalCostBasis;
|
||||
const totalProfitRate = totalCostBasis > 0 ? (totalProfit / totalCostBasis) * 100 : 0;
|
||||
return { totalBuy, totalEval, totalProfit, totalProfitRate, hasNullPrice };
|
||||
};
|
||||
|
||||
/* ── TAB IDs ─────────────────────────────────────────────────────── */
|
||||
|
||||
export const TAB_PORTFOLIO = 'portfolio';
|
||||
|
||||
48
src/pages/stock/stockUtils.test.js
Normal file
48
src/pages/stock/stockUtils.test.js
Normal file
@@ -0,0 +1,48 @@
|
||||
import { describe, it, expect } from 'vitest';
|
||||
import { computeBrokerSummary } from './stockUtils.js';
|
||||
|
||||
describe('computeBrokerSummary - 총 매입(total_buy) 계산', () => {
|
||||
it('총 매입 = 각 종목 매입가(purchase_price)의 단순 합 (수량 미곱산)', () => {
|
||||
const items = [
|
||||
{ quantity: 100, avg_price: 72000, purchase_price: 70000, eval_amount: 7450000 },
|
||||
];
|
||||
// 매입가 70000 (수량 곱하지 않음)
|
||||
expect(computeBrokerSummary(items).totalBuy).toBe(70_000);
|
||||
});
|
||||
|
||||
it('purchase_price 미설정 시 avg_price로 폴백 (단순 합)', () => {
|
||||
const items = [
|
||||
{ quantity: 100, avg_price: 72000, purchase_price: null, eval_amount: 7450000 },
|
||||
];
|
||||
// 매입가 미입력 → 평균단가 72000 폴백
|
||||
expect(computeBrokerSummary(items).totalBuy).toBe(72_000);
|
||||
});
|
||||
|
||||
it('여러 종목 합산: 각 매입가의 단순 합', () => {
|
||||
const items = [
|
||||
{ quantity: 100, avg_price: 70000, purchase_price: 70000, eval_amount: 7500000 },
|
||||
{ quantity: 50, avg_price: 130000, purchase_price: 130000, eval_amount: 6800000 },
|
||||
];
|
||||
// 70000 + 130000 = 200,000 (수량 미곱산)
|
||||
expect(computeBrokerSummary(items).totalBuy).toBe(200_000);
|
||||
});
|
||||
|
||||
it('손익 = 총 평가 - 매입원가(avg_price × qty) — 손익은 수량 곱산 유지', () => {
|
||||
const items = [
|
||||
{ quantity: 10, avg_price: 100000, purchase_price: 90000, eval_amount: 1_200_000 },
|
||||
];
|
||||
const s = computeBrokerSummary(items);
|
||||
// cost_basis = 100000 × 10 = 1,000,000; profit = 1,200,000 - 1,000,000 = 200,000
|
||||
expect(s.totalEval).toBe(1_200_000);
|
||||
expect(s.totalProfit).toBe(200_000);
|
||||
expect(s.totalProfitRate).toBeCloseTo(20, 5);
|
||||
expect(s.hasNullPrice).toBe(false);
|
||||
});
|
||||
|
||||
it('eval_amount가 null인 종목이 있으면 hasNullPrice=true', () => {
|
||||
const items = [
|
||||
{ quantity: 10, avg_price: 100000, purchase_price: 100000, eval_amount: null },
|
||||
];
|
||||
expect(computeBrokerSummary(items).hasNullPrice).toBe(true);
|
||||
});
|
||||
});
|
||||
@@ -16,6 +16,7 @@ import {
|
||||
const Home = lazy(() => import('./pages/home/Home'));
|
||||
const Blog = lazy(() => import('./pages/blog/Blog'));
|
||||
const Lotto = lazy(() => import('./pages/lotto/Lotto'));
|
||||
const Evolver = lazy(() => import('./pages/lotto/Evolver'));
|
||||
const Travel = lazy(() => import('./pages/travel/Travel'));
|
||||
const Stock = lazy(() => import('./pages/stock/Stock'));
|
||||
const StockTrade = lazy(() => import('./pages/stock/StockTrade'));
|
||||
@@ -153,6 +154,10 @@ export const appRoutes = [
|
||||
path: 'lotto',
|
||||
element: <Lotto />,
|
||||
},
|
||||
{
|
||||
path: 'lotto/evolver',
|
||||
element: <Evolver />,
|
||||
},
|
||||
{
|
||||
path: 'stock',
|
||||
element: <Stock />,
|
||||
|
||||
Reference in New Issue
Block a user