liuyu/nofx
1
0
Fork 0
mirror of https://github.com/NoFxAiOS/nofx.git synced 2026-07-07 04:50:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of github.com:Icyoung/nofx

Browse Source 
# Conflicts:
#	config.json.example
#	config/config.go
#	main.go
#	trader/auto_trader.go
#	web/src/App.tsx
#	web/src/components/CompetitionPage.tsx
This commit is contained in:
icy
2025-10-31 03:59:58 +08:00
parent ac7c40632d 23fb34c58a
commit 3f686dec2e
10 changed files with 347 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/components/ComparisonChart.tsx
View File

@@ -13,6 +13,7 @@ import {
import useSWR from 'swr';
import { api } from '../lib/api';
import type { CompetitionTraderData } from '../types';
import { getTraderColor } from '../utils/traderColors';
interface ComparisonChartProps {
traders: CompetitionTraderData[];
@@ -171,15 +172,8 @@ export function ComparisonChart({ traders }: ComparisonChartProps) {
];
};
// Trader颜色配置 - 使用更鲜艳对比度更高的颜色
const getTraderColor = (traderId: string) => {
const trader = traders.find((t) => t.trader_id === traderId);
if (trader?.ai_model === 'qwen') {
return '#c084fc'; // purple-400 (更亮)
} else {
return '#60a5fa'; // blue-400 (更亮)
}
};
// 使用统一的颜色分配逻辑（与Leaderboard保持一致）
const traderColor = (traderId: string) => getTraderColor(traders, traderId);
// 自定义Tooltip - Binance Style
const CustomTooltip = ({ active, payload }: any) => {
@@ -199,7 +193,7 @@ export function ComparisonChart({ traders }: ComparisonChartProps) {
<div key={trader.trader_id} className="mb-1.5 last:mb-0">
<div
className="text-xs font-semibold mb-0.5"
style={{ color: getTraderColor(trader.trader_id) }}
style={{ color: traderColor(trader.trader_id) }}
>
{trader.trader_name}
</div>
@@ -240,8 +234,8 @@ export function ComparisonChart({ traders }: ComparisonChartProps) {
x2="0"
y2="1"
>
<stop offset="5%" stopColor={getTraderColor(trader.trader_id)} stopOpacity={0.9} />
<stop offset="95%" stopColor={getTraderColor(trader.trader_id)} stopOpacity={0.2} />
<stop offset="5%" stopColor={traderColor(trader.trader_id)} stopOpacity={0.9} />
<stop offset="95%" stopColor={traderColor(trader.trader_id)} stopOpacity={0.2} />
</linearGradient>
))}
</defs>
@@ -288,10 +282,10 @@ export function ComparisonChart({ traders }: ComparisonChartProps) {
key={trader.trader_id}
type="monotone"
dataKey={`${trader.trader_id}_pnl_pct`}
stroke={getTraderColor(trader.trader_id)}
stroke={traderColor(trader.trader_id)}
strokeWidth={3}
dot={displayData.length < 50 ? { fill: getTraderColor(trader.trader_id), r: 3 } : false}
activeDot={{ r: 6, fill: getTraderColor(trader.trader_id), stroke: '#fff', strokeWidth: 2 }}
dot={displayData.length < 50 ? { fill: traderColor(trader.trader_id), r: 3 } : false}
activeDot={{ r: 6, fill: traderColor(trader.trader_id), stroke: '#fff', strokeWidth: 2 }}
name={trader.trader_name}
connectNulls
/>

7
web/src/components/CompetitionPage.tsx
View File

@@ -2,6 +2,7 @@ import useSWR from 'swr';
import { api } from '../lib/api';
import type { CompetitionData } from '../types';
import { ComparisonChart } from './ComparisonChart';
import { getTraderColor } from '../utils/traderColors';
export function CompetitionPage() {
const { data: competition } = useSWR<CompetitionData>(
@@ -105,7 +106,7 @@ export function CompetitionPage() {
<div className="space-y-2">
{sortedTraders.map((trader, index) => {
const isLeader = index === 0;
const aiModelColor = trader.ai_model === 'qwen' ? '#c084fc' : '#60a5fa';
const traderColor = getTraderColor(sortedTraders, trader.trader_id);
return (
<div
@@ -125,7 +126,7 @@ export function CompetitionPage() {
</div>
<div>
<div className="font-bold text-sm" style={{ color: '#EAECEF' }}>{trader.trader_name}</div>
<div className="text-xs mono font-semibold" style={{ color: aiModelColor }}>
<div className="text-xs mono font-semibold" style={{ color: traderColor }}>
{trader.ai_model.toUpperCase()}
</div>
</div>
@@ -220,7 +221,7 @@ export function CompetitionPage() {
<div className="text-center">
<div
className="text-base font-bold mb-2"
style={{ color: trader.ai_model === 'qwen' ? '#c084fc' : '#60a5fa' }}
style={{ color: getTraderColor(sortedTraders, trader.trader_id) }}
>
{trader.trader_name}
</div>