<template>
	<up-navbar
	  title="支付详情"
	  bgColor="#00aa7f"
	  :autoBack="false"
	  leftIconColor="#00aa7f"
	  titleStyle="color:#fff"
	  :placeholder="true"
	/>
	<view style="padding: 100rpx 20rpx; background: #fff;">
		<view style="display: flex;align-items: center;justify-content: center;">
			<up-icon name="checkmark-circle" color="#00aa00" size="38" />
			<view style="padding-left: 10rpx;font-size: 54rpx;color: #00aa00;">支付成功</view>
		</view>
		<view class="dingdan">
			<view>
				<view>订单号</view>
				<view style="font-size: 28rpx;">{{order.orderNo}}</view>
			</view>
			<view>
				<view>订单金额</view>
				<view>¥{{order.amount}}</view>
			</view>
			<view>
				<view>车牌号</view>
				<view>{{order.plateNum}}</view>
			</view>
			<view>
				<view>换电站</view>
				<view>{{order.stationName}}</view>
			</view>
		</view>
		<view class="btns">
			<view class="qxyy" @tap="gohome">返回首页</view>
			<view class="qxyy" @tap="goorder">我的订单</view>
		</view>
	</view>
	
</template>

<script setup lang="ts">
	import { ref,reactive } from 'vue'
	import { payment,getip,orderlist } from '@/utils/service'
	import { onLoad,onShow } from '@dcloudio/uni-app'
	let order = ref<any>({})
	onLoad((opt:any) => {
		orderlist({
			userId:uni.getStorageSync('wxuid'),
			pageSize:30,
			pageNo:1,
			orderNo:opt.orderNo
		}).then((rps:any) => {
			if(rps.data.total > 0){
				order.value = rps.data.records[0]
			}
		})
	})
	
	
	
	function gohome(){
		uni.switchTab({
			url:'/pages/home/index'
		})
	}
	
	function goorder(){
		uni.redirectTo({
			url:'/minePages/order/index'
		})
	}
	
</script>

<style lang="scss">
	page{
		background: #f4f4f4;
	}
	.dingdan{
		padding:60rpx 20rpx 100rpx;
		>view{
			display: flex;
			justify-content:space-between;
			padding-bottom: 24rpx;
			>view{
				padding-right: 14rpx;
			}
			>view:last-child{
				color: #616161;
			}
		}
	}
	.btns{
		display: flex;
		box-sizing: border-box;
		width: 100%;
		padding: 0 30rpx;
		justify-content:space-between
	}
	.qxyy{
		width: 40%;
		height: 80rpx;
		//margin: 100rpx auto 0;
		line-height: 80rpx;
		border-radius:16rpx;
		color: #fff;
		text-align: center;
		background: #00aa00;
	}
</style>