miracle/auto_trade_sys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

a

Browse Source
This commit is contained in:
薇薇安 2026-01-19 13:46:27 +08:00
parent 175c5b158a
commit 03f746288b
2 changed files with 78 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
frontend/src/components/Recommendations.css
View File

@ -331,12 +331,70 @@
margin: 10px 0;
}
.user-guide-head {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 10px;
}
.user-guide strong {
display: block;
margin-bottom: 10px;
font-size: 16px;
}
.user-guide-prices {
display: flex;
flex-wrap: wrap;
gap: 8px;
justify-content: flex-end;
}
.ug-pill {
display: inline-block;
padding: 4px 8px;
border-radius: 999px;
font-size: 12px;
background: rgba(255, 255, 255, 0.16);
border: 1px solid rgba(255, 255, 255, 0.22);
line-height: 1.2;
}
.collapsible-user-guide .cug-body {
position: relative;
}
.collapsible-user-guide .cug-body.collapsed {
overflow: hidden;
}
.collapsible-user-guide .cug-fade {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 36px;
background: linear-gradient(to bottom, rgba(102, 126, 234, 0), rgba(118, 75, 162, 0.9));
pointer-events: none;
}
.collapsible-user-guide .cug-toggle {
margin-top: 8px;
background: rgba(255, 255, 255, 0.14);
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.22);
border-radius: 6px;
padding: 6px 10px;
cursor: pointer;
font-size: 12px;
}
.collapsible-user-guide .cug-toggle:hover {
background: rgba(255, 255, 255, 0.22);
}
.user-guide-content {
margin: 0;
white-space: pre-wrap;

21
frontend/src/components/Recommendations.jsx
View File

@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react'
import { api } from '../services/api'
import './Recommendations.css'
import CollapsibleUserGuide from './CollapsibleUserGuide'
function Recommendations() {
const [recommendations, setRecommendations] = useState([])
@ -399,8 +400,24 @@ function Recommendations() {
{/* 用户指南（人话版计划） */}
{rec.user_guide && (
<div className="user-guide">
<strong>📋 操作计划:(入场价格：{fmtPrice(rec.suggested_limit_price)} USDT，止损价格：{fmtPrice(rec.suggested_stop_loss)} USDT，第一目标：{fmtPrice(rec.suggested_take_profit_1)} USDT，第二目标：{fmtPrice(rec.suggested_take_profit_2)} USDT)</strong>
<CollapsibleUserGuide text={rec.user_guide} suggested_limit_price={rec.suggested_limit_price} suggested_stop_loss={rec.suggested_stop_loss} suggested_take_profit_1={rec.suggested_take_profit_1} suggested_take_profit_2={rec.suggested_take_profit_2} />
<div className="user-guide-head">
<strong>📋 操作计划</strong>
<div className="user-guide-prices">
<span className="ug-pill">
入场 {fmtPrice(rec.suggested_limit_price ?? rec.planned_entry_price)} USDT
</span>
<span className="ug-pill">
止损 {fmtPrice(rec.suggested_stop_loss)} USDT
</span>
<span className="ug-pill">
目标1 {fmtPrice(rec.suggested_take_profit_1)} USDT
</span>
<span className="ug-pill">
目标2 {fmtPrice(rec.suggested_take_profit_2)} USDT
</span>
</div>
</div>
<CollapsibleUserGuide text={rec.user_guide} maxHeight={160} />
</div>
)}