付款结果

pages/scanToPay/payResult.vue

@@ -0,0 +1,146 @@
+<template>
+	<view>
+		<u-navbar title="付款结果"></u-navbar>
+		<view class="main">
+			<view class="icon">
+				<img src="../../assets/img/success.png" alt="">
+			</view>
+			<!-- 金额 -->
+			<view class="money">
+				15.00
+			</view>
+			<view class="text">
+				付款成功
+			</view>
+			<!-- 订单信息 -->
+			<view class="infos">
+				<view class="item">
+					<view class="title">
+						饭卡余额（元）
+					</view>
+					<view class="value">
+						315.00
+					</view>
+				</view>
+				<view class="item">
+					<view class="title">
+						订单号
+					</view>
+					<view class="value">
+						000111222333444
+					</view>
+				</view>
+				<view class="item">
+					<view class="title">
+						支付时间
+					</view>
+					<view class="value">
+			        2023-04-10 12:00:00
+					</view>
+				</view>
+			</view>
+			<!-- 按钮 -->
+			 <view class="button">
+			 	 <view class="close">
+			 	 	<button>关闭页面</button>
+			 	 </view>
+				 <view class="check">
+				 	<button>查看消费记录</button>
+				 </view>
+			 </view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page{
+		background-color: #fff;
+	}
+	/deep/.u-border-bottom:after {
+	       border-bottom-width: 0px;
+	}
+	.main{
+		text-align: center;
+		.icon{
+			margin: 100rpx auto 40rpx;
+			
+		}
+		// 金额
+		.money{
+			color: rgba(51, 51, 51, 1);
+			font-size: 96rpx;
+			font-weight: bold;
+			font-family: Roboto-medium;
+		}
+		.text{
+			color: rgba(16, 16, 16, 1);
+			font-size: 48rpx;
+			margin-top: 8rpx;
+			
+		}
+		// 订单信息
+		.infos{
+			margin: 48rpx 72rpx;
+			.item{
+				display: flex;
+				justify-content: space-between;
+				margin-bottom: 32rpx;
+				.title{
+					color: rgba(134, 137, 140, 1);
+					font-size: 32rpx;
+				}
+				.value{
+					color: rgba(51, 51, 51, 1);
+					font-size: 32rpx;
+				}
+			}
+		}
+		// 按钮
+		.button{
+			margin: 0 72rpx;
+			display: flex;
+			justify-content: space-between;
+			font-size: 32rpx;
+			text-align: center;
+			.close{
+				uni-button{
+					width: 280rpx;
+					height: 80rpx;
+					line-height: 80rpx;
+					border-radius: 8px;
+					font-size: 32rpx;
+					background-color: rgba(255, 255, 255, 1);
+					color: rgba(51, 51, 51, 1);
+					border: 1px solid rgba(153, 153, 153, 1);
+				}
+			}
+			.check{
+				uni-button{
+					width: 280rpx;
+					height: 80rpx;
+					line-height: 80rpx;
+					border-radius: 8px;
+					font-size: 32rpx;
+					background-color: rgba(255, 255, 255, 1);
+					color: rgba(31, 74, 153, 1);
+					border: 1px solid rgba(31, 74, 153, 1);
+				}
+			}
+		}
+	}
+
+</style>