feat(hub): fix archive quotes inline expand and mobile archive layout
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -5532,49 +5532,61 @@ body.funds-fullscreen-open {
|
||||
}
|
||||
.archive-quotes-list {
|
||||
flex: 1 1 auto;
|
||||
min-height: 160px;
|
||||
min-height: 0;
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
.archive-quote-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0;
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 8px;
|
||||
background: var(--inset-surface);
|
||||
overflow: hidden;
|
||||
}
|
||||
.archive-quote-block.is-open {
|
||||
border-color: var(--accent);
|
||||
}
|
||||
.archive-quote-item {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
grid-template-columns: auto 1fr auto;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: 8px;
|
||||
background: var(--inset-surface);
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.archive-quote-item:hover {
|
||||
border-color: color-mix(in srgb, var(--accent) 40%, var(--border-soft));
|
||||
background: color-mix(in srgb, var(--accent) 8%, transparent);
|
||||
}
|
||||
.archive-quote-item.is-selected {
|
||||
border-color: var(--accent);
|
||||
background: color-mix(in srgb, var(--accent) 12%, var(--inset-surface));
|
||||
}
|
||||
.archive-quote-open-hint {
|
||||
font-size: 0.7rem;
|
||||
color: var(--accent);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.archive-quote-detail {
|
||||
flex: 0 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
padding-top: 10px;
|
||||
padding: 0 10px 10px;
|
||||
border-top: 1px solid var(--border-soft);
|
||||
min-height: 140px;
|
||||
max-height: 42vh;
|
||||
}
|
||||
.archive-quote-detail .archive-quote-full {
|
||||
flex: 1 1 auto;
|
||||
min-height: 96px;
|
||||
max-height: 34vh;
|
||||
overflow: auto;
|
||||
min-height: 120px;
|
||||
max-height: none;
|
||||
overflow: visible;
|
||||
}
|
||||
.archive-quote-date {
|
||||
font-weight: 600;
|
||||
@@ -5648,6 +5660,15 @@ body.funds-fullscreen-open {
|
||||
color: var(--muted);
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
.archive-overview-panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
min-width: 0;
|
||||
}
|
||||
.archive-overview-panel > .archive-panel-head {
|
||||
display: none;
|
||||
}
|
||||
.archive-stats-bar {
|
||||
padding: 0;
|
||||
border-radius: 8px;
|
||||
@@ -5926,19 +5947,49 @@ body.funds-fullscreen-open {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
@media (max-width: 900px) {
|
||||
.archive-layout {
|
||||
grid-template-columns: 1fr;
|
||||
#page-archive .page-desc {
|
||||
display: none;
|
||||
}
|
||||
#page-archive .archive-toolbar-desktop,
|
||||
#page-archive .archive-panel-desktop {
|
||||
display: none !important;
|
||||
}
|
||||
#page-archive .archive-toolbar {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#page-archive .archive-layout {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
min-height: 0;
|
||||
}
|
||||
.archive-quotes-panel {
|
||||
min-height: 360px;
|
||||
#page-archive .archive-quotes-panel {
|
||||
order: 1;
|
||||
flex: 0 0 auto;
|
||||
min-height: 0;
|
||||
max-height: none;
|
||||
overflow: visible;
|
||||
}
|
||||
.archive-quotes-list {
|
||||
#page-archive .archive-main-panel {
|
||||
order: 2;
|
||||
flex: 0 0 auto;
|
||||
min-height: 0;
|
||||
gap: 0;
|
||||
}
|
||||
#page-archive .archive-overview-panel {
|
||||
width: 100%;
|
||||
}
|
||||
#page-archive .archive-overview-panel > .archive-panel-head {
|
||||
display: flex;
|
||||
}
|
||||
#page-archive .archive-quotes-list {
|
||||
min-height: 120px;
|
||||
max-height: 42vh;
|
||||
}
|
||||
.archive-quote-detail {
|
||||
max-height: 36vh;
|
||||
#page-archive .archive-stats-table th,
|
||||
#page-archive .archive-stats-table td {
|
||||
padding: 6px 8px;
|
||||
font-size: 0.74rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -26,10 +26,6 @@
|
||||
const elQuoteDate = document.getElementById("archive-quote-date");
|
||||
const elQuoteContent = document.getElementById("archive-quote-content");
|
||||
const elQuoteSubmit = document.getElementById("archive-quote-submit");
|
||||
const elQuoteDetail = document.getElementById("archive-quote-detail");
|
||||
const elQuoteDetailFull = document.getElementById("archive-quote-detail-full");
|
||||
const elQuoteEditBtn = document.getElementById("archive-quote-edit-btn");
|
||||
const elQuoteDelBtn = document.getElementById("archive-quote-del-btn");
|
||||
const elChartSection = document.getElementById("archive-chart-section");
|
||||
const elChartTitle = document.getElementById("archive-chart-title");
|
||||
const elTfTabs = document.getElementById("archive-tf-tabs");
|
||||
@@ -520,24 +516,13 @@
|
||||
}
|
||||
|
||||
function selectQuote(id) {
|
||||
if (editingQuoteId != null && String(id) !== String(editingQuoteId)) {
|
||||
const nextId = String(id);
|
||||
const same = selectedQuoteId != null && String(selectedQuoteId) === nextId;
|
||||
if (editingQuoteId != null && String(editingQuoteId) !== nextId) {
|
||||
resetQuoteForm();
|
||||
}
|
||||
selectedQuoteId = id;
|
||||
selectedQuoteId = same ? null : id;
|
||||
renderQuotes();
|
||||
renderQuoteDetail();
|
||||
}
|
||||
|
||||
function renderQuoteDetail() {
|
||||
if (!elQuoteDetail) return;
|
||||
const q = findQuote(selectedQuoteId);
|
||||
if (!q) {
|
||||
elQuoteDetail.hidden = true;
|
||||
if (elQuoteDetailFull) elQuoteDetailFull.textContent = "";
|
||||
return;
|
||||
}
|
||||
elQuoteDetail.hidden = false;
|
||||
if (elQuoteDetailFull) elQuoteDetailFull.textContent = q.content || "(空)";
|
||||
}
|
||||
|
||||
function renderQuotes() {
|
||||
@@ -547,13 +532,15 @@
|
||||
}
|
||||
if (!quotes.length) {
|
||||
elQuotesList.innerHTML = '<p class="archive-empty">暂无复盘语录,可在上方添加。</p>';
|
||||
if (elQuoteDetail) elQuoteDetail.hidden = true;
|
||||
return;
|
||||
}
|
||||
elQuotesList.innerHTML = quotes
|
||||
.map(function (q) {
|
||||
const selected = String(q.id) === String(selectedQuoteId);
|
||||
return (
|
||||
'<div class="archive-quote-block' +
|
||||
(selected ? " is-open" : "") +
|
||||
'">' +
|
||||
'<button type="button" class="archive-quote-item' +
|
||||
(selected ? " is-selected" : "") +
|
||||
'" data-id="' +
|
||||
@@ -565,7 +552,23 @@
|
||||
'<span class="archive-quote-preview">' +
|
||||
esc(quotePreview(q.content)) +
|
||||
"</span>" +
|
||||
"</button>"
|
||||
(selected ? "" : '<span class="archive-quote-open-hint">查看</span>') +
|
||||
"</button>" +
|
||||
(selected
|
||||
? '<div class="archive-quote-detail">' +
|
||||
'<div class="archive-quote-full">' +
|
||||
esc(q.content || "(空)") +
|
||||
"</div>" +
|
||||
'<div class="archive-quote-actions">' +
|
||||
'<button type="button" class="ghost archive-quote-edit-btn" data-id="' +
|
||||
q.id +
|
||||
'">修改</button>' +
|
||||
'<button type="button" class="archive-del-btn archive-quote-del-btn" data-id="' +
|
||||
q.id +
|
||||
'">删除</button>' +
|
||||
"</div></div>"
|
||||
: "") +
|
||||
"</div>"
|
||||
);
|
||||
})
|
||||
.join("");
|
||||
@@ -575,17 +578,27 @@
|
||||
selectQuote(btn.getAttribute("data-id"));
|
||||
});
|
||||
});
|
||||
renderQuoteDetail();
|
||||
elQuotesList.querySelectorAll(".archive-quote-edit-btn").forEach(function (btn) {
|
||||
btn.addEventListener("click", function (ev) {
|
||||
ev.stopPropagation();
|
||||
selectedQuoteId = btn.getAttribute("data-id");
|
||||
startEditQuote();
|
||||
});
|
||||
});
|
||||
elQuotesList.querySelectorAll(".archive-quote-del-btn").forEach(function (btn) {
|
||||
btn.addEventListener("click", function (ev) {
|
||||
ev.stopPropagation();
|
||||
void deleteQuote(btn.getAttribute("data-id"));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function loadQuotes() {
|
||||
const r = await apiFetch("/api/archive/quotes");
|
||||
const j = await r.json();
|
||||
quotes = j.quotes || [];
|
||||
if (!quotes.length) {
|
||||
if (!findQuote(selectedQuoteId)) {
|
||||
selectedQuoteId = null;
|
||||
} else if (!findQuote(selectedQuoteId)) {
|
||||
selectedQuoteId = quotes[0].id;
|
||||
}
|
||||
renderQuotes();
|
||||
}
|
||||
@@ -610,8 +623,7 @@
|
||||
return;
|
||||
}
|
||||
resetQuoteForm();
|
||||
selectedQuoteId =
|
||||
j.quote && j.quote.id != null ? j.quote.id : selectedQuoteId;
|
||||
selectedQuoteId = null;
|
||||
await loadQuotes();
|
||||
setStatus("语录已添加");
|
||||
}
|
||||
@@ -627,9 +639,8 @@
|
||||
setStatus(j.detail || "保存失败");
|
||||
return;
|
||||
}
|
||||
const savedId = id;
|
||||
resetQuoteForm();
|
||||
selectedQuoteId = savedId;
|
||||
selectedQuoteId = null;
|
||||
await loadQuotes();
|
||||
setStatus("语录已保存");
|
||||
}
|
||||
@@ -1382,13 +1393,6 @@
|
||||
});
|
||||
}
|
||||
if (elQuoteForm) elQuoteForm.addEventListener("submit", submitQuoteForm);
|
||||
if (elQuoteEditBtn) elQuoteEditBtn.addEventListener("click", startEditQuote);
|
||||
if (elQuoteDelBtn) {
|
||||
elQuoteDelBtn.addEventListener("click", function () {
|
||||
if (!selectedQuoteId) return;
|
||||
void deleteQuote(selectedQuoteId);
|
||||
});
|
||||
}
|
||||
if (elTfTabs) {
|
||||
elTfTabs.addEventListener("click", function (ev) {
|
||||
const btn = ev.target.closest(".archive-tf-btn");
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" media="print" onload="this.media='all'" />
|
||||
<noscript><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&family=Orbitron:wght@500;600;700&display=swap" rel="stylesheet" /></noscript>
|
||||
<link rel="stylesheet" href="/assets/app.css?v=20260612-archive-quotes-v2" />
|
||||
<link rel="stylesheet" href="/assets/app.css?v=20260612-archive-mobile" />
|
||||
<link rel="stylesheet" href="/assets/dashboard.css?v=20260612-dash-monitor-count" />
|
||||
</head>
|
||||
<body>
|
||||
@@ -263,9 +263,9 @@
|
||||
<p class="page-desc">复盘语录 · 当日交易记录 · 按需查看 K 线</p>
|
||||
</div>
|
||||
<div class="archive-toolbar toolbar">
|
||||
<label class="chk-label"><input type="checkbox" id="archive-filter-profit" /> 盈利单</label>
|
||||
<label class="chk-label"><input type="checkbox" id="archive-filter-loss" /> 亏损单</label>
|
||||
<label class="chk-label"><input type="checkbox" id="archive-filter-sick" /> 犯病</label>
|
||||
<label class="chk-label archive-toolbar-desktop"><input type="checkbox" id="archive-filter-profit" /> 盈利单</label>
|
||||
<label class="chk-label archive-toolbar-desktop"><input type="checkbox" id="archive-filter-loss" /> 亏损单</label>
|
||||
<label class="chk-label archive-toolbar-desktop"><input type="checkbox" id="archive-filter-sick" /> 犯病</label>
|
||||
<div class="archive-period-bar archive-field">
|
||||
<span>日期</span>
|
||||
<div class="archive-period-tabs" id="archive-period-tabs" role="tablist">
|
||||
@@ -281,12 +281,12 @@
|
||||
<input id="archive-date-to" type="date" title="结束日" />
|
||||
</span>
|
||||
</div>
|
||||
<button type="button" id="archive-btn-chart-toggle" class="ghost">图表</button>
|
||||
<label class="archive-field archive-search-field">
|
||||
<button type="button" id="archive-btn-chart-toggle" class="ghost archive-toolbar-desktop">图表</button>
|
||||
<label class="archive-field archive-search-field archive-toolbar-desktop">
|
||||
<span>搜索</span>
|
||||
<input id="archive-search" type="search" placeholder="合约 / 交易所 / 备注" autocomplete="off" />
|
||||
</label>
|
||||
<label class="archive-field">
|
||||
<label class="archive-field archive-toolbar-desktop">
|
||||
<span>交易所</span>
|
||||
<select id="archive-exchange"><option value="">全部</option></select>
|
||||
</label>
|
||||
@@ -306,17 +306,15 @@
|
||||
<button type="submit" id="archive-quote-submit" class="primary">添加语录</button>
|
||||
</form>
|
||||
<div id="archive-quotes-list" class="archive-quotes-list"></div>
|
||||
<div id="archive-quote-detail" class="archive-quote-detail" hidden>
|
||||
<div id="archive-quote-detail-full" class="archive-quote-full"></div>
|
||||
<div class="archive-quote-actions">
|
||||
<button type="button" id="archive-quote-edit-btn" class="ghost">修改</button>
|
||||
<button type="button" id="archive-quote-del-btn" class="archive-del-btn">删除</button>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<main class="archive-main-panel">
|
||||
<div id="archive-stats" class="archive-stats-bar"></div>
|
||||
<details id="archive-chart-section" class="archive-acc-section archive-chart-section">
|
||||
<section class="archive-overview-panel">
|
||||
<div class="archive-panel-head">
|
||||
<h2>数据总览</h2>
|
||||
</div>
|
||||
<div id="archive-stats" class="archive-stats-bar"></div>
|
||||
</section>
|
||||
<details id="archive-chart-section" class="archive-acc-section archive-chart-section archive-panel-desktop">
|
||||
<summary class="archive-acc-summary">K 线图表 <span id="archive-chart-title" class="archive-acc-sub">—</span></summary>
|
||||
<div class="archive-chart-toolbar toolbar">
|
||||
<div class="archive-tf-tabs" id="archive-tf-tabs" role="tablist">
|
||||
@@ -344,7 +342,7 @@
|
||||
<button type="button" id="archive-mark-auto" class="archive-mark-auto is-on" title="开启:该币种全部交易均标注开/平;关闭:仅当前选中一笔">自动</button>
|
||||
</div>
|
||||
</details>
|
||||
<details id="archive-trades-section" class="archive-acc-section archive-trades-section" open>
|
||||
<details id="archive-trades-section" class="archive-acc-section archive-trades-section archive-panel-desktop" open>
|
||||
<summary class="archive-acc-summary">交易记录</summary>
|
||||
<div id="archive-trades" class="archive-trades"></div>
|
||||
</details>
|
||||
@@ -591,7 +589,7 @@
|
||||
<script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script>
|
||||
<script src="/assets/chart_draw.js?v=20260609-market-day-split"></script>
|
||||
<script src="/assets/chart.js?v=20260609-market-day-split"></script>
|
||||
<script src="/assets/archive.js?v=20260612-archive-quotes-v2"></script>
|
||||
<script src="/assets/archive.js?v=20260612-archive-quotes-v3"></script>
|
||||
<script src="/assets/funds.js?v=20260609-hub-funds-fold"></script>
|
||||
<script src="/assets/dashboard.js?v=20260612-dash-monitor-count"></script>
|
||||
<script src="/assets/ai_review_render.js?v=3"></script>
|
||||
|
||||
Reference in New Issue
Block a user