page { background: #f2f3f7; } .submit-order { padding-bottom: calc(130rpx + env(safe-area-inset-bottom)); } .submit-order .distribution-mode { padding: 30rpx; padding-bottom: 36rpx; position: relative; background: #fff; } .submit-order .distribution-mode .item-box { background:#f1f1f1; width: 420rpx; height: 70rpx; line-height: 70rpx; border-radius: 70rpx; box-sizing: border-box; display: flex; margin: auto; } .submit-order .distribution-mode .item-box .item { flex: 1; border-radius: 70rpx; font-weight: 600; text-align: center; font-size: 26rpx; } .submit-order .distribution-mode .item-box .item.active { color: #fff; background: #fc1b35; } /* 收货地址 */ .submit-order .address-box { background: #fff; position: relative; border-radius: 10rpx; padding: 30rpx; box-sizing: border-box; /* margin-top: 30rpx; */ } .submit-order .address-box .tit { display: flex; justify-content: space-between; line-height: 40rpx; padding: 10rpx 0; } .submit-order .address-box .tit .text { font-weight: 600; } .submit-order .address-box .tit .total { color: #fc1b35; position: relative; font-size: 20rpx; } /* 邮寄到家 */ .submit-order .address-box .add-item { display: flex; align-items: center; margin-top: 30rpx; padding-bottom: 30rpx; position: relative; border-bottom: 2rpx solid #f9f9f9; } .submit-order .address-box .add-item:last-child { border: 0; padding-bottom: 0; } .submit-order .address-box .add-item .input, .submit-order .address-box .add-item .area { flex: 1; font-size: 24rpx; font-weight: 600; height: 32rpx; line-height: 32rpx; } .submit-order .address-box .add-item .area { height: 32rpx; line-height: 32rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .submit-order .address-box .add-item .area.text-arrow::after { top: 45%; right: 12rpx; } .submit-order .address-box .add-item .area .tip-text { color: #999; } .submit-order .address-box .add-item.btns { justify-content: center; } .submit-order .address-box .add-item .btn { width: 200rpx; height: 60rpx; line-height: 60rpx; border-radius: 60rpx; text-align: center; border: 2rpx solid #ddd; } .submit-order .address-box .add-item .btn.btn-r { border: 2rpx solid #fc1b35; color: #fc1b35; margin-right: 20rpx; } .submit-order .address-box .current-address { margin-bottom: 36rpx; position: relative; padding-right: 58rpx; } .submit-order .address-box .current-address .c-address { font-size: 28rpx; font-weight: 600; line-height: 36rpx; } .submit-order .address-box .current-address .c-user { font-size: 24rpx; margin-top: 16rpx; color: #999; } .submit-order .address-box .current-address .c-user .name { margin-right: 30rpx; } .submit-order .address-box .current-address .c-edit { font-size: 0; width: 24rpx; height: 24rpx; position: absolute; top: 6rpx; right: 10rpx; } .submit-order .address-box .choose-way { padding-top: 30rpx; margin-top: 30rpx; display: flex; justify-content: space-between; box-shadow: 0 -6rpx 6rpx rgba(0, 0, 0, .01); } .submit-order .address-box .choose-way .text { font-weight: 600; } .submit-order .address-box .choose-way .go { color: #fc1b35; } /* 到店自提 */ .submit-order .address-box .self-raising .choose-store { display: flex; align-items: flex-start; padding-top: 30rpx; } .submit-order .address-box .self-raising .choose-store .img { width: 28rpx; height: 28rpx; margin: 6rpx 10rpx 0 0; } .submit-order .address-box .self-raising .choose-store .text { font-weight: 600; max-height: 80rpx; line-height: 40rpx; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; flex: 1; } .submit-order .address-box .self-raising .choose-store .text .tip-text { color: #999; } .submit-order .address-box .self-raising .choose-store .text::after { top: 20rpx; } .submit-order .address-box .raising-user { margin-top: 30rpx; padding-top: 30rpx; padding-bottom: 10rpx; box-shadow: 0 -6rpx 6rpx rgba(0, 0, 0, .01); } .submit-order .address-box .raising-user .user-info { margin-top: 30rpx; font-size: 24rpx; } .submit-order .address-box .raising-user .user-info .input { padding-bottom: 30rpx; font-size: 24rpx; border-bottom: 2rpx solid #f9f9f9; font-weight: 600; } .submit-order .address-box .raising-user .user-info:last-child .input { padding-bottom: 0; border: 0; } /* 店铺 */ .submit-order .shop-item { background: #fff; border-radius: 10rpx; margin-top: 30rpx; position: relative; padding: 30rpx; } .submit-order .shop-item .shop-box { display: flex; align-items: center; } .submit-order .shop-item .shop-box .shop-icon { width: 24rpx; height: 24rpx; font-size: 0; margin-right: 10rpx; } .submit-order .shop-item .shop-box .shop-name { flex: 1; font-weight: 600; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } .submit-order .shop-item .shop-prods .prod-item:last-child { padding-bottom: 36rpx; } /* 活动商品 */ .submit-order .shop-item .discount-prod { padding: 30rpx 0; border-bottom: 2rpx dashed #f2f2f2; } .submit-order .shop-item .discount-prod:first-child { margin-top: 30rpx; border-top: 2rpx dashed #f2f2f2; } .submit-order .shop-item .prod-item .discount-info { display: none; align-items: center; } .submit-order .shop-item .prod-item.discount-prod .discount-info { display: flex; } .submit-order .shop-item .discount-prod .discount-info .d-name { padding: 4rpx 6rpx; background: #fc1b35; border-radius: 4rpx; color: #fff; font-size: 18rpx; line-height: 1; } .submit-order .shop-item .discount-prod .discount-info .d-des { flex: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; margin: 0 10rpx; font-weight: 600; } .submit-order .shop-item .discount-prod .discount-info .d-reduced { display: flex; align-items: baseline; } /* 单商品 */ .submit-order .shop-item .prod-item .single-prod { display: flex; padding-top: 30rpx; } .submit-order .shop-item .prod-item .single-prod .pic { font-size: 0; width: 160rpx; height: 160rpx; border-radius: 10rpx; overflow: hidden; } .submit-order .shop-item .prod-item .single-prod .info { flex: 1; margin-left: 20rpx; position: relative; } .submit-order .shop-item .prod-item .single-prod .info .name { max-height: 64rpx; line-height: 32rpx; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; word-break: break-all; } .submit-order .shop-item .prod-item .single-prod .info .name .prods-style { padding: 0 6rpx; background: #fc1b35; border-radius: 4rpx; color: #fff; font-size: 18rpx; margin-right: 10rpx; display: inline-block; height: 24rpx; line-height: 24rpx; vertical-align: top; margin-top: 4rpx; } .submit-order .shop-item .prod-item .single-prod .info .sku { color: #999; font-size: 20rpx; margin-top: 10rpx; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; word-break: break-all; } .submit-order .shop-item .prod-item .single-prod .info .price-box { display: flex; align-items: baseline; justify-content: space-between; position: absolute; bottom: 0; width: 100%; } .submit-order .shop-item .prod-item .single-prod .info .price-box .count { color: #999; margin-right: 10rpx; } /* 不满足当前配送方式的商品 */ .submit-order .shop-item .useless { position: relative; z-index: 1; padding: 20rpx 30rpx; background: #f6f9fb; border-radius: 10rpx; } .submit-order .shop-item .useless .u-reason { color: #999; font-size: 20rpx; } .submit-order .shop-item .useless .u-box { margin-top: 20rpx; white-space: nowrap; } .submit-order .shop-item .useless .u-box .u-prods { display: inline-block; width: 100rpx; height: 100rpx; font-size: 0; border-radius: 6rpx; overflow: hidden; margin-left: 10rpx; } .submit-order .shop-item .useless .u-box .u-prods:first-child { margin-left: 0; } /* 优惠、留言、金额计算 */ .submit-order .msg-item { background: #fff; padding: 0 30rpx 30rpx; margin-top: 30rpx; border-radius: 10rpx; line-height: 40rpx; } .submit-order .shop-item .msg-item { position: relative; padding: 0; margin-top: -2rpx; box-shadow: 0 -6rpx 6rpx rgba(0, 0, 0, .01); } .submit-order .shop-item .msg-item .item:last-child { padding-bottom: 0; } .submit-order .msg-item .item { display: flex; justify-content: space-between; align-items: center; padding-top: 30rpx; } .submit-order .msg-item .item .item-tit { margin-right: 20rpx; } .submit-order .msg-item .item .price.black { color: #333; } .submit-order .msg-item .item .price .big { font-size: 28rpx; } .submit-order .msg-item .item .free-box { display: flex; align-items: baseline; } .submit-order .msg-item .item .free-box .price { margin-left: 10rpx; } .submit-order .msg-item .item .number .text { color: #999; font-family: -apple-system,Helvetica,sans-serif; } .submit-order .msg-item .item .input { flex: 1; background: #fff; font-size: 24rpx; text-align: right; height: 40rpx; } .submit-order .msg-item .item .input-placeholder { color: #999; } /* 底部栏 */ .submit-order .submit-footer { position: fixed; bottom: 0; left: 0; right: 0; max-width: 750rpx; margin: auto; background: #fff; display: flex; align-items: center; justify-content: space-between; border-radius: 10rpx 10rpx 0 0; box-shadow: 0 -6rpx 6rpx rgba(0,0,0,.01); box-sizing: border-box; height: calc(100rpx + env(safe-area-inset-bottom)); padding: 0 30rpx; } .submit-order .submit-footer .total { display: flex; align-items: center; font-weight: 600; } .submit-order .submit-footer .total .text { font-size: 26rpx; margin-top: 10rpx; } .submit-order .submit-footer .total .price { font-size: 32rpx; } .submit-order .submit-footer .total .price .big { font-size: 40rpx; } .submit-order .submit-footer .btn { height: 70rpx; line-height: 70rpx; border-radius: 70rpx; background: linear-gradient(135deg, #ff1a49, #f1091d 69%, #fc1b35); padding: 0 50rpx; color: #fff; font-weight: 600; font-size: 26rpx; } /* 选择配送方式、可用地址、历史提货人弹窗 */ .submit-order .popup .check-address { height: 60%; } .submit-order .popup .check-address.h40 { height: 40%; } .submit-order .popup .check-address .address-item { display: flex; align-items: flex-start; padding: 30rpx 0 10rpx; } .submit-order .popup .check-address .address-item:last-child { padding-bottom: 30rpx; } .submit-order .popup .check-address .address-item .text-box { flex: 1; margin-right: 20rpx; } .submit-order .popup .check-address .address-item .text-box .address { font-weight: 600; line-height: 32rpx; } .submit-order .popup .check-address .address-item .text-box .address .default { padding: 0 6rpx; background: #fc1b35; border-radius: 4rpx; color: #fff; font-size: 18rpx; margin-right: 10rpx; display: inline-block; height: 24rpx; line-height: 24rpx; vertical-align: top; margin-top: 4rpx; } .submit-order .popup .check-address .address-item .text-box .address .des { color: #999; } .submit-order .popup .check-address .address-item .text-box .user { display: flex; align-items: center; color: #999; margin-top: 10rpx; } .submit-order .popup .check-address .address-item .text-box .user .name { margin-right: 20rpx; } /* 选择提货时间弹窗 */ .submit-order .popup .delivery-time { height: 60%; } .submit-order .popup .delivery-time .popup-tit { box-shadow: 0 6rpx 6rpx rgba(0, 0, 0, .01); } .submit-order .popup .delivery-time .con-box-min.time-box { left: 0; right: 0; display: flex; } .submit-order .popup .delivery-time .time-box .day-box { background: #f9f9f9; width: 220rpx; } .submit-order .popup .delivery-time .time-box .day-box .item { padding: 30rpx 0; height: 40rpx; line-height: 40rpx; text-align: center; } .submit-order .popup .delivery-time .time-box .day-box .item.active { background: #fff; } .submit-order .popup .delivery-time .time-box .hour-box { flex: 1; padding: 10rpx 30rpx; } .submit-order .popup .delivery-time .time-box .hour-box .item { display: flex; align-items: center; height: 40rpx; padding: 20rpx 0 10rpx; } .submit-order .popup .delivery-time .time-box .hour-box .item .number { flex: 1; line-height: 40rpx; } /* 优惠券弹窗 */ .submit-order .popup .check-coupon .con-box { bottom: calc(110rpx + env(safe-area-inset-bottom)); } .submit-order .popup .check-coupon .coupon-item .text-box { position: relative; padding-right: 76rpx; } .submit-order .popup .check-coupon .coupon-item .text-box .check { position: absolute; top: 50%; right: 20rpx; transform: translateY(-50%); } /* 积分抵扣弹窗 */ .popup .use-integral { height: 40%; } .popup .use-integral .my-integral { display: flex; align-items: baseline; justify-content: space-between; margin-top: 70rpx; } .popup .use-integral .my-integral .number .bold { font-weight: 600; font-family: PingFangSC-Medium, tahoma; } .popup .use-integral .my-integral .used { display: flex; align-items: baseline; } .popup .use-integral .my-integral .not-use { color: #999; } .popup .use-integral .input { padding: 20rpx 0 40rpx; box-shadow: 0 6rpx 6rpx rgba(0,0,0,.01); margin-top: 60rpx; font-weight: 600; } /* 地区picker弹窗 */ picker-view { background-color: white; padding: 0; width: 100%; height: 380rpx; bottom: 0; position: fixed; } picker-view-column view { vertical-align: middle; font-size: 30rpx; line-height: 30rpx; height: 100%; display: flex; align-items: center; justify-content: center; } .animation-element-wrapper { display: flex; position: fixed; left: 0; top: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.6); z-index: 999; } .animation-element { display: flex; position: fixed; width: 100%; height: 530rpx; bottom: 0; background-color: rgba(255, 255, 255, 1); } .animation-button { top: 20rpx; width: 290rpx; height: 100rpx; align-items: center; } picker-view text { color: #999; display: inline-flex; position: fixed; margin-top: 20rpx; height: 50rpx; text-align: center; line-height: 50rpx; font-size: 34rpx; font-family: Arial, Helvetica, sans-serif; } .left-bt { left: 30rpx; } .right-bt { right: 35rpx; top: 20rpx; position: absolute; width: 80rpx !important; } .line { display: block; position: fixed; height: 2rpx; width: 100%; margin-top: 89rpx; background-color: #eee; }