.page-container { background-color: #f3f3f3; padding-top: 10px; padding-bottom: 140rpx; height: calc(100vh - 44px); box-sizing: border-box; -webkit-overflow-scrolling: touch; .verify-record-page { background: white; // padding: 24rpx 0; padding-bottom: 50px; } .title { font-size: 32rpx; font-weight: bold; padding: 24rpx 32rpx 12rpx 32rpx; color: #222; } .record-card { background: #fff; border-radius: 16rpx; margin: 0 24rpx 24rpx 24rpx; padding: 24rpx 24rpx 18rpx 24rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); } .record-header { font-size: 28rpx; font-weight: 500; color: #222; margin-bottom: 12rpx; display: flex; align-items: center; } .record-index { margin-right: 8rpx; } .record-time { color: #222; } .record-row { font-size: 26rpx; color: #666; margin-bottom: 8rpx; display: flex; flex-wrap: wrap; } .opt-img { display: flex; justify-content: baseline; .img-box { width: 300rpx; height: 200rpx; border-radius: 10rpx; } } .label { color: #999; margin-right: 8rpx; } } .bottom-actions { position: fixed; left: 0; right: 0; bottom: 0; // padding: 24rpx 32rpx calc(24rpx + env(safe-area-inset-bottom)); padding: 24rpx 32rpx calc(env(safe-area-inset-bottom)); background: #f3f3f3; box-sizing: border-box; } .bottom-btn { height: 88rpx; line-height: 88rpx; border-radius: 12rpx; background: #1976d2; color: #fff; font-size: 30rpx; text-align: center; } .empty-state { display: flex; justify-content: center; align-items: center; min-height: 300rpx; padding: 40rpx; .empty-text { color: #999; font-size: 28rpx; } } // 预约成功卡片 .appointment-success-card { background: #fff; border-radius: 16rpx; // margin: 24rpx; padding: 30rpx 32rpx 40rpx; box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); margin-bottom: 20rpx; } .appointment-actions { margin-top: 30rpx; display: flex; justify-content: center; gap: 24rpx; } .action-btn { min-width: 220rpx; height: 72rpx; line-height: 72rpx; border-radius: 12rpx; font-size: 28rpx; text-align: center; box-sizing: border-box; padding: 0 24rpx; } .action-btn.cancel { background: #fff; color: #1976d2; border: 2rpx solid #1976d2; margin-right: 20px; } .action-btn.modify { background: #1976d2; color: #fff; border: 2rpx solid #1976d2; } .appointment-success-title { font-size: 48rpx; font-weight: 600; color: #000; text-align: center; margin-bottom: 30rpx; } // 二维码容器 .qr-code-container { display: flex; justify-content: center; align-items: center; margin-bottom: 50rpx; } .qr-code-image { width: 400rpx; height: 400rpx; background: #fff; } .qr-code-placeholder { width: 260rpx; height: 260rpx; background: #f5f5f5; border: 2rpx dashed #ddd; border-radius: 8rpx; display: flex; align-items: center; justify-content: center; } .qr-code-text { font-size: 28rpx; color: #999; } // 预约信息 .appointment-info { margin-bottom: 50rpx; margin-left: 20rpx; } .info-item { display: flex; align-items: flex-start; margin-bottom: 25rpx; font-size: 30rpx; line-height: 1.8; } .info-label { color: #000; margin-right: 16rpx; // min-width: 180rpx; flex-shrink: 0; } .info-value { color: #000; flex: 1; word-break: break-all; font-weight: 600; } // 提示信息 // .appointment-tip { // margin-top: 50rpx; // padding-top: 40rpx; // border-top: 1rpx solid #eee; // } .tip-text { font-size: 26rpx; color: #000; line-height: 1.8; text-align: center; } .evaluate-box{ display: flex; justify-content: space-between; align-items: center; } .btn-review { padding: 12rpx 40rpx; border-radius: 12rpx; font-size: 26rpx; text-align: center; background-color: #fff; color: #1976d2; border: 1px solid #1976d2; margin-left: 20rpx; }