<template>
	<!-- 订单详情 -->
	<view class="order-detail-home">
		<view class="top">
           <view class="title">订单详情</view>
		</view>
		<view class="card">
			<view class="text">
				<text>订单编号:</text><text class="right">{{orderDetail.no}}</text>
			</view>
			<view class="text">
				<text>订单状态:</text><text class="right">{{orderDetail.pay_status_text}}</text>
			</view>
			<view class="text">
				<text>支付金额:</text><text class="right" style="color: #ff7e4b;">￥{{orderDetail.pay_money}}</text>
			</view>

		</view>
		<view class="detail">
			<view class="text">
				站点名称：<text class="right">{{orderDetail.shop.name}}</text>
			</view>
			<view class="text">
				设备编号：<text class="right">{{orderDetail.device.no}}</text>
			</view>
			<view class="text">
				消费地址：<text class="right">{{orderDetail.shop.address}}</text>
			</view>
			<view class="text">
				使用模式：<text class="right">{{orderDetail.work_type_text}}吸氢{{orderDetail.work_time}}分钟</text>
			</view>
			<!-- <view class="text" v-if="orderDetail.pay_time">
				支付时间：<text class="right">{{orderDetail.pay_time}}</text>
			</view> -->
			<view class="text" v-if="orderDetail.pay_time">
				开始时间：<text class="right">{{orderDetail.start_use_time}}</text>
			</view>
			<view class="text" v-if="orderDetail.pay_time">
				结束时间：<text class="right">{{orderDetail.end_use_time}}</text>
			</view>
			
		</view>
		<view class="submit" v-if="orderDetail.status==1" @click="payImmediately()">
			立即支付
		</view>
	</view>
</template>

<script>
	var app=getApp()
	export default{
		data(){
			return{
				orderDetail:''
			}
		},
		onLoad(options){
			uni.showLoading()
			let data={
				order_no:options.order_no
			}
			app.request('/orders' ,data,'post').then(res=>{
				console.log(res,'订单详情')
				this.orderDetail=res.data.data.data
				uni.hideLoading()
			})
		},
		methods:{
			//立即支付
			payImmediately: function(e) {
				let params = {
					no: this.orderDetail.no
				}
				app.request('/order/pay', params, 'post').then(res => {
					console.log(res)
					// let params=res.data.data
					let order_no = res.data.data.order_no
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.data.timeStamp,
						nonceStr: res.data.data.nonceStr,
						package: res.data.data.package,
						signType: res.data.data.signType,
						paySign: res.data.data.paySign,
						appId: res.data.data.appId,
						success: function(res) {
							console.log('success:' + JSON.stringify(res));
							uni.navigateTo({
								url: '../index/surePay?order_no=' + order_no
								// url: './?order_no=' + order_no
							})
						},
						fail: function(err) {
							console.log('fail:' + JSON.stringify(err));
							console.log(typeof(res.data.data.package))
						}
					});
			
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.order-detail-home {
		.top {
			height: 300upx;
			background-color: $mine-background-color;
			border-radius: 0 0 30% 30%;
			text-align: center;
			.title{
				color: #FFFFFF;
				font-size: 32upx;
				font-weight: bolder;
				padding-top: 50upx;
				}
		}

		.card {
			padding: 30upx;
			background-color: #FFFFFF;
			margin: 0 50upx;
			margin-top: -150upx;
			border-radius: 12upx;

			.text {
				height: 50upx;
				line-height: 50upx;
				font-size: 26upx;

				.right {
					margin-left: 20upx;
				}
			}
		}

		.detail {
			margin: 50upx;
			background-color: #FFFFFF;
			border-radius: 12upx;
			padding: 30upx;
			.text{
				height: 70upx;
				line-height: 70upx;
				font-size: 26upx;
				.right {
					margin-left: 20upx;
				}
			}
		}
		.submit{
			background-color: $mine-background-color;
			width: 150upx;
			color: #FFFFFF;
			margin: 0 auto;
			padding: 20upx;
			font-size: 26upx;
			border-radius: 12upx;
			margin-top: 50upx;
			text-align: center;
			}
	}
</style>
