From d3f9f8d949a024bb3613fc47ab2da636b0271dad Mon Sep 17 00:00:00 2001
From: jiazhipeng <jiazhipeng@xmainc.com>
Date: Thu, 19 Jun 2025 14:54:25 +0800
Subject: [PATCH] 1

---
 subPackages/service/gate.vue | 68 +++++++++++++++++++++++++++++-------
 1 file changed, 55 insertions(+), 13 deletions(-)

diff --git a/subPackages/service/gate.vue b/subPackages/service/gate.vue
index 95e6604..11ba8c0 100644
--- a/subPackages/service/gate.vue
+++ b/subPackages/service/gate.vue
@@ -6,12 +6,16 @@
 		</view>
 		
 		<view class="step2" v-else-if="moneyData">
-			<view style="padding-top: 200rpx;">账单号： {{moneyData.bill_id}}</view>
-			<view>停车场名称：{{moneyData.park_name}}</view>
-			<view>车牌号：{{moneyData.vpl_number}}</view>
-			<view>入站时间：{{moneyData.in_time}}</view>
-			<view>出站时间：{{moneyData.out_time}}</view>
-			<view>应付：￥{{moneyData.unpaid_charge}}</view>
+			<view class="container">
+				<view><text>账单号：</text>{{moneyData.bill_id}}</view>
+				<view><text>停车场名称：</text>{{moneyData.park_name}}</view>
+				<view><text>车牌号：</text>{{moneyData.vpl_number}}</view>
+				<view><text>入站时间：</text>{{moneyData.in_time}}</view>
+				<view style="padding-bottom: 66rpx;"><text>出站时间：</text>{{moneyData.out_time}}</view>
+				
+				<view class="bottom"><view>应付：</view><view class="price">{{moneyData.unpaid_charge}}</view></view>
+			</view>
+			
 		</view>
 		<view class="step2" v-else>
 			<view>未获取到账单信息</view>
@@ -39,7 +43,7 @@
 			};
 		},
 		onLoad(options){
-			this.vpl_number = options.carNo
+			this.vpl_number = decodeURIComponent(options.carNo) 
 			this.park_code = options.park_code
 			this.arm_code = options.arm_code
 			this.gate_type = options.gate_type || 'in'
@@ -107,7 +111,11 @@
 	}
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
+	.bg{
+		height: 100vh;
+		background: linear-gradient(180deg, #E0F4E4, #F7F7F7);
+	}
 	.text{
 		padding: 20rpx;
 	}
@@ -134,14 +142,48 @@
 		font-size: 36rpx;
 		font-family: PingFang SC;
 		font-weight: 500;
-		color: #FFFFFF;
+		color: black;
 	}
 	.step2{
-		text-align: center;
-		font-weight: bold;
-		font-size: 40rpx;
 		height: 100vh;
+		padding: 40rpx 26rpx;
+	}
+	.container{
+		width: 100%;
+		background: #F7F7F7;
+		border-radius: 13rpx;
+		border: 1px solid #6AAC7C;
+		font-size: 31rpx;
+		color: #000000;
+		padding: 78rpx 44rpx 0 44rpx;
+		&>view{
+			padding-bottom: 84rpx;
+			text{
+				font-weight: bold;
+				width: 200rpx;
+				display: inline-block;
+			}
+		}
 		
-		line-height: 2;
+		.bottom{
+			height: 149rpx;
+			// line-height: 149rpx;
+			border-top: 1px solid #D8D8D8;
+			padding-bottom: 62rpx;
+			display: flex;
+			font-weight: bold;
+			font-size: 31rpx;
+			color: #000000;
+			align-items: flex-end;
+			.price{
+				font-size: 40rpx;
+				color: #EF2828;
+				font-weight: normal;
+				&::before{
+					content: "￥";
+					font-size: 30rpx;
+				}
+			}
+		}
 	}
 </style>