From 9736af164d1aae76b3388944d675cb21b61c755b Mon Sep 17 00:00:00 2001 From: Oliver <1070107765@qq.com> Date: 星期一, 12 十二月 2022 14:01:04 +0800 Subject: [PATCH] fix bug --- src/views/layout/components/Header/updatePassword/index.vue | 260 ++++++++++++++++++++++++++++----------------------- 1 files changed, 143 insertions(+), 117 deletions(-) diff --git a/src/views/layout/components/Header/updatePassword/index.vue b/src/views/layout/components/Header/updatePassword/index.vue index 6a7d481..5e5c04c 100644 --- a/src/views/layout/components/Header/updatePassword/index.vue +++ b/src/views/layout/components/Header/updatePassword/index.vue @@ -1,139 +1,165 @@ <template> - <div class="createUser"> - <main> - <div class="mainContent"> - <el-form ref="password" label-width="140px" :rules="passwordRules" autoComplete="on" :model="password" - label-position="right"> - <el-form-item class="optionItem" label="褰撳墠瀵嗙爜:" prop="oldPassword"> - <el-input type="password" v-model="password.oldPassword" placeholder="璇峰~鍐欏綋鍓嶅瘑鐮�"></el-input> - </el-form-item> - <el-form-item class="optionItems" label="鏂板瘑鐮�:" prop="newPassword"> - <el-input type="password" v-model="password.newPassword" placeholder="璇峰~鍐欐柊瀵嗙爜"></el-input> - </el-form-item> - <el-form-item class="optionItems" label="纭畾鏂板瘑鐮�:" prop="confirmPassword"> - <el-input type="password" v-model="password.confirmPassword" placeholder="璇峰啀娆″~鍐欐柊瀵嗙爜"></el-input> - </el-form-item> - <el-form-item class="optionItems"> - <el-button type="primary" @click="onSubmit">鎻愪氦</el-button> - </el-form-item> - </el-form> - </div> - </main> - </div> + <div class="createUser"> + <main> + <div class="mainContent"> + <el-form ref="password" label-width="140px" :rules="passwordRules" autoComplete="on" :model="password" + label-position="right"> + <el-form-item class="optionItem" label="褰撳墠瀵嗙爜:" prop="oldPassword"> + <el-input type="password" v-model="password.oldPassword" placeholder="璇峰~鍐欏綋鍓嶅瘑鐮�"></el-input> + </el-form-item> + <el-form-item class="optionItems" label="鏂板瘑鐮�:" prop="newPassword"> + <el-input type="password" v-model="password.newPassword" placeholder="璇峰~鍐欐柊瀵嗙爜"></el-input> + </el-form-item> + <el-form-item class="optionItems" label="纭畾鏂板瘑鐮�:" prop="confirmPassword"> + <el-input type="password" v-model="password.confirmPassword" placeholder="璇峰啀娆″~鍐欐柊瀵嗙爜"></el-input> + </el-form-item> + <el-form-item class="optionItems"> + <el-button type="primary" @click="onSubmit">鎻愪氦</el-button> + </el-form-item> + </el-form> + </div> + </main> + </div> </template> <script> import users from "@/api/users"; export default { - data() { - return { - updatePasswordParam:{ - newPassword:"", - oldPassword:"", - username:"" - }, - password: { - oldPassword: null, - newPassword: null, - confirmPassword: null - }, - passwordRules: { - newPassword: [{ required: true, trigger: 'blur', message: '瀵嗙爜涓嶈兘涓虹┖' }], - oldPassword: [{ required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�' }], - confirmPassword: [{ required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�' }], - }, - } - }, - created() { - }, - methods: { - onSubmit() { - this.$refs.password.validate(valid => { - if (valid) { - this.updatePasswordParam.oldPassword=this.password.oldPassword; - this.updatePasswordParam.username=sessionStorage.getItem('name'); - this.updatePasswordParam.newPassword=this.password.newPassword; - users.updatePassword(this.updatePasswordParam) - .then(() => { - this.$message.success('淇敼瀵嗙爜鎴愬姛, 鍗冲皢閲嶆柊鐧诲綍'); - this.logout(); - location.reload(); - }) - .catch(err => this.$message.error(err)) + data() { + const validatePass = (rule, value, callback) => { + if (!value) { + callback(new Error("鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖")); + } else { + if (value.length < 6 || value.length > 16) { + callback(new Error("鐢ㄦ埛瀵嗙爜闀垮害涓嶅悎娉�")); + } else { + const rep = /^\w+$/; + if (!rep.test(value)) { + callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆")); + } else { + callback(); } - }) - }, - logout() { - users.logout() - .then(() => { - sessionStorage.clear(); - }) - .catch(err => this.$message.error(err)) + } } - }, + }; + return { + updatePasswordParam: { + newPassword: "", + oldPassword: "", + username: "" + }, + password: { + oldPassword: null, + newPassword: null, + confirmPassword: null + }, + passwordRules: { + newPassword: [ + {required: true, trigger: 'blur', message: '瀵嗙爜涓嶈兘涓虹┖'}, + {validator: validatePass, trigger: 'blur'} + ], + oldPassword: [ + {required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�'}, + {validator: validatePass, trigger: 'blur'} + ], + confirmPassword: [ + {required: true, trigger: 'blur', message: '鏂板瘑鐮佷笉鑳戒负绌�'}, + {validator: validatePass, trigger: 'blur'} + ], + } + } + }, + created() { + }, + methods: { + onSubmit() { + this.$refs.password.validate(valid => { + if (valid) { + this.updatePasswordParam.oldPassword = this.password.oldPassword; + this.updatePasswordParam.username = sessionStorage.getItem('name'); + this.updatePasswordParam.newPassword = this.password.newPassword; + users.updatePassword(this.updatePasswordParam) + .then(() => { + this.$message.success('淇敼瀵嗙爜鎴愬姛, 鍗冲皢閲嶆柊鐧诲綍'); + this.logout(); + location.reload(); + }) + .catch(err => this.$message.error(err)) + } + }) + } + , + logout() { + users.logout() + .then(() => { + sessionStorage.clear(); + }) + .catch(err => this.$message.error(err)) + } + }, } </script> <style lang="scss" scoped> .createUser { - border-radius: 1px; + border-radius: 1px; + background-color: #09152f; + + main { + text-align: left; + padding: 0 55px; background-color: #09152f; + padding-bottom: 50px; - main { - text-align: left; - padding: 0 55px; - background-color: #09152f; - padding-bottom: 50px; + .mainContent { + display: flex; + justify-content: center; + padding-top: 50px; - .mainContent { - display: flex; - justify-content: center; - padding-top: 50px; + .el-form-item__content { + width: 400px; - .el-form-item__content { - width: 400px; - - .el-select { - width: 100%; - } - } - - .optionHandleSp { - display: flex; - - .areaNumber, - .moreNumber { - flex: 1; - } - - .telNumber { - flex: 2; - } - } - - .optionBtn { - display: flex; - margin-top: 20px; - - .btn { - padding: 12px 50px; - } - } - + .el-select { + width: 100%; } - } + } - &::v-deep .el-textarea__inner { - background-color: #09152f; - border: 1px solid #17324c; - } + .optionHandleSp { + display: flex; - ::v-deep .el-form-item__label { - color: #4b9bb7; - } + .areaNumber, + .moreNumber { + flex: 1; + } - ::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; + .telNumber { + flex: 2; + } + } + + .optionBtn { + display: flex; + margin-top: 20px; + + .btn { + padding: 12px 50px; + } + } + } + } + + &::v-deep .el-textarea__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + + ::v-deep .el-form-item__label { + color: #4b9bb7; + } + + ::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0