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

<template>
	<view>
		<u-navbar
			:title="$t('page.walletRecharge.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.walletRecharge.Recharge-amount')"
			prop="rechargeAmount"
			borderBottom
			labelWidth="80px"
			>
				<u--input
				v-model="model1.rechargeAmount"
				border="none"
				:placeholder="$t('page.walletRecharge.rechargeAmount-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-button class="submit"
		size="large" @click="submit"
		:text="$t('page.walletRecharge.submit')"></u-button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				model1: {
					rechargeAmount: '',
					payPassword: '',
				},
				rules: {
					'rechargeAmount': {
						type: 'string',
						required: true,
						message: this.$t('page.walletRecharge.rechargeAmount-placeholder'),
						trigger: ['blur', 'change']
					},
					'payPassword': {
						type: 'string',
						required: true,
						message: this.$t('page.productDetail.payOrder.pay-input-placeholder'),
						trigger: ['blur', 'change']
					},
				},
			}
		},
		methods: {
			leftClick(){
				uni.navigateTo({
					url: '/pages/balance/balance'
				})
			},
			submit(){
				this.$refs.uForm.validate().then(res => {
					this.request('water', {
						"type": "0",
						"money": this.model1.rechargeAmount,
						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 scoped lang="scss">
	.line{
		background-color: #fff;
		padding: 5px 10px;
		margin-top: 10px;
		.celi{
			border-radius: 10px;
			margin: 10px 0;
		}
	}
	.submit{
		border-radius: 30px;
		background-color: #ED762F;
		color: #fff;
		margin: 10px;
		width: calc(100% - 20px);
	}
</style>