提交 46c56f39 编写于 作者: lakernote's avatar lakernote

(新增)[整体](修改密码、修改个人资料)

上级 f5754952
......@@ -20,9 +20,11 @@ import com.laker.admin.framework.cache.ICache;
import com.laker.admin.framework.ext.mybatis.UserInfoAndPowers;
import com.laker.admin.framework.ext.satoken.MySaTokenListener;
import com.laker.admin.framework.ext.satoken.OnlineUser;
import com.laker.admin.module.sys.entity.SysDept;
import com.laker.admin.module.sys.entity.SysRole;
import com.laker.admin.module.sys.entity.SysUser;
import com.laker.admin.module.sys.entity.SysUserRole;
import com.laker.admin.module.sys.service.ISysDeptService;
import com.laker.admin.module.sys.service.ISysRoleService;
import com.laker.admin.module.sys.service.ISysUserRoleService;
import com.laker.admin.module.sys.service.ISysUserService;
......@@ -52,6 +54,8 @@ public class LoginController {
ISysUserRoleService sysUserRoleService;
@Autowired
ISysRoleService sysRoleService;
@Autowired
ISysDeptService sysDeptService;
@PostMapping("/api/v1/login")
@ApiOperationSupport(order = 1)
......@@ -103,7 +107,12 @@ public class LoginController {
@ApiOperationSupport(order = 2)
@ApiOperation(value = "获取当前用户信息")
public Response userInfo() {
return Response.ok(sysUserService.getById(StpUtil.getLoginIdAsLong()));
SysUser user = sysUserService.getById(StpUtil.getLoginIdAsLong());
SysDept dept = sysDeptService.getById(user.getDeptId());
if (dept != null) {
user.setDeptName(dept.getDeptName());
}
return Response.ok(user);
}
@GetMapping("/api/v1/onlineUsers")
......
......@@ -14,6 +14,7 @@ import com.laker.admin.framework.aop.Metrics;
import com.laker.admin.module.sys.entity.SysRole;
import com.laker.admin.module.sys.entity.SysUser;
import com.laker.admin.module.sys.entity.SysUserRole;
import com.laker.admin.module.sys.pojo.PwdQo;
import com.laker.admin.module.sys.service.ISysRoleService;
import com.laker.admin.module.sys.service.ISysUserRoleService;
import com.laker.admin.module.sys.service.ISysUserService;
......@@ -102,6 +103,29 @@ public class SysUserController {
return sysUserRoleService.saveBatch(sysUserRoles);
}
@PutMapping("/updatePwd")
@ApiOperation(value = "更新用户密码")
@SaCheckPermission("user.update.pwd")
public Response updatePwd(@RequestBody PwdQo param) {
if (!StrUtil.equals(param.getNewPassword(), param.getConfirmPassword())) {
return Response.error("500", "两次输入密码不一致");
}
long userId = StpUtil.getLoginIdAsLong();
SysUser sysUser = sysUserService.getOne(Wrappers.<SysUser>lambdaQuery()
.eq(SysUser::getUserId, userId)
.eq(SysUser::getPassword, SecureUtil.sha256(param.getOldPassword())));
if (sysUser == null) {
return Response.error("500", "用户名密码错误");
}
SysUser user = new SysUser();
user.setUserId(userId);
user.setPassword(SecureUtil.sha256(param.getNewPassword()));
sysUserService.updateById(user);
return Response.ok();
}
@GetMapping("/{id}")
@ApiOperation(value = "根据id查询")
public Response get(@PathVariable Long id) {
......
......@@ -38,7 +38,8 @@ public class SysUser implements Serializable {
private Long deptId;
@TableField(exist = false)
private SysDept dept;
@TableField(exist = false)
private String deptName;
private Integer sex;
private String phone;
......
package com.laker.admin.module.sys.pojo;
import lombok.Data;
@Data
public class PwdQo {
private String oldPassword;
private String newPassword;
private String confirmPassword;
}
\ No newline at end of file
.pear-container {
background-color: whitesmoke;
margin: 10px;
}
.layui-body {
padding: 25px;
}
.text-center {
text-align: center;
}
.user-info-head {
width: 110px;
height: 110px;
line-height: 110px;
position: relative;
display: inline-block;
border-radius: 50%;
overflow: hidden;
cursor: pointer;
margin: 0 auto;
}
.layui-line-dash {
border-bottom: 1px dashed #ccc;
margin: 15px 0;
}
.comment {
position: absolute;
bottom: 3px;
right: 10px;
font-size: 12px;
color: dimgray;
}
.content {
padding-left: 13px;
font-size: 13px;
color: dimgray;
}
.title {
padding-left: 13.5px;
}
.layui-tab-title {
border-bottom: none;
}
.fl-item {
height: 30px;
font-size: 13.5;
}
.dot {
width: 10px;
height: 10px;
border-radius: 50px;
background-color: gray;
display: inline-block;
margin-right: 10px;
}
.list .list-item {
height: 32px;
line-height: 32px;
color: gray;
padding: 5px;
padding-left: 15px;
border-radius: 4px;
margin-top: 5.2px;
}
.list .list-item:hover {
background-color: whitesmoke;
}
.list .list-item .title {
font-size: 13px;
width: 100%;
}
.list .list-item .footer {
position: absolute;
right: 30px;
font-size: 12px;
}
......@@ -37,7 +37,9 @@
</a>
<!-- 功 能 菜 单 -->
<dl class="layui-nav-child">
<dd><a user-menu-url="view/system/person.html" user-menu-id="5555" user-menu-title="基本资料">基本资料</a>
<dd><a user-menu-url="view/system/user/center.html" user-menu-id="5555" user-menu-title="基本资料">基本资料</a>
</dd>
<dd><a user-menu-url="view/system/user/password.html" user-menu-id="6666" user-menu-title="修改密码">修改密码</a>
</dd>
<dd><a href="javascript:void(0);" class="logout">注销登录</a></dd>
</dl>
......
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="../../../component/pear/css/pear.css"/>
<link rel="stylesheet" href="../../../admin/css/other/center.css"/>
<style>
.layui-form-item {
margin-top: 17px !important;
margin-bottom: 17px !important;
}
</style>
</head>
<body class="pear-container">
<div class="layui-row layui-col-space10">
<div class="layui-col-md3">
<div class="layui-card">
<div class="layui-card-body" style="padding: 25px;">
<div class="text-center layui-text">
<div class="user-info-head" id="userInfoHead">
<img id="avatar" src="" width="115px" height="115px" alt="">
</div>
<h2 style="padding-top: 20px;font-size: 20px;">头像</h2>
</div>
</div>
</div>
</div>
<div class="layui-col-md9">
<div class="layui-card">
<div class="layui-card-header">个人信息</div>
<div class="layui-card-body">
<div class="layui-tab layui-tab-brief">
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<form class="layui-form" lay-filter="edit">
<div class="layui-form-item layui-hide">
<label class="layui-form-label">编号</label>
<div class="layui-input-block">
<input type="text" name="userId"
lay-verify="title"
autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">账号</label>
<div class="layui-input-block">
<input type="text" readonly name="userName"
lay-verify="title"
autocomplete="off" placeholder="请输入标题"
class="layui-input layui-disabled" disabled>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">昵称</label>
<div class="layui-input-block">
<input type="text" name="nickName"
lay-verify="title"
autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">邮箱</label>
<div class="layui-input-block">
<input type="text" name="email" lay-verify="title|email"
autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">电话</label>
<div class="layui-input-block">
<input type="text" name="phone" lay-verify="title"
autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">性别</label>
<div class="layui-input-block">
<input type="radio" name="sex" value="1" title="男">
<input type="radio" name="sex" value="2" title="女">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">部门</label>
<div class="layui-input-block">
<input type="text" name="deptName" lay-verify="title"
autocomplete="off" placeholder="请输入标题"
class="layui-input layui-disabled" disabled>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="pear-btn pear-btn-primary pear-btn-sm" lay-submit
lay-filter="user-update">修改资料
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../../../component/layui/layui.js"></script>
<script src="../../../component/pear/pear.js"></script>
<script>
layui.use(['element', 'jquery', 'layer', 'form', 'easyAdmin'], function () {
let $ = layui.jquery;
let layer = layui.layer;
let form = layui.form;
let easyAdmin = layui.easyAdmin;
// 获取用户信息,用户名、昵称、头像等
easyAdmin.http({
url: "/api/v1/userInfo",
dataType: 'json',
success: function (result) {
$("#avatar").attr("src", "../../../admin/images/avatar.jpg");
form.val("edit", result.data);
},
error: function () {
// 用于验证前端信息 对应到不对的会话情况
// 清空本地存储
console.log("当前浏览器存储中没有用户信息,清空本地存储,讲跳转到login.html")
layui.data('user', null);
location.href = "login.html";
}
});
$("#avatar").click(function () {
layer.open({
type: 2,
title: '更换图片',
shade: 0.1,
area: ["900px", "500px"],
content: "profile.html",
btn: ['确定', '取消'],
yes: function (index, layero) {
window['layui-layer-iframe' + index].submitForm();
}
});
});
form.on('submit(user-update)', function (data) {
easyAdmin.http({
url: '/sys/user',
data: JSON.stringify(data.field),
dataType: 'json',
contentType: 'application/json',
type: 'post',
success: function (result) {
if (result.success) {
layer.msg("修改成功", {icon: 1, time: 2000, area: ['100px', '65px']});
} else {
layer.msg(result.msg, {icon: 2, time: 2000, area: ['260px', '65px']});
}
}
})
return false;
});
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../../component/pear/css/pear.css"/>
</head>
<body>
<form class="layui-form" action="">
<div class="mainBox">
<div class="main-container">
<div class="main-container">
<div class="layui-form-item">
<label class="layui-form-label">旧密码</label>
<div class="layui-input-block">
<input type="password" name="oldPassword" lay-verify="title|required" autocomplete="off"
placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">新密码</label>
<div class="layui-input-block">
<input type="password" name="newPassword" lay-verify="title|required" autocomplete="off"
placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">确认密码</label>
<div class="layui-input-block">
<input type="password" name="confirmPassword" lay-verify="title|required" autocomplete="off"
placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit=""
lay-filter="edit-password">
<i class="layui-icon layui-icon-ok"></i>
提交
</button>
<button type="reset" class="pear-btn pear-btn-sm">
<i class="layui-icon layui-icon-refresh"></i>
重置
</button>
</div>
</div>
</div>
</div>
</div>
</form>
<script src="../../../component/layui/layui.js"></script>
<script src="../../../component/pear/pear.js"></script>
<script>
layui.use(['form', 'jquery', 'popup', 'easyAdmin'], function () {
let form = layui.form;
let $ = layui.jquery;
let popup = layui.popup;
let easyAdmin = layui.easyAdmin;
form.on('submit(edit-password)', function (data) {
easyAdmin.http({
url: '/sys/user/updatePwd',
data: JSON.stringify(data.field),
contentType: 'application/json',
dataType: 'json',
type: 'put',
success: function (result) {
if (result.success) {
layer.msg("修改密码成功", {icon: 1, time: 2000, area: ['100px', '65px']});
} else {
layer.msg(result.msg, {icon: 2, time: 2000, area: ['260px', '65px']});
}
}
})
return false;
});
})
</script>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../../component/pear/css/pear.css"/>
</head>
<body class="pear-container">
<div class="layui-row layui-col-space15">
<div class="layui-col-xs9">
<div style="height:325px;background-color: rgb(247, 247, 247);">
<img id="sourceImage" src="">
</div>
</div>
<div class="layui-col-xs3" style="padding-left:0px;">
<div id="previewImage" style="width:210px;height:210px;border: 1px solid rgb(200, 200, 200);border-radius: 50%;overflow:hidden;">
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-form-item">
<div class="layui-input-inline layui-btn-container" style="width: auto;vertical-align:top;">
<button class="pear-btn pear-btn-sm pear-btn-primary layui-icon layui-icon-left" cropper-event="rotate" data-option="-15" title="左旋15°"></button>
<button class="pear-btn pear-btn-sm pear-btn-primary layui-icon layui-icon-right" cropper-event="rotate" data-option="15" title="右旋15°"></button>
<button class="pear-btn pear-btn-sm pear-btn-danger layui-icon layui-icon-refresh" cropper-event="reset" title="重置"></button>
<label for="uploadPicture" class="pear-btn pear-btn-sm pear-btn-primary layui-icon layui-icon-upload" title="选择图片"></label>
<input class="layui-upload-file" id="uploadPicture" type="file" value="选择图片">
</div>
<div class="layui-form-mid layui-word-aux">建议:图片的尺寸宽高比为1:1,大小在5m以内。</div>
</div>
</div>
</body>
<script src="../../../component/layui/layui.js"></script>
<script src="../../../component/pear/pear.js"></script>
<script>
layui.use(['jquery','layer','cropper','popup'], function () {
let $ = layui.jquery;
let popup = layui.popup;
let options = {
aspectRatio: 1 / 1, // 裁剪框比例
preview: '#previewImage', // 预览div
viewmode: 1
};
$("#sourceImage").attr("src", parent.layui.$("#avatar").attr("src"));
$("#sourceImage").cropper(options);
window.submitForm = function () {
$("#sourceImage").crossOrigin = 'anonymous';//解决跨域图片问题
$("#sourceImage").cropper("getCroppedCanvas", {
width: 280,
height: 140
}).toBlob(function (blob) {
let timeStamp = Date.parse(new Date());
let fileName = timeStamp + '.jpg';
let formData = new FormData();
formData.append('file', blob, fileName);
formData.append('fileName', fileName);
formData.append('fileToken', timeStamp);
$.ajax({
method: "post",
url: "/system/file/upload", //用于文件上传的服务器端请求地址
data: formData,
processData: false,
contentType: false,
success: function (result) {
if(result.success){
// 修改 avatar 字段
$.ajax({
method:"put",
url: "/system/user/updateAvatar",
data: JSON.stringify({avatar:result.data}),
dataType: "json",
contentType: 'application/json',
success:function(resu){
if(resu.success){
// 关闭当前弹层
parent.$("#avatar").attr("src", "/system/file/download/"+result.data);
top.$("#avatar").attr("src", "/system/file/download/"+result.data);
parent.layer.close(parent.layer.getFrameIndex(window.name));
}else{
popup.failure("上传失败")
}
}
})
}else{
popup.failure("上传失败")
}
}
});
});
}
$(".pear-btn").on('click', function () {
let event = $(this).attr("cropper-event");
if (event === 'rotate') {
let option = $(this).attr('data-option');
$("#sourceImage").cropper('rotate', option);
} else if (event === 'reset') {
$("#sourceImage").cropper('reset');
}
$("#uploadPicture").change(function () {
let r = new FileReader();
let f = this.files[0];
let uploadFileSize = f.size / 1024;
if (uploadFileSize > 5120) {
parent.layer.msg("上传文件不得超过5m", { icon: 5 });
return false;
}
r.readAsDataURL(f);
r.onload = function (e) {
$("#sourceImage")
.cropper('destroy')
.attr('src', this.result)
.cropper(options);
};
});
});
});
</script>
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册