Macbook
69 lines
2.3 KiB
TypeScript
69 lines
2.3 KiB
TypeScript
import React from 'react';
|
|
import type { StrategyDto } from '../../utils/backendApi';
|
|
import type { VirtualIndicatorSnapshot } from '../../hooks/useVirtualIndicatorSnapshots';
|
|
import { formatUpdatedTime } from '../../utils/virtualSignalMetrics';
|
|
import { STRATEGY_CANDLE_TYPE_OPTIONS } from '../../utils/strategyStartNodes';
|
|
import {
|
|
defaultStrategyOptionLabel,
|
|
parseTargetStrategySelectValue,
|
|
targetStrategySelectValue,
|
|
} from '../../utils/virtualTargetStrategy';
|
|
|
|
interface Props {
|
|
snapshot: VirtualIndicatorSnapshot | undefined;
|
|
strategies: StrategyDto[];
|
|
strategyId: number | null;
|
|
globalStrategyId: number | null;
|
|
candleType: string;
|
|
onStrategyChange?: (strategyId: number | null) => void;
|
|
onCandleTypeChange?: (candleType: string) => void;
|
|
}
|
|
|
|
/** 카드 하단 — 갱신 시각(좌) · 전략·시간봉 드롭다운(우) */
|
|
const VirtualTargetCardFoot: React.FC<Props> = ({
|
|
snapshot,
|
|
strategies,
|
|
strategyId,
|
|
globalStrategyId,
|
|
candleType,
|
|
onStrategyChange,
|
|
onCandleTypeChange,
|
|
}) => (
|
|
<div className="vtd-card-foot">
|
|
<span className="vtd-card-updated">갱신 {formatUpdatedTime(snapshot?.updatedAt)}</span>
|
|
<div className="vtd-card-foot-controls" onClick={e => e.stopPropagation()}>
|
|
<label className="vtd-card-foot-field">
|
|
<select
|
|
className="vtd-card-foot-select"
|
|
aria-label="투자전략"
|
|
value={targetStrategySelectValue({ strategyId })}
|
|
onChange={e => {
|
|
onStrategyChange?.(parseTargetStrategySelectValue(e.target.value));
|
|
}}
|
|
>
|
|
<option value={targetStrategySelectValue({ strategyId: null })}>
|
|
{defaultStrategyOptionLabel(globalStrategyId, strategies)}
|
|
</option>
|
|
{strategies.map(s => (
|
|
<option key={s.id} value={String(s.id)}>{s.name}</option>
|
|
))}
|
|
</select>
|
|
</label>
|
|
<label className="vtd-card-foot-field">
|
|
<select
|
|
className="vtd-card-foot-select vtd-card-foot-select--tf"
|
|
aria-label="시간봉"
|
|
value={candleType}
|
|
onChange={e => onCandleTypeChange?.(e.target.value)}
|
|
>
|
|
{STRATEGY_CANDLE_TYPE_OPTIONS.map(o => (
|
|
<option key={o.value} value={o.value}>{o.label}</option>
|
|
))}
|
|
</select>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
);
|
|
|
|
export default VirtualTargetCardFoot;
|