<div class="strategy-panel-inner" id="strategy-roll-panel">
    <h2 style="margin:0 0 8px">顺势加仓</h2>
    <details class="tip-collapse strategy-roll-rule-collapse" open>
        <summary class="tip-collapse-summary">顺势加仓规则说明{% if roll_trend_active %} · 当前有趋势回调计划{% endif %}</summary>
        <div class="tip-collapse-body rule-tip">
            <strong>仅人工提交</strong>;须先在「实盘下单」有同向持仓.仅<strong>以损定仓</strong>模式可用.<br>
            做多/做空各最多滚仓 <strong>3</strong> 次(仅计已成交腿);止盈<strong>锁定首仓</strong>不变.<br>
            风险比例读取所选监控单,<strong>不可手改</strong>;打到新止损时合并持仓亏损 ≈ 1 个风险单位(当前基数 × 监控 risk%).<br>
            斐波/突破为<strong>程序监控</strong>(交易所 mark 价),触价后市价加仓;填写后直接点「执行滚仓」(无需预览).同时仅允许 <strong>1</strong> 条监控中腿,提交后<strong>不可修改</strong>,可删除.<br>
            手动平仓后滚仓监控自动结束;<strong>已成交腿历史保留</strong>供复盘.<br>
            <a href="/strategy/roll/docs" target="_blank" rel="noopener" class="roll-doc-link">→ 顺势加仓完整逻辑说明</a><br>
            {% if roll_trend_active %}<span style="color:#ff8f8f">当前有运行中的趋势回调计划,请先结束后再滚仓.</span>{% endif %}
        </div>
    </details>

    <div id="roll-risk-banner" class="rule-tip roll-risk-banner">
        当前风险:请选择持仓币种
    </div>

    <form id="roll-form" action="{{ url_for('strategy_roll_execute') }}" method="post" class="form-row" data-add-mode="market">
        <select name="symbol" id="roll-symbol" required>
            <option value="">选择持仓币种</option>
            {% for o in roll_monitors %}
            <option value="{{ o.symbol }}"
                    data-direction="{{ o.direction }}"
                    data-monitor-id="{{ o.id }}"
                    data-risk-percent="{{ o.risk_percent or default_risk_percent }}">
                {{ o.symbol }} {{ '多' if o.direction=='long' else '空' }} #{{ o.id }} · 风险{{ o.risk_percent or default_risk_percent }}%
            </option>
            {% endfor %}
        </select>
        <input type="hidden" name="direction" id="roll-direction" value="long">
        <select name="add_mode" id="roll-add-mode" onchange="var f=document.getElementById('roll-form');if(f){f.setAttribute('data-add-mode',this.value);if(window.syncRollFormMode)syncRollFormMode(f,this.value);}">
            <option value="market">市价加仓</option>
            <option value="fib_618">斐波 0.618</option>
            <option value="fib_786">斐波 0.786</option>
            <option value="breakout">突破加仓</option>
        </select>
        <span class="roll-field roll-field-fib">
            <input name="fib_upper" id="roll-fib-upper" step="any" placeholder="上沿 H">
            <input name="fib_lower" id="roll-fib-lower" step="any" placeholder="下沿 L">
        </span>
        <span class="roll-field roll-field-breakout">
            <input name="breakthrough_price" id="roll-breakout" step="any" placeholder="突破价">
        </span>
        <input name="new_stop_loss" id="roll-stop-loss" type="number" min="0" step="any" placeholder="新止损价" required>
        <button type="button" id="roll-preview-btn" class="roll-preview-btn" {% if roll_trend_active %}disabled{% endif %}>预览</button>
        <button type="submit" id="roll-submit-btn" {% if roll_trend_active %}disabled style="opacity:.5" data-trend-locked="1"{% endif %} disabled>执行滚仓</button>
    </form>

    <div id="roll-preview-box" class="rule-tip roll-preview-box" style="display:none" role="status" aria-live="polite">
        <div id="roll-preview-text">—</div>
        <div id="roll-countdown" class="roll-countdown" style="display:none"></div>
    </div>

    <h3 class="roll-section-title">活跃滚仓组</h3>
    <div class="table-wrap">
    <table class="roll-active-groups-table">
        <tr><th>ID</th><th>币种</th><th>方向</th><th>腿数</th><th>首仓张数</th><th>加仓后张数</th><th>首仓TP</th><th>当前SL</th><th>当前均价</th><th>止盈盈利U</th><th>状态</th></tr>
        {% for g in roll_groups %}
        <tr>
            <td>{{ g.id }}</td>
            <td>{{ g.symbol }}</td>
            <td>{{ g.direction }}</td>
            <td>{{ g.leg_count }}</td>
            <td>{% if g.initial_qty is not none %}{{ '%.2f'|format(g.initial_qty) }}{% else %}—{% endif %}</td>
            <td>{% if g.current_qty is not none %}{{ '%.2f'|format(g.current_qty) }}{% else %}—{% endif %}</td>
            <td>{% if price_fmt %}{{ price_fmt(g.symbol, g.initial_take_profit) }}{% else %}{{ g.initial_take_profit }}{% endif %}</td>
            <td>{% if price_fmt %}{{ price_fmt(g.symbol, g.current_stop_loss) }}{% else %}{{ g.current_stop_loss }}{% endif %}</td>
            <td>{% if g.avg_entry_display %}{{ g.avg_entry_display }}{% elif g.avg_entry is not none %}{{ g.avg_entry }}{% else %}—{% endif %}</td>
            <td class="roll-tp-profit">{% if g.reward_at_tp_usdt is not none %}{{ '%.2f'|format(g.reward_at_tp_usdt) }}{% else %}—{% endif %}</td>
            <td class="roll-status-active">滚仓中</td>
        </tr>
        {% else %}
        <tr><td colspan="11" style="color:#8892b0">暂无</td></tr>
        {% endfor %}
    </table>
    </div>

    <h3 class="roll-section-title">最近滚仓腿</h3>
    <div class="table-wrap">
    <table>
        <tr><th>#</th><th>组</th><th>方式</th><th>张数</th><th>触发/限价</th><th>新SL</th><th>状态</th><th>操作</th></tr>
        {% for leg in roll_legs %}
        <tr>
            <td>{{ leg.leg_index }}</td>
            <td>{{ leg.roll_group_id }}</td>
            <td>{{ leg.add_mode }}</td>
            <td>{% if leg.amount %}{{ leg.amount }}{% else %}—{% endif %}</td>
            <td>{% if leg.limit_price %}{{ leg.limit_price }}{% elif leg.breakthrough_price %}{{ leg.breakthrough_price }}{% elif leg.fill_price %}{{ leg.fill_price }}{% else %}—{% endif %}</td>
            <td>{{ leg.new_stop_loss }}</td>
            <td>{{ leg.status_label or leg.status }}</td>
            <td>
                {% if leg.status == 'pending' %}
                <form action="{{ url_for('strategy_roll_cancel_leg', leg_id=leg.id) }}" method="post" style="margin:0" onsubmit="return confirm('确认删除本条滚仓监控?')">
                    <button type="submit" style="padding:2px 8px;font-size:.75rem">删除</button>
                </form>
                {% else %}—{% endif %}
            </td>
        </tr>
        {% else %}
        <tr><td colspan="8" style="color:#8892b0">暂无</td></tr>
        {% endfor %}
    </table>
    </div>
</div>
