diff --git a/static/css/records.css b/static/css/records.css index 65e3cc2..9d6b722 100644 --- a/static/css/records.css +++ b/static/css/records.css @@ -181,33 +181,16 @@ line-height: 1.45; } -.records-trade-actions { - display: none; - align-items: center; - gap: .3rem; - flex-shrink: 0; - flex-wrap: nowrap; -} - .records-trade-verify-form { display: inline-flex; margin: 0; } -.records-trade-actions .btn-link, -.records-trade-actions a, -.records-trade-actions button { - font-size: .72rem; - padding: .3rem .5rem; - border-radius: 6px; - text-decoration: none; - border: none; - cursor: pointer; - white-space: nowrap; - flex-shrink: 0; +.records-trade-row-actions { + min-width: 0; } -.records-trade-actions .btn-link { +.records-trade-row-actions .btn-link { background: transparent; color: var(--accent); } @@ -218,6 +201,76 @@ margin-top: .35rem; } +.records-phone-only, +.records-tablet-only { + display: none; +} + +/* 平板交易记录表格(对齐数据看板平仓记录) */ +.records-trade-table-wrap { + overflow-x: auto; + -webkit-overflow-scrolling: touch; +} + +.records-trade-table-wrap .dashboard-table { + width: 100%; + border-collapse: collapse; + font-size: .82rem; +} + +.records-trade-table-wrap .dashboard-table th, +.records-trade-table-wrap .dashboard-table td { + padding: .45rem .55rem; + border-bottom: 1px solid var(--table-border); + text-align: left; + white-space: nowrap; + font-variant-numeric: tabular-nums; + vertical-align: middle; +} + +.records-trade-table-wrap .dashboard-table tbody tr:last-child td { + border-bottom: none; +} + +.records-trade-table-wrap .dash-symbol-ex { + font-weight: 400; + font-size: .78rem; +} + +.records-trade-table-wrap .dash-main-badge { + font-size: .68rem; + vertical-align: middle; +} + +.records-trade-table-wrap .dashboard-table .badge.dir-long, +.records-trade-table-wrap .dashboard-table .badge.dir-short { + font-size: .72rem; +} + +.records-trade-table-wrap .dashboard-table .badge.dir-long { + background: var(--profit-bg); + color: var(--profit); +} + +.records-trade-table-wrap .dashboard-table .badge.dir-short { + background: var(--loss-bg); + color: var(--loss); +} + +.records-trade-table-wrap .pnl-pos { + color: var(--profit); + font-weight: 600; +} + +.records-trade-table-wrap .pnl-neg { + color: var(--loss); + font-weight: 600; +} + +.records-trade-table-wrap .trade-actions { + min-width: 17rem; +} + html:is([data-mobile="1"], .layout-phone) .records-trade-row, html:is([data-layout="phone"], .layout-phone) .records-trade-row { cursor: pointer; @@ -229,56 +282,18 @@ html:is([data-layout="phone"], .layout-phone) .records-trade-row:hover { box-shadow: 0 0 0 1px rgba(56, 189, 248, .2); } -/* 平板横屏:单行 + 右侧操作 */ -html:is([data-layout="tablet"], .layout-tablet) .records-trade-row { - display: flex; - flex-direction: row; - align-items: center; - gap: .5rem .65rem; - padding: .5rem .65rem; - overflow: hidden; +html:is([data-mobile="1"], .layout-phone) .records-page .records-phone-only, +html:is([data-layout="phone"], .layout-phone) .records-page .records-phone-only, +html:is([data-mobile="1"], .layout-phone) .records-page .records-review-mobile, +html:is([data-layout="phone"], .layout-phone) .records-page .records-review-mobile { + display: block; } -html:is([data-layout="tablet"], .layout-tablet) .records-trade-main { - flex: 1 1 auto; - min-width: 0; - display: flex; - flex-direction: row; - align-items: center; - gap: .55rem .75rem; +html:is([data-layout="tablet"], .layout-tablet) .records-page .records-tablet-only { + display: block; } -html:is([data-layout="tablet"], .layout-tablet) .records-trade-head { - margin-bottom: 0; - flex: 0 1 auto; - min-width: 0; -} - -html:is([data-layout="tablet"], .layout-tablet) .records-mobile-symbol { - font-size: .84rem; - max-width: 6.5rem; -} - -html:is([data-layout="tablet"], .layout-tablet) .records-trade-summary { - flex: 1 1 auto; - min-width: 0; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - font-size: .76rem; -} - -html:is([data-layout="tablet"], .layout-tablet) .records-trade-actions { - display: flex; -} - -html:is([data-layout="tablet"], .layout-tablet) .records-trade-phone-foot { - display: none; -} - -html:is([data-mobile="1"], .layout-phone) .records-page .records-mobile-list, -html:is([data-layout="phone"], .layout-phone) .records-page .records-mobile-list, -html:is([data-layout="tablet"], .layout-tablet) .records-page .records-mobile-list { +html:is([data-layout="tablet"], .layout-tablet) .records-page .records-review-mobile { display: block; } @@ -293,11 +308,29 @@ html:is([data-layout="phone"], .layout-phone) .records-page .records-trade-card padding: 0; } -html:is([data-layout="tablet"], .layout-tablet) .records-page .records-trade-card .card-body, -html:is([data-layout="tablet"], .layout-tablet) .records-page .records-split .card .card-body { +html:is([data-layout="tablet"], .layout-tablet) .records-page .records-trade-card .card-body { padding: 0 .75rem .35rem; } +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .dashboard-table { + font-size: .78rem; +} + +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .dashboard-table th, +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .dashboard-table td { + padding: .4rem .45rem; +} + +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .trade-actions { + min-width: 15.5rem; +} + +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .trade-actions a, +html:is([data-layout="tablet"], .layout-tablet) .records-trade-table-wrap .trade-actions button { + font-size: .68rem; + padding: .28rem .45rem; +} + html:is([data-mobile="1"], .layout-phone) .records-page .records-equity-card #equity-curve-chart, html:is([data-layout="phone"], .layout-phone) .records-page .records-equity-card #equity-curve-chart { min-height: 180px; @@ -336,6 +369,7 @@ html:is([data-layout="phone"], .layout-phone) #review-modal .review-detail-value } @media (pointer: coarse) and (max-width: 600px) { - .records-page .records-mobile-list { display: block; } + .records-page .records-phone-only, + .records-page .records-review-mobile { display: block; } .records-page .records-desktop-only { display: none !important; } } diff --git a/static/js/records.js b/static/js/records.js index c9d3ce1..23e4cd5 100644 --- a/static/js/records.js +++ b/static/js/records.js @@ -12,11 +12,6 @@ return String(v).replace('T', ' ').slice(0, 16); } - function isTabletLayout() { - var root = document.documentElement; - return root.dataset.layout === 'tablet' || root.classList.contains('layout-tablet'); - } - function showTradeModal(data) { var mask = document.getElementById('trade-detail-modal'); var body = document.getElementById('trade-detail-modal-body'); @@ -53,7 +48,7 @@ html += '
暂无交易记录
{% endfor %}| 品种 | +方向 | +手数 | +开仓 | +平仓 | +盈亏 | +净盈亏 | +平仓时间 | +操作 | +
|---|---|---|---|---|---|---|---|---|
| {{ trade_symbol_cell(t) }} | ++ + {{ '做多' if t.direction == 'long' else '做空' }} + + | +{% if t.lots is not none %}{{ '%.2f'|format(t.lots|float) }}{% else %}—{% endif %} | +{% if t.entry_price is not none %}{{ '%.2f'|format(t.entry_price|float) }}{% else %}—{% endif %} | +{% if t.close_price is not none %}{{ '%.2f'|format(t.close_price|float) }}{% elif t.entry_price is not none %}{{ '%.2f'|format(t.entry_price|float) }}{% else %}—{% endif %} | +{{ trade_pnl_cell(t.pnl) }} | +{{ trade_pnl_cell(t.pnl_net) }} | +{{ (t.close_time or '')[:16].replace('T', ' ') or '—' }} | +{{ trade_row_actions(t, 'records-tablet-detail-btn') }} | +
| 暂无交易记录 | ||||||||