<template>
	<div class="form">
		<el-form ref="form" :model="form" label-width="100px">
			<el-form-item label="承兑人名称" prop="name">
				<el-input v-model="form.name" style="width: 500px;" placeholder="请输入承兑人名称"></el-input>
			</el-form-item>
			<el-form-item label="账号" prop="bankAccount">
				<el-input v-model="form.bankAccount" style="width: 500px;" placeholder="请输入账号"></el-input>
			</el-form-item>
			<el-form-item label="开户行名称" prop="bankName">
				<el-input v-model="form.bankName" style="width: 500px;" placeholder="请输入开户行名称"></el-input>
			</el-form-item>
			<el-form-item label="服务费率" prop="serviceRate">
				<el-input v-model="form.serviceRate" placeholder="请输入服务费率" style="width: 500px;">
					<i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
				</el-input>
			</el-form-item>
			<el-form-item label="利率" prop="interest">
				<el-input v-model="form.interest" placeholder="请输入利率" style="width: 500px;">
					<i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
				</el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="onsubmit">立即提交</el-button>
				<el-button type="primary" @click="resetForm('form')">重置</el-button>
			</el-form-item>
		</el-form>
	</div>
</template>

<script>
	import axios from 'axios'
	export default {
		data() {
			return {
				form: {
					name: '',
					bankAccount: '',
					bankName: '',
					serviceRate: '',
					interest: ''
				}
			}
		},
		mounted() {

		},
		methods: {
			onsubmit() {
				this.$request({
					url: '/api/Acceptor',
					method: 'post',
					data: this.form
				}).then((res) => {
					this.$message("提交成功")
					// this.$router.push({
					// 	path: '/table'
					// })
					this.$router.go (-1)
				})
			},
			resetForm(form) {
				this.$refs[form].resetFields();
			}
		},
	}
</script>

<style lang="scss">
	.form {
		margin-top: 100px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.el-form-item:last-child {
		display: flex;
		justify-content: space-between;
	}
</style>
