SpringBoot2+Vue2实战(十八)修改密码

一、修改密码：

Header.vue

<el-dropdown-item style="font-size: 14px; padding: 5px 0"><router-link to="/password" style="text-decoration: none">修改密码</router-link></el-dropdown-item>

router/index.js

//拼装动态路由const manageRoute = {path: '/',name: 'Manage',component: () => import('../views/Manage.vue'),redirect: "/home",children: [{path: '/person',name: '个人信息',component: () => import('../views/Person.vue'),},{path: '/password',name: '修改密码',component: () => import('../views/Password.vue'),},]}

Password.vue

<template><el-card style="width: 500px"><el-form label-width="120px" size="small" :model="form" :rules="rules" ref="pass"><el-form-item label="原密码" prop="password"><el-input v-model="form.password" autocomplate="off" show-password></el-input></el-form-item><el-form-item label="新密码" prop="newPassword"><el-input v-model="form.newPassword" autocomplate="off" show-password></el-input></el-form-item><el-form-item label="新密码" prop="confirmPassword"><el-input v-model="form.confirmPassword" autocomplate="off" show-password></el-input></el-form-item><el-form-item><el-button type="primary" @click="save">确认</el-button></el-form-item></el-form></el-card>
</template><script>
export default {name: "Password",data(){return{form:{},//username,password,newPassword,confirmNewPassword这四个属性user:localStorage.getItem("user")?JSON.parse(localStorage.getItem("user")):{},rules:{password:[{required:true,message:'请输入原密码',trigger:'blur'},{min:3,message: '长度不少于3位',trigger: 'blur'}],newPassword:[{required:true,message:'请输入新密码',trigger:'blur'},{min:3,message: '长度不少于3位',trigger: 'blur'}],confirmPassword:[{required:true,message:'请输入密码',trigger:'blur'},{min:3,message: '长度不少于3位',trigger: 'blur'}],}}},created() {this.form.username = this.user.username},methods:{save(){this.$refs.pass.validate((valid) =>{//如果合法if (valid){if (this.form.newPassword !== this.form.confirmPassword){this.$message.error("2次新输入密码不相同")return false}this.request.post("/user/password",this.form).then(res =>{if (res.code ==='200'){this.$message.success("修改成功")this.$store.commit("logout")}else {this.$message.error(res.msg)}})}})},}
}
</script><style></style>

UserController

@PostMapping("/password")//   /user/passwordpublic Result password(@RequestBody UserPasswordDto userPasswordDto){userService.updatePassword(userPasswordDto);return Result.success();}

UserService

void updatePassword(UserPasswordDto userPasswordDto);

UserServiceImpl

@Overridepublic void updatePassword(UserPasswordDto userPasswordDto) {int update = userMapper.updatePassword(userPasswordDto);if (update < 1) {throw new ServiceException(Constants.CODE_600, "密码错误");}}

UserMapper

@Update("update sys_user set password = #{newPassword} where username = #{username} and password = #{password}")int updatePassword(UserPasswordDto userPasswordDto);