Skip to content

Instantly share code, notes, and snippets.

@echogao2023

echogao2023/.markdown

Created February 17, 2026 00:17
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save echogao2023/d3f7a8b8467b2bee86862e6455feec88 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save echogao2023/d3f7a8b8467b2bee86862e6455feec88 to your computer and use it in GitHub Desktop.
Download ZIP
开盘前选股
Raw
.markdown
Raw
index.html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>开盘前5分钟 短线强势候选</title>
<style>
:root {
--bg: #0d1117;
--card: #161b22;
--text: #c9d1d9;
--border: #30363d;
--up: #f85149;
--accent: #58a6ff;
--gray: #8b949e;
--highlight: #21262d;
}
body {
margin: 0;
padding: 12px 10px;
background: var(--bg);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-size: 14px;
line-height: 1.5;
}
h1 {
text-align: center;
color: var(--accent);
margin: 12px 0 20px;
font-size: 1.35rem;
}
.info {
text-align: center;
color: var(--gray);
font-size: 0.82rem;
margin: 0 0 16px;
}
.time {
color: #ffa657;
font-weight: 600;
}
.card {
background: var(--card);
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
margin-bottom: 20px;
}
table {
width: 100%;
border-collapse: collapse;
}
th, td {
padding: 10px 8px;
text-align: left;
border-bottom: 1px solid var(--border);
}
th {
background: var(--highlight);
color: var(--gray);
font-weight: 500;
cursor: pointer;
user-select: none;
}
th:hover {
background: #1f6feb;
color: white;
}
td[contenteditable="true"] {
background: #0d1117;
cursor: text;
}
.up {
color: var(--up);
font-weight: 600;
}
.score {
font-weight: bold;
color: #ffa657;
}
.tips {
font-size: 0.8rem;
color: var(--gray);
text-align: center;
margin: 24px 0 12px;
line-height: 1.6;
}
@media (min-width: 500px) {
body { padding: 20px; max-width: 720px; margin: 0 auto; }
h1 { font-size: 1.6rem; }
}
</style>
</head>
<body>
<h1>开盘前5分钟 短线强势候选</h1>
<div class="info">
最后更新：<span id="update-time" class="time">——</span>
</div>
<div class="card">
<table id="stock-table">
<thead>
<tr>
<th data-sort="code">代码</th>
<th data-sort="name">名称</th>
<th data-sort="chg" data-type="number">竞价涨幅</th>
<th data-sort="amtratio" data-type="number">竞价金额比</th>
<th data-sort="fund" data-type="number">3日资金净额</th>
<th>热点/概念</th>
<th data-sort="score" data-type="number">打分</th>
</tr>
</thead>
<tbody id="tbody">
<!-- 示例行，可手动编辑或清空后重新填写 -->
<tr>
<td contenteditable="true">603999</td>
<td contenteditable="true">读者传媒</td>
<td contenteditable="true" class="up">+4.2%</td>
<td contenteditable="true">7.8倍</td>
<td contenteditable="true">+1.68亿</td>
<td contenteditable="true">AI教育/出版</td>
<td contenteditable="true" class="score">91</td>
</tr>
<tr>
<td contenteditable="true">300750</td>
<td contenteditable="true">宁德时代</td>
<td contenteditable="true" class="up">+2.9%</td>
<td contenteditable="true">5.1倍</td>
<td contenteditable="true">+2.34亿</td>
<td contenteditable="true">新能源/锂电</td>
<td contenteditable="true" class="score">87</td>
</tr>
<!-- 你可以继续在这里添加更多 <tr> 行 -->
</tbody>
</table>
</div>
<div class="tips">
<p>• 点击表头可按该列排序（数字列已自动识别）</p>
<p>• 长按单元格可编辑（开盘前5分钟快速填入集合竞价数据）</p>
<p>• 推荐配合通达信/同花顺 9:20–9:25 快速复制粘贴</p>
<p>• 当前为手动版，后续可接入 Flask API 自动刷新</p>
</div>
<script>
// 更新显示时间
function updateTime() {
const now = new Date();
document.getElementById('update-time').textContent =
now.toLocaleString('zh-CN', { hour12: false });
}
setInterval(updateTime, 1000);
updateTime();
// 表格排序功能
const table = document.getElementById('stock-table');
const tbody = document.getElementById('tbody');
const headers = table.querySelectorAll('th[data-sort]');
headers.forEach(header => {
header.addEventListener('click', () => {
const key = header.dataset.sort;
const type = header.dataset.type || 'string';
const rows = Array.from(tbody.querySelectorAll('tr'));
const dir = header.classList.contains('asc') ? -1 : 1;
headers.forEach(h => h.classList.remove('asc', 'desc'));
header.classList.add(dir > 0 ? 'asc' : 'desc');
rows.sort((a, b) => {
let valA = a.querySelector(`td:nth-child(${Array.from(headers).indexOf(header) + 1})`).textContent.trim();
let valB = b.querySelector(`td:nth-child(${Array.from(headers).indexOf(header) + 1})`).textContent.trim();
if (type === 'number') {
// 处理 +3.2% → 3.2 / 7.8倍 → 7.8 / +1.68亿 → 16800
valA = parseFloat(valA.replace(/[^0-9.-]/g, '')) || 0;
valB = parseFloat(valB.replace(/[^0-9.-]/g, '')) || 0;
} else {
valA = valA.toLowerCase();
valB = valB.toLowerCase();
}
return dir * (valA > valB ? 1 : valA < valB ? -1 : 0);
});
tbody.innerHTML = '';
rows.forEach(row => tbody.appendChild(row));
});
});
// 可选：未来接入 Flask API 的示例代码（取消注释即可使用）
// async function loadFromAPI() {
// try {
// const res = await fetch('http://192.168.0.29:5000/api/stocks');
// const data = await res.json();
// // 这里把 data.stocks 渲染到 tbody
// // ...
// } catch(e) {
// console.log('API加载失败，仍使用手动数据', e);
// }
// }
// // loadFromAPI();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment