jp-charge/pagesFinance/user/withdrawal/applicationForWithdrawal.vue

<template>
	<view>
		<!-- <view v-if="step==1">
			
			<ujp-navbar title="签名" :custom-back="customback" >
					
			</ujp-navbar>
			<signReceipt :obj="0" @signsubmit="submit" ></signReceipt>
		</view> -->
		<view > 
		<ujp-navbar title="申请提现"></ujp-navbar>
		
		<businessView1  v-if="info.applicationType==1"  :onReadyId="id" @changetabs_app="changetabs" ></businessView1>
		<businessView2  v-if="info.applicationType==2" :onReadyId="id" @changetabs_app="changetabs" ></businessView2>
		<businessView3  v-if="info.applicationType==3" :onReadyId="id" @changetabs_app="changetabs" ></businessView3>
		
		<view class="withdraw" v-if="tabindex==0" >
			<view class="withdraw-head " v-if="!info.invoiceRequired">
				<b>是否开票</b>
				<span>
					<view class="uni-input">{{info.invoiceRequired?'是':'否'}}</view>
				</span>
			</view>
			<view class="withdraw-head " v-if="info.invoiceRequired">
				<b>发票类型</b>
				<span>
					<view class="uni-input" v-if="!info.invoiceType">无</view>
			
					<view class="uni-input" v-else>{{invoiceTypeName}}</view>
				</span>
			</view>
			<view class="withdraw-head border-n " v-if="info.invoiceRequired&&info.invoiceType==1" >
				<b>发票税率</b>
				<span>
					<view class="uni-input">{{info.taxRate?info.taxRate+'%':''}}</view>
				</span>
			</view>
		
		</view>
		
		<view v-if="tabindex==0&&(info.status!=5||!userInfo.status)" >
			
			
			
			<view class="withdraw" v-if="info.applicationType!=3">
				<view class="withdraw-head ">
					<b class="asterisk">收款户名</b>
					<p class="uni-input">{{info.accountName}}</p>
			
				</view>
				<view class="withdraw-head ">
					<b class="asterisk">收款银行</b>
					<p class="uni-input">{{info.bankName}}</p>
			
				</view>
				<view class="withdraw-head border-n">
					<b class="asterisk">收款账号</b>
					<p class="uni-input">{{info.accountNo}}</p>
				</view>
			
			</view>
			
		</view>
		<view v-if="tabindex==0&&info.status==5&&userInfo.status" >
			
			<view class="withdraw"  v-if="info.applicationType!=3" >
				<view class="withdraw-head ">
					<b class="asterisk"><text>*</text>收款户名</b>
					<u-input class="textarea" type="textarea" 
					v-model="info.accountName"
					placeholder="请填写收款户名" height="96" cursor-spacing="8" />
			
				</view>
				<view class="withdraw-head ">
					<b class="asterisk"><text>*</text>收款银行</b>
					<u-input class="textarea" type="textarea"
					v-model="info.bankName"
					 placeholder="请填写收款银行全称" height="96" cursor-spacing="8" />
			
				</view>
				<view class="withdraw-head border-n">
					<b class="asterisk"><text>*</text>收款账号</b>
					<u-input class="textarea" v-model="info.accountNo"
					type="textarea" placeholder="请填写收款账号" height="96" cursor-spacing="8" />
			
				</view>
			
			</view>
			<u-button   v-if="info.applicationType==3"
			 @click="submit()"
			 type="primary" >申请提现</u-button>
			<u-button   v-if="info.applicationType!=3"
			 @click="submit2()"
			 type="primary" >申请提现</u-button>
		</view>
		</view>
	</view>
</template>

