shuim/auto-stock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

대시보드 수정중

Browse Source
This commit is contained in:
shuim
2026-02-27 09:11:49 +09:00
parent c29e7f9716
commit 3585357e0e
2 changed files with 32 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
frontend/src/components/OrderbookPanel.tsx
View File

@@ -15,34 +15,19 @@ const OrderbookPanel = React.memo(({ orderbook }: OrderbookPanelProps) => {
<div className="overflow-y-auto custom-scrollbar flex-1">
{orderbook ? (() => {
const currentPrice = orderbook.current_price
const priceUnit =
currentPrice < 1000 ? 1
: currentPrice < 5000 ? 5
: currentPrice < 10000 ? 10
: currentPrice < 50000 ? 50
: currentPrice < 100000 ? 100
: currentPrice < 500000 ? 500
: 1000
const steps = 10
const sequentialAsks: { price: number; volume: number }[] = []
for (let i = steps; i >= 1; i--) {
const price = currentPrice + priceUnit * i
const existingAsk = orderbook.asks?.find((ask: any) => ask.price === price)
sequentialAsks.push({ price, volume: existingAsk ? existingAsk.volume : 0 })
}
const sequentialBids: { price: number; volume: number }[] = []
for (let i = 1; i <= steps; i++) {
const price = currentPrice - priceUnit * i
const existingBid = orderbook.bids?.find((bid: any) => bid.price === price)
sequentialBids.push({ price, volume: existingBid ? existingBid.volume : 0 })
}
// 높은 가격 → 낮은 가격 순으로 정렬된 매도호가 (최대 10개)
const asks: { price: number; volume: number }[] = [...(orderbook.asks || [])]
.sort((a, b) => b.price - a.price)
.slice(0, 10)
// 높은 가격 → 낮은 가격 순으로 정렬된 매수호가 (최대 10개)
const bids: { price: number; volume: number }[] = [...(orderbook.bids || [])]
.sort((a, b) => b.price - a.price)
.slice(0, 10)
return (
<div className="space-y-2">
<div className="space-y-0.5">
{sequentialAsks.map((ask, i) => (
{asks.map((ask, i) => (
<div key={`ask-${i}`} className="grid grid-cols-3 items-center gap-2 py-1 px-2">
<div className="text-xs text-gray-300 font-medium text-right font-mono">
{ask.volume > 0 ? ask.volume.toLocaleString() : '-'}
@@ -66,11 +51,11 @@ const OrderbookPanel = React.memo(({ orderbook }: OrderbookPanelProps) => {
</div>
)}
</div>
<div className="text-xs text-red-300 mt-1 text-center">연속 호가창</div>
<div className="text-xs text-red-300 mt-1 text-center">실시간 호가창</div>
</div>
<div className="space-y-0.5">
{sequentialBids.map((bid, i) => (
{bids.map((bid, i) => (
<div key={`bid-${i}`} className="grid grid-cols-3 items-center gap-2 py-1 px-2">
<div></div>
<div className="text-sm font-bold text-blue-400 font-mono text-center">

22
frontend/src/pages/Dashboard.tsx
View File

@@ -267,6 +267,26 @@ const Dashboard = () => {
setLiveQuote(null)
}, [selectedStock])
// 실시간 평가손익/총자산 — livePrices 기반 매 틱마다 재계산
const liveSummary = useMemo(() => {
if (!portfolioSummary || !portfolio) return portfolioSummary
const liveValue = portfolio.reduce((sum, s) => {
const price = livePrices[s.stock_code] ?? Number(s.current_price || 0)
return sum + price * Number(s.quantity || 0)
}, 0)
const totalInvestment = portfolio.reduce((sum, s) =>
sum + Number(s.average_price || 0) * Number(s.quantity || 0), 0)
const liveProfitLoss = liveValue - totalInvestment
const liveProfitLossRate = totalInvestment > 0 ? (liveProfitLoss / totalInvestment) * 100 : 0
return {
...portfolioSummary,
total_value: liveValue,
total_profit_loss: liveProfitLoss,
total_profit_loss_rate: liveProfitLossRate,
total_assets: (portfolioSummary.available_cash || 0) + liveValue,
}
}, [portfolioSummary, portfolio, livePrices])
// 실시간 차트: 마지막 캔들에 live price 반영 (close/high/low)
// livePrice가 selectedStock에 대해서만 변경될 때 재계산
const livePrice = livePrices[selectedStock]
@@ -488,7 +508,7 @@ const Dashboard = () => {
<main className="flex-1 p-4 max-w-[1920px] mx-auto w-full flex flex-col gap-4 overflow-hidden">
<div className="flex-shrink-0">
<PortfolioSummary summary={portfolioSummary} error={portfolioSummaryError} />
<PortfolioSummary summary={liveSummary} error={portfolioSummaryError} />
</div>
<div className="grid grid-cols-12 gap-4 flex-1 min-h-0">