综述: 优化福利专区页面布局和积分订单功能
- 调整页面内容区域高度,移除底部多余内边距,优化页面布局 - 修改底部导航栏定位方式,从固定定位改为普通文档流定位,避免遮挡内容 - 调整悬浮购物车按钮位置,使其与新的底部导航栏布局适配 - 优化积分订单tab切换逻辑,进入订单页面时隐藏购物车按钮,提升用户体验
This commit is contained in:
		
							parent
							
								
									acaea8fd8d
								
							
						
					
					
						commit
						d94fbdc464
					
				|  | @ -85,7 +85,6 @@ | ||||||
|             border-radius: 20px 20px 0 0; |             border-radius: 20px 20px 0 0; | ||||||
|             margin-top: -15px; |             margin-top: -15px; | ||||||
|             padding: 20px; |             padding: 20px; | ||||||
|             padding-bottom: 120px; |  | ||||||
|             min-height: calc(100vh - 200px); |             min-height: calc(100vh - 200px); | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|  | @ -874,15 +873,12 @@ | ||||||
| 
 | 
 | ||||||
|         /* 底部导航 */ |         /* 底部导航 */ | ||||||
|         .bottom-nav { |         .bottom-nav { | ||||||
|             position: fixed; |  | ||||||
|             bottom: 0; |  | ||||||
|             left: 0; |  | ||||||
|             right: 0; |  | ||||||
|             background: white; |             background: white; | ||||||
|             display: flex; |             display: flex; | ||||||
|             justify-content: space-around; |             justify-content: space-around; | ||||||
|             padding: 10px 0 25px; |             padding: 10px 0 25px; | ||||||
|             border-top: 1px solid #eee; |             border-top: 1px solid #eee; | ||||||
|  |             margin-top: 20px; | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         .nav-item { |         .nav-item { | ||||||
|  | @ -912,7 +908,7 @@ | ||||||
|         /* 悬浮购物车图标 */ |         /* 悬浮购物车图标 */ | ||||||
|         .floating-cart { |         .floating-cart { | ||||||
|             position: fixed; |             position: fixed; | ||||||
|             bottom: 90px; |             bottom: 20px; | ||||||
|             right: 20px; |             right: 20px; | ||||||
|             width: 60px; |             width: 60px; | ||||||
|             height: 60px; |             height: 60px; | ||||||
|  | @ -1704,6 +1700,14 @@ | ||||||
|             if (tabName === 'orders') { |             if (tabName === 'orders') { | ||||||
|                 renderPointsOrders(); |                 renderPointsOrders(); | ||||||
|             } |             } | ||||||
|  |              | ||||||
|  |             // 积分订单tab不显示购物车按钮 | ||||||
|  |             const floatingCart = document.getElementById('floatingCart'); | ||||||
|  |             if (tabName === 'orders') { | ||||||
|  |                 floatingCart.style.display = 'none'; | ||||||
|  |             } else { | ||||||
|  |                 floatingCart.style.display = 'flex'; | ||||||
|  |             } | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         // 渲染积分订单数据 |         // 渲染积分订单数据 | ||||||
|  |  | ||||||
		Loading…
	
		Reference in New Issue