Update

supply.html

@@ -5000,7 +5000,7 @@
                 // 添加售空标识
                 const soldOutTag = specStatus === '1' ? '<span style="color: #f5222d; font-size: 12px; font-weight: 600; margin-left: 10px;">已售空</span>' : '';
                 
-                specQuantityBoxes += `<div class="spec-quantity-box" style="border: 1px solid #f0f0f0; padding: 10px; border-radius: 8px; background-color: #fafafa; margin-bottom: 10px;">• 规格${i + 1}: ${spec} - 件数: ${quantity}件 - 采购价: ¥${costprice}${soldOutTag}</div>`;
+                specQuantityBoxes += `<div class="spec-quantity-box" style="border: 1px solid #f0f0f0; padding: 10px; border-radius: 8px; background-color: #fafafa; margin-bottom: 10px;">• ${spec}<br>${quantity}件 | ¥${costprice}${soldOutTag}</div>`;
             }
             
             return `
@@ -5011,33 +5011,34 @@
                         </div>
                     </div>
                     <div class="supply-info">
-                        <!-- 产品名称和规格-件数对在同一行 -->
-                        <div style="display: flex; gap: 20px; align-items: flex-start;">
-                            <!-- 左侧产品名称 -->
-                            <div style="flex: 1;">
-                                <div class="supply-name">
+                        <!-- 产品名称行，铺满整行 -->
+                        <div class="supply-name" style="width: 100%; margin-bottom: 15px;">
                                     ${supply.productName}
                                     ${(supply.status === 'hidden' || supply.status === 'sold_out') ? '' : `<span class="supply-status ${status.class}">${status.text}</span>`}
                                     ${supply.status === 'published' && supply.autoOfflineHours && supply.autoOfflineHours !== '' && supply.autoOfflineHours !== null ? `<span class="countdown-badge" data-id="${supply.id}" style="margin-left: 8px; padding: 4px 12px; background: linear-gradient(135deg, #ff6b6b, #ee5a6f); color: white; border-radius: 16px; font-size: 12px; font-weight: 500; box-shadow: 0 2px 4px rgba(255, 107, 107, 0.3); display: inline-flex; align-items: center; gap: 4px;">⏰ 计算中...</span>` : ''}
                                     <button class="copy-supply-btn" onclick="copySupply('${supply.id}')">复制</button>
                         </div>
+                        <!-- 详细信息和规格-件数对在同一行，水平对齐 -->
+                        <div style="display: flex; gap: 20px; align-items: flex-start;">
+                            <!-- 左侧详细信息 -->
+                            <div style="flex: 1;">
                                 <!-- 基本信息 -->
-                                <div class="supply-details">
-                                    <div class="detail-item">货源类型: ${supply.sourceType || '无'}</div>
-                                    <div class="detail-item">品种: ${supply.category || '无'}</div>
-                                    <div class="detail-item">蛋黄: ${supply.yolk || '无'}</div>
-                                    <div class="detail-item">包装: ${supply.producting || '无'}</div>
-                                    <div class="detail-item">新鲜程度: ${supply.freshness || '无'}</div>
-                                    <div class="detail-item">货源状态: ${supply.supplyStatus || '未设置'}</div>
-                                    <div class="detail-item">货源描述: ${supply.description || '无'}</div>
-                                    <div class="detail-item">地区: ${supply.region || '未设置'}</div>
+                                <div class="supply-details" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; padding: 12px; background: #f8f9fa; border-radius: 8px;">
+                                    <div class="detail-item">${supply.sourceType || '无'}</div>
+                                    <div class="detail-item">${supply.category || '无'}</div>
+                                    <div class="detail-item">${supply.yolk || '无'}</div>
+                                    <div class="detail-item">${supply.producting || '无'}</div>
+                                    <div class="detail-item">${supply.freshness || '无'}</div>
+                                    <div class="detail-item">${supply.supplyStatus || '未设置'}</div>
+                                    <div class="detail-item">${supply.description || '无'}</div>
+                                    <div class="detail-item">${supply.region || '未设置'}</div>
                                     <!-- 隐藏独立价格字段，因为每个规格-件数对都有自己的采购价 -->
-                                    <div class="detail-item" style="font-size: 12px; color: #999;">创建时间: ${formatDate(supply.created_at)}</div>
-                                    ${supply.status === 'published' ? `<div class="detail-item" style="color: #faad14;">上架时间: ${formatDate(getPublishTime(supply))}</div>` : ''}
+                                    <div class="detail-item" style="font-size: 12px; color: #999; grid-column: 1 / -1;">创建时间：${formatDate(supply.created_at)}</div>
+                                    ${supply.status === 'published' ? `<div class="detail-item" style="font-size: 12px; color: #999; grid-column: 1 / -1;">上架时间：${formatDate(getPublishTime(supply))}</div>` : ''}
                                 </div>
                             </div>
                             <!-- 右侧规格-件数对 -->
-                            <div class="spec-quantity-container" style="display: block; gap: 15px; flex: 1;">
+                            <div class="spec-quantity-container" style="flex: 1;">
                                 ${specQuantityBoxes}
                             </div>
                         </div>