|
|
@@ -1,12 +1,29 @@
|
|
|
-/* pages/DetailsOfRefund/DetailsOfRefund.wxss */
|
|
|
-.DetailsOfRefund{
|
|
|
+/* pages/order-detail/order-detail.wxss */
|
|
|
+.order-detail{
|
|
|
padding: 20rpx 24rpx 120rpx;
|
|
|
background: #F6F6F6;
|
|
|
}
|
|
|
+.callout-box{
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 16rpx 16rpx 16rpx 16rpx;
|
|
|
+ padding: 14rpx 20rpx;
|
|
|
+}
|
|
|
+.callout-box .title{
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+}
|
|
|
+.callout-box .desc{
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #222222;
|
|
|
+ margin-top: 16rpx;
|
|
|
+}
|
|
|
+
|
|
|
|
|
|
/* 店铺 */
|
|
|
.shop-box {
|
|
|
display: inline-block;
|
|
|
+ padding-bottom: 24rpx;
|
|
|
}
|
|
|
.shop-icon {
|
|
|
display: inline-block;
|
|
|
@@ -27,36 +44,36 @@
|
|
|
color: #222222;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .result-box{
|
|
|
+.order-detail .result-box{
|
|
|
padding: 0 28rpx ;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .result-box .result{
|
|
|
+.order-detail .result-box .result{
|
|
|
position: relative;
|
|
|
padding: 24rpx 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .result-box .result .title{
|
|
|
+.order-detail .result-box .result .title{
|
|
|
font-weight: bold;
|
|
|
font-size: 32rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
-.DetailsOfRefund .result-box .result .title.small{
|
|
|
+.order-detail .result-box .result .title.small{
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .result-box .result .desc{
|
|
|
+.order-detail .result-box .result .desc{
|
|
|
font-size: 24rpx;
|
|
|
color: #AAAAAA;
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .result-box .result .title-box{
|
|
|
+.order-detail .result-box .result .title-box{
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .result-box .result .price{
|
|
|
+.order-detail .result-box .result .price{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #FF4D3A;
|
|
|
@@ -68,12 +85,95 @@
|
|
|
margin-bottom: 20rpx;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .oprate-box{
|
|
|
- display: flex;
|
|
|
+.order-detail .oprate-box{
|
|
|
+ /* display: flex; */
|
|
|
padding: 0 24rpx;
|
|
|
|
|
|
}
|
|
|
-.DetailsOfRefund .oprate-box .item{
|
|
|
+
|
|
|
+.order-sts{
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color: #222222;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+.pay-btn-box{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.pay-btn-box .cancel-btn{
|
|
|
+ width: 226rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ line-height: 68rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 60rpx 60rpx 60rpx 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+}
|
|
|
+.pay-btn-box .pay-btn{
|
|
|
+ width: 456rpx;
|
|
|
+ height: 68rpx;
|
|
|
+ line-height: 68rpx;
|
|
|
+ text-align: center;
|
|
|
+ background: #FF941A;
|
|
|
+ border-radius: 60rpx 60rpx 60rpx 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+}
|
|
|
+
|
|
|
+.order-detail .delivery-addr {
|
|
|
+ padding: 20rpx 30rpx;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.order-detail .delivery-addr .user-info {
|
|
|
+ line-height: 48rpx;
|
|
|
+ word-wrap: break-word;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 1;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+}
|
|
|
+.order-detail .delivery-addr .user-info .item {
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-right: 30rpx;
|
|
|
+ vertical-align: top;
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.order-detail .delivery-addr .addr {
|
|
|
+ font-size: 28rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+ margin-top: 20rpx;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.order-detail .time-box{
|
|
|
+ padding: 20rpx 0;
|
|
|
+}
|
|
|
+.order-detail .time-box .title{
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+}
|
|
|
+.order-detail .time-box .time{
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 48rpx;
|
|
|
+ color: #222222;
|
|
|
+ margin-top: 20rpx;
|
|
|
+}
|
|
|
+.order-detail .flex-box{
|
|
|
+ display: flex;
|
|
|
+}
|
|
|
+.order-detail .oprate-box .item{
|
|
|
width: 25%;
|
|
|
text-align: center;
|
|
|
margin: 0;
|
|
|
@@ -85,87 +185,87 @@
|
|
|
outline: none;
|
|
|
line-height: normal;
|
|
|
}
|
|
|
-.DetailsOfRefund wx-button:after {
|
|
|
+.order-detail wx-button:after {
|
|
|
border: none;
|
|
|
}
|
|
|
-.DetailsOfRefund .oprate-box .item .icon{
|
|
|
+.order-detail .oprate-box .item .icon{
|
|
|
width: 40rpx;
|
|
|
height: 40rpx;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .oprate-box .item .label{
|
|
|
+.order-detail .oprate-box .item .label{
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
|
|
|
|
|
|
-.DetailsOfRefund .refund-goods{
|
|
|
+.order-detail .refund-goods{
|
|
|
padding: 24rpx;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .refund-goods .title-box{
|
|
|
+.order-detail .refund-goods .title-box{
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
padding-bottom: 24rpx;
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .title-box .title{
|
|
|
+.order-detail .refund-goods .title-box .title{
|
|
|
color: #222222;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .title-box .price{
|
|
|
+.order-detail .refund-goods .title-box .price{
|
|
|
color: #FF4D3A;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .refund-goods .good-list{
|
|
|
+.order-detail .refund-goods .good-list{
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item{
|
|
|
+.order-detail .refund-goods .good-list .good-item{
|
|
|
border-top:1rpx solid #F0F0F0;
|
|
|
padding: 20rpx 0;
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .img{
|
|
|
+.order-detail .refund-goods .good-list .good-item .img{
|
|
|
width: 120rpx;
|
|
|
height: 120rpx;
|
|
|
border-radius: 16rpx;
|
|
|
background: #F6F6F6;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .info{
|
|
|
+.order-detail .refund-goods .good-list .good-item .info{
|
|
|
margin-left: 20rpx;
|
|
|
flex: 1;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .info .good-name{
|
|
|
+.order-detail .refund-goods .good-list .good-item .info .good-name{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .info .desc{
|
|
|
+.order-detail .refund-goods .good-list .good-item .info .desc{
|
|
|
font-size: 24rpx;
|
|
|
color: #AAAAAA;
|
|
|
margin-top: 10rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .info .price{
|
|
|
+.order-detail .refund-goods .good-list .good-item .info .price{
|
|
|
color: #AAAAAA;
|
|
|
font-size: 24rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .price-box{
|
|
|
+.order-detail .refund-goods .good-list .good-item .price-box{
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
justify-content: space-between;
|
|
|
align-items: flex-end;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .price-box .price{
|
|
|
+.order-detail .refund-goods .good-list .good-item .price-box .price{
|
|
|
font-weight: bold;
|
|
|
font-size: 32rpx;
|
|
|
color: #FF4D3A;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .good-list .good-item .price-box .num{
|
|
|
+.order-detail .refund-goods .good-list .good-item .price-box .num{
|
|
|
font-size: 24rpx;
|
|
|
color: #AAAAAA;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .open-btn{
|
|
|
+.order-detail .refund-goods .open-btn{
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
@@ -173,74 +273,74 @@
|
|
|
color: #222222;
|
|
|
margin-top: 20rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .refund-goods .open-btn .arrow{
|
|
|
+.order-detail .refund-goods .open-btn .arrow{
|
|
|
width: 20rpx;
|
|
|
height: 20rpx;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .goods-info{
|
|
|
+.order-detail .goods-info{
|
|
|
padding: 24rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .goods-info .item{
|
|
|
+.order-detail .goods-info .item{
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
padding-bottom: 28rpx;
|
|
|
|
|
|
}
|
|
|
-.DetailsOfRefund .goods-info .item .label{
|
|
|
+.order-detail .goods-info .item .label{
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .goods-info .item .value{
|
|
|
+.order-detail .goods-info .item .value{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #FF4D3A;
|
|
|
}
|
|
|
-.DetailsOfRefund .goods-info .total{
|
|
|
+.order-detail .goods-info .total{
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
padding-top: 28rpx ;
|
|
|
border-top: 2rpx solid #F0F0F0;
|
|
|
}
|
|
|
-.DetailsOfRefund .goods-info .total .label{
|
|
|
+.order-detail .goods-info .total .label{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
-.DetailsOfRefund .goods-info .total .value{
|
|
|
+.order-detail .goods-info .total .value{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #FF4D3A;
|
|
|
}
|
|
|
|
|
|
-.DetailsOfRefund .order-info{
|
|
|
+.order-detail .order-info{
|
|
|
padding: 28rpx 24rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .title{
|
|
|
+.order-detail .order-info .title{
|
|
|
font-weight: bold;
|
|
|
font-size: 32rpx;
|
|
|
color: #222222;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .item{
|
|
|
+.order-detail .order-info .item{
|
|
|
padding-top: 28rpx;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .item .label{
|
|
|
+.order-detail .order-info .item .label{
|
|
|
font-size: 28rpx;
|
|
|
color: #AAAAAA;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .item .value-box{
|
|
|
+.order-detail .order-info .item .value-box{
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .item .value-box .icon{
|
|
|
+.order-detail .order-info .item .value-box .icon{
|
|
|
width: 30rpx;
|
|
|
height: 30rpx;
|
|
|
margin-left: 20rpx;
|
|
|
}
|
|
|
-.DetailsOfRefund .order-info .item .value{
|
|
|
+.order-detail .order-info .item .value{
|
|
|
font-weight: bold;
|
|
|
font-size: 28rpx;
|
|
|
color: #222222;
|