<template>
	<view class="withdraw-box">
		<view class="top-box">
			<view class="title">可用金额</view>
			<view class="money">{{userInfo.spread.brokeragePrice || 0}}</view>
		</view>
		<view class="draw-box">
			<view class="title">提现金额(元)</view>
			<view class="inp-box acea-row row-between-wrapper">
				<input placeholder="0" type="number" v-model="money" placeholder-style="color:#1d1d1d">
				<view class="btn" @click="inpAll">全部提现</view>
			</view>
		</view>
		<view class="add-btn" @click="submit">确认提现</view>
	</view>
</template>

<script>
	const app = getApp()
	import { cash } from  '@/api/user'
	export default{
		data(){
			return {
				userInfo: {},
				money: null
			}
		},
		mounted(){
			this.getInfo()
		},
		methods:{
			getInfo() {
			  app.http('get', 'userinfo').then(res => {
			    if (res.data.success) {
			      this.setData({
			        userInfo: res.data.data
			      });
						uni.setStorageSync('userInfo',res.data.data)
			    }
			  });
			},
			inpAll(){
				this.money = this.userInfo.spread.brokeragePrice
			},
			submit(){
				if(this.data.money == ''){
					return uni.showToast({
						title:'请输入提现金额！',
						icon: 'none'
					})
				}
				cash({
					money: parseInt(this.data.money) 
				}).then((res)=>{
					uni.showToast({
						title: '申请提现成功',
					})
					setTimeout(()=>{
						this.getInfo()
					},1500)
				})
			},
		}
	}
</script>

<style lang="less">
	.withdraw-box{
		width: 100%;
		min-height: 100vh;
		background: #EEEEEE;
	}
	.top-box{
		width: 100%;
		height: 450rpx;
		background: linear-gradient(180deg, #FE6620 0%, #F89C75 100%);
		text-align: center;
		color: #fff;
		.title{
			font-size: 32rpx;
			padding-top: 60rpx;
		}
		.money{
			font-size: 90rpx;
			font-weight: 500;
			line-height: 126rpx;
		}
	}
	.draw-box{
		width: 670rpx;
		height: 216rpx;
		background-color: #fff;
		border-radius: 12rpx;
		margin: -168rpx auto 0;
		padding: 32rpx;
		color: #1d1d1d;
		.inp-box{
			height: 90rpx;
			margin-top: 14rpx;
			input{
				width: 360rpx;
				height: 100%;
				font-size: 60rpx;
				font-weight: bold;
			}
			.btn{
				width: 176rpx;
				height: 62rpx;
				background: linear-gradient(270deg, #FF7238 0%, #FFA782 100%);
				border-radius: 32rpx;
				text-align: center;
				line-height: 62rpx;
				background: linear-gradient(270deg, #FF7238 0%, #FFA782 100%);;
				color: #fff;
				border-radius: 32rpx;
				font-weight: 500;
			}
		}
	}
	.add-btn{
		width: 670rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		color: #fff;
		background: #000;
		border-radius: 40rpx;
		margin: 120rpx auto;
	}
</style>
