.container { padding: 20rpx; } .search-bar { display: flex; align-items: center; background: #f5f5f5; border-radius: 8rpx; padding: 20rpx; margin-bottom: 20rpx; } .search-input { flex: 1; font-size: 28rpx; } .search-icon { width: 40rpx; height: 40rpx; margin-left: 20rpx; } .order-list { height: calc(100vh - 160rpx); } .order-item { background: #fff; border-radius: 8rpx; padding: 20rpx; margin-bottom: 20rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); } .order-field { display: flex; margin-bottom: 16rpx; } .label { color: #666; font-size: 28rpx; width: 180rpx; white-space: nowrap; } .value { color: #333; font-size: 28rpx; flex: 1; } .order-actions { display: flex; justify-content: flex-end; margin-top: 20rpx; } .action-btn { margin: 0; padding: 0 40rpx; height: 60rpx; line-height: 60rpx; font-size: 28rpx; border-radius: 30rpx; } .complete-btn { background: #2583FF; color: #fff; } .custom-navbar { position: fixed; top: 0; left: 0; right: 0; height: 88rpx; background: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0 32rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); z-index: 999; } .navbar-title { font-size: 32rpx; font-weight: bold; } .navbar-right { font-size: 28rpx; color: #007aff; } /* 新增右下角按钮样式 */ .fixed-bottom-right { position: fixed; right: 32rpx; bottom: 32rpx; z-index: 999; } .profile-btn { width: 160rpx; height: 80rpx; line-height: 80rpx; text-align: center; background: #2583FF; color: #fff; border-radius: 40rpx; box-shadow: 0 4rpx 16rpx rgba(255, 81, 42, 0.3); } /* 新增固定定位样式 */ .fixed-top { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background: #fff; } /* 调整内容区域的上边距 */ .content { margin-top: 80rpx; /* 根据实际高度调整 */ } .search_icon { width: 30rpx; height: 30rpx; } .navBox { display: flex; align-items: center; padding: 0 20rpx; box-sizing: border-box; } .navItem { flex: 1; white-space: nowrap; font-weight: 400; font-size: 28rpx; color: #555555; } .active { font-weight: bold; position: relative; font-size: 32rpx; } .active::after { content: ''; width: 90%; height: 10rpx; background: #2583FF; border-radius: 0rpx 0rpx 0rpx 0rpx; position: absolute; left: 50%; bottom: -8rpx; transform: translateX(-50%); } .btn1 { width: 120rpx; height: 50rpx; display: flex; align-items: center; justify-content: center; border-radius: 30rpx; background-color: #2583ff; color: #fff; flex: unset; } .order-field2{ justify-content: flex-end; } .btn2{ width: 120rpx; height: 50rpx; display: flex; align-items: center; justify-content: center; border-radius: 30rpx; background-color: #2583ff; color: #fff; flex: unset; } .btn3{ width: 120rpx; height: 50rpx; display: flex; align-items: center; justify-content: center; border-radius: 30rpx; background-color: #2583ff; color: #fff; flex: unset; }