<template>
	<view class="container">
		<view class="top">
			<text class="iconfont icon-youjiantou zuojiantou" @click="goBack()"></text>
			<text>兑换详情</text>
		</view>
		<view class="recordContent">
			<image :src="deductionUrl" mode="widthFix"></image>
			<view class="detail">
				<h4>{{productTypeName}}</h4>
				<view class="">
					{{deductionDate}}
				</view>
			</view>
		</view>
		<view class="withdrawalDetail">
			<view class="item">
				<text>兑换积分：</text>
				<text>{{integralExchange}}积分</text>
			</view>
			<view class="item">
				<text>提现金额(税前)：</text>
				<text>￥{{exchangeAmount}}</text>
			</view>
			<view class="item">
				<text>代缴税：</text>
				<text>￥{{taxAmount}}</text>
			</view>
			<view class="item">
				<text>实际到账：</text>
				<text>￥{{noTaxAmount}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import api from '../../api/api';
	export default{
		data(){
			return {
				partnerTradeNo:null,
				deductionName:null,
				integralExchange:null,
				deductionDate:null,
				deductionUrl:null,
				partnerTradeNo:null,
				taxAmount:null,
				exchangeBeforeAmount:null,
				exchangeAmount:null,
				exchangeAfterAmount:null,
				noTaxAmount:null

			}
		},
		components:{},
		onLoad(options){
			this.partnerTradeNo = options.partnerTradeNo;
			this.findByUserIdForWithdralDtl();
		},
		methods:{
			goBack(){
				uni.navigateBack({  
					delta: 1  
				})
			},
			findByUserIdForWithdralDtl(){
				const params = {
					partnerTradeNo:this.partnerTradeNo,
					userId:uni.getStorageSync('cffp_userId')
					// userId:1
				}
				api.findByUserIdForWithdralDtl(params).then((res)=>{
					if(res['success']){
						const data = res['data']['cffpFortuneExchangeVO'];
						this.productTypeName = data['productTypeName'];
						this.integralExchange = data['integralExchange'];
						this.deductionDate = data['deductionDate'];
						this.deductionUrl = data['deductionUrl'];
						this.partnerTradeNo = data['partnerTradeNo'];
						this.taxAmount = data['taxAmount'];
						this.exchangeBeforeAmount = data['exchangeBeforeAmount'];
						this.exchangeAmount = data['exchangeAmount'];
						this.exchangeAfterAmount = data['exchangeAfterAmount'];
						this.noTaxAmount = data['noTaxAmount'];
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.container{
		height:100%;
		.top{
			display: flex;
			height: 80rpx;
			justify-content: space-between;
			align-items: center;
			position: relative;
			width: 100%;
			margin: 0 auto;
			background: #fff;
			text:nth-child(2){
				width: 100%;
				text-align: center;
				position: absolute;
			}
		}
	}
	.recordContent{
		display: flex;
		margin-bottom: 20rpx;
		background: #fff;
		justify-content: space-between;
		padding: 30rpx;
		align-items: center;
		uni-image {
		    width: 30%!important;
			border-radius: 10rpx;
		}
		.detail{
			width: 65%;
			h4{
				margin-bottom: 20rpx;
			}
			view{
				color: #666;
			}
		}
	}
	.withdrawalDetail{
		background: #fff;
		padding: 20rpx;
		.item{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20rpx;
			border-bottom: 2rpx #F2F2F2 solid;
			text:nth-child(2){
				color: #0A2F99;
			}
		}
	}
</style>