1. 把缩略图放到最上面，可以矮一些（height小一点）

2. 缩略图的y轴也有这个问题
3. 主图我需要有框选和拖拽功能

src/leadlag/templates/dashboard.html

@@ -159,7 +159,7 @@
         
         .thumbnail-wrapper {
             position: relative;
-            height: 120px;
+            height: 80px;
             cursor: crosshair;
             border-radius: 5px;
             overflow: hidden;
@@ -291,10 +291,18 @@
             <button class="refresh-btn" onclick="resetZoom()" style="background: linear-gradient(135deg, #6f42c1 0%, #e83e8c 100%);">🔍 重置缩放</button>
         </div>
         
+        <div class="chart-container">
+            <h2>📅 24小时缩略图</h2>
+            <div class="thumbnail-container">
+                <h3>点击选择时间范围</h3>
+                <div class="thumbnail-wrapper" id="priceThumbnail"></div>
+            </div>
+        </div>
+
         <div class="stats-grid" id="statsGrid">
             <!-- 统计卡片将通过JavaScript动态生成 -->
         </div>
-        
+
         <div class="chart-container">
             <h2>📈 价格走势图</h2>
             <div class="chart-wrapper" id="priceChart"></div>
@@ -304,21 +312,13 @@
             <h2>📊 价差走势图 (BPS)</h2>
             <div class="chart-wrapper" id="bpsChart"></div>
         </div>
-        
+
         <div class="events-container">
             <h2>📋 交易事件记录</h2>
             <div id="eventsContent">
                 <div class="loading">正在加载数据...</div>
             </div>
         </div>
-        
-        <div class="chart-container">
-            <h2>📅 24小时缩略图</h2>
-            <div class="thumbnail-container">
-                <h3>点击选择时间范围</h3>
-                <div class="thumbnail-wrapper" id="priceThumbnail"></div>
-            </div>
-        </div>
     </div>
 
     <script>
@@ -584,14 +584,27 @@
                     {
                         type: 'inside',
                         start: 0,
-                        end: 100
+                        end: 100,
+                        zoomOnMouseWheel: true,
+                        moveOnMouseMove: true,
+                        moveOnMouseWheel: false
                     },
                     {
                         type: 'slider',
                         start: 0,
-                        end: 100
+                        end: 100,
+                        show: true
                     }
-                ]
+                ],
+                toolbox: {
+                    feature: {
+                        dataZoom: {
+                            yAxisIndex: 'none'
+                        },
+                        restore: {},
+                        saveAsImage: {}
+                    }
+                }
             };
 
             priceChart.setOption(option);
@@ -671,14 +684,27 @@
                     {
                         type: 'inside',
                         start: 0,
-                        end: 100
+                        end: 100,
+                        zoomOnMouseWheel: true,
+                        moveOnMouseMove: true,
+                        moveOnMouseWheel: false
                     },
                     {
                         type: 'slider',
                         start: 0,
-                        end: 100
+                        end: 100,
+                        show: true
                     }
-                ]
+                ],
+                toolbox: {
+                    feature: {
+                        dataZoom: {
+                            yAxisIndex: 'none'
+                        },
+                        restore: {},
+                        saveAsImage: {}
+                    }
+                }
             };
 
             bpsChart.setOption(option);
@@ -753,7 +779,9 @@
                     axisLine: { show: false },
                     axisTick: { show: false },
                     axisLabel: { show: false },
-                    splitLine: { show: false }
+                    splitLine: { show: false },
+                    min: 'dataMin',
+                    max: 'dataMax'
                 },
                 series: [
                     {