<template> <div class="reset-password-com"> <dee-form ref="editForm" :form="form" :form-data="editData" form-btn-position="center" :rules="formRules" :inline="true" > <span style="display:flex"> <el-button type="primary" class="searchBtn" @click="handleSubmit" >确定</el-button> <el-button class="searchBtn" @click="handleClose" >取消</el-button> </span> </dee-form> </div> </template> <script> import { resetPassword } from '@/api/userSystem/user.js' export default { name: 'ResetPassword', components: { }, props: { selectionRow: { type: Array, default: () => [] } }, data() { return { passwordType: '', password1Type: '', form: {}, formRules: { password: [ { required: true, message: '请输入', trigger: 'blur' }, { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' } ], password1: [ { required: true, message: '请输入', trigger: 'blur' }, { min: 6, max: 20, message: '长度在 6 到 20 个字符', trigger: 'blur' } ] } } }, computed: { editData: function() { const arr = [ { data: [{ key: 'password', title: '密码', hiden: this.passwordType === 'password', component: { name: 'el-input', type: 'text', autocomplete: 'off' }, handler: { input: () => { this.changePasswordType() } } }, { key: 'password', title: '密码', hiden: this.passwordType !== 'password', component: { name: 'el-input', type: 'password', autocomplete: 'new-password' }, handler: { input: () => { this.changePasswordType() } } }, { key: 'password1', title: '确认密码', hiden: this.password1Type === 'password', component: { name: 'el-input', type: 'text', autocomplete: 'off' }, handler: { input: () => { this.changePassword1Type() } } }, { key: 'password1', title: '确认密码', hiden: this.password1Type !== 'password', component: { name: 'el-input', type: 'password', autocomplete: 'new-password' }, handler: { input: () => { this.changePassword1Type() } } }] } ] arr[0].data = arr[0].data.filter(r => !r.hiden) return arr } }, watch: { selectionRow: { deep: true, immediate: true, handler: function(val) { this.selectionRow = val } } }, methods: { changePasswordType(type) { if (this.form.password) { this.passwordType = 'password' } else { this.passwordType = 'text' } }, changePassword1Type(type) { if (this.form.password1) { this.password1Type = 'password' } else { this.password1Type = 'text' } }, handleSubmit() { this.$refs['editForm'].$refs.form.validate((valid, obj) => { if (this.form.password !== this.form.password1) { this.$utils.showMessageError('请检查密码是否一致') return } if (valid) { const form = { 'ids': this.selectionRow.map(n => n.id), 'password': this.form.password } this.handleSubmitAjax(form) } }) }, handleSubmitAjax(form) { resetPassword(form).then(res => { this.$emit('handleClose') this.$emit('getList') this.$utils.showMessageSuccess(res.message) }) }, handleClose() { this.$emit('handleClose') } } } </script> <style lang="scss" > </style>