a

frontend/src/components/StatsDashboard.css

@@ -241,6 +241,63 @@
   font-style: italic;
 }
 
+.price-change {
+  font-weight: 600;
+  font-size: 0.9rem;
+  padding: 0.25rem 0.5rem;
+  border-radius: 4px;
+  display: inline-block;
+}
+
+.price-change.positive {
+  color: #28a745;
+  background-color: #d4edda;
+}
+
+.price-change.negative {
+  color: #dc3545;
+  background-color: #f8d7da;
+}
+
+.stop-take-info {
+  display: flex;
+  flex-direction: column;
+  gap: 0.25rem;
+  margin-top: 0.5rem;
+  padding: 0.5rem;
+  background-color: #fff3cd;
+  border-radius: 4px;
+  border-left: 3px solid #ffc107;
+}
+
+.stop-loss-info,
+.take-profit-info {
+  font-size: 0.85rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.stop-loss-info .negative,
+.take-profit-info .positive {
+  font-weight: 600;
+}
+
+.stop-loss-info .negative {
+  color: #dc3545;
+}
+
+.take-profit-info .positive {
+  color: #28a745;
+}
+
+.stop-price,
+.take-price {
+  color: #666;
+  font-size: 0.8rem;
+  font-style: italic;
+}
+
 .close-btn {
   padding: 0.5rem 1rem;
   background: #e74c3c;

frontend/src/components/StatsDashboard.jsx

@@ -168,6 +168,46 @@ const StatsDashboard = () => {
                 const leverage = parseFloat(trade.leverage || 1)
                 const margin = leverage > 0 ? entryValueUsdt / leverage : 0
                 
+                // 计算价格涨跌比例、止损比例、止盈比例
+                const entryPrice = parseFloat(trade.entry_price || 0)
+                const markPrice = parseFloat(trade.mark_price || entryPrice)
+                const side = trade.side || 'BUY'
+                
+                // 价格涨跌比例（当前价格相对于入场价）
+                let priceChangePercent = 0
+                if (entryPrice > 0) {
+                  if (side === 'BUY') {
+                    priceChangePercent = ((markPrice - entryPrice) / entryPrice) * 100
+                  } else {
+                    priceChangePercent = ((entryPrice - markPrice) / entryPrice) * 100
+                  }
+                }
+                
+                // 默认止损止盈比例（从配置获取，如果没有则使用默认值）
+                // 注意：这里使用默认值，实际止损止盈可能是动态计算的
+                const defaultStopLossPercent = 3.0  // 默认3%
+                const defaultTakeProfitPercent = 5.0  // 默认5%
+                
+                // 计算止损价和止盈价（基于默认比例）
+                let stopLossPrice = 0
+                let takeProfitPrice = 0
+                if (side === 'BUY') {
+                  stopLossPrice = entryPrice * (1 - defaultStopLossPercent / 100)
+                  takeProfitPrice = entryPrice * (1 + defaultTakeProfitPercent / 100)
+                } else {
+                  stopLossPrice = entryPrice * (1 + defaultStopLossPercent / 100)
+                  takeProfitPrice = entryPrice * (1 - defaultTakeProfitPercent / 100)
+                }
+                
+                // 计算止损比例和止盈比例（相对于入场价）
+                const stopLossPercent = side === 'BUY' 
+                  ? ((entryPrice - stopLossPrice) / entryPrice) * 100
+                  : ((stopLossPrice - entryPrice) / entryPrice) * 100
+                
+                const takeProfitPercent = side === 'BUY'
+                  ? ((takeProfitPrice - entryPrice) / entryPrice) * 100
+                  : ((entryPrice - takeProfitPrice) / entryPrice) * 100
+                
                 // 格式化开仓时间为具体的年月日时分秒
                 const formatEntryTime = (timeStr) => {
                   if (!timeStr) return null
@@ -195,13 +235,31 @@ const StatsDashboard = () => {
                       <div>数量: {parseFloat(trade.quantity || 0).toFixed(4)}</div>
                       <div>保证金: {margin.toFixed(2)} USDT</div>
                       
-                      <div>入场价: {parseFloat(trade.entry_price || 0).toFixed(4)}</div>
+                      <div>入场价: {entryPrice.toFixed(4)}</div>
                       {trade.mark_price && (
-                        <div>标记价: {parseFloat(trade.mark_price).toFixed(4)}</div>
+                        <div>标记价: {markPrice.toFixed(4)}</div>
                       )}
                       {trade.leverage && (
                         <div>杠杆: {trade.leverage}x</div>
                       )}
+                      
+                      {/* 价格涨跌比例 */}
+                      <div className={`price-change ${priceChangePercent >= 0 ? 'positive' : 'negative'}`}>
+                        价格涨跌: {priceChangePercent >= 0 ? '+' : ''}{priceChangePercent.toFixed(2)}%
+                      </div>
+                      
+                      {/* 止损止盈比例 */}
+                      <div className="stop-take-info">
+                        <div className="stop-loss-info">
+                          止损比例: <span className="negative">-{stopLossPercent.toFixed(2)}%</span>
+                          <span className="stop-price">(价: {stopLossPrice.toFixed(4)})</span>
+                        </div>
+                        <div className="take-profit-info">
+                          止盈比例: <span className="positive">+{takeProfitPercent.toFixed(2)}%</span>
+                          <span className="take-price">(价: {takeProfitPrice.toFixed(4)})</span>
+                        </div>
+                      </div>
+                      
                       {trade.entry_time && (
                         <div className="entry-time">开仓时间: {formatEntryTime(trade.entry_time)}</div>
                       )}