当前位置: 首页 > news >正文

Nuxt3 全栈作品【通用信息管理系统】修改密码

最终效果

在这里插入图片描述

在这里插入图片描述

前端代码

layouts/default.vue

<el-dropdown-item @click="openEditPassword">修改密码
</el-dropdown-item>
const openEditPassword = () => {editPassword_dialogVisible.value = true;
};
const editPassword_dialogVisible = ref(false);
    <!-- 修改密码的弹窗 --><el-dialogtitle="修改密码"v-model="editPassword_dialogVisible"width="40%"><S-form:Model="editPassword_Model":colNum="1":local_save="editPassword_local_save":cancel="() => {editPassword_dialogVisible = false;}"></S-form></el-dialog>
const editPassword_Model = {newPassword: {label: "新密码",type: "password",require: true,},newPassword_confirm: {label: "密码确认",type: "password",formRules: [{ required: true, message: "请再次输入新密码", trigger: "blur" },],},
};const editPassword_local_save = async (formData: any) => {let error_msg = "";if (formData.newPassword !== formData.newPassword_confirm) {error_msg = "两次密码输入不一致";}if (error_msg) {callbackMessage.value = {show: true,valid: false,content: error_msg,};return;}try {await useFetch(`/api/user/${currentUser._id}`, {method: "PATCH",query: {handleType: "editPassword",newPassword: formData.newPassword,},});callbackMessage.value = {show: true,valid: true,content: "操作成功",};editPassword_dialogVisible.value = false;} catch (e: any) {callbackMessage.value = {show: true,valid: false,content: e.data.message,};}
};

依赖组件 S-form.vue

https://blog.csdn.net/weixin_41192489/article/details/149717692

接口开发

`/api/user/${currentUser._id}`

server/api/user/[id].patch.ts

// 用户的禁用、启用、重置密码
import { UserDataProps } from "~/server/models/user";
import bcrypt from "bcrypt";
export default defineEventHandler(async (event) => {const id = getRouterParam(event, "id");const query = getQuery(event);const { handleType, newPassword } = query;let newData: Partial<UserDataProps> = {};const config = useRuntimeConfig();switch (handleType) {case "disable":newData.disabled = true;break;case "enable":newData.disabled = false;break;case "resetPassword":newData = {password: await bcrypt.hash(config.bcrypt.defaultPassword,config.bcrypt.saltRounds),};break;case "editPassword":if (newPassword) {newData = {password: await bcrypt.hash(String(newPassword),config.bcrypt.saltRounds),};}break;default:break;}const newUser = UserSchema.findByIdAndUpdate(id, newData, { new: true });return newUser;
});

server/models/user.ts

见 https://blog.csdn.net/weixin_41192489/article/details/149709713

validators/user.ts

见 https://blog.csdn.net/weixin_41192489/article/details/149709713

http://www.lryc.cn/news/602144.html

相关文章:

  • React中的合成事件解释和理解
  • 架构实战——互联网架构模板(“开发层”和“服务层”技术)
  • DevOps时代的知识治理革命:Wiki如何成为研发效能的新引擎
  • 并发安全之锁机制一
  • 小架构step系列28:自定义校验注解
  • “太赫兹”
  • KubeSphere理论及实战
  • Error reading config file (/home/ansible.cfg): ‘ACTION_WARNINGS(default) = True
  • 什么是3DVR?VR技术有哪些应用场景?
  • 关于sql面试积累
  • 红绿灯纵向距离的评估
  • 【查漏补缺】机器学习典型算法
  • 【Java Web实战】从零到一打造企业级网上购书网站系统 | 完整开发实录(终)
  • 应用加速游戏盾的安全作用
  • Java BigDecimal详解:小数精确计算、使用方法与常见问题解决方案
  • 【数据库】使用Sql Server将分组后指定字段的行数据转为一个字段显示,并且以逗号隔开每个值,收藏不迷路
  • GaussDB 开发基本规范
  • 22 BTLO 蓝队靶场 Countdown 解题记录
  • 如何利用机器学习分析筛选生物标记物
  • 微信小程序——早餐小程序
  • TMS320F28335PGFA TI德州仪器:32位浮点内核+CLA协处理器DSP,工业控制性能极限!
  • 【Linux指南】Linux粘滞位详解:解决共享目录文件删除安全隐患
  • CJ02、CJ20N下达项目报错用户状态 初始 是活动的,怎么解决?
  • 模型压缩的一些整理
  • 异步通讯组件MQ
  • 【Linux系统】Ext2文件系统 | 软硬链接
  • 医疗人工智能高质量数据集和语料库建设路径探析
  • HOT100——链表篇Leetcode206. 反转链表
  • qt 心跳包
  • Java面试宝典:Spring Boot