Prechádzať zdrojové kódy

订单详情取消支付调整

DELL 3 rokov pred
rodič
commit
d0ec6998ae
1 zmenil súbory, kde vykonal 35 pridanie a 15 odobranie
  1. 35 15
      pages/order/detail.vue

+ 35 - 15
pages/order/detail.vue

@@ -131,7 +131,7 @@
 				</view>
 			</view> -->
 		</view>
-		
+
 		<view class="footer-fixed" v-if="status.value == 2 || status.value == 3">
 			<view class="flex btn">
 				<view class="btn-right">
@@ -142,10 +142,18 @@
 				</view>
 			</view>
 		</view>
-		<view class="detail-btn" v-if="status.value == 0">
-			<text @click="cancelOrder">取消订单</text>
-			<text @click="payOrder">去支付</text>
+
+		<view class="footer-fixed" v-if="status.value == 0">
+			<view class="flex btn">
+				<view class="btn-right">
+					<text class="logisticsCancel" @click="cancelOrder">取消订单</text>
+				</view>
+				<view class="btn-right">
+					<text class="confirmPay" @click="payOrder">去支付</text>
+				</view>
+			</view>
 		</view>
+
 	</view>
 </template>
 
@@ -279,15 +287,15 @@
 					data: id,
 				});
 			},
-			
+
 			// 查看物流
 			getLogistics() {
 				uni.navigateTo({
-					url:`/pages/order/logistics?id=${ this.orderId }`
+					url: `/pages/order/logistics?id=${ this.orderId }`
 					// url:`/pages/order/logistics?id=96666733329055749370`
 				});
 			},
-			
+
 			// 确认收货
 			confirmOne() {
 				let orderId = this.orderId
@@ -343,27 +351,38 @@
 					color: $uni-text-color;
 				}
 
-				.logistics {
+				@mixin btn {
 					width: 160rpx;
 					height: 60rpx;
 					line-height: 60rpx;
 					border-radius: 8rpx;
 					text-align: center;
 					margin-left: 20rpx;
+				}
+
+				.logistics {
+					@include btn
 					border: 1px solid #bbbbbb;
 					color: #414141;
 				}
 
+				.logisticsCancel {
+					@include btn
+					border: 2rpx solid $uni-bg-color;
+				}
+
 				.confirm {
-					width: 160rpx;
-					height: 60rpx;
-					line-height: 60rpx;
-					border-radius: 8rpx;
-					text-align: center;
-					margin-left: 20rpx;
-					border: 1px solid rgba(236, 112, 9, 100);
+					@include btn
+					border: 2rpx solid rgba(236, 112, 9, 100);
 					color: rgba(236, 112, 9, 100);
 				}
+
+				.confirmPay {
+					@include btn
+					background-color: $uni-bg-color;
+					border: 2rpx solid $uni-bg-color;
+					color: #FFFFFF;
+				}
 			}
 		}
 	}
@@ -583,6 +602,7 @@
 		padding: 20rpx 20rpx;
 
 		text {
+
 			display: block;
 			box-sizing: border-box;
 			margin: 0 0 0 40rpx;