92 lines
3.0 KiB
JavaScript
92 lines
3.0 KiB
JavaScript
const REFRESH_MS = 60_000;
|
|
|
|
function formatPeriod(start, end) {
|
|
const fmt = (s) => s.replace("T", " ").slice(0, 16);
|
|
return `${fmt(start)} ~ ${fmt(end)}`;
|
|
}
|
|
|
|
function renderTags(row) {
|
|
const parts = [];
|
|
if (row.is_high_volume) {
|
|
parts.push('<span class="tag tag-vol">千万+</span>');
|
|
}
|
|
if (row.is_high_change) {
|
|
parts.push('<span class="tag tag-chg">涨跌5%+</span>');
|
|
}
|
|
return parts.length ? parts.join("") : "—";
|
|
}
|
|
|
|
function pctClass(pct) {
|
|
if (pct > 0) return "pct-up";
|
|
if (pct < 0) return "pct-down";
|
|
return "";
|
|
}
|
|
|
|
function renderTable(tbody, items) {
|
|
if (!items || !items.length) {
|
|
tbody.innerHTML = '<tr><td colspan="5" class="loading">暂无数据</td></tr>';
|
|
return;
|
|
}
|
|
tbody.innerHTML = items
|
|
.map((row) => {
|
|
const highlight =
|
|
row.is_high_volume || row.is_high_change ? " row-highlight" : "";
|
|
const pct = row.price_change_pct ?? 0;
|
|
return `<tr class="${highlight}">
|
|
<td class="rank">${row.rank}</td>
|
|
<td><strong>${row.symbol}</strong></td>
|
|
<td>${row.quote_volume_fmt || row.quote_volume}</td>
|
|
<td class="${pctClass(pct)}">${row.price_change_pct_fmt || pct.toFixed(2) + "%"}</td>
|
|
<td>${renderTags(row)}</td>
|
|
</tr>`;
|
|
})
|
|
.join("");
|
|
}
|
|
|
|
async function loadYesterday() {
|
|
const body = document.getElementById("yesterday-body");
|
|
body.innerHTML = '<tr><td colspan="5" class="loading">加载中…</td></tr>';
|
|
try {
|
|
const res = await fetch("/api/yesterday/top30");
|
|
const data = await res.json();
|
|
document.getElementById("yesterday-period").textContent = formatPeriod(
|
|
data.period_start,
|
|
data.period_end
|
|
);
|
|
document.getElementById("yesterday-updated").textContent =
|
|
"更新: " + (data.updated_at || "").replace("T", " ").slice(0, 19);
|
|
renderTable(body, data.items);
|
|
} catch (e) {
|
|
body.innerHTML = `<tr><td colspan="5" class="error">加载失败: ${e.message}</td></tr>`;
|
|
}
|
|
}
|
|
|
|
async function loadToday() {
|
|
const body = document.getElementById("today-body");
|
|
try {
|
|
const res = await fetch("/api/today/top30");
|
|
const data = await res.json();
|
|
document.getElementById("today-period").textContent = formatPeriod(
|
|
data.period_start,
|
|
data.period_end
|
|
);
|
|
document.getElementById("today-updated").textContent =
|
|
"更新: " + (data.updated_at || "").replace("T", " ").slice(0, 19);
|
|
renderTable(body, data.items);
|
|
document.getElementById("status").textContent = "今日数据已刷新";
|
|
} catch (e) {
|
|
body.innerHTML = `<tr><td colspan="5" class="error">加载失败: ${e.message}</td></tr>`;
|
|
document.getElementById("status").textContent = e.message;
|
|
}
|
|
}
|
|
|
|
document.getElementById("btn-refresh").addEventListener("click", async () => {
|
|
document.getElementById("status").textContent = "刷新中…";
|
|
await fetch("/api/refresh/today", { method: "POST" });
|
|
await loadToday();
|
|
});
|
|
|
|
loadYesterday();
|
|
loadToday();
|
|
setInterval(loadToday, REFRESH_MS);
|