BJ_web_developers / jy_parkingOS

  <template>

  	<view>
  

  		<!-- 	<view class="order-time">

  			剩余支付时间: {{appOrderTimeout}}

  		</view> -->

  
  		<view class="order-title">
  			订单详情
  		</view>
  		<view class="order-info">
  			车牌号：{{mycarNumber | tranNull}}
  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">

  			停车场：{{parkName | tranNull}}

  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">

  			进场时间：{{parkInTime | tranNull}}

  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">

  			停车时间：{{staytime | timeFormatter}}

  		</view>
  		<view class="order-line"></view>
  		<view class="order-info">

  			总计费用：{{due |toFixed2}}元

  		</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 ;">

  					{{orderFee | toFixed2}}

  				</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">
  			<image src="../../static/orderInfo/orderinfo-wechat.png" class="orderways"></image>
  			<view class="order-info" style="margin-left: 8px;">
  				商户余额
  			</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>

  </template>
  
  <script>

  	export default {
  		data() {
  			return {
  				businessId: '',

  				orderId: '',
  				mycarNumber: '',
  				parkName: '',
  				parkInTime: '',
  				staytime: '',
  				due: '',
  				orderFee: '',
  				// appOrderTimeout:'0',

  				totalFee: '', //应收

  			}
  		},
  		onLoad(params) {
  			wx.showShareMenu({
  				withShareTicket: true
  			})
  			this.mycarNumber = params.carNumber;
  			let indexInfo = uni.getStorageSync("indexInfo");
  			this.businessId = indexInfo.businessId;

  			console.log(this.mycarNumber, this.businessId)

  			this.getbBillQueryInfo();
  		},
  		onShow() {
  
  		},
  		methods: {
  
  			payClick() {

  				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() {
  						uni.navigateTo({
  							url: '../inputCarNumber/inputCarNumber'
  						})
  					}, 2000);
  
  				})

  			},
  
  			getbBillQueryInfo() {
  				let that = this
  				let paramsData = {
  					carNumber: that.mycarNumber,

  					pageNum: '1',
  					pageSize: '10',

  					businessId: that.businessId,

  					parkState: '10',

  				}
  				// 获取 接口
  				that.$myRequest({
  					url: that.$common.queryParkingRecordByCarNumbers,
  					method: 'POST',
  					data: that.$common.requestSign(paramsData)
  				}).then(res => {

  					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;
  					that.orderFee = data.payFee;
  					that.orderId = data.orderId;
  

  				})
  
  			},
  		}
  
  	}

  </script>
  
  <style scoped lang="scss">

  	.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;
  
  	}

  </style>