e449354b69
- Created Flask web application (app.py) to display and analyze trading data - Implemented data loading, processing, and email notification features - Added HTML templates for interactive data viewing - Included ultimate smoother and trend detection algorithms - Configured dynamic file selection and data rendering
107 lines
3.5 KiB
HTML
107 lines
3.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>订单流实时数据监控</title>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css">
|
|
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css">
|
|
<style>
|
|
table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
table, th, td {
|
|
border: 1px solid black;
|
|
}
|
|
th, td {
|
|
padding: 8px;
|
|
text-align: center;
|
|
}
|
|
button {
|
|
margin: 10px;
|
|
padding: 10px;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Real-Time CSV Data Viewer</h1>
|
|
|
|
<!-- 动态生成按钮 -->
|
|
{% for file_name, file_path in files.items() %}
|
|
<button onclick="loadData('{{ file_name }}')">{{ file_name }}</button>
|
|
{% endfor %}
|
|
|
|
<h3>Data for {{ file_name }}</h3>
|
|
<table id="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Symbol</th>
|
|
<th>Datetime</th>
|
|
<th>Delta</th>
|
|
<th>Close</th>
|
|
<th>Open</th>
|
|
<th>High</th>
|
|
<th>Low</th>
|
|
<th>Volume</th>
|
|
<th>DJ</th>
|
|
<th>Delta累计</th>
|
|
<th>POC</th>
|
|
<th>终极平滑值</th>
|
|
<th>趋势方向</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in data %}
|
|
<tr>
|
|
<td>{{ row.symbol }}</td>
|
|
<td>{{ row.datetime }}</td>
|
|
<td>{{ row.delta }}</td>
|
|
<td>{{ row.close }}</td>
|
|
<td>{{ row.open }}</td>
|
|
<td>{{ row.high }}</td>
|
|
<td>{{ row.low }}</td>
|
|
<td>{{ row.volume }}</td>
|
|
<td>{{ row.dj }}</td>
|
|
<td>{{ row.delta累计 }}</td>
|
|
<td>{{ row.POC }}</td>
|
|
<td>{{ row.终极平滑值 }}</td>
|
|
<td>{{ row.趋势方向 }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
|
|
<script>
|
|
function loadData(fileName) {
|
|
fetch('/data/' + fileName)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
let tableBody = document.querySelector("#data-table tbody");
|
|
tableBody.innerHTML = ''; // 清空现有数据行
|
|
data.forEach(row => {
|
|
let rowElement = document.createElement('tr');
|
|
rowElement.innerHTML = `
|
|
<td>${row.symbol}</td>
|
|
<td>${row.datetime}</td>
|
|
<td>${row.delta}</td>
|
|
<td>${row.close}</td>
|
|
<td>${row.open}</td>
|
|
<td>${row.high}</td>
|
|
<td>${row.low}</td>
|
|
<td>${row.volume}</td>
|
|
<td>${row.dj}</td>
|
|
<td>${row.delta累计}</td>
|
|
<td>${row.POC}</td>
|
|
<td>${row.终极平滑值}</td>
|
|
<td>${row.趋势方向}</td>
|
|
`;
|
|
tableBody.appendChild(rowElement);
|
|
});
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|