| ¶Ô±ÈÐÂÎļþ | 
|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <GlobalWindow | 
|---|
|  |  |  | :visible.sync="visible" | 
|---|
|  |  |  | :confirm-working="isWorking" | 
|---|
|  |  |  | width="576px" | 
|---|
|  |  |  | title="éç½®å¯ç " | 
|---|
|  |  |  | @confirm="confirm" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <p class="tip" v-if="user != null">ä¸ºç¨æ· <em>{{user.realname}}</em> éç½®å¯ç </p> | 
|---|
|  |  |  | <el-form :model="form" ref="form" :rules="rules"> | 
|---|
|  |  |  | <el-form-item label="æ°å¯ç " prop="password" required> | 
|---|
|  |  |  | <el-input v-model="form.password" type="password" placeholder="请è¾å
¥æ°å¯ç " maxlength="30" show-password></el-input> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | </el-form> | 
|---|
|  |  |  | </GlobalWindow> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
|---|
|  |  |  | import { resetPwd } from '@/api/system/user' | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'ResetPwdWindow', | 
|---|
|  |  |  | components: { GlobalWindow }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | isWorking: false, | 
|---|
|  |  |  | visible: false, | 
|---|
|  |  |  | user: null, | 
|---|
|  |  |  | form: { | 
|---|
|  |  |  | password: '' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | rules: { | 
|---|
|  |  |  | password: [ | 
|---|
|  |  |  | { required: true, message: '请è¾å
¥å¯ç ', trigger: 'blur' }, | 
|---|
|  |  |  | { validator: this.validatePassword, trigger: 'blur' } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | validatePassword (rule, value, callback) { | 
|---|
|  |  |  | if (!value) { | 
|---|
|  |  |  | callback(new Error('请è¾å
¥å¯ç ')) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | const lengthValid = /^.{6,20}$/.test(value) | 
|---|
|  |  |  | const hasLetter = /[a-zA-Z]/.test(value) | 
|---|
|  |  |  | const hasNumber = /[0-9]/.test(value) | 
|---|
|  |  |  | const hasSpecial = /[!@#$%^&*(),.?":{}|<>]/.test(value) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const typesCount = [hasLetter, hasNumber, hasSpecial].filter(Boolean).length | 
|---|
|  |  |  |  | 
|---|
|  |  |  | if (!lengthValid) { | 
|---|
|  |  |  | callback(new Error('å¯ç é¿åº¦é为6å°20个å符')) | 
|---|
|  |  |  | } else if (typesCount < 2) { | 
|---|
|  |  |  | callback(new Error('å¯ç éå
å«åæ¯ãæ°ååç¹æ®å符ä¸çè³å°ä¸¤ç§')) | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | callback() // éªè¯éè¿ | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * æå¼çªå£ | 
|---|
|  |  |  | * | 
|---|
|  |  |  | * @param user ç®æ ç¨æ· | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | open (user) { | 
|---|
|  |  |  | this.user = user | 
|---|
|  |  |  | this.visible = true | 
|---|
|  |  |  | this.$nextTick(() => { | 
|---|
|  |  |  | this.$refs.form.resetFields() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * ç¡®è®¤éç½®å¯ç  | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | confirm () { | 
|---|
|  |  |  | if (this.isWorking) { | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.$refs.form.validate((valid) => { | 
|---|
|  |  |  | if (!valid) { | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.isWorking = true | 
|---|
|  |  |  | resetPwd({ | 
|---|
|  |  |  | id: this.user.id, | 
|---|
|  |  |  | password: this.form.password | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .then(() => { | 
|---|
|  |  |  | this.$tip.apiSuccess('å¯ç éç½®æå') | 
|---|
|  |  |  | this.visible = false | 
|---|
|  |  |  | this.$emit('success') | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .catch(e => { | 
|---|
|  |  |  | this.$tip.apiFailed(e) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | .finally(() => { | 
|---|
|  |  |  | this.isWorking = false | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style scoped lang="scss"> | 
|---|
|  |  |  | @import "@/assets/style/variables.scss"; | 
|---|
|  |  |  | // è§è²é
ç½® | 
|---|
|  |  |  | .global-window { | 
|---|
|  |  |  | .tip { | 
|---|
|  |  |  | margin-bottom: 12px; | 
|---|
|  |  |  | em { | 
|---|
|  |  |  | font-style: normal; | 
|---|
|  |  |  | color: $primary-color; | 
|---|
|  |  |  | font-weight: bold; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|