Blame view

pages/parkPay/parkPay.vue 4.99 KB
4b045f7c   刘淇   江阴初始化项目
1
  <template>
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
2
3
  	<view>
  
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
4
  		<!-- 	<view class="order-time">
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
5
  			剩余支付时间: {{appOrderTimeout}}
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
6
  		</view> -->
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
7
8
9
10
11
12
13
14
15
  
  		<view class="order-title">
  			订单详情
  		</view>
  		<view class="order-info">
  			车牌号:{{mycarNumber | tranNull}}
  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
16
  			停车场:{{parkName | tranNull}}
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
17
18
19
  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
20
  			进场时间:{{parkInTime | tranNull}}
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
21
22
23
  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
24
  			停车时间:{{staytime | timeFormatter}}
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
25
26
27
  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
28
  			总计费用:{{due |toFixed2}}元
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
29
30
31
32
33
34
35
36
37
  		</view>
  		<view class="order-line"></view>
  
  		<view class="flex-row-justify-between">
  			<view class="order-info">
  				支付金额
  			</view>
  			<view class="flex-row-justify-end">
  				<view class="order-info" style="font-weight:bold;font-size:17px ;">
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
38
  					{{orderFee | toFixed2}}
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
  				</view>
  				<view class="order-info" style="margin-right: 50upx;margin-left: 0px;">
  
  				</view>
  			</view>
  		</view>
  
  		<view class="order-line-bold"></view>
  
  		<view class="order-title">
  			支付方法
  		</view>
  		<view class="order-line"></view>
  
  		<view class="orderwaysview">
9d693018   刘淇   卡券购买下单
54
55
  			<!--<image src="../../static/orderInfo/orderinfo-wechat.png" class="orderways"></image>-->
  			<view class="order-info" style="margin-left: 15px;">
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
56
57
58
59
60
61
62
63
64
65
  				商户余额
  			</view>
  			<image src="../../static/orderInfo/orderinfo-sel.png" class="orderwaysSel"></image>
  
  		</view>
  
  		<view class="order-line"></view>
  		<button @click="payClick" class="button-sp-area" type="primary" plain="true">确认支付</button>
  
  	</view>
4b045f7c   刘淇   江阴初始化项目
66
67
68
  </template>
  
  <script>
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
69
70
71
72
  	export default {
  		data() {
  			return {
  				businessId: '',
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
73
74
75
76
77
78
79
80
  				orderId: '',
  				mycarNumber: '',
  				parkName: '',
  				parkInTime: '',
  				staytime: '',
  				due: '',
  				orderFee: '',
  				// appOrderTimeout:'0',
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
81
  				totalFee: '', //应收
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
82
83
84
85
86
87
88
89
90
  			}
  		},
  		onLoad(params) {
  			wx.showShareMenu({
  				withShareTicket: true
  			})
  			this.mycarNumber = params.carNumber;
  			let indexInfo = uni.getStorageSync("indexInfo");
  			this.businessId = indexInfo.businessId;
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
91
  			console.log(this.mycarNumber, this.businessId)
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
92
93
94
95
96
97
98
99
  			this.getbBillQueryInfo();
  		},
  		onShow() {
  
  		},
  		methods: {
  
  			payClick() {
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
  				let that = this;
  				let paramsData = {
  					payType: '35',
  					paySrcType: '101',
  					orderId: that.orderId,
  					payFee: that.orderFee,
  
  				}
  				// 获取 接口
  				that.$myRequest({
  					url: that.$common.accountPay,
  					method: 'POST',
  					data: that.$common.requestSign(paramsData)
  				}).then(res => {
  					console.log('余额支付:' + res)
  					uni.showToast({
  						title: "支付成功",
  						icon: 'success',
  						duration: 2000
  					});
  					setTimeout(function() {
ff4eb366   chenbiao   add 初始化停车缴费页面 支付订...
121
122
123
124
125
126
  						let pages = getCurrentPages(); //当前页
  						let beforePage = pages[pages.length - 2];
  						uni.navigateBack({
  							success: function() {
  								beforePage.onLoad();
  							}
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
127
128
129
130
  						})
  					}, 2000);
  
  				})
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
131
132
133
134
135
136
  			},
  
  			getbBillQueryInfo() {
  				let that = this
  				let paramsData = {
  					carNumber: that.mycarNumber,
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
137
138
  					pageNum: '1',
  					pageSize: '10',
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
139
  					businessId: that.businessId,
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
140
  					parkState: '10',
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
141
  
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
142
143
144
145
146
147
148
  				}
  				// 获取 接口
  				that.$myRequest({
  					url: that.$common.queryParkingRecordByCarNumbers,
  					method: 'POST',
  					data: that.$common.requestSign(paramsData)
  				}).then(res => {
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
149
150
151
152
153
154
155
  					console.log(res.data.dataList[0])
  					let data = res.data.dataList[0]
  
  					that.parkName = data.parkName;
  					that.parkInTime = data.parkInTime;
  					that.staytime = data.parkDuration;
  					that.due = data.totalFee;
9d693018   刘淇   卡券购买下单
156
  					that.orderFee = data.unPayFee;
07fee088   chenbiao   add 停车缴费支付订单页面 接口联调
157
158
  					that.orderId = data.orderId;
  
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
159
160
161
162
163
164
  				})
  
  			},
  		}
  
  	}
4b045f7c   刘淇   江阴初始化项目
165
166
167
  </script>
  
  <style scoped lang="scss">
ed34839c   chenbiao   add 停车缴费 支付页面 接口联调
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
  	.order-time {
  		padding: 5px 0;
  		background: #f0ad4e;
  		text-align: center;
  		color: #fff;
  	}
  
  	.order-title {
  		font-size: 18px;
  		margin-left: 16px;
  		margin-top: 15px;
  		font-weight: bold;
  		color: #404040;
  	}
  
  	.order-info {
  		font-size: 14px;
  		margin-left: 15px;
  		margin-top: 12px;
  		color: #404040;
  	}
  
  	.order-line {
  		background: #D9D9D9;
  		height: 1px;
  		margin-top: 12px;
  		margin-left: 15px;
  		padding: 0px;
  		overflow: hidden;
  		/* 透明度 */
  		opacity: 0.5;
  	}
  
  	.order-line-bold {
  		background: #FAFAFA;
  		height: 12px;
  		margin-top: 12px;
  		padding: 0px;
  		overflow: hidden;
  	}
  
  	.flex-row-justify-between {
  		display: flex;
  		flex-direction: row;
  		justify-content: space-between;
  	}
  
  	.flex-row-justify-end {
  		display: flex;
  		flex-direction: row;
  		/* 水平对齐*/
  		align-items: baseline;
  
  	}
  
  	.order-discount {
  		color: #C8C7CC;
  		margin-right: 20 upx;
  		/* margin-right: 12px ; */
  		/* margin-top:12px ; */
  
  	}
  
  	.orderwaysview {
  		display: flex;
  		flex-direction: row;
  	}
  
  	.orderways {
  		width: 18px;
  		height: 18px;
  		margin-left: 15px;
  		margin-top: 14px;
  	}
  
  	.orderwaysSel {
  		width: 16px;
  		height: 16px;
  		margin-left: auto;
  		margin-right: 14px;
  		margin-top: 14px;
  		/* justify-content:flex-end; */
  	}
  
  	.button-sp-area {
  		margin: 0 auto;
  		width: 60%;
  		margin-top: 40px;
  
  	}
4b045f7c   刘淇   江阴初始化项目
258
  </style>