fix: redesign order monitor open form for clearer SL/TP inputs

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-11 07:56:55 +08:00
parent 401ee2f130
commit 91c8cd8c2a
6 changed files with 283 additions and 156 deletions
+8 -39
View File
@@ -233,7 +233,7 @@
.stats-period-block h3{font-size:1rem;color:#dbe4ff;margin-bottom:4px}
.stats-period-block .sub{font-size:.78rem;color:#8892b0;margin-bottom:10px;line-height:1.4}
</style>
<link rel="stylesheet" href="/static/instance_theme.css?v=13">
<link rel="stylesheet" href="/static/instance_theme.css?v=14">
</head>
<body data-page="{{ page }}">
@@ -335,38 +335,7 @@
{% endif %}
</div>
{% include 'order_monitor_rule_tips_gate.html' %}
<form id="add-order-form" action="/add_order" method="post" class="form-row">
<input id="order-symbol" name="symbol" placeholder="BTC 或 BTC/USDT" required>
<select id="order-direction" name="direction" required>
<option value="">方向</option><option value="long">做多</option><option value="short">做空</option>
</select>
<select id="sltp-mode" name="sltp_mode">
<option value="fixed_rr" selected>止盈止损:固定盈亏比</option>
<option value="price">止盈止损:价格模式</option>
<option value="pct">止盈止损:百分比模式</option>
</select>
<select name="trade_style" required>
<option value="trend">趋势单</option>
<option value="swing">波段单</option>
</select>
{% if position_sizing_mode != 'full_margin' %}
<input id="order-leverage" name="leverage" type="number" min="1" step="1" placeholder="杠杆(可选)">
{% endif %}
<label style="display:flex;align-items:center;gap:4px;font-size:.82rem;color:#cfd3ef">
<input type="checkbox" name="breakeven_enabled" value="1" checked> 启用移动保本(关闭则仅保留初始止损与交易所挂单)
</label>
<label style="display:flex;align-items:center;gap:4px;font-size:.82rem;color:#cfd3ef">
<input type="checkbox" name="order_chart" value="true"> 开仓后生成多周期K线图(各周期100根,含开平仓标记)
</label>
<span style="display:flex;align-items:center;padding:0 10px;font-size:.8rem;color:#8fc8ff">成交价自动取交易所实时+成交回报</span>
<input id="order-sl" name="sl" step="any" placeholder="止损价格" required>
<input id="order-fixed-rr" name="fixed_rr" type="number" min="0.01" step="0.01" placeholder="盈亏比(默认1.5)" value="1.5" title="止盈距离=止损距离×盈亏比">
<span id="order-tp-preview" style="display:none;font-size:.8rem;color:#8fc8ff;align-self:center">预估止盈:—</span>
<input id="order-tp" name="tgt" step="any" placeholder="止盈价格" style="display:none">
<input id="order-sl-pct" name="sl_pct" type="number" min="0.01" step="0.01" placeholder="止损%" style="display:none">
<input id="order-tp-pct" name="tp_pct" type="number" min="0.01" step="0.01" placeholder="止盈%" style="display:none">
<button type="submit">{{ open_position_button_label }}</button>
</form>
{% include 'order_monitor_open_form.html' %}
</div>
<div class="card">
<h2 style="margin-bottom:8px">实时持仓</h2>
@@ -1974,14 +1943,14 @@ function toggleSltpMode(){
if(!slEl || !tpEl || !slPctEl || !tpPctEl){ return; }
const pct = mode === "pct";
const fixed = mode === "fixed_rr";
slEl.style.display = pct ? "none" : "";
tpEl.style.display = (pct || fixed) ? "none" : "";
if(fixedRrEl) fixedRrEl.style.display = fixed ? "" : "none";
const price = mode === "price";
document.querySelectorAll("#add-order-form [data-sltp-panel]").forEach(function(el){
const panels = (el.getAttribute("data-sltp-panel") || "").trim().split(/\s+/);
el.style.display = panels.indexOf(mode) >= 0 ? "" : "none";
});
slEl.required = !pct;
tpEl.required = !pct && !fixed;
tpEl.required = price;
if(fixedRrEl) fixedRrEl.required = fixed;
slPctEl.style.display = pct ? "" : "none";
tpPctEl.style.display = pct ? "" : "none";
slPctEl.required = pct;
tpPctEl.required = pct;
refreshOrderTpPreview();