紧凑多列表单:开单计划与关键位监控输入区

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-15 12:43:43 +08:00
parent 9b4bbbe8a3
commit ea680e0485
3 changed files with 77 additions and 59 deletions
+10 -2
View File
@@ -23,7 +23,15 @@
.card{background:#12121a;border-radius:16px;padding:1.5rem;border:1px solid #242435;margin-bottom:1.5rem} .card{background:#12121a;border-radius:16px;padding:1.5rem;border:1px solid #242435;margin-bottom:1.5rem}
.card h2{font-size:1.15rem;margin-bottom:1rem;color:#c4c4ff;display:flex;align-items:center;gap:.5rem} .card h2{font-size:1.15rem;margin-bottom:1rem;color:#c4c4ff;display:flex;align-items:center;gap:.5rem}
.card h2:before{content:"";width:4px;height:16px;background:#4cc2ff;border-radius:2px} .card h2:before{content:"";width:4px;height:16px;background:#4cc2ff;border-radius:2px}
.form-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:1rem;align-items:flex-start} .form-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem;align-items:center}
.form-compact{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem}
.form-compact .form-line{display:grid;gap:.5rem;align-items:center}
.form-compact .line-3{grid-template-columns:repeat(3,1fr)}
.form-compact .line-4{grid-template-columns:repeat(4,1fr)}
.form-compact .line-btn{display:flex;gap:.5rem;align-items:center}
.form-compact input,.form-compact select{padding:.55rem .7rem;font-size:.85rem;border-radius:8px}
.form-compact .symbol-selected{font-size:.7rem;margin-top:2px}
.form-compact button.btn-primary{padding:.55rem 1.5rem;font-size:.85rem;white-space:nowrap}
.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem;margin-bottom:1rem} .form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem;margin-bottom:1rem}
.form-grid .full{grid-column:1/-1} .form-grid .full{grid-column:1/-1}
.field label{display:block;font-size:.8rem;color:#a9a9ff;margin-bottom:.35rem} .field label{display:block;font-size:.8rem;color:#a9a9ff;margin-bottom:.35rem}
@@ -64,7 +72,7 @@
.filter-row .field{width:auto;min-width:140px} .filter-row .field{width:auto;min-width:140px}
.filter-row button{width:auto} .filter-row button{width:auto}
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:stretch;margin-bottom:1.5rem} .split-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:stretch;margin-bottom:1.5rem}
.split-grid .card{margin-bottom:0;height:100%;min-height:560px;display:flex;flex-direction:column} .split-grid .card{margin-bottom:0;height:100%;min-height:480px;display:flex;flex-direction:column}
.split-grid .card-body{flex:1;overflow:auto} .split-grid .card-body{flex:1;overflow:auto}
.card-scroll{max-height:420px;overflow-y:auto} .card-scroll{max-height:420px;overflow-y:auto}
.preset-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem} .preset-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
+35 -31
View File
@@ -7,44 +7,48 @@
<div class="card"> <div class="card">
<h2>新增监控</h2> <h2>新增监控</h2>
<div class="card-body"> <div class="card-body">
<form action="{{ url_for('add_key') }}" method="post" class="form-row"> <form action="{{ url_for('add_key') }}" method="post" class="form-compact">
<div class="symbol-wrap" style="min-width:180px;flex:1"> <div class="form-line line-3">
<input type="text" class="symbol-input" placeholder="中文名或同花顺代码" autocomplete="off" required> <div class="symbol-wrap">
<input type="hidden" name="symbol" required> <input type="text" class="symbol-input" placeholder="中文名或同花顺代码" autocomplete="off" required>
<input type="hidden" name="symbol_name"> <input type="hidden" name="symbol" required>
<input type="hidden" name="market_code" required> <input type="hidden" name="symbol_name">
<input type="hidden" name="sina_code"> <input type="hidden" name="market_code" required>
<div class="symbol-dropdown"></div> <input type="hidden" name="sina_code">
<div class="symbol-selected"></div> <div class="symbol-dropdown"></div>
<div class="symbol-selected"></div>
</div>
<select name="type" required>
<option value="箱体突破">箱体突破</option>
<option value="收敛突破">收敛突破</option>
<option value="关键阻力位">关键阻力位</option>
<option value="关键支撑位">关键支撑位</option>
</select>
<select name="direction" required>
<option value="">方向</option>
<option value="long">做多</option>
<option value="short">做空</option>
</select>
</div>
<div class="form-line line-3">
<input name="upper" type="number" step="0.0001" placeholder="上沿/阻力" required>
<input name="lower" type="number" step="0.0001" placeholder="下沿/支撑" required>
<button type="submit" class="btn-primary">添加</button>
</div> </div>
<select name="type" required>
<option value="箱体突破">箱体突破</option>
<option value="收敛突破">收敛突破</option>
<option value="关键阻力位">关键阻力位</option>
<option value="关键支撑位">关键支撑位</option>
</select>
<select name="direction" required>
<option value="">方向</option>
<option value="long">做多</option>
<option value="short">做空</option>
</select>
<input name="upper" type="number" step="0.0001" placeholder="上沿/阻力" required>
<input name="lower" type="number" step="0.0001" placeholder="下沿/支撑" required>
<button type="submit" class="btn-primary">添加</button>
</form> </form>
<h3 style="font-size:.95rem;color:#a9a9ff;margin:1rem 0 .75rem">监控列表</h3> <h3 style="font-size:.9rem;color:#a9a9ff;margin:.75rem 0 .5rem">监控列表</h3>
<div class="list card-scroll"> <div class="list card-scroll">
{% for k in keys %} {% for k in keys %}
<div class="list-item"> <div class="list-item" style="padding:.75rem;font-size:.85rem">
<div> <div>
<strong>{{ k.symbol_name or k.symbol }}</strong> | {{ k.monitor_type }} <strong>{{ k.symbol_name or k.symbol }}</strong> {{ k.monitor_type }}
<span class="badge dir">{{ '多' if k.direction == 'long' else '空' }}</span> <span class="badge dir">{{ '多' if k.direction == 'long' else '空' }}</span>
</div> </div>
<div> {{ k.upper }} | 下 {{ k.lower }}</div> <div>上{{ k.upper }} {{ k.lower }}</div>
<a href="{{ url_for('del_key', pid=k.id) }}" class="btn-del" onclick="return confirm('移入历史?')"></a> <a href="{{ url_for('del_key', pid=k.id) }}" class="btn-del" onclick="return confirm('移入历史?')"></a>
</div> </div>
{% else %} {% else %}
<div style="color:#888;padding:1rem">暂无监控</div> <div style="color:#888;padding:.75rem;font-size:.85rem">暂无监控</div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
@@ -54,7 +58,7 @@
<h2>监控历史</h2> <h2>监控历史</h2>
<div class="card-body card-scroll"> <div class="card-body card-scroll">
<table> <table>
<thead><tr><th>品种</th><th>类型</th><th>方向</th><th>上沿</th><th>下沿</th><th>归档时间</th></tr></thead> <thead><tr><th>品种</th><th>类型</th><th>方向</th><th>上沿</th><th>下沿</th><th>归档</th></tr></thead>
<tbody> <tbody>
{% for k in history %} {% for k in history %}
<tr> <tr>
+32 -26
View File
@@ -7,43 +7,49 @@
<div class="card"> <div class="card">
<h2>今日计划</h2> <h2>今日计划</h2>
<div class="card-body"> <div class="card-body">
<p class="hint" style="margin-bottom:1rem">开盘前制定,当日有效;下方为进行中计划。</p> <p class="hint" style="margin-bottom:.75rem">开盘前制定,当日有效;下方为进行中计划。</p>
<form action="{{ url_for('add_plan') }}" method="post" class="form-row"> <form action="{{ url_for('add_plan') }}" method="post" class="form-compact">
<div class="symbol-wrap" style="min-width:180px;flex:1"> <div class="form-line line-3">
<input type="text" class="symbol-input" placeholder="中文名或同花顺代码" autocomplete="off" required> <div class="symbol-wrap">
<input type="hidden" name="symbol" required> <input type="text" class="symbol-input" placeholder="中文名或同花顺代码" autocomplete="off" required>
<input type="hidden" name="symbol_name"> <input type="hidden" name="symbol" required>
<input type="hidden" name="market_code" required> <input type="hidden" name="symbol_name">
<input type="hidden" name="sina_code"> <input type="hidden" name="market_code" required>
<div class="symbol-dropdown"></div> <input type="hidden" name="sina_code">
<div class="symbol-selected"></div> <div class="symbol-dropdown"></div>
<div class="symbol-selected"></div>
</div>
<select name="direction" required>
<option value="">方向</option>
<option value="long">做多</option>
<option value="short">做空</option>
</select>
<input name="zone_lower" type="number" step="0.0001" placeholder="区间下限" required>
</div>
<div class="form-line line-3">
<input name="zone_upper" type="number" step="0.0001" placeholder="区间上限" required>
<input name="stop_loss" type="number" step="0.0001" placeholder="止损" required>
<input name="take_profit" type="number" step="0.0001" placeholder="止盈" required>
</div>
<div class="form-line line-btn">
<button type="submit" class="btn-primary">添加</button>
</div> </div>
<select name="direction" required>
<option value="">方向</option>
<option value="long">做多</option>
<option value="short">做空</option>
</select>
<input name="zone_lower" type="number" step="0.0001" placeholder="区间下限" required>
<input name="zone_upper" type="number" step="0.0001" placeholder="区间上限" required>
<input name="stop_loss" type="number" step="0.0001" placeholder="止损" required>
<input name="take_profit" type="number" step="0.0001" placeholder="止盈" required>
<button type="submit" class="btn-primary">添加</button>
</form> </form>
<h3 style="font-size:.95rem;color:#a9a9ff;margin:1rem 0 .75rem">进行中</h3> <h3 style="font-size:.9rem;color:#a9a9ff;margin:.75rem 0 .5rem">进行中</h3>
<div class="list card-scroll"> <div class="list card-scroll">
{% for p in plans %} {% for p in plans %}
<div class="list-item"> <div class="list-item" style="padding:.75rem;font-size:.85rem">
<div> <div>
<strong>{{ p.symbol_name or p.symbol }}</strong> <strong>{{ p.symbol_name or p.symbol }}</strong>
<span class="badge dir">{{ '多' if p.direction == 'long' else '空' }}</span> <span class="badge dir">{{ '多' if p.direction == 'long' else '空' }}</span>
{% if p.status == 'planned' %}<span class="badge planned">待触发</span> {% if p.status == 'planned' %}<span class="badge planned">待触发</span>
{% else %}<span class="badge active">已激活</span>{% endif %} {% else %}<span class="badge active">已激活</span>{% endif %}
</div> </div>
<div>区间 {{ p.zone_lower }}~{{ p.zone_upper }} | 损{{ p.stop_loss }} 盈{{ p.take_profit }}</div> <div>{{ p.zone_lower }}~{{ p.zone_upper }} 损{{ p.stop_loss }} 盈{{ p.take_profit }}</div>
<a href="{{ url_for('del_plan', pid=p.id) }}" class="btn-del" onclick="return confirm('删除?')"></a> <a href="{{ url_for('del_plan', pid=p.id) }}" class="btn-del" onclick="return confirm('删除?')"></a>
</div> </div>
{% else %} {% else %}
<div style="color:#888;padding:1rem">今日暂无进行中的计划</div> <div style="color:#888;padding:.75rem;font-size:.85rem">今日暂无进行中的计划</div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>