shop-uniapp-240426/pages/user/bankCardWithdrawal/bankCardWithdrawal.vue

<template>
	<view>
		<u-navbar
		:title="$t('page.bankCardWithdrawal.title')"
		:safeAreaInsetTop="false"
		placeholder
		@leftClick="leftClick"
		>
		</u-navbar>
		
		<u--form
		labelPosition="left"
		:model="model1"
		:rules="rules"
		class="line"
		ref="uForm"
		>
			<u-form-item
			:label="$t('page.bankCardWithdrawal.bank_id')"
			prop="bank_id"
			borderBottom
			labelWidth="80px"
			>
				<u--input
				v-model="model1.bank_no"
				@focus="showSelectBankCart = true"
				border="none"
				:placeholder="$t('page.bankCardWithdrawal.bank_id-placeholder')"
				></u--input>
			</u-form-item>
			
			<u-form-item
			:label="$t('page.bankCardWithdrawal.withdrawalAmount')"
			prop="withdrawalAmount"
			borderBottom
			labelWidth="80px"
			>
				<u--input
				v-model="model1.withdrawalAmount"
				border="none"
				:placeholder="$t('page.bankCardWithdrawal.withdrawalAmount-placeholder')"
				></u--input>
			</u-form-item>
			
			<u-form-item
			:label="$t('page.productDetail.payOrder.pay-password')"
			prop="payPassword"
			borderBottom
			labelWidth="80px"
			>
				<u--input
				v-model="model1.payPassword"
				type="password"
				:placeholder="$t('page.productDetail.payOrder.pay-input-placeholder')"
				></u--input>
			</u-form-item>
		</u--form>
		
		<u-alert type = "warning" description = "Please check the card number information with customer service to ensure that it is accurate"></u-alert>
		
		<u-button class="submit"
		size="large" @click="submit"
		:text="$t('page.bankCardWithdrawal.submit')"></u-button>
		
		<!-- 注意事项 -->
		<view class="matters-needing-attention">
			<!-- <view class="matters-needing-attention-title">
				注意事项
			</view>
			<view class="matters-needing-attention-content">
				<view>1.服务属于舒缓保健，不是治疗，如需治疗请到医院就诊。</view>
				<view>2.平台只提供专业、正规的服务，对于不正当的行为和要求，理疗师有权拒绝并保留诉讼法律的权利</view>
				<view>3.因客户原因提前终止服务的，服务费不予退还。</view>
				<view>4.客户因看见理疗师不够漂亮等与专业无关系列因素要求退单者，该客户所付项回费退一半，交通费不予退还。</view>
				<view>5.如客户选择理疗师下单后，理疗师与客户联系确定核实情况后，理疗师按了确认出发，客户如要取消订单的，扣该订单的项目三分之一费用和理疗师的交通费用。</view>
				<view>6.理疗师到达服务地址后，若联系不上客户，理疗师会等待20分钟; 如20分钟后仍无法联系上，点按开始服务后理疗师则会自行离开，该订单将扣除订单三分之一费用和金部交通费用，剩余费用请联系客服退款，感谢你的理解和支持。</view>
			</view> -->
		</view>
		
		<bankCartSelect 
		:show="showSelectBankCart"
		@close="showSelectBankCart = false"
		@select="select"
		:list="bankList"/>
	</view>
</template>

<script>
	import bankCartSelect from '@/components/bankCart/bankCartSelect.vue';
	export default {
		components : {
			bankCartSelect
		},
		data() {
			return {
				showSelectBankCart : false,
				model1: {
					withdrawalAmount: '',
					payPassword: '',
					bank_id : '',
					bank_no : ''
				},
				bankList : [],
				rules: {
					'withdrawalAmount': {
						type: 'string',
						required: true,
						message: this.$t('page.bankCardWithdrawal.withdrawalAmount-placeholder'),
						trigger: ['blur', 'change']
					},
					'payPassword': {
						type: 'string',
						required: true,
						message: this.$t('page.productDetail.payOrder.pay-input-placeholder'),
						trigger: ['blur', 'change']
					},
					// 'bank_id': {
					// 	type: 'string',
					// 	required: true,
					// 	message: this.$t('page.bankCardWithdrawal.bank_id-placeholder'),
					// 	trigger: ['blur', 'change']
					// },
				},
			};
		},
		onShow() {
			this.getData()
		},
		methods: {
			getData(){
				this.request('bankCardPage',{}, {
					uid : '1'
				}).then(res=>{
					if(res.code == 200){
						this.bankList = res.result.records
					}
				})
				
				this.request('tiShi').then(res => {
					if(res.code && res.result){
						
					}
				})
			},
			select(item){
				console.log(item);
				this.model1.bank_id = item.id
				this.model1.bank_no = item.no
			},
			leftClick(){
				uni.switchTab({
					url: '/pages/user/user'
				})
			},
			submit(){
				this.$refs.uForm.validate().then(res => {
					
					if(!this.model1.bank_id){
						return uni.$u.toast(this.$t('page.bankCardWithdrawal.bank_id-placeholder'));
					}
					
					this.request('water', {
						"type": "1",
						"money": this.model1.withdrawalAmount,
						bankId : this.model1.bank_id,
						payPass : this.model1.payPassword
					}).then(res => {
						if(res.code === 200){
							uni.$u.toast(this.$t('success-operation'))
							setTimeout(()=>{
								uni.navigateTo({
									url: '/pages/balance/balance'
								})
							},500)
						}
					})
					
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.line{
	background-color: #fff;
	padding: 5px 10px;
	margin-top: 10px;
}
.submit{
	border-radius: 30px;
	background-color: #ED762F;
	color: #fff;
	margin: 10px;
	width: calc(100% - 20px);
}
</style>