修复iOS端滚动问题并恢复页面布局

supply.html

@@ -8,22 +8,20 @@
         body {
             font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
             margin: 0;
-            padding: 0;
+            padding: 20px;
             background-color: #f5f5f5;
             color: #333;
-            font-size: 14px;
-            overflow-x: hidden;
-            touch-action: pan-y;
         }
         
         .container {
-            max-width: 100%;
+            max-width: 1200px;
             margin: 0 auto;
             background-color: #fff;
+            border-radius: 8px;
+            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+            padding: 20px;
             min-height: 100vh;
-            overflow-x: hidden;
+            box-sizing: border-box;
-            overflow-y: auto;
-            -webkit-overflow-scrolling: touch;
         }
         
         /* 顶部标题栏样式优化 */
@@ -1049,6 +1047,39 @@
             }
         }
         
+        /* iOS设备优化 */
+        @media screen and (max-width: 768px) {
+            /* 防止iOS设备上的页面拖动 */
+            body {
+                -webkit-overflow-scrolling: touch;
+                overflow-x: hidden;
+            }
+            
+            /* 确保容器不会溢出 */
+            .container {
+                overflow-x: hidden;
+                position: relative;
+            }
+            
+            /* 优化标题栏在iOS上的显示 */
+            .title-bar {
+                position: relative;
+                z-index: 100;
+            }
+            
+            /* 优化按钮布局在iOS上的显示 */
+            .supply-actions {
+                flex-wrap: wrap;
+                gap: 8px;
+            }
+            
+            .supply-actions button {
+                flex: 1;
+                min-width: 80px;
+                text-align: center;
+            }
+        }
+        
         /* 选择弹窗 */
         .select-modal {
             position: fixed;
@@ -1273,50 +1304,6 @@
             </div>
         </div>
         
-    <!-- 新鲜程度选择弹窗 -->
-    <div id="freshnessSelectModal" class="select-modal">
-        <div class="select-content">
-            <div class="select-header">
-                <h3>选择新鲜程度</h3>
-                <button class="close-btn" onclick="hideFreshnessSelectModal()">×</button>
-            </div>
-            <div class="select-search">
-                <input type="text" id="freshnessSearchInput" placeholder="搜索新鲜程度" oninput="filterFreshnessOptions()" style="width: 100%; padding: 10px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 14px; box-sizing: border-box;">
-            </div>
-            <div class="select-body">
-                <div id="freshnessOptionsList" class="select-list">
-                    <!-- 新鲜程度选项将通过JavaScript动态生成 -->
-                </div>
-            </div>
-            <div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
-                <button onclick="hideFreshnessSelectModal()" style="padding: 10px 24px; background-color: #f5f5f5; color: #666; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">取消</button>
-                <button onclick="confirmFreshnessSelection()" style="padding: 10px 24px; background-color: #1677ff; color: white; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">确定</button>
-            </div>
-        </div>
-    </div>
-    
-    <!-- 编辑新鲜程度选择弹窗 -->
-    <div id="editFreshnessSelectModal" class="select-modal">
-        <div class="select-content">
-            <div class="select-header">
-                <h3>选择新鲜程度</h3>
-                <button class="close-btn" onclick="hideEditFreshnessSelectModal()">×</button>
-            </div>
-            <div class="select-search">
-                <input type="text" id="editFreshnessSearchInput" placeholder="搜索新鲜程度" oninput="filterEditFreshnessOptions()" style="width: 100%; padding: 10px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 14px; box-sizing: border-box;">
-            </div>
-            <div class="select-body">
-                <div id="editFreshnessOptionsList" class="select-list">
-                    <!-- 新鲜程度选项将通过JavaScript动态生成 -->
-                </div>
-            </div>
-            <div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
-                <button onclick="hideEditFreshnessSelectModal()" style="padding: 10px 24px; background-color: #f5f5f5; color: #666; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">取消</button>
-                <button onclick="confirmEditFreshnessSelection()" style="padding: 10px 24px; background-color: #1677ff; color: white; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">确定</button>
-            </div>
-        </div>
-    </div>
-        
         <!-- 搜索框 -->
         <div class="search-container">
             <div class="search-box">
@@ -1377,6 +1364,50 @@
         </div>
     </div>
     
+    <!-- 新鲜程度选择弹窗 -->
+    <div id="freshnessSelectModal" class="select-modal">
+        <div class="select-content">
+            <div class="select-header">
+                <h3>选择新鲜程度</h3>
+                <button class="close-btn" onclick="hideFreshnessSelectModal()">×</button>
+            </div>
+            <div class="select-search">
+                <input type="text" id="freshnessSearchInput" placeholder="搜索新鲜程度" oninput="filterFreshnessOptions()" style="width: 100%; padding: 10px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 14px; box-sizing: border-box;">
+            </div>
+            <div class="select-body">
+                <div id="freshnessOptionsList" class="select-list">
+                    <!-- 新鲜程度选项将通过JavaScript动态生成 -->
+                </div>
+            </div>
+            <div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
+                <button onclick="hideFreshnessSelectModal()" style="padding: 10px 24px; background-color: #f5f5f5; color: #666; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">取消</button>
+                <button onclick="confirmFreshnessSelection()" style="padding: 10px 24px; background-color: #1677ff; color: white; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">确定</button>
+            </div>
+        </div>
+    </div>
+    
+    <!-- 编辑新鲜程度选择弹窗 -->
+    <div id="editFreshnessSelectModal" class="select-modal">
+        <div class="select-content">
+            <div class="select-header">
+                <h3>选择新鲜程度</h3>
+                <button class="close-btn" onclick="hideEditFreshnessSelectModal()">×</button>
+            </div>
+            <div class="select-search">
+                <input type="text" id="editFreshnessSearchInput" placeholder="搜索新鲜程度" oninput="filterEditFreshnessOptions()" style="width: 100%; padding: 10px; border: 1px solid #d9d9d9; border-radius: 8px; font-size: 14px; box-sizing: border-box;">
+            </div>
+            <div class="select-body">
+                <div id="editFreshnessOptionsList" class="select-list">
+                    <!-- 新鲜程度选项将通过JavaScript动态生成 -->
+                </div>
+            </div>
+            <div class="select-footer" style="padding: 16px 20px; display: flex; justify-content: space-between; border-top: 1px solid #f0f0f0; background-color: #fafafa;">
+                <button onclick="hideEditFreshnessSelectModal()" style="padding: 10px 24px; background-color: #f5f5f5; color: #666; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">取消</button>
+                <button onclick="confirmEditFreshnessSelection()" style="padding: 10px 24px; background-color: #1677ff; color: white; border: none; border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 500; transition: all 0.3s ease;">确定</button>
+            </div>
+        </div>
+    </div>
+    
     <!-- 创建货源模态框 -->
     <div id="createSupplyModal" class="modal">
         <div class="modal-content">
@@ -2499,28 +2530,9 @@
             }
         }
         
-        // 阻止iOS端触摸拖动
+        // 移除复杂的触摸事件处理，使用浏览器默认滚动行为
         function preventIOSDrag() {
-            // 只阻止水平滑动，允许垂直滚动
+            // 不再阻止任何默认行为，让浏览器处理滚动
-            document.addEventListener('touchmove', function(e) {
-                // 只处理单点触摸
-                if (e.touches.length === 1) {
-                    // 计算滑动方向
-                    const touch = e.touches[0];
-                    const deltaX = touch.clientX - (window.lastTouchX || touch.clientX);
-                    const deltaY = touch.clientY - (window.lastTouchY || touch.clientY);
-                    
-                    // 更新上次触摸位置
-                    window.lastTouchX = touch.clientX;
-                    window.lastTouchY = touch.clientY;
-                    
-                    // 检测是否为水平滑动
-                    if (Math.abs(deltaX) > Math.abs(deltaY)) {
-                        // 阻止水平滑动
-                        e.preventDefault();
-                    }
-                }
-            }, { passive: false });
         }
 
         // 初始化