pxx-pc/src/views/home/setPas.vue

<template>
	<div class="order-wrapper">
		<!-- <breadcrumb :item-name="['订单管理', '订单列表']"></breadcrumb> -->
		<el-card >
			<div class="wrap">
				<el-form :model="form" style="width: 500px;">
					<el-form-item label="新交易密码" :label-width="formLabelWidth">
						<el-input v-model="form.newpassword" type="password"  maxlength="30" minlength="6" placeholder="请输入新交易密码(6~30位任意字符)" width="300px"></el-input>
					</el-form-item>
					<el-form-item label="旧交易密码" :label-width="formLabelWidth">
						<el-input v-model="form.oldpassword" type="password" maxlength="30" minlength="6" placeholder="请输入旧交易密码(如无则不需要填写)"></el-input>
					</el-form-item>
				</el-form>
				<div class="dialog-footer">
				    <el-button @click="dialogTableVisible = false">取 消</el-button>
				    <el-button type="primary" @click="goBuy">确 定</el-button>
				  </div>
			</div>
			
			
		</el-card>
	</div>
</template>

<script>
	import { setTransaction } from '@/request/agent.js'
	export default {
		name: 'Order',
		data() {
			return {
				formLabelWidth: '120px',
				form: {
					newpassword: '',
					oldpassword: ''
				},
				dialogTableVisible: false,
				queryInfo: {
					keyword: '',
					page: 1,
					limit: 10
				},
				list: [],
				total: 0,
				loading: false,
			}
		},
		created() {

		},
		methods: {
			openBuy() {
				this.dialogTableVisible = true
			},
			goBuy() {
				let that = this
				if(!that.form.newpassword) {
					return that.$msg.error('请输入新交易密码')
				}
				// if(!that.transaction) {
				// 	return that.$msg.error('请输入交易密码')
				// }
				setTransaction(that.form).then(res => {
					console.log(res);
					return that.$msg.success('交易密码设置成功')
				})
			},
			getList() {
				let that = this
				if (that.loading) {
					return
				}
				that.loading = true

			},
			handleSizeChange(newPageSize) {
				this.queryInfo.limit = newPageSize
				this.getList()
			},
			handleCurrentChange(newPageNum) {
				this.queryInfo.page = newPageNum
				this.getList()
			},
		},

	}
</script>

<style scoped>
	.dialog-footer {
		display: flex;
		justify-content: flex-end;
		width: 500px;
	}
	/deep/ .el-card__body {
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>