<script>
	import businessView1 from './businessView-1.vue'
	import businessView2 from './businessView-2.vue'
	import businessView3 from './businessView-3.vue'
	
	//import signReceipt from './signReceipt.vue'
	
	import * as API from '@/apis/finance.js'
	import {
	
		DX
	} from '@/utils'
	export default {
		components: {
			businessView1,businessView2,businessView3
		
		
		},
		data() {
			return {
				step:0,
				id:'',
				tabindex:0,
				info:{},
				list1: [
					{
						name: '收据',
						value: "3"
					},{
					name: '普票',
					value: "1"
				},
				// {
				// 	name: '专票',
				// 	value: "2"
				// },
				],
				list2: [{
					name: '是',
					value: "1"
				}, {
					name: '否',
					value: "0"
				}],
				detailList:[],
				userInfo:{},
				
			}
		},

		onLoad(op){
			this.userInfo=this.carhelp.getPersonInfo()
			
			if(op.id){
				this.id=op.id
				this.getInfo()
				this.uuid=op.uuid;
			}
		},computed: {
			invoiceTypeName() {
			
				var info = this.list1.find(item => {
					console.log(item.value == this.info.invoiceType)
					return item.value == this.info.invoiceType
				})
			
				if (info) {
					return info.name
				}
				return ''
			},
		},
		watch:{
			
			
			
		},
		methods: {
			customback(){
				this.step=0
				
			},
			submit2(){
				
					
										
					if(!this.info.accountName){
							uni.showToast({
								title: "请输入收款户名"
							})
						return
					}
					if(!this.info.bankName){
							uni.showToast({
								title: "请输入收款银行"
							})
						return
					}
					if(!this.info.accountNo){
							uni.showToast({
								title: "请输入收款账号"
							})
						return
					}
				
				
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				
				this.info.status=5;
				
				//var str=JSON.stringify();
				API.applyWithdrawByAccounting({
					
					record:this.info,
					detailList:this.detailList
				
				}).then((res) => {
					
					this.carhelp.set("withdrawRecord",{
						uuid:this.uuid,
					})
					this.id=res.data;
					uni.hideLoading()
					uni.redirectTo({
						url:"/pagesFinance/user/withdrawal/signature?id="+this.info.id+"&uuid="+this.uuid
					})
						
					
				}).catch(error => {
					uni.hideLoading()
					uni.showModal({
						title:"提示",
						content:error,
						showCancel:false
					})
				})
			},
			submit(){
				
				
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				
				this.info.status=0;
				
				//var str=JSON.stringify();
				API.applyWithdrawByAccounting({
					
					record:this.info,
					detailList:this.detailList
				
				}).then((res) => {
					
					this.carhelp.set("withdrawRecord",{
						uuid:this.uuid,
					})
					this.id=res.data;
					uni.hideLoading()
					uni.redirectTo({
						url:"/pagesFinance/user/applyResult?value="+this.info.applicationAmount
					})
					
				}).catch(error => {
					uni.hideLoading()
					uni.showModal({
						title:"提示",
						content:error,
						showCancel:false
					})
				})
			},
			changetabs(index){
				this.tabindex=index
			},
			
			getInfo(){
				uni.showLoading({
					title: "加载中",
					mask: true,
				})
				API.getWithdrawInfoByAccounting(this.id).then((res) => {
					
					this.info=res.data.record
					if(this.info.applicationType!=3){
						if(this.info.invoiceRequired==null){
							this.info.invoiceRequired="1"
							this.info.invoiceType="3"
						}
					}
					this.detailList=res.data.detailList
					uni.hideLoading()
				
				}).catch(error => {
					uni.showToast({
						title: error
					})
				})
			},
			change(index) {
				this.current = index;
			}



		}
	}
</script>
<style>
	page {
		background-color: #F7F7F7;
		padding-bottom: 65px;
	}
