目标
实现管理员的所有功能
- 用户信息查询
- 用户信息修改
- 用户账号删除
- 用户账号添加
- 个人信息修改
用户信息查询
- 前端创建表单获取查询信息并提交后端
<form class="myform" action="${pageContext.request.contextPath }/admin/inquireUsers.action" method="post">
<tr>
<td class="mytd" colspan="2">要查询的账号:
<input style="color:#5F6D7E;" name="inquiryAcc" id="inquiryAcc" value="${inquiryAcc}" type="text">
</td>
<td class="mytd" colspan="2">要查询的身份:
<select style="color:#5F6D7E;" class="myinquiry" id="inquiryId" name="inquiryId">
<option value="">全部</option>
<c:forEach items="${Ids}" var="item">
<option value="${item.id}" <c:if test="${item.id==inquiryId}">selected</c:if>>
${item.userId}
</option>
</c:forEach>
</select>
</td>
<td class="mytd" colspan="1">
<button style="color:#5F6D7E;" type="submit">查询</button>
</td>
</tr>
</form>
- 后端控制层代码
/**
* 条件查询用户
* @param page
* @param rows
* @param inquiryAcc
* @param inquiryId
* @param model
* @return
*/
@RequestMapping(value = "/admin/inquireUsers.action")
public String inquireUsers(@RequestParam(defaultValue = "1")Integer page,@RequestParam(defaultValue = "10")Integer rows,
String inquiryAcc,String inquiryId,Model model) {
//条件查询所有用户
Page<User> users = userService.findUsers(page,rows,inquiryAcc,inquiryId);
model.addAttribute("page",users);
//客户身份
List<Dict> Ids = dictService.findAll();
model.addAttribute("Ids",Ids);
model.addAttribute("inquiryAcc",inquiryAcc);
model.addAttribute("inquiryId",inquiryId);
return "index_a";
}
- 控制层所需要的Service层代码
/**
* 将Id编号变成身份信息
* @param userId
* @return
*/
public String idToChinese(String userId) {
String meaing = "";
if(userId.contains("1")) {
meaing+="管理员 ";
}
if(userId.contains("2")) {
meaing+="专业负责人 ";
}
if(userId.contains("3")) {
meaing+="班主任 ";
}
if(userId.contains("4")) {
meaing+="教师 ";
}
if(userId.contains("5")) {
meaing+="辅导员 ";
}
if(userId.contains("6")) {
meaing+="秘书 ";
}
if(userId.contains("7")) {
meaing+="学生";
}
return meaing;
}
/**
* 条件查询所有用户
*/
@Override
public Page<User> findUsers(Integer page, Integer rows, String inquiryAcc, String inquiryId) {
//创建用户对象
User user = new User();
//判断用户账号
if(StringUtils.isNotBlank(inquiryAcc)) {
user.setUserAcc(inquiryAcc);
}
//判断用户身份
if(StringUtils.isNotBlank(inquiryId)) {
user.setUserId(inquiryId);
}
//设置当前页
user.setStart((page-1)*rows);
//每页数
user.setRows(rows);
//查询用户列表
List<User> users = userDao.findUsers(user);
//将Id编号变成身份信息
for(User u : users) {
u.setUserId(idToChinese(u.getUserId()));
}
//查询用户列表总记录数
Integer count = userDao.findUsersCount(user);
//创建Page返回对象
Page<User> result = new Page<User>();
result.setPage(page);
result.setRows(users);
result.setSize(rows);
result.setTotal(count);
return result;
}
/**
* 获取现有所有身份
*/
@Override
public List<Dict> findAll() {
// TODO Auto-generated method stub
return dictDao.findAll();
}
- Service层所需的Dao层代码及相应的xml代码
/**
* 条件查询所有用户
* @param user
* @return
*/
List<User> findUsers(User user);
<!-- 条件查询所有用户 -->
<select id="findUsers" parameterType="user" resultType="user">
select * from tb_user u
<where>
<if test="userAcc!=null">
userAcc = #{userAcc}
</if>
<if test="userId!=null">
And find_in_set(#{userId},u.userId)>0
</if>
</where>
<!-- 执行分页查询 -->
<if test="start!=null and rows!=null">
LIMIT #{start},#{rows}
</if>
</select>
/**
* 查询所有用户数量
* @param user
* @return
*/
Integer findUsersCount(User user);
<!-- 查询用户总数量 -->
<select id="findUsersCount" parameterType="user" resultType="Integer">
select count(*) from tb_user u
<where>
<if test="userAcc!=null">
userAcc = #{userAcc}
</if>
<if test="userId!=null">
And find_in_set(#{userId},u.userId)>0
</if>
</where>
</select>
/**
* 获取现在所有可用身份
* @return
*/
List<Dict> findAll();
<!-- 获取所有可用身份 -->
<select id="findAll" resultType="dict">
select * from tb_dict
</select>
- 功能演示
用户查询
用户信息修改
- 前端编写用户信息弹窗代码
<button onclick="editUser(${row.userAcc})">修改</button>
<!-- 修改用户窗口 -->
<div class="mydialog" align="center" name="editUserWin" id="editUserWin">
<form id="edit_user_form">
<div id="editUserIds">
<label>用户身份:</label>
<input type="hidden" id="edit_userId" name="edit_userId">
<c:forEach items="${Ids}" var="item">
<c:set var="id" value="${item.id}" ></c:set>
<input type="checkbox" id="editUserIds" name="editUserIds" value="${item.id}" <c:if test="${fn:indexOf(edit_userId, id) != -1}">checked="checked"</c:if>>
${item.userId}
</c:forEach>
</div><br/>
<div>
<label>用户账号:</label>
<input type="text" id="edit_userAcc" name="edit_userAcc" disabled="disabled">
</div><br/>
<div>
<label>用户密码:</label>
<input type="text" id="edit_userPwd" name="edit_userPwd">
</div><br/>
<div>
<button type="button" onclick="updateUser()">保存修改</button>
</div>
</form>
</div>
// 通过id获取修改的客户信息
function editUser(Acc) {
$.ajax({
type:"get",
url:"<%=basePath%>admin/getUserByAcc.action",
data:{"Acc":Acc},
success:function(data) {
$("#edit_userId").val(data.userId);
$("#edit_userAcc").val(data.userAcc);
$("#edit_userPwd").val(data.userPwd);
//设置复选框默认选中
var editId = $("#edit_userId").val();
var inputs = document.getElementById("editUserIds");
var checkboxInput = inputs.getElementsByTagName('input');
for (var i = 0; i < checkboxInput.length; i++) {
checkboxInput[i].checked = false;
}
for (var i = 0; i < checkboxInput.length; i++) {
if(editId.indexOf(checkboxInput[i].value) != -1){
checkboxInput[i].checked = true;
}
}
$("#editUserWin").dialog({
modal:true,
width:"400",
});
}
});
}
- 前端编写用户编辑信息提交代码
<button type="button" onclick="updateUser()">保存修改</button>
//执行修改用户操作
function updateUser() {
var editUserIds = [];
var edit_userAcc = $("#edit_userAcc").val();
var edit_userPwd = $("#edit_userPwd").val();
$("input[name='editUserIds']:checked").each(function (index) {
editUserIds[index] = $(this).val();
});
$.ajax({
type:"post",
url:"<%=basePath%>admin/updateUser.action",
traditional: true,
data:{
'editUserIds':editUserIds,
'edit_userAcc':edit_userAcc,
'edit_userPwd':edit_userPwd
},
success:function(data) {
if(data =="OK"){
alert("客户信息更新成功!");
window.location.reload();
}else{
alert("客户信息更新失败!");
window.location.reload();
}
}
});
}
- 后端控制层代码
/**
* 通过用户账号查询用户信息
* @param Acc
* @param model
* @return
*/
@RequestMapping(value = "/admin/getUserByAcc.action")
@ResponseBody
public User getUserByAcc(String Acc,Model model) {
User user = userService.getUserByAcc(Acc);
return user;
}
/**
* 修改用户
* @param user
* @return
*/
@RequestMapping(value = "/admin/updateUser.action" ,consumes = "application/x-www-form-urlencoded")
@ResponseBody
public String updateUser(String[] editUserIds,String edit_userAcc,String edit_userPwd,HttpServletRequest request) {
editUserIds = request.getParameterValues("editUserIds");
int rows = userService.updateUser(editUserIds,edit_userAcc,edit_userPwd);
if(rows>0) {
return "OK";
}else {
return "FAIL";
}
}
- 控制层所用Service层代码
/**
* 根据账号查询用户
*/
@Override
public User getUserByAcc(String acc) {
// TODO Auto-generated method stub
return userDao.getUserByAcc(acc);
}
/**
* 修改用户
*/
@Override
public int updateUser(String[] editUserIds,String edit_userAcc,String edit_userPwd) {
User user = new User();
String userId = "";
if(editUserIds!=null&&editUserIds.length>0) {
for(String s:editUserIds) {
userId+=s+",";
}
}
user.setUserId(userId);
if(StringUtils.isNotBlank(edit_userAcc)) {
user.setUserAcc(edit_userAcc);
}
if(StringUtils.isNotBlank(edit_userPwd)) {
user.setUserPwd(edit_userPwd);
}
return userDao.updateUser(user);
}
- Service层所需Dao层代码及相应的XML代码
/**
* 根据账号查询用户
* @param acc
* @return
*/
User getUserByAcc(String acc);
/**
* 修改用户
* @param user
* @return
*/
int updateUser(User user);
<!-- 根据账号查询用户 -->
<select id="getUserByAcc" parameterType="String" resultType="user">
select * from tb_user where userAcc = #{userAcc}
</select>
<!-- 修改用户 -->
<update id="updateUser" parameterType="user">
update tb_user
<set>
<if test="userId!=null">
userId = #{userId},
</if>
<if test="userPwd!=null">
userPwd = #{userPwd},
</if>
</set>
where userAcc=#{userAcc}
</update>
- 功能演示
用户修改
用户账号删除
- 前端编写用户账号删除按钮及提交函数
<button onclick="deleteUser(${row.userAcc})">删除</button>
// 删除客户
function deleteUser(Acc) {
if(confirm('确实要删除该客户吗?')) {
$.post("<%=basePath%>admin/deleteUser.action",{"Acc":Acc},
function(data){
if(data =="OK"){
alert("客户删除成功!");
window.location.reload();
}else{
alert("删除客户失败!");
window.location.reload();
}
});
}
}
- 后端控制层代码
/**
* 删除用户
* @param Acc
* @return
*/
@RequestMapping(value = "/admin/deleteUser.action")
@ResponseBody
public String deleteUser(String Acc) {
int rows = userService.deleteUser(Acc);
if(rows>0) {
return "OK";
}else {
return "FAIL";
}
}
- 控制层所用Service层代码
/**
* 删除用户
*/
@Override
public int deleteUser(String acc) {
return userDao.deleteUser(acc);
}
- Service层所需Dao层代码及相应的XML代码
/**
* 删除用户
* @param acc
* @return
*/
int deleteUser(String acc);
<!-- 删除用户 -->
<delete id="deleteUser" parameterType="String">
delete from tb_user where userAcc = #{Acc}
</delete>
- 功能演示
用户删除
用户账号添加
- 前端编写添加用户弹窗和提交新增用户的数据给后端
<td colspan="5"><button onclick="clearUser()">添加</button></td>
<!-- 新建用户窗口 -->
<div class="mydialog" align="center" name="addUserWin" id="addUserWin">
<form id="add_user_form">
<div id="add_UserIds">
<label>用户身份:</label>
<c:forEach items="${Ids}" var="item">
<input type="checkbox" id="addUserIds" name="addUserIds" value="${item.id}" />
${item.userId}
</c:forEach>
</div><br/>
<div>
<label>用户账号:</label>
<input type="text" id="add_userAcc" name="add_userAcc" />
</div><br/>
<div>
<label>用户密码:</label>
<input type="text" id="add_userPwd" name="add_userPwd">
</div><br/>
<div>
<button type="button" onclick="createUser()">创建用户</button>
</div>
</form>
</div>
//清空新建客户窗口中的数据
function clearUser() {
var inputs = document.getElementById("add_UserIds");
var checkboxInput = inputs.getElementsByTagName('input');
for (var i = 0; i < checkboxInput.length; i++) {
checkboxInput[i].checked = false;
}
$("#add_userAcc").val("");
$("#add_userPwd").val("");
$("#addUserWin").dialog({
modal:true,
width:"400",
});
}
// 创建客户
function createUser() {
var addUserIds = [];
var add_userAcc = $("#add_userAcc").val();
var add_userPwd = $("#add_userPwd").val();
$("input[name='addUserIds']:checked").each(function (index) {
addUserIds[index] = $(this).val();
});
$.ajax({
type:"post",
url:"<%=basePath%>admin/createUser.action",
traditional: true,
data:{
'addUserIds':addUserIds,
'add_userAcc':add_userAcc,
'add_userPwd':add_userPwd
},
success:function(data) {
if(data =="OK"){
alert("客户创建成功!");
window.location.reload();
}else{
alert("客户创建失败!");
window.location.reload();
}
}
});
}
- 后端控制层代码
@RequestMapping(value = "/admin/createUser.action")
@ResponseBody
public String createUser(String[] addUserIds,String add_userAcc,String add_userPwd) {
int rows = userService.createUser(addUserIds,add_userAcc,add_userPwd);
if(rows>0) {
return "OK";
}else {
return "FAIL";
}
}
- 控制层所用Service层代码
/**
* 添加用户
*/
@Override
public int createUser(String[] addUserIds, String add_userAcc, String add_userPwd) {
User user = new User();
String userId = "";
if(addUserIds!=null&&addUserIds.length>0) {
for(String s:addUserIds) {
userId+=s+",";
}
}else {
return 0;
}
user.setUserId(userId);
if(StringUtils.isNotBlank(add_userAcc)) {
if(userDao.getUserByAcc(add_userAcc)!=null) {
return 0;
}
user.setUserAcc(add_userAcc);
}else {
return 0;
}
if(StringUtils.isNotBlank(add_userPwd)) {
user.setUserPwd(add_userPwd);
}else {
return 0;
}
return userDao.createUser(user);
}
- Service层所需Dao层代码及相应的XML代码
/**
* 创建用户
* @param user
* @return
*/
int createUser(User user);
<!-- 创建用户 -->
<insert id="createUser" parameterType="user">
insert into tb_user(userAcc,userId,userPwd)
values(#{userAcc},#{userId},#{userPwd})
</insert>
- 功能演示
添加用户
个人信息修改
- 前端编写个人信息弹窗以及将修改信息提交给后端
<a href="javascript:void(0)" class="exit" style="font-size:25px;" title="点此修改" onclick="editSelf(${USER_SESSION.userAcc})">✎</a>
<!-- 修改个人信息窗口 -->
<div class="mydialog" align="center" name="editSelfWin" id="editSelfWin">
<form id="edit_self_form">
<div>
<label>用户账号</label>
<input type="text" id="edit_selfAcc" name="edit_selfAcc" value="${USER_SESSION.userAcc}" disabled="disabled">
</div><br/>
<div>
<label>用户密码</label>
<input type="text" value="${USER_SESSION.userPwd}" id="edit_selfPwd" name="edit_selfPwd">
</div><br/>
<div>
<label>用户姓名</label>
<input type="text" value="${USER_SESSION.userName}" id="edit_selfName" name="edit_selfName">
</div><br/>
<div>
<label>用户年龄</label>
<input type="text" value="${USER_SESSION.userAge}" id="edit_selfAge" name="edit_selfName">
</div><br/>
<div>
<label>用户性别</label>
<input id="editselfSex" type="hidden">
<select id="edit_selfSex" name="edit_selfSex">
<option value="">--请选择--</option>
<option value="0" <c:if test="${USER_SESSION.userSex==0}">selected</c:if>>女</option>
<option value="1" <c:if test="${USER_SESSION.userSex==1}">selected</c:if>>男</option>
</select>
</div><br/>
<div>
<button type="button" onclick="updateSelf()">保存修改</button>
</div>
</form>
</div>
//执行修改用户操作
function updateSelf() {
var edit_selfAcc = $("#edit_selfAcc").val();
var edit_selfPwd = $("#edit_selfPwd").val();
var edit_selfName = $("#edit_selfName").val();
var edit_selfAge = $("#edit_selfAge").val();
var edit_selfSex = $("#edit_selfSex").val();
if(edit_selfAge == null || edit_selfAge == undefined || edit_selfAge == ''){
alert("年龄不能为空!");
return false;
}
if(edit_selfSex == null || edit_selfSex == undefined || edit_selfSex == ''){
alert("请选择您的性别!");
return false;
}
$.ajax({
type:"post",
url:"<%=basePath%>admin/updateSelf.action",
traditional: true,
data:{
'edit_selfAcc':edit_selfAcc,
'edit_selfPwd':edit_selfPwd,
'edit_selfName':edit_selfName,
'edit_selfAge':edit_selfAge,
'edit_selfSex':edit_selfSex,
},
success:function(data) {
if(data =="OK"){
alert("个人信息更新成功!");
window.location.reload();
}else{
alert("个人信息更新失败!");
window.location.reload();
}
}
});
}
- 后端控制层代码
/**
* 修改个人信息
*/
@RequestMapping(value = "/admin/updateSelf.action")
@ResponseBody
public String updateSelf(String edit_selfAcc,String edit_selfPwd,String edit_selfName,
int edit_selfAge,int edit_selfSex,HttpSession session) {
int rows = userService.updateSelf(edit_selfAcc,edit_selfPwd,edit_selfName,edit_selfAge,edit_selfSex);
if(rows>0) {
session.setAttribute("USER_SESSION", userService.getUserByAcc(edit_selfAcc));
return "OK";
}else {
return "FAIL";
}
}
- 控制层所用Service层代码
/**
* 修改个人信息
*/
@Override
public int updateSelf(String edit_selfAcc, String edit_selfPwd, String edit_selfName, int edit_selfAge,
int edit_selfSex) {
User user = new User();
user.setUserAcc(edit_selfAcc);
if(StringUtils.isNoneBlank(edit_selfPwd)) {
user.setUserPwd(edit_selfPwd);
}
if(StringUtils.isNoneBlank(edit_selfName)) {
user.setUserName(edit_selfName);
}
if(edit_selfAge > 0 && edit_selfAge<=200) {
user.setUserAge(edit_selfAge);
}else {
return 0;
}
if(edit_selfSex==0||edit_selfSex==1) {
user.setUserSex(edit_selfSex);
}else {
return 0;
}
return userDao.updateSelf(user);
}
- Service层所需Dao层代码及相应的XML代码
/**
* 修改个人信息
* @param user
* @return
*/
int updateSelf(User user);
<!-- 修改个人信息 -->
<update id="updateSelf" parameterType="user">
update tb_user
<set>
<if test="userPwd!=null">
userPwd = #{userPwd},
</if>
<if test="userName!=null">
userName = #{userName},
</if>
<if test="userAge !=null">
userAge = #{userAge},
</if>
<if test="userSex!=null">
userSex = #{userSex},
</if>
</set>
where userAcc = #{userAcc}
</update>
- 功能演示
个人信息修改