page { background: #f6f6f6; } .box { background: #ffffff; margin: 30rpx; padding: 30rpx; border-radius: 30rpx; position: relative; .code { width: 100%; text-align: center; margin: 30rpx 0; .code-img { width: 300rpx; height: 300rpx; } } .order-details { font-size: 30rpx; margin-top: 20rpx; color: #666666; display: flex; .number { color: black; } } .names { font-size: 30rpx; } .taxi { display: flex; margin: 0rpx 0 0 10rpx; position: absolute; bottom: 20rpx; right: 30rpx; .taxi-box { margin-right: 40rpx; .taxi-name { text-align: center; } .taxi-phone { text-align: center; } } .taxi-boxs { margin-right: 0rpx; .taxi-name { text-align: center; } .taxi-phone { text-align: center; } } } .time { margin-top: 20rpx; font-size: 26rpx; width: 450rpx; } .order-times { width: 90%; background: #FFFFFF; border: 1rpx solid #FFE300; border-radius: 30rpx; margin: 20rpx 5% 0rpx 5%; display: flex; justify-content: space-between; padding: 10rpx 30rpx; .order-date { display: flex; .date { margin-right: 20rpx; } } .price { color: red; } } .order-number { display: flex; justify-content: space-between; .number { font-size: 30rpx; } .state { font-size: 30rpx; } } .order-txt { display: flex; margin: 20rpx 0rpx 0 0; .order-image { width: 240rpx; height: 180rpx; margin-right: 20rpx; } .order-name { margin-top: 5rpx; .name { overflow: hidden; //一定要写 text-overflow: ellipsis; //超出省略号 display: -webkit-box; //一定要写 -webkit-line-clamp: 1; //控制行数 -webkit-box-orient: vertical; //一定要写 } .order-price { color: red; margin-top: 20rpx; } .order-time { margin-top: 20rpx; } } } .order-order { display: flex; justify-content: flex-end; margin-top: 20rpx; .bu { border: 1rpx solid #BBBBBB !important; border-radius: 24rpx !important; font-size: 30rpx !important; padding: 0rpx 20rpx !important; margin-right: 20rpx !important; background: #ffffff !important; } .service { border: 1rpx solid #BBBBBB; border-radius: 24rpx; font-size: 30rpx; padding: 20rpx 20rpx; margin-right: 20rpx; } .pay { // border: 1rpx solid #BBBBBB; border-radius: 24rpx; font-size: 30rpx; padding: 20rpx 0; width: 180rpx; text-align: center; background: #46a9a4; } } } .bommon { position: fixed; bottom: 0; width: 100%; display: flex; justify-content: space-between; padding: 10rpx 30rpx; background: #ffffff; .bommon-price { color: red; margin: auto 30rpx; } .bommon-pay { background: #fee104; border-radius: 30rpx; font-size: 32rpx; padding: 20rpx 50rpx; } }