.success-container { display: flex; flex-direction: column; align-items: center; padding: 40rpx 30rpx; } .success-icon { margin-top: 162rpx; width: 160rpx; height: 160rpx; } .success-icon image { width: 100%; height: 100%; } .success-title { font-size: 36rpx; font-weight: bold; margin: 30rpx 0 50rpx; } .check-list { width: 100%; margin-bottom: 60rpx; display: flex; flex-direction: column; align-content: center; flex-wrap: wrap; } .check-item { display: flex; align-items: center; margin-bottom: 20rpx; } .check-index { width: 40rpx; height: 40rpx; border-radius: 50%; background-color: #f0f0f0; color: #999; display: flex; justify-content: center; align-items: center; font-size: 24rpx; margin-right: 20rpx; } .check-name { margin-right: 20px; font-size: 28rpx; color: #333; } .check-status { font-size: 28rpx; color: #003399; } .status-fail { color: #f56c6c; } .button-group { display: flex; width: 100%; justify-content: space-between; margin-top: 240rpx; } .btn-retake, .btn-next { width: 45%; height: 80rpx; line-height: 80rpx; text-align: center; border-radius: 8rpx; } .btn-retake { background-color: #f5f5f5; color: #333; border: 1px solid #ddd; } .btn-next { background-color: #003399; color: #fff; } .btn-next:disabled { background-color: #999; opacity: 0.6; } .loading-container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.8); display: flex; flex-direction: column; align-items: center; justify-content: center; } .loading-spinner { border: 4px solid #f3f3f3; border-top: 4px solid #003399; border-radius: 50%; width: 40rpx; height: 40rpx; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .loading-text { margin-top: 20rpx; font-size: 28rpx; color: #333; } /* 添加 loading 相关样式 */ .loading-container { display: flex; flex-direction: column; align-items: center; margin: 40rpx 0; } .loading-spinner { width: 60rpx; height: 60rpx; border: 4rpx solid #f3f3f3; border-top: 4rpx solid #003399; border-radius: 50%; animation: spin 1s linear infinite; margin-bottom: 20rpx; } .loading-text { font-size: 28rpx; color: #666; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* 修改按钮禁用状态样式 */ .btn-retake:disabled, .btn-next:disabled { opacity: 0.5; cursor: not-allowed; }