Initial standalone crypto_okx with one-click deploy.
Add deploy/manage.sh bootstrap for git.bz121.com/dekun/crypto_okx and point docs at this repo. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
@@ -0,0 +1,353 @@
|
||||
<div class="options-page-wrap" style="grid-column:1/-1" id="options-root"
|
||||
data-default-underly="{{ options_default_underly | default('ETH') }}"
|
||||
data-budget-buffer="{{ options_budget_buffer | default(0.95) }}"
|
||||
data-trade-budget="{{ options_trade_budget | default(10) }}"
|
||||
data-compound-full-enabled="{% if options_compound_full_enabled %}1{% else %}0{% endif %}"
|
||||
data-compound-cap-enabled="{% if options_compound_full_cap_enabled %}1{% else %}0{% endif %}"
|
||||
data-compound-cap-usdc="{{ '%.2f'|format(options_compound_full_cap_usdc|default(300)|float) }}"
|
||||
data-ask-liq-filter="{% if options_chain_ask_liq_filter is defined %}{{ '1' if options_chain_ask_liq_filter else '0' }}{% else %}1{% endif %}">
|
||||
{% set compound_on = options_compound_full_enabled if options_compound_full_enabled is defined else true %}
|
||||
{% if not options_enabled %}
|
||||
<div class="flash" style="margin-bottom:12px">期权未启用:请在 <code>crypto_monitor_okx/.env</code> 设置 <code>OKX_OPTIONS_ENABLED=true</code> 及 <code>OKX_API_*</code>(永续与期权共用),然后 <code>pm2 restart crypto_okx --update-env</code>.</div>
|
||||
{% endif %}
|
||||
{% if options_enabled and options_open_allowed is defined and not options_open_allowed %}
|
||||
<div class="flash" style="margin-bottom:12px">当前交易模式为对冲(永期/期期),不可单独开期权;持仓可在此查看/平仓.切换请到 env「交易模式」.</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="options-dual-grid">
|
||||
<div class="card options-order-card"{% if options_open_allowed is defined and not options_open_allowed %} style="opacity:.72"{% endif %}>
|
||||
<h2>期权下单{% if options_open_allowed is defined and not options_open_allowed %} <small class="muted">(对冲模式已禁用开仓)</small>{% endif %}</h2>
|
||||
<details class="opt-close-rule opt-open-rule">
|
||||
<summary>开仓规则说明</summary>
|
||||
<div class="opt-close-rule-body">
|
||||
<p>报价单位为每 1 ETH/BTC;1 张 = 0.01。默认选中<strong>最近一期</strong>到期,可手动改。</p>
|
||||
<ul>
|
||||
<li><strong>列表</strong>含卖一/买一;<strong>T 型</strong>仅卖一(买方开仓),中间为跨式双买测算。</li>
|
||||
<li>环境配置「链上仅显示有卖一」开启时,隐藏无真实卖一或深度不足 1 张的合约(估算价 <strong>~</strong> 亦不显示)。</li>
|
||||
<li><strong>开仓只认真实卖一价且卖一深度≥1</strong>;无深度时面板显示参考标记价并禁用买入。</li>
|
||||
<li>链展示近 <span id="opt-chain-dte">14</span> 日到期;列表与 T 型默认<strong>平值 + 实值3档 + 虚值3档</strong>,勾选「展开全部」看全部行权价(若当前为实值/虚值筛选会自动切回「全部」)。</li>
|
||||
<li>「按可用余额打满」可用额度 = min(交易户可用 USDC, 单笔预算 <strong id="opt-trade-budget">{{ '%.2f'|format(options_trade_budget|default(10)|float) }}</strong>),再 × 预算缓冲 <strong id="opt-budget-buf">{{ '%.2f'|format(options_budget_buffer|default(0.95)|float) }}</strong> 算张数(env 可改)。</li>
|
||||
<li>「全仓复利」用期权交易户<strong>全部可用</strong>×缓冲开仓(不受单笔预算限制);可选开启全仓上限;该模式下仅允许同时 1 笔持仓。</li>
|
||||
<li><strong>翻倍出场</strong>:开仓时可勾选;1倍=盈利等于权利金,买一可回收达标后限价平;持仓卡可改倍数或关闭。</li>
|
||||
<li>平仓仅买一限价,详见说明文档。</li>
|
||||
</ul>
|
||||
<p><a href="/options/guide" target="_blank" rel="noopener">打开《期权开平仓与监控说明》</a></p>
|
||||
</div>
|
||||
</details>
|
||||
<div class="form-row options-chain-toolbar">
|
||||
<button type="button" class="btn-secondary opt-uly-btn active" data-uly="ETH">ETH</button>
|
||||
<button type="button" class="btn-secondary opt-uly-btn" data-uly="BTC">BTC</button>
|
||||
<select id="opt-exp-select"><option value="">选择到期日</option></select>
|
||||
<span class="opt-chain-view-group">
|
||||
<button type="button" class="btn-secondary opt-view-btn active" data-view="list">列表</button>
|
||||
<button type="button" class="btn-secondary opt-view-btn" data-view="t">T 型</button>
|
||||
</span>
|
||||
<span id="opt-type-btn-group" class="opt-type-btn-group">
|
||||
<button type="button" class="btn-secondary opt-type-btn active" data-type="C">看涨 Call</button>
|
||||
<button type="button" class="btn-secondary opt-type-btn" data-type="P">看跌 Put</button>
|
||||
</span>
|
||||
<button type="button" class="btn-secondary opt-money-btn active" data-money="all">全部</button>
|
||||
<button type="button" class="btn-secondary opt-money-btn" data-money="itm">实值</button>
|
||||
<button type="button" class="btn-secondary opt-money-btn" data-money="otm">虚值</button>
|
||||
<label id="opt-strike-expand-wrap" class="opt-strike-expand-label">
|
||||
<input type="checkbox" id="opt-strike-expand-all"> 展开全部
|
||||
</label>
|
||||
<button type="button" class="btn-secondary" id="opt-load-chain">刷新链</button>
|
||||
</div>
|
||||
<div id="opt-index-line" class="muted"></div>
|
||||
<div class="options-strike-table-wrap" id="opt-strike-table-wrap">
|
||||
<table class="options-strike-table" id="opt-strike-table">
|
||||
<thead>
|
||||
<tr id="opt-strike-head-list">
|
||||
<th>行权价</th>
|
||||
<th>类型</th>
|
||||
<th>合约</th>
|
||||
<th>卖一/张</th>
|
||||
<th title="指数÷卖一(每1币)">杠杆</th>
|
||||
<th>买一/张</th>
|
||||
<th>到期平衡</th>
|
||||
<th>距平衡</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
<tr id="opt-strike-head-t" class="hidden" hidden>
|
||||
<th colspan="3" class="opt-t-head-call">Call</th>
|
||||
<th colspan="3" class="opt-t-head-mid">跨式</th>
|
||||
<th colspan="3" class="opt-t-head-put">Put</th>
|
||||
</tr>
|
||||
<tr id="opt-strike-head-t-cols" class="hidden" hidden>
|
||||
<th>卖一/张</th>
|
||||
<th>类型</th>
|
||||
<th>操作</th>
|
||||
<th>行权价</th>
|
||||
<th title="Call卖一+Put卖一(每1币)">双买/币</th>
|
||||
<th title="到期测算平衡带">平衡带</th>
|
||||
<th>类型</th>
|
||||
<th>卖一/张</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="opt-strike-tbody">
|
||||
<tr><td colspan="9" class="muted">请选择到期日</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div id="opt-order-panel-host" class="opt-order-backdrop" hidden aria-hidden="true">
|
||||
<div id="opt-order-panel" class="opt-order-dialog" role="dialog" aria-modal="true" aria-labelledby="opt-order-dialog-title" style="display:none">
|
||||
<div class="opt-order-dialog-head">
|
||||
<h3 class="opt-order-title" id="opt-order-dialog-title">下单</h3>
|
||||
<button type="button" class="btn-secondary" id="opt-order-close-btn" style="font-size:.72rem;padding:2px 10px">取消</button>
|
||||
</div>
|
||||
<div class="opt-order-layout">
|
||||
<div class="opt-order-main">
|
||||
<div id="opt-order-inst" class="options-order-inst"></div>
|
||||
<div class="options-order-grid">
|
||||
<div><span class="k">卖一/张</span><span id="opt-order-ask" class="v">—</span></div>
|
||||
<div><span class="k">买一/张</span><span id="opt-order-bid" class="v">—</span></div>
|
||||
<div><span class="k">参考标记价</span><span id="opt-order-ref-ask" class="v muted">—</span></div>
|
||||
<div><span class="k">张数</span><span id="opt-order-sheets" class="v">—</span></div>
|
||||
<div><span class="k" id="opt-order-eth-label">ETH 数量</span><span id="opt-order-eth" class="v">—</span></div>
|
||||
<div><span class="k">预估权利金</span><span id="opt-order-premium" class="v">—</span></div>
|
||||
<div><span class="k">合约杠杆</span><span id="opt-order-leverage" class="v" title="名义价值÷权利金,测算用">—</span></div>
|
||||
<div><span class="k">到期平衡</span><span id="opt-order-expiry-be" class="v">—</span></div>
|
||||
<div><span class="k">距平衡</span><span id="opt-order-dist-be" class="v">—</span></div>
|
||||
</div>
|
||||
<div class="options-estimate-row">
|
||||
<div class="opt-est-main">
|
||||
<label class="btn-secondary opt-order-chip" for="opt-target-idx" title="仅作到期实值估算参考">目标位(指数)</label>
|
||||
<input type="number" id="opt-target-idx" class="opt-target-idx" step="0.1" min="0" placeholder="参考指数·到期实值"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
<span class="k">预计价值</span>
|
||||
<span id="opt-est-value" class="v">—</span>
|
||||
<span class="k">盈利</span>
|
||||
<span id="opt-est-profit" class="v">—</span>
|
||||
<span class="k">盈亏比</span>
|
||||
<span id="opt-est-rr" class="v" title="盈利金额÷本合约权利金">—</span>
|
||||
</div>
|
||||
<span class="muted opt-est-note">目标位仅参考(按到期实值估);盈亏比=盈利÷权利金;到位后按买一限价平;无止损,到期即止损</span>
|
||||
</div>
|
||||
<div class="options-estimate-row opt-profit-exit-row">
|
||||
<div class="opt-est-main">
|
||||
<label class="btn-secondary opt-order-chip" for="opt-profit-exit-enabled" title="开启后监控买一可回收;达标按买一限价平">
|
||||
<input type="checkbox" id="opt-profit-exit-enabled">
|
||||
<span>翻倍出场</span>
|
||||
</label>
|
||||
<label class="k" for="opt-profit-exit-mult">倍数</label>
|
||||
<input type="number" id="opt-profit-exit-mult" class="opt-profit-exit-mult" min="0.1" step="0.1" value="1"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
</div>
|
||||
<span class="muted opt-est-note">1倍=盈利等于权利金(可回收≥2×权利金);可开可关,与目标位并行</span>
|
||||
</div>
|
||||
<div class="form-row options-order-mode-row">
|
||||
<div class="opt-size-mode-bar">
|
||||
<label class="btn-secondary opt-order-chip opt-size-mode-chip">
|
||||
<input type="radio" name="opt-size-mode" value="sheets"{% if not compound_on %} checked{% endif %}>
|
||||
<span>指定张数</span>
|
||||
</label>
|
||||
<input type="number" id="opt-sheets-amount" min="1" step="1" value="1" placeholder="张数"
|
||||
autocomplete="off" inputmode="numeric" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
<label class="btn-secondary opt-order-chip opt-size-mode-chip" id="opt-size-mode-budget-wrap"{% if compound_on %} hidden{% endif %}>
|
||||
<input type="radio" name="opt-size-mode" value="budget_full"{% if compound_on %} disabled{% endif %}>
|
||||
<span>按可用余额打满</span>
|
||||
</label>
|
||||
<label class="btn-secondary opt-order-chip opt-size-mode-chip" id="opt-size-mode-compound-wrap"{% if not compound_on %} hidden{% endif %}>
|
||||
<input type="radio" name="opt-size-mode" value="compound_full"{% if compound_on %} checked{% endif %}{% if not compound_on %} disabled{% endif %}>
|
||||
<span>全仓复利</span>
|
||||
</label>
|
||||
<label class="btn-secondary opt-order-chip opt-size-mode-chip">
|
||||
<input type="radio" name="opt-size-mode" value="eth_amount" id="opt-size-mode-eth">
|
||||
<span>指定币数量</span>
|
||||
</label>
|
||||
<input type="number" id="opt-eth-amount" min="0.01" step="0.01" placeholder="如 0.5" style="display:none"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
</div>
|
||||
<p class="muted opt-budget-full-hint" id="opt-budget-full-hint" style="display:none;margin:6px 0 0;font-size:.82rem;line-height:1.4">
|
||||
余额 > 单笔预算(<span id="opt-budget-full-cap">{{ '%.2f'|format(options_trade_budget|default(10)|float) }}</span>U)时按预算;余额不足时按余额;再乘预算缓冲算张数。
|
||||
</p>
|
||||
<p class="muted opt-compound-full-hint" id="opt-compound-full-hint" style="display:none;margin:6px 0 0;font-size:.82rem;line-height:1.4">
|
||||
用期权交易户全部可用×缓冲开仓;不受单笔预算限制。<span id="opt-compound-cap-line">全仓上限关闭</span>。仅允许同时持有 1 笔仓位。
|
||||
</p>
|
||||
<input type="text" id="opt-signal-note" name="opt_signal_note" class="opt-signal-note" placeholder="备注(关键位说明)"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-lpignore="true" data-1p-ignore="true" data-form-type="other" readonly>
|
||||
</div>
|
||||
<div class="opt-order-dialog-actions">
|
||||
<button type="button" class="btn-primary" id="opt-open-btn">限价买入 @ 卖一</button>
|
||||
<button type="button" class="btn-secondary" id="opt-order-cancel-btn">取消</button>
|
||||
</div>
|
||||
<div id="opt-order-msg" class="muted"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card options-pos-card-wrap">
|
||||
<div class="options-pos-head">
|
||||
<h2>持仓</h2>
|
||||
<button type="button" class="btn-secondary" id="opt-refresh-positions">刷新</button>
|
||||
</div>
|
||||
<div class="options-pos-tabs" role="tablist" aria-label="持仓面板">
|
||||
<button type="button" class="btn-secondary opt-pos-tab active" data-opt-pos-tab="live" role="tab" aria-selected="true" id="opt-pos-tab-live">当前持仓</button>
|
||||
<button type="button" class="btn-secondary opt-pos-tab" data-opt-pos-tab="pending" role="tab" aria-selected="false" id="opt-pos-tab-pending">当前委托</button>
|
||||
<button type="button" class="btn-secondary opt-pos-tab" data-opt-pos-tab="stats" role="tab" aria-selected="false" id="opt-pos-tab-stats">数据统计</button>
|
||||
<button type="button" class="btn-secondary opt-pos-tab" data-opt-pos-tab="history" role="tab" aria-selected="false" id="opt-pos-tab-history">期权历史</button>
|
||||
</div>
|
||||
<div class="options-pos-tab-body">
|
||||
<div class="options-pos-pane is-active" data-opt-pos-pane="live" role="tabpanel" aria-labelledby="opt-pos-tab-live">
|
||||
<div id="opt-target-monitors" class="opt-target-monitors" hidden>
|
||||
<div class="opt-target-monitors-head">目标监控</div>
|
||||
<div id="opt-target-monitors-list"></div>
|
||||
</div>
|
||||
<div id="opt-pos-live" class="panel-scroll pos-list options-pos-live-pane">
|
||||
<div class="pos-empty" id="opt-pos-empty">暂无持仓</div>
|
||||
<div id="opt-pos-cards"></div>
|
||||
</div>
|
||||
<details class="opt-close-rule">
|
||||
<summary>买一平仓规则说明</summary>
|
||||
<div class="opt-close-rule-body">
|
||||
<p>平仓前重新读盘口并校验有效流动性;市价平仓已禁用。</p>
|
||||
<ul>
|
||||
<li>本轮只锁<strong>买一</strong>:张数 = min(持仓, 买一深度),限价 = 当场买一。</li>
|
||||
<li>买一不够时只平能吃掉的部分,剩余等下次再点「买一平仓」。</li>
|
||||
<li>手动平仓只验有效买一(非残档);目标触达后才平,2×权利金只是门控(到 2× 本身不会自动平)。</li>
|
||||
<li><strong>翻倍出场</strong>:开启后可自选倍数(默认1);1倍=盈利等于权利金,买一可回收达标即限价平;可随时关闭。</li>
|
||||
<li>全程 <code>reduceOnly</code> 限价卖,不吃买二及以下、不走市价。</li>
|
||||
</ul>
|
||||
<p><a href="/options/guide" target="_blank" rel="noopener">打开《期权开平仓与监控说明》</a></p>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
<div class="options-pos-pane" data-opt-pos-pane="pending" role="tabpanel" aria-labelledby="opt-pos-tab-pending" hidden>
|
||||
<div class="opt-pos-pending-pane">
|
||||
<div class="opt-order-pending-head">
|
||||
<p class="muted opt-pending-ttl-hint" id="opt-pending-ttl-hint" style="margin:0;flex:1">平仓限价超 10 分未成交将自动撤销</p>
|
||||
<button type="button" class="btn-secondary" id="opt-pending-refresh">刷新</button>
|
||||
</div>
|
||||
<div id="opt-pending-list" class="opt-pending-list opt-pending-list--tab">
|
||||
<div class="muted opt-pending-empty">暂无未成交委托</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-pos-pane" data-opt-pos-pane="stats" role="tabpanel" aria-labelledby="opt-pos-tab-stats" hidden>
|
||||
<div class="options-stats-panel">
|
||||
<div class="options-stats-pnl-summary" id="opt-stats-pnl-summary">
|
||||
<div class="options-stat-item opt-stats-net-item">
|
||||
<span class="k">合计盈亏</span>
|
||||
<span class="v" id="opt-stats-total-pnl">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">已平净盈亏</span>
|
||||
<span class="v" id="opt-stats-net-realized">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">持仓浮盈</span>
|
||||
<span class="v" id="opt-stats-open-float">—</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-stats-charts">
|
||||
<div class="opt-stats-chart opt-stats-chart--ring">
|
||||
<div class="opt-stats-ring" id="opt-stats-ring" style="--win-pct: 0">
|
||||
<span class="opt-stats-ring-label" id="opt-stats-ring-label">—</span>
|
||||
</div>
|
||||
<span class="opt-stats-chart-caption">胜率</span>
|
||||
</div>
|
||||
<div class="opt-stats-chart opt-stats-chart--pnl">
|
||||
<div class="opt-stats-bar-row">
|
||||
<span class="k">平均盈利</span>
|
||||
<div class="opt-stats-bar-track">
|
||||
<div class="opt-stats-bar-fill opt-stats-bar-fill--profit" id="opt-stats-bar-profit"></div>
|
||||
</div>
|
||||
<span class="v pos-pnl-profit" id="opt-stats-bar-profit-label">—</span>
|
||||
</div>
|
||||
<div class="opt-stats-bar-row">
|
||||
<span class="k">平均亏损</span>
|
||||
<div class="opt-stats-bar-track">
|
||||
<div class="opt-stats-bar-fill opt-stats-bar-fill--loss" id="opt-stats-bar-loss"></div>
|
||||
</div>
|
||||
<span class="v pos-pnl-loss" id="opt-stats-bar-loss-label">—</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="opt-stats-chart opt-stats-chart--hold">
|
||||
<div class="opt-stats-chart-title">持仓时长对比</div>
|
||||
<div class="opt-stats-bar-row">
|
||||
<span class="k">盈单</span>
|
||||
<div class="opt-stats-bar-track">
|
||||
<div class="opt-stats-bar-fill opt-stats-bar-fill--profit" id="opt-stats-bar-win-hold"></div>
|
||||
</div>
|
||||
<span class="v" id="opt-stats-win-hold-label">—</span>
|
||||
</div>
|
||||
<div class="opt-stats-bar-row">
|
||||
<span class="k">亏单</span>
|
||||
<div class="opt-stats-bar-track">
|
||||
<div class="opt-stats-bar-fill opt-stats-bar-fill--loss" id="opt-stats-bar-loss-hold"></div>
|
||||
</div>
|
||||
<span class="v" id="opt-stats-loss-hold-label">—</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-stats-grid">
|
||||
<div class="options-stat-item">
|
||||
<span class="k">胜率</span>
|
||||
<span class="v" id="opt-stats-winrate">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">盈亏比</span>
|
||||
<span class="v" id="opt-stats-plr">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">已平笔数</span>
|
||||
<span class="v" id="opt-stats-closed">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">平均盈利</span>
|
||||
<span class="v pos-pnl-profit" id="opt-stats-profit">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">平均亏损</span>
|
||||
<span class="v pos-pnl-loss" id="opt-stats-loss">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">均持仓</span>
|
||||
<span class="v" id="opt-stats-avg-hold">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">盈单持仓</span>
|
||||
<span class="v" id="opt-stats-win-hold">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">亏单持仓</span>
|
||||
<span class="v" id="opt-stats-loss-hold">—</span>
|
||||
</div>
|
||||
<div class="options-stat-item">
|
||||
<span class="k">持仓中</span>
|
||||
<span class="v" id="opt-stats-open-hold">—</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-pos-pane" data-opt-pos-pane="history" role="tabpanel" aria-labelledby="opt-pos-tab-history" hidden>
|
||||
<div class="options-history-table-wrap">
|
||||
<table class="options-strike-table opt-history-table" id="opt-history-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>合约</th>
|
||||
<th>张数</th>
|
||||
<th>权利金</th>
|
||||
<th>状态</th>
|
||||
<th>盈亏</th>
|
||||
<th>时间</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="opt-history-tbody">
|
||||
<tr><td colspan="7" class="muted">加载中…</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/static/options_expiry_countdown.js?v=1"></script>
|
||||
<script src="/static/options_panel.js?v=64"></script>
|
||||
@@ -0,0 +1,419 @@
|
||||
{# OKX 期权复盘:交易记录 → 复盘表单 → 复盘记录 → 统计 #}
|
||||
<div class="options-review-wrap" id="options-review-root" style="grid-column:1/-1">
|
||||
{% if not options_enabled %}
|
||||
<div class="flash" style="margin-bottom:12px;font-size:.82rem">期权未启用:请设置 <code>OKX_OPTIONS_ENABLED=true</code> 后重启.</div>
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.options-review-wrap{font-size:.82rem;display:flex;flex-direction:column;gap:14px}
|
||||
.options-review-wrap h2,.options-review-wrap h3{margin:0}
|
||||
.or-page-head{
|
||||
display:flex;align-items:center;gap:10px;flex-wrap:wrap;
|
||||
padding:2px 2px 0;
|
||||
}
|
||||
.or-page-head h2{font-size:1.05rem;font-weight:650;margin-right:auto;letter-spacing:.02em}
|
||||
.or-section{
|
||||
margin:0;padding:14px 16px 16px;
|
||||
border:1px solid var(--or-border, rgba(127,127,127,.28));
|
||||
border-radius:12px;
|
||||
background:var(--or-section-bg, rgba(18,23,38,.55));
|
||||
box-shadow:var(--or-section-shadow, 0 1px 0 rgba(255,255,255,.03) inset);
|
||||
color:var(--or-text, inherit);
|
||||
}
|
||||
.or-section-head{
|
||||
display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;
|
||||
margin-bottom:12px;padding-bottom:10px;
|
||||
border-bottom:1px solid var(--or-border-soft, rgba(127,127,127,.22));
|
||||
}
|
||||
.or-section-head > div{min-width:0;flex:1}
|
||||
.or-step{
|
||||
flex-shrink:0;width:1.55rem;height:1.55rem;border-radius:999px;
|
||||
display:inline-flex;align-items:center;justify-content:center;
|
||||
font-size:.72rem;font-weight:700;
|
||||
background:var(--or-accent-bg, rgba(99,102,241,.28));
|
||||
color:var(--or-accent-fg, #c7c9ff);
|
||||
border:1px solid var(--or-accent-border, rgba(129,140,248,.45));
|
||||
}
|
||||
.or-section-title{font-size:.95rem;font-weight:650;line-height:1.3;color:var(--or-title, inherit)}
|
||||
.or-section-desc{margin:4px 0 0;font-size:.72rem;opacity:.72;line-height:1.45;color:var(--or-muted, inherit)}
|
||||
.or-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
|
||||
.or-toolbar{display:flex;flex-direction:column;gap:0;margin:0}
|
||||
.or-tab{
|
||||
border:1px solid var(--or-border, rgba(127,127,127,.35));background:transparent;color:inherit;
|
||||
padding:6px 12px;border-radius:8px;cursor:pointer;font-size:.78rem;
|
||||
}
|
||||
.or-tab.active{
|
||||
background:var(--or-accent-bg, rgba(99,102,241,.28));
|
||||
border-color:var(--or-accent-border, rgba(129,140,248,.55));
|
||||
color:var(--or-accent-fg, #e8e9ff);font-weight:600;
|
||||
}
|
||||
.or-filters{
|
||||
display:flex;flex-wrap:wrap;gap:8px;align-items:center;
|
||||
margin:0;padding:10px 12px;border-radius:10px;
|
||||
background:var(--or-filters-bg, rgba(0,0,0,.22));
|
||||
border:1px solid var(--or-border-soft, rgba(127,127,127,.18));
|
||||
}
|
||||
.or-filters select,.or-filters input[type="search"],.or-filters input[type="datetime-local"]{
|
||||
font-size:.76rem;min-height:2rem;
|
||||
}
|
||||
.or-filters #or-filter-q{max-width:168px}
|
||||
.or-filters label{display:flex;align-items:center;gap:5px;font-size:.72rem;opacity:.85}
|
||||
.or-badge{
|
||||
display:inline-block;padding:1px 7px;border-radius:999px;
|
||||
background:var(--or-badge-bg, rgba(127,127,127,.22));font-size:.7rem;vertical-align:middle;
|
||||
}
|
||||
.or-list-title{display:none}
|
||||
.or-trades-table,.or-reviewed-table{font-size:.78rem}
|
||||
.or-trades-table tr.or-row-active{
|
||||
outline:1px solid var(--or-accent-border, rgba(129,140,248,.55));
|
||||
background:var(--or-row-active-bg, rgba(99,102,241,.1));
|
||||
}
|
||||
.or-reviewed-table tbody tr{cursor:pointer}
|
||||
.or-reviewed-table tbody tr:hover{background:var(--or-row-hover-bg, rgba(99,102,241,.08))}
|
||||
.or-pager{
|
||||
display:flex;align-items:center;gap:8px;margin-top:10px;
|
||||
padding-top:8px;border-top:1px dashed var(--or-border-soft, rgba(127,127,127,.2));font-size:.74rem;
|
||||
}
|
||||
.or-list-loading{opacity:.55;pointer-events:none;transition:opacity .12s ease}
|
||||
.or-trades-table-wrap,.or-reviewed-table-wrap{min-height:9.5rem;overflow-x:auto}
|
||||
.or-reviewed-table{min-width:980px}
|
||||
.or-kpi-row{
|
||||
display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
|
||||
gap:8px;margin-bottom:12px;
|
||||
}
|
||||
.or-kpi-tile{
|
||||
border:1px solid var(--or-border-soft, rgba(127,127,127,.22));border-radius:10px;
|
||||
padding:10px 12px;background:var(--or-tile-bg, rgba(0,0,0,.2));min-width:0;
|
||||
}
|
||||
.or-kpi-label{font-size:.7rem;opacity:.7;margin-bottom:4px}
|
||||
.or-kpi-value{font-size:.95rem;font-weight:650;letter-spacing:.01em;word-break:break-all}
|
||||
.or-stats-grid{
|
||||
display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;
|
||||
}
|
||||
.or-stat-card{
|
||||
border:1px solid var(--or-border-soft, rgba(127,127,127,.22));border-radius:10px;
|
||||
padding:10px 12px;background:var(--or-tile-bg, rgba(0,0,0,.16));font-size:.76rem;
|
||||
}
|
||||
.or-stat-card-title{
|
||||
font-weight:650;margin-bottom:8px;font-size:.78rem;
|
||||
padding-bottom:6px;border-bottom:1px solid var(--or-border-soft, rgba(127,127,127,.18));
|
||||
}
|
||||
.or-stat-row{
|
||||
display:flex;justify-content:space-between;align-items:baseline;gap:10px;
|
||||
padding:5px 0;border-bottom:1px solid var(--or-border-faint, rgba(127,127,127,.1));
|
||||
}
|
||||
.or-stat-row:last-child{border-bottom:none;padding-bottom:0}
|
||||
.or-stat-key{opacity:.9;min-width:0;overflow:hidden;text-overflow:ellipsis}
|
||||
.or-stat-val{flex-shrink:0;font-variant-numeric:tabular-nums;opacity:.85}
|
||||
.or-journal-card{font-size:.78rem}
|
||||
.or-journal-card h2{font-size:.92rem}
|
||||
.or-journal-card input,
|
||||
.or-journal-card select,
|
||||
.or-journal-card textarea,
|
||||
.or-journal-card button{font-size:.76rem}
|
||||
.or-journal-card .or-form-grid,
|
||||
.or-journal-card .or-form-grid2{
|
||||
display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;margin-bottom:6px;
|
||||
}
|
||||
.or-journal-card .or-mood-grid{display:flex;flex-wrap:wrap;gap:6px 12px;margin:8px 0;font-size:.74rem}
|
||||
.or-journal-card .muted,.or-journal-card .sub{font-size:.7rem}
|
||||
.or-journal-card.hidden{display:none!important}
|
||||
.or-detail-backdrop{
|
||||
position:fixed;inset:0;z-index:1300;
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
padding:16px;background:var(--or-backdrop, rgba(0,0,0,.72));
|
||||
}
|
||||
.or-detail-backdrop[hidden]{display:none!important}
|
||||
.or-img-lightbox{
|
||||
position:fixed;inset:0;z-index:2200;
|
||||
display:flex;align-items:center;justify-content:center;
|
||||
padding:16px;background:rgba(0,0,0,.86);cursor:zoom-out;
|
||||
}
|
||||
.or-img-lightbox[hidden]{display:none!important}
|
||||
.or-img-lightbox img{
|
||||
max-width:min(96vw,1200px);max-height:92vh;
|
||||
object-fit:contain;border-radius:8px;
|
||||
box-shadow:0 12px 40px rgba(0,0,0,.55);
|
||||
}
|
||||
.or-detail-modal{
|
||||
width:min(96vw,920px);max-height:90vh;overflow:auto;
|
||||
background:var(--or-modal-bg, var(--card-bg, #121726));color:var(--or-text, inherit);
|
||||
border:1px solid var(--or-border, rgba(127,127,127,.35));border-radius:10px;
|
||||
padding:14px 16px 18px;box-shadow:var(--or-modal-shadow, 0 12px 40px rgba(0,0,0,.45));
|
||||
}
|
||||
.or-detail-modal-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
|
||||
.or-detail-modal-head h3{margin:0;margin-right:auto;font-size:.95rem;color:var(--or-title, inherit)}
|
||||
.or-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:6px 12px;font-size:.76rem;margin-bottom:8px}
|
||||
.or-detail-images{
|
||||
display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
|
||||
gap:10px;margin:10px 0 4px;
|
||||
}
|
||||
.or-detail-img-cell{
|
||||
min-width:0;border:1px solid var(--or-border-soft, rgba(127,127,127,.25));border-radius:8px;
|
||||
padding:8px;display:flex;flex-direction:column;gap:6px;
|
||||
background:var(--or-tile-bg, rgba(0,0,0,.18));
|
||||
}
|
||||
.or-detail-img-label{font-size:.72rem;opacity:.85;font-weight:600}
|
||||
.or-detail-img-thumb{
|
||||
width:100%;max-height:280px;object-fit:contain;
|
||||
border-radius:6px;cursor:zoom-in;background:var(--or-img-bg, rgba(0,0,0,.25));
|
||||
}
|
||||
.or-detail-img-miss{
|
||||
min-height:120px;display:flex;align-items:center;justify-content:center;
|
||||
font-size:.72rem;opacity:.65;border-radius:6px;background:rgba(127,127,127,.12);
|
||||
}
|
||||
.or-slot-thumb{
|
||||
display:block;margin-top:6px;max-width:160px;max-height:90px;
|
||||
object-fit:contain;border-radius:4px;border:1px solid var(--or-border, rgba(127,127,127,.3));
|
||||
background:var(--or-img-bg, rgba(0,0,0,.2));cursor:zoom-in;
|
||||
}
|
||||
@media (max-width:900px){
|
||||
.or-kpi-row{grid-template-columns:repeat(3,minmax(0,1fr))}
|
||||
}
|
||||
@media (max-width:640px){
|
||||
.or-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}
|
||||
.or-detail-images{grid-template-columns:1fr}
|
||||
.or-detail-img-thumb{max-height:220px}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="or-page-head">
|
||||
<h2>期权复盘</h2>
|
||||
<span class="muted" id="or-sync-status" style="font-size:.72rem"></span>
|
||||
<button type="button" class="btn-secondary" id="or-reload-btn" style="font-size:.76rem;padding:4px 10px">刷新</button>
|
||||
</div>
|
||||
|
||||
{# Tab + 筛选:放在各内容卡片上方,全局作用于下方列表/统计 #}
|
||||
<div class="or-toolbar">
|
||||
<div class="or-tabs" role="tablist" aria-label="复盘分类" data-okx-trade-mode="{{ okx_trade_mode|default('options') }}">
|
||||
{% if okx_trade_mode|default('options') == 'options' %}
|
||||
<button type="button" class="or-tab active" data-source="option_spot" role="tab">期权交易记录</button>
|
||||
{% elif okx_trade_mode == 'options_options' %}
|
||||
<button type="button" class="or-tab active" data-source="options_options" role="tab">期期对冲记录</button>
|
||||
{% elif okx_trade_mode == 'perp_options' %}
|
||||
<button type="button" class="or-tab active" data-source="perp_options" role="tab">永期对冲记录</button>
|
||||
{% else %}
|
||||
<button type="button" class="or-tab active" data-source="option_spot" role="tab">期权交易记录</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="or-filters">
|
||||
<select id="or-filter-uly" autocomplete="off">
|
||||
<option value="">标的:全部</option>
|
||||
<option value="ETH">ETH</option>
|
||||
<option value="BTC">BTC</option>
|
||||
</select>
|
||||
<select id="or-filter-opt" autocomplete="off">
|
||||
<option value="">Call/Put:全部</option>
|
||||
<option value="C">Call</option>
|
||||
<option value="P">Put</option>
|
||||
</select>
|
||||
<input type="text" name="username" autocomplete="username" tabindex="-1" aria-hidden="true"
|
||||
style="position:absolute;left:-9999px;width:1px;height:1px;opacity:0" value="">
|
||||
<input type="search" id="or-filter-q" name="or_filter_q" placeholder="搜索标的/合约/策略"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-lpignore="true" data-1p-ignore="true" data-form-type="other" readonly>
|
||||
<input type="datetime-local" id="or-filter-from" title="平仓起" autocomplete="off">
|
||||
<input type="datetime-local" id="or-filter-to" title="平仓止" autocomplete="off">
|
||||
{% if okx_trade_mode|default('options') == 'options' %}
|
||||
<label class="muted">
|
||||
<input type="checkbox" id="or-include-hedge-legs"> 含已归属对冲的期权腿
|
||||
</label>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# 1. 交易记录 #}
|
||||
<section class="or-section" aria-labelledby="or-list-title">
|
||||
<div class="or-section-head">
|
||||
<span class="or-step" aria-hidden="true">1</span>
|
||||
<div>
|
||||
<div class="or-section-title" id="or-list-title">期权交易记录</div>
|
||||
<p class="or-section-desc">点「复盘」填写表单；已复盘仍保留在此，也可在下方查看详情。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-strike-table-wrap or-trades-table-wrap" id="or-trades-wrap">
|
||||
<table class="options-strike-table or-trades-table" id="or-trades-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>类型</th>
|
||||
<th>标的/合约</th>
|
||||
<th>盈亏</th>
|
||||
<th>开仓时间</th>
|
||||
<th>平仓时间</th>
|
||||
<th>持有</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="or-trades-tbody">
|
||||
<tr><td colspan="7" class="muted">加载中…</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="or-pager" id="or-trades-pager">
|
||||
<button type="button" class="btn-secondary" id="or-trades-prev" style="font-size:.72rem;padding:2px 8px">上一页</button>
|
||||
<span class="muted" id="or-trades-page-label">第 1 / 1 页</span>
|
||||
<button type="button" class="btn-secondary" id="or-trades-next" style="font-size:.72rem;padding:2px 8px">下一页</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{# 2. 复盘上传(默认隐藏) #}
|
||||
<section class="or-section journal-card or-journal-card hidden" id="or-journal-card">
|
||||
<div class="or-section-head">
|
||||
<span class="or-step" aria-hidden="true">✎</span>
|
||||
<div>
|
||||
<div class="or-section-title">填写复盘</div>
|
||||
<p class="or-section-desc" id="or-journal-summary">截图槽位 5m / 15m / 1h / 4h，选文件后即时上传。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="or-journal-body">
|
||||
<form id="or-journal-form" onsubmit="return false;">
|
||||
<input type="hidden" id="or-trade-id" value="">
|
||||
<input type="hidden" id="or-draft-id" value="">
|
||||
<div class="or-form-grid">
|
||||
<input type="datetime-local" id="or-f-open" title="开仓时间" autocomplete="off">
|
||||
<input type="datetime-local" id="or-f-close" title="平仓时间" autocomplete="off">
|
||||
<input type="text" id="or-f-coin" name="or_f_coin" placeholder="标的(如 ETH)"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
<input type="text" id="or-f-inst" name="or_f_inst" placeholder="合约/计划"
|
||||
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
|
||||
data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
<input type="text" id="or-f-pnl" name="or_f_pnl" placeholder="盈亏(U)"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-form-type="other">
|
||||
<input type="text" id="or-f-hold" name="or_f_hold" placeholder="持有时长" readonly autocomplete="off">
|
||||
</div>
|
||||
<div class="or-form-grid2">
|
||||
<select id="or-f-strategy" title="策略标签" required>
|
||||
<option value="">策略标签</option>
|
||||
</select>
|
||||
<select id="or-f-direction" title="方向判断">
|
||||
<option value="">方向判断</option>
|
||||
</select>
|
||||
<select id="or-f-exit" title="离场原因">
|
||||
<option value="">离场原因</option>
|
||||
<option value="止盈">止盈</option>
|
||||
<option value="止损">止损</option>
|
||||
<option value="到期">到期</option>
|
||||
<option value="目标价">目标价</option>
|
||||
<option value="手动平仓">手动平仓</option>
|
||||
<option value="其他">其他</option>
|
||||
</select>
|
||||
<select id="or-f-followed" title="是否按计划">
|
||||
<option value="">是否按计划</option>
|
||||
<option value="是">是</option>
|
||||
<option value="否">否</option>
|
||||
<option value="部分">部分</option>
|
||||
</select>
|
||||
<select id="or-f-result" title="结果标签">
|
||||
<option value="">结果标签</option>
|
||||
<option value="盈利">盈利</option>
|
||||
<option value="亏损">亏损</option>
|
||||
<option value="持平">持平</option>
|
||||
</select>
|
||||
</div>
|
||||
<select id="or-f-entry" title="入场逻辑" style="width:100%;margin-bottom:6px;box-sizing:border-box">
|
||||
<option value="">入场逻辑</option>
|
||||
</select>
|
||||
|
||||
<div class="journal-upload-slots" id="or-upload-slots">
|
||||
{% for tf in ['5m', '15m', '1h', '4h'] %}
|
||||
<div class="journal-upload-row" data-tf="{{ tf }}">
|
||||
<span class="journal-upload-slot-label">{{ tf }}</span>
|
||||
<input type="file" accept="image/*" class="or-upload-input" data-tf="{{ tf }}">
|
||||
<input type="hidden" class="or-upload-hidden" data-tf="{{ tf }}" value="">
|
||||
<span class="journal-upload-status or-upload-status" data-tf="{{ tf }}" aria-live="polite"></span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<p class="sub journal-upload-hint">可只传部分周期;选文件后即时上传</p>
|
||||
|
||||
<div class="or-mood-grid mood-grid">
|
||||
<label><input type="checkbox" class="or-mood" value="怕踏空">怕踏空</label>
|
||||
<label><input type="checkbox" class="or-mood" value="报复开仓">报复开仓</label>
|
||||
<label><input type="checkbox" class="or-mood" value="盈利飘了">盈利飘了</label>
|
||||
<label><input type="checkbox" class="or-mood" value="拿不住单">拿不住单</label>
|
||||
<label><input type="checkbox" class="or-mood" value="扛单">扛单</label>
|
||||
<label><input type="checkbox" class="or-mood" value="重仓违规">重仓违规</label>
|
||||
</div>
|
||||
<textarea id="or-f-note" rows="2" placeholder="备注" style="width:100%;box-sizing:border-box"></textarea>
|
||||
<div class="form-row" style="margin-top:8px;gap:6px">
|
||||
<button type="button" class="btn" id="or-save-btn">保存复盘记录</button>
|
||||
<button type="button" class="btn-secondary" id="or-clear-btn">取消</button>
|
||||
<button type="button" class="btn-secondary" id="or-del-btn">删除复盘内容</button>
|
||||
<span class="muted" id="or-save-status"></span>
|
||||
</div>
|
||||
<div id="or-legs-host" style="margin-top:10px;font-size:.74rem"></div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{# 3. 已复盘记录 #}
|
||||
<section class="or-section" aria-labelledby="or-reviewed-heading">
|
||||
<div class="or-section-head">
|
||||
<span class="or-step" aria-hidden="true">2</span>
|
||||
<div>
|
||||
<div class="or-section-title" id="or-reviewed-heading">复盘记录</div>
|
||||
<p class="or-section-desc">已保存的复盘内容，点一行查看详情与截图。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options-strike-table-wrap or-reviewed-table-wrap" id="or-reviewed-wrap">
|
||||
<table class="options-strike-table or-reviewed-table" id="or-reviewed-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>类型</th>
|
||||
<th>标的/合约</th>
|
||||
<th>方向</th>
|
||||
<th>盈亏</th>
|
||||
<th>开仓时间</th>
|
||||
<th>平仓时间</th>
|
||||
<th>持仓时长</th>
|
||||
<th>策略</th>
|
||||
<th>入场逻辑</th>
|
||||
<th>结果</th>
|
||||
<th>复盘时间</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="or-reviewed-tbody">
|
||||
<tr><td colspan="11" class="muted">加载中…</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="or-pager" id="or-reviewed-pager">
|
||||
<button type="button" class="btn-secondary" id="or-reviewed-prev" style="font-size:.72rem;padding:2px 8px">上一页</button>
|
||||
<span class="muted" id="or-reviewed-page-label">第 1 / 1 页</span>
|
||||
<button type="button" class="btn-secondary" id="or-reviewed-next" style="font-size:.72rem;padding:2px 8px">下一页</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{# 详情 / 放大 #}
|
||||
<div id="or-detail-backdrop" class="or-detail-backdrop" hidden>
|
||||
<div class="or-detail-modal" role="dialog" aria-modal="true" aria-labelledby="or-detail-title" id="or-detail-panel">
|
||||
<div class="or-detail-modal-head">
|
||||
<h3 id="or-detail-title">复盘详情</h3>
|
||||
<button type="button" class="btn-secondary" id="or-detail-edit-btn" style="font-size:.72rem;padding:2px 8px">编辑</button>
|
||||
<button type="button" class="btn-secondary" id="or-detail-close-btn" style="font-size:.72rem;padding:2px 8px">关闭</button>
|
||||
</div>
|
||||
<div class="or-detail-grid" id="or-detail-meta"></div>
|
||||
<div id="or-detail-text" style="font-size:.76rem;line-height:1.5;margin-bottom:8px"></div>
|
||||
<div class="or-detail-images" id="or-detail-images"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="or-img-lightbox" class="or-img-lightbox" hidden>
|
||||
<img id="or-img-lightbox-img" src="" alt="截图放大">
|
||||
</div>
|
||||
|
||||
{# 4. 统计 #}
|
||||
<section class="or-section" aria-labelledby="or-stats-heading">
|
||||
<div class="or-section-head">
|
||||
<span class="or-step" aria-hidden="true">3</span>
|
||||
<div>
|
||||
<div class="or-section-title" id="or-stats-heading">统计</div>
|
||||
<p class="or-section-desc">跟随上方 Tab 与筛选条件汇总。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div id="or-kpi" class="or-kpi-row"></div>
|
||||
<div id="or-stats-groups" class="or-stats-grid"></div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<script src="/static/options_review.js?v=23"></script>
|
||||
@@ -0,0 +1,3 @@
|
||||
{# 期权设置脚本挂载点(卡片在 settings_panel 中拆分) #}
|
||||
<div id="options-settings-root" hidden></div>
|
||||
<script src="/static/options_settings.js?v=10"></script>
|
||||
@@ -0,0 +1,16 @@
|
||||
<div class="options-settings-section">
|
||||
<p class="options-settings-hint">账户资金账户:USDT ↔ USDC 现货市价单.</p>
|
||||
<div class="form-row settings-transfer-form options-settings-row">
|
||||
<input type="text" name="username" autocomplete="username" tabindex="-1" aria-hidden="true"
|
||||
style="position:absolute;left:-9999px;width:1px;height:1px;opacity:0" value="">
|
||||
<select id="opt-set-swap-dir" aria-label="兑换方向" autocomplete="off">
|
||||
<option value="usdt_to_usdc" selected>USDT → USDC</option>
|
||||
<option value="usdc_to_usdt">USDC → USDT</option>
|
||||
</select>
|
||||
<input type="number" id="opt-set-swap-amount" name="cm_opt_swap_amt" min="0.01" step="0.01" placeholder="数量"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-bwignore="true" data-form-type="other" readonly>
|
||||
<button type="button" class="btn-secondary btn-sm" id="opt-set-swap-all-btn">全部兑换</button>
|
||||
<button type="button" class="btn-primary btn-sm" id="opt-set-swap-btn">市价兑换</button>
|
||||
</div>
|
||||
<div id="opt-set-swap-msg" class="options-settings-msg muted"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,24 @@
|
||||
<div class="options-settings-section">
|
||||
<div class="options-settings-subtitle">账户内划转</div>
|
||||
<div class="form-row settings-transfer-form options-settings-row">
|
||||
<input type="text" name="username" autocomplete="username" tabindex="-1" aria-hidden="true"
|
||||
style="position:absolute;left:-9999px;width:1px;height:1px;opacity:0" value="">
|
||||
<select id="opt-set-int-ccy" aria-label="币种" autocomplete="off">
|
||||
<option value="USDC" selected>USDC</option>
|
||||
<option value="USDT">USDT</option>
|
||||
</select>
|
||||
<select id="opt-set-int-from" aria-label="划出账户">
|
||||
<option value="funding" selected>from: 资金</option>
|
||||
<option value="trading">from: 交易</option>
|
||||
</select>
|
||||
<select id="opt-set-int-to" aria-label="划入账户">
|
||||
<option value="trading" selected>to: 交易</option>
|
||||
<option value="funding">to: 资金</option>
|
||||
</select>
|
||||
<input type="number" id="opt-set-int-amount" name="cm_opt_int_amt" min="0.01" step="0.01" placeholder="数量"
|
||||
autocomplete="off" inputmode="decimal" data-lpignore="true" data-1p-ignore="true" data-bwignore="true" data-form-type="other" readonly>
|
||||
<button type="button" class="btn-secondary btn-sm" id="opt-set-int-all-btn">全部划转</button>
|
||||
<button type="button" class="btn-primary btn-sm" id="opt-set-int-btn">划转</button>
|
||||
</div>
|
||||
<div id="opt-set-int-msg" class="options-settings-msg muted"></div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user