Przeglądaj źródła

refactor(dashboard): 移除数据卡片并简化图表显示

- 删除统计卡片相关HTML结构和JavaScript代码
- 简化图表配置,仅保留百分比差显示
- 调整容器样式为全宽度无阴影设计
skyfffire 1 tydzień temu
rodzic
commit
7dc7cce927
1 zmienionych plików z 12 dodań i 105 usunięć
  1. 12 105
      src/dashboard/static/index.html

+ 12 - 105
src/dashboard/static/index.html

@@ -21,11 +21,11 @@
         }
 
         .container {
-            max-width: 1400px;
-            margin: 0 auto;
+            width: 100%;
+            margin: 0;
             background: rgba(255, 255, 255, 0.95);
-            border-radius: 20px;
-            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+            border-radius: 0;
+            box-shadow: none;
             overflow: hidden;
         }
 
@@ -179,7 +179,7 @@
 
         .chart-wrapper {
             position: relative;
-            height: 400px;
+            height: 80vh;
         }
 
         .loading {
@@ -267,40 +267,7 @@
             <div id="loading" class="loading">请选择币对以查看数据</div>
             <div id="error" class="error" style="display: none;"></div>
             
-            <div id="statsContainer" style="display: none;">
-                <div class="stats-grid">
-                    <div class="stat-card">
-                        <h3>当前标记价格差</h3>
-                        <div class="value" id="currentMarkPriceDiff">--</div>
-                        <div class="unit">USDT</div>
-                    </div>
-                    <div class="stat-card">
-                        <h3>当前价格差</h3>
-                        <div class="value" id="currentPriceDiff">--</div>
-                        <div class="unit">USDT</div>
-                    </div>
-                    <div class="stat-card">
-                        <h3>标记价格差百分比</h3>
-                        <div class="value" id="currentMarkPriceDiffPct">--</div>
-                        <div class="unit">%</div>
-                    </div>
-                    <div class="stat-card">
-                        <h3>价格差百分比</h3>
-                        <div class="value" id="currentPriceDiffPct">--</div>
-                        <div class="unit">%</div>
-                    </div>
-                    <div class="stat-card">
-                        <h3>平均标记价格差</h3>
-                        <div class="value" id="avgMarkPriceDiff">--</div>
-                        <div class="unit">USDT</div>
-                    </div>
-                    <div class="stat-card">
-                        <h3>数据记录数</h3>
-                        <div class="value" id="recordCount">--</div>
-                        <div class="unit">条</div>
-                    </div>
-                </div>
-            </div>
+            <!-- 数据卡片已移除 -->
 
             <div id="chartsContainer" style="display: none;">
                 <div class="chart-container">
@@ -392,14 +359,11 @@
                 ]);
 
                 const data = dataResponse.data.data;
-                const stats = statsResponse.data;
-                const latest = latestResponse.data;
-
-                updateStats(stats, latest);
+                // 数据卡片相关代码已移除
+                
                 updateCharts(data, symbol);
                 updateLastUpdateTime();
                 
-                document.getElementById('statsContainer').style.display = 'block';
                 document.getElementById('chartsContainer').style.display = 'block';
                 document.getElementById('lastUpdate').style.display = 'block';
                 document.getElementById('loading').style.display = 'none';
@@ -410,29 +374,7 @@
             }
         }
 
-        function updateStats(stats, latest) {
-            // 更新当前数据
-            updateStatValue('currentMarkPriceDiff', latest.mark_price_diff);
-            updateStatValue('currentPriceDiff', latest.price_diff);
-            updateStatValue('currentMarkPriceDiffPct', latest.mark_price_diff_pct, '%');
-            updateStatValue('currentPriceDiffPct', latest.price_diff_pct, '%');
-            
-            // 更新统计数据
-            updateStatValue('avgMarkPriceDiff', stats.avg_mark_price_diff);
-            document.getElementById('recordCount').textContent = stats.record_count || '--';
-        }
-
-        function updateStatValue(elementId, value, suffix = '') {
-            const element = document.getElementById(elementId);
-            if (value !== null && value !== undefined) {
-                const formattedValue = typeof value === 'number' ? value.toFixed(4) : value;
-                element.textContent = formattedValue + suffix;
-                element.className = 'value ' + (value > 0 ? 'positive' : value < 0 ? 'negative' : '');
-            } else {
-                element.textContent = '--';
-                element.className = 'value';
-            }
-        }
+        // 数据卡片相关函数已移除
 
         function updateCharts(data, symbol) {
             if (!data || data.length === 0) {
@@ -535,8 +477,6 @@
                                     const item = data[dataIndex];
                                     return [
                                         '',
-                                        `标记价格差: ${item.mark_price_diff ? item.mark_price_diff.toFixed(6) : '--'} USDT`,
-                                        `价格差: ${item.price_diff ? item.price_diff.toFixed(6) : '--'} USDT`,
                                         `标记价格差 (%): ${item.mark_price_diff_pct ? item.mark_price_diff_pct.toFixed(4) : '--'}%`,
                                         `价格差 (%): ${item.price_diff_pct ? item.price_diff_pct.toFixed(4) : '--'}%`
                                     ];
@@ -575,32 +515,13 @@
                 data: {
                     labels: labels,
                     datasets: [
-                        {
-                            label: '标记价格差 (USDT)',
-                            data: data.map(item => item.mark_price_diff),
-                            borderColor: '#ff6384',
-                            backgroundColor: 'rgba(255, 99, 132, 0.1)',
-                            tension: 0.1,
-                            pointRadius: 0,
-                            yAxisID: 'y'
-                        },
-                        {
-                            label: '价格差 (USDT)',
-                            data: data.map(item => item.price_diff),
-                            borderColor: '#36a2eb',
-                            backgroundColor: 'rgba(54, 162, 235, 0.1)',
-                            tension: 0.1,
-                            pointRadius: 0,
-                            yAxisID: 'y'
-                        },
                         {
                             label: '标记价格差 (%)',
                             data: data.map(item => item.mark_price_diff_pct),
                             borderColor: '#ffce56',
                             backgroundColor: 'rgba(255, 206, 86, 0.1)',
                             tension: 0.1,
-                            pointRadius: 0,
-                            yAxisID: 'y1'
+                            pointRadius: 0
                         },
                         {
                             label: '价格差 (%)',
@@ -608,8 +529,7 @@
                             borderColor: '#4bc0c0',
                             backgroundColor: 'rgba(75, 192, 192, 0.1)',
                             tension: 0.1,
-                            pointRadius: 0,
-                            yAxisID: 'y1'
+                            pointRadius: 0
                         }
                     ]
                 },
@@ -667,23 +587,10 @@
                         y: {
                             type: 'linear',
                             display: true,
-                            position: 'left',
-                            title: {
-                                display: true,
-                                text: '价格差 (USDT)'
-                            }
-                        },
-                        y1: {
-                            type: 'linear',
-                            display: true,
-                            position: 'right',
                             title: {
                                 display: true,
                                 text: '价格差 (%)'
-                            },
-                            grid: {
-                                drawOnChartArea: false,
-                            },
+                            }
                         },
                         x: {
                             title: {