</style>
<style lang="scss" scoped>
	.jputabs {
		//position: absolute;
		position: fixed;
		background-color: #FFF;
		width: 100%;
		top: 45px;
		z-index: 99;
	}
	
	.classFFF {
		color: #607d8b  !important;
	}
	
	.download {
		color: #185AC6 !important;
	}
	.download5 {
		width: 160rpx !important;
		float: right;
		
		color: #185AC6 !important;
	}
	
	/deep/.u-tab-bar {
		background-color: #0076FF !important;
	
	}
	
	/deep/.u-tabs-scorll-flex {
		width: 56%;
		margin: 0 auto;
	}
	
	.withdraw-tips {
		margin: 24px 16px;
	
		p {
			color: #999;
			margin-top: 4px;
		}
	}
	
	.uni-input {
		font-size: 16px;
		color: #333333;
	
	
	}
	
	.withdraw {
		margin-bottom: 8px;
		background-color: #fff;
		padding: 0px 16px 0 16px;
		
		.withdraw-head {
			padding: 24rpx 0;
			border-bottom: 1px solid #E5E7EA;
	
			align-items: center;
			position: relative;
	
			.unit {
				position: absolute;
				top: 34rpx;
				right: 0;
	
			}
	
			
	
			b {
				font-weight: normal;
				color: rgba(119, 119, 119, 100);
				font-size: 36rpx;
			}
	
			span {
				width: 60%;
				float: right;
				text-align: left;
				font-size: 32rpx;
				color: #333333;
			}
	
			@media screen and (max-width:320px) {
				span {
					width: 60%;
				}
			}
	
		}
	
		.withdraw-main {
			border-top: 1px solid #f7f7f7;
			border-bottom: 1px solid #f7f7f7;
	
			margin: 16px 0;
			padding: 16px 0;
	
			.withdraw-input {
				width: 63%;
				margin-top: 64rpx;
				display: flex;
				align-items: center;
				font-size: 56rpx;
	
				/deep/.uni-input-input {
					font-size: 28rpx;
				}
			}
		}
	
		.withdraw-foot {
			display: flex;
			align-items: center;
	
			p {
				color: #999
			}
	
			span {
				color: #2979FF;
				margin-left: 16px;
	
			}
		}
	}
	
	.more {
	
		color: #B3B3B3;
		font-size: 24px
	}
	
	.applyBtn {
		padding: 0 16px;
	
		display: flex;
		background-color: #FFF;
		font-size: 16px;
		line-height: 44px;
		height: 60px;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	
		.save {
			width: 33.6%;
			border-radius: 8px 0px 0px 8px;
			background-color: rgba(0, 185, 98, 100);
			color: rgba(255, 255, 255, 100);
		}
	
		.submit {
			width: 66.4%;
			border-radius: 0px 8px 8px 0px;
			background-color: rgba(24, 90, 198, 100);
			color: rgba(255, 255, 255, 100);
		}
	}
	
	
	/deep/.uni-input-input {
		text-align: start !important;
	}
	
	.border-n {
		//border: none !important;
	}
	
	.textarea {
		background-color: rgba(242, 242, 242, 100);
		margin-top: 12px;
		line-height: 20px;
		border-radius: 4px;
		color: rgba(136, 136, 136, 100);
	
		.uni-textarea-placeholder {
			padding: 0 16rpx;
	
		}
	
		/deep/.uni-textarea-textarea {
			width: 90%;
			padding: 0 16rpx;
	
		}
	}
	.withdrawHead{
		padding: 15px;
		font-size: 14px;
		.red{
			color: red;
		}
	}
	.details {
		margin: 16px;
		border-radius: 8px;
		background-color: #fff;
		overflow: hidden;
	}
	
	.asterisk {
		position: relative;
	
		text {
			position: absolute;
			top: 0px;
			left: -14rpx;
			color: #EE3138;
		}
	}
	
	.add {
		text-align: center;
		font-size: 18px;
		color: #101010;
		display: flex;
		align-items: center;
		justify-content: center;
	
		.ri-add-circle-fill {
			font-size: 24px;
			color: #44B371;
			margin: auto 0;
			margin-right: 4rpx;
		}
	
	}
	
	/deep/.u-input__input {
		font-size: 16px !important
	}
	.uni-time{
		font-size: 32rpx;
	}
	.uni-input {
		display: flex;
		justify-content: space-between;
	}
	
	.input-text {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	 
	.u-btn{
		margin: 0 16px;
		position: fixed;
		bottom: 12px;
		left: 0;
		right: 0;
		height: 44px;
		line-height: 44px;
		border-radius: 8px;
		background-color: rgba(24, 90, 198, 100);
		color: rgba(255, 255, 255, 100);
	}
</style>