{# Copyright (c) 2025-2026 马建军. All rights reserved. 专有软件，详见 LICENSE.zh-CN.txt #}
{% extends "base.html" %}
{% block title %}关键位监控 - 国内期货 · 交易复盘系统{% endblock %}
{% block extra_css %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/keys.css') }}">
{% endblock %}
{% block content %}
<div class="split-grid">
    <div class="card">
        <h2>新增监控</h2>
        <div class="card-body">
            <details class="key-rules" open>
                <summary>规则说明</summary>
                <div class="key-rules-body">
                    <p><strong>箱体突破 / 收敛突破（自动单）</strong></p>
                    <ul>
                        <li>触发：<strong>5 分钟 K 线收盘</strong>收在上沿或下沿之外</li>
                        <li>顺势：上破做多、下破做空；反转：上破做空、下破做多</li>
                        <li>自动<strong>市价开仓</strong>；止损 = 突破 K 线极值 ± 2 跳</li>
                        <li>盈亏比默认 2（可改）；开启移动保本时默认 3，达目标价自动止盈</li>
                        <li>成交后进入「下单监控」持仓，来源备注为监控类型</li>
                    </ul>
                    <p><strong>关键支阻区（仅提醒）</strong></p>
                    <ul>
                        <li>上沿 = 阻力，下沿 = 支撑，合并为一个区间</li>
                        <li>5m 收盘突破上沿或跌破下沿 → 微信推送（最多 3 次，间隔约 5 分钟）</li>
                        <li>推送完毕后自动结案，<strong>不参与自动开仓</strong></li>
                    </ul>
                </div>
            </details>
            <form action="{{ url_for('add_key') }}" method="post" class="form-compact" id="key-add-form">
                <div class="form-line line-3">
                    <div class="symbol-wrap symbol-mains">
                        <input type="text" class="symbol-input" placeholder="主力合约" autocomplete="off" required>
                        <input type="hidden" name="symbol" required>
                        <input type="hidden" name="symbol_name">
                        <input type="hidden" name="market_code" required>
                        <input type="hidden" name="sina_code">
                        <div class="symbol-dropdown"></div>
                        <div class="symbol-selected"></div>
                    </div>
                    <select name="type" id="key-type" required>
                        <option value="箱体突破">箱体突破</option>
                        <option value="收敛突破">收敛突破</option>
                        <option value="关键支阻区">关键支阻区</option>
                    </select>
                    <div id="key-trade-mode-wrap">
                        <select name="trade_mode" id="key-trade-mode">
                            <option value="顺势">顺势</option>
                            <option value="反转">反转</option>
                        </select>
                    </div>
                </div>
                <div class="form-line line-3" id="key-row-prices">
                    <input name="upper" type="number" step="0.0001" placeholder="上沿（阻力）" required>
                    <input name="lower" type="number" step="0.0001" placeholder="下沿（支撑）" required>
                    <div id="key-rr-wrap">
                        <input name="risk_reward" id="key-rr" type="number" step="0.1" min="0.5" max="10" value="2" placeholder="盈亏比">
                    </div>
                </div>
                <div class="form-line line-key-actions" id="key-row-actions">
                    <label class="key-check" id="key-trailing-wrap">
                        <input type="checkbox" name="trailing_be" id="key-trailing" value="1">
                        <span class="key-check-text">移动保本（默认盈亏比 3，达 3R 止盈）</span>
                    </label>
                    <button type="submit" class="btn-primary key-submit-btn">添加</button>
                </div>
            </form>
            <h3 class="section-label">监控列表</h3>
            <div class="list card-scroll" id="key-monitor-list">
                {% for k in keys %}
                <div class="list-item key-item" data-key-id="{{ k.id }}" style="padding:.75rem;font-size:.85rem">
                    <div>
                        <strong>{{ k.symbol_name or k.symbol }}</strong> {{ k.monitor_type }}
                        {% if k.monitor_type in ('箱体突破', '收敛突破') %}
                        <span class="badge planned">{{ k.trade_mode or '顺势' }}</span>
                        {% endif %}
                        {% if k.trailing_be %}
                        <span class="badge profit">移动保本</span>
                        {% endif %}
                    </div>
                    <div class="key-live">
                        <span class="live-price-line">现价：<span class="live-price">--</span></span>
                        <span class="live-dist">距上<span class="dist-up">--</span> 距下<span class="dist-down">--</span></span>
                    </div>
                    <div>上沿 {{ k.upper }} · 下沿 {{ k.lower }}
                        {% if k.monitor_type in ('箱体突破', '收敛突破') %}
                        · 盈亏比 {{ k.risk_reward or 2 }}
                        {% endif %}
                    </div>
                    <a href="{{ url_for('del_key', pid=k.id) }}" class="btn-del" onclick="return confirm('移入历史？')">删</a>
                </div>
                {% else %}
                <div class="empty-hint">暂无监控</div>
                {% endfor %}
            </div>
        </div>
    </div>

    <div class="card">
        <h2>监控历史</h2>
        <div class="card-body card-scroll">
            <table>
                <thead><tr><th>品种</th><th>类型</th><th>模式</th><th>上沿</th><th>下沿</th><th>归档</th></tr></thead>
                <tbody>
                    {% for k in history %}
                    <tr>
                        <td>{{ k.symbol_name or k.symbol }}</td>
                        <td>{{ k.monitor_type }}</td>
                        <td>
                            {% if k.monitor_type in ('箱体突破', '收敛突破') %}
                            {{ k.trade_mode or '顺势' }}{% if k.trailing_be %} · 移动保本{% endif %}
                            {% elif k.monitor_type in ('关键阻力位', '关键支撑位') %}
                            支阻区
                            {% else %}
                            提醒
                            {% endif %}
                        </td>
                        <td>{{ k.upper }}</td>
                        <td>{{ k.lower }}</td>
                        <td>{{ k.archived_at[:16] if k.archived_at else '' }}</td>
                    </tr>
                    {% else %}
                    <tr><td colspan="6" class="text-muted">暂无历史</td></tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% endblock %}
{% block extra_js %}
<script src="{{ url_for('static', filename='js/keys.js') }}"></script>
{% endblock %}