一、基本环境

二、创建实体类
1.User.java
package bjredcross.rainbowplans.model; import bjredcross.rainbowplans.common.UUIDUtils; public class User { private String id; private String nickname; private String loginpassword; private String email; public String getId() { return id; } public void setId(String id) { this.id = id; } public String getNickname() { return nickname; } public void setNickname(String nickname) { this.nickname = nickname; } public String getLoginpassword() { return loginpassword; } public void setLoginpassword(String loginpassword) { this.loginpassword = loginpassword; } public String getEmail() { return email; } public void setEmail(String email) { this.email = email; } }
2.UserSex.java
package bjredcross.rainbowplans.model; public class UserSex { private String id; private String sexname; private String sexcode; public String getId() { return id; } public void setId(String id) { this.id = id; } public String getSexname() { return sexname; } public void setSexname(String sexname) { this.sexname = sexname; } public String getSexcode() { return sexcode; } public void setSexcode(String sexcode) { this.sexcode = sexcode; } }
三、创建映射文件
1.UserMapper.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="bjredcross.rainbowplans.dao.UserMapper">
<resultMap id="BaseResultMap" type="bjredcross.rainbowplans.model.User">
<result column="id" property="id" />
<result column="nickname" property="nickname" />
<result column="loginpassword" property="loginpassword" />
<result column="email" property="email" />
</resultMap>
<parameterMap id="User" type="bjredcross.rainbowplans.model.User"/>
<sql id="Base_User_List">
id, nickname, loginpassword, email
</sql>
<select id="findAll" resultMap="BaseResultMap">
select
<include refid="Base_User_List" />
from t_user
</select>
<select id="findById" resultMap="BaseResultMap" parameterType="java.lang.String">
select
<include refid="Base_User_List" />
from t_user where id = #{id}
</select>
<update id="updateUser" parameterType="bjredcross.rainbowplans.model.User">
update t_user set
nickname = #{nickname}, loginpassword = #{loginpassword}, email = #{email}
where id = #{id}
</update>
<insert id="insertUser" parameterType="bjredcross.rainbowplans.model.User">
insert into t_user (id, nickname, loginpassword, email)
values (#{id}, #{nickname}, #{loginpassword}, #{email})
</insert>
<delete id="deleteById" parameterType="java.lang.String">
delete from t_user where id = #{id}
</delete>
</mapper>
2.UserSexMapper.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="bjredcross.rainbowplans.dao.UserMapper">
<resultMap id="BaseResultMap" type="bjredcross.rainbowplans.model.User">
<result column="id" property="id" />
<result column="nickname" property="nickname" />
<result column="loginpassword" property="loginpassword" />
<result column="email" property="email" />
</resultMap>
<parameterMap id="User" type="bjredcross.rainbowplans.model.User"/>
<sql id="Base_User_List">
id, nickname, loginpassword, email
</sql>
<select id="findAll" resultMap="BaseResultMap">
select
<include refid="Base_User_List" />
from t_user
</select>
<select id="findById" resultMap="BaseResultMap" parameterType="java.lang.String">
select
<include refid="Base_User_List" />
from t_user where id = #{id}
</select>
<update id="updateUser" parameterType="bjredcross.rainbowplans.model.User">
update t_user set
nickname = #{nickname}, loginpassword = #{loginpassword}, email = #{email}
where id = #{id}
</update>
<insert id="insertUser" parameterType="bjredcross.rainbowplans.model.User">
insert into t_user (id, nickname, loginpassword, email)
values (#{id}, #{nickname}, #{loginpassword}, #{email})
</insert>
<delete id="deleteById" parameterType="java.lang.String">
delete from t_user where id = #{id}
</delete>
</mapper>
四、创建数据层接口
1.UserMapper.java
package bjredcross.rainbowplans.dao; import java.util.List; import bjredcross.rainbowplans.model.User; public interface UserMapper { List<User> findAll(); User findById(String id); void updateUser(User user); void insertUser(User user); void deleteById(String id); }
2.UserSexMapper.java
package bjredcross.rainbowplans.dao; import java.util.List; import bjredcross.rainbowplans.model.UserSex; public interface UserSexMapper { List<UserSex> findAll(); }
五、创建服务层接口
1.UserService.java
package bjredcross.rainbowplans.service; import java.util.List; import bjredcross.rainbowplans.model.User; public interface UserService { List<User> findAll(); User findById(String id); void updateUser(User user); void insertUser(User user); void deleteById(String id); }
2.UserSexService.java
package bjredcross.rainbowplans.service; import java.util.List; import bjredcross.rainbowplans.model.UserSex; public interface UserSexService { List<UserSex> findAll(); }
六、创建服务层类
1.UserServiceImpl.java
package bjredcross.rainbowplans.service.impl; import java.util.List; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import bjredcross.rainbowplans.dao.UserMapper; import bjredcross.rainbowplans.model.User; import bjredcross.rainbowplans.service.UserService; @Service public class UserServiceImpl implements UserService { @Autowired private UserMapper userMapper; @Override public List<User> findAll() { return userMapper.findAll(); } public User findById(String id){ return userMapper.findById(id); } public void updateUser(User user){ userMapper.updateUser(user); } public void insertUser(User user) { userMapper.insertUser(user); } public void deleteById(String id) { userMapper.deleteById(id); } }
2.UserSexServiceImpl.java
package bjredcross.rainbowplans.service.impl; import java.util.List; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import bjredcross.rainbowplans.dao.UserSexMapper; import bjredcross.rainbowplans.model.UserSex; import bjredcross.rainbowplans.service.UserSexService; @Service public class UserSexServiceImpl implements UserSexService { @Autowired private UserSexMapper userSexMapper; @Override public List<UserSex> findAll() { return userSexMapper.findAll(); } }
七、创建控制文件
UserController.java
package bjredcross.rainbowplans.controller; import java.util.List; import java.util.Map; import java.util.Set; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.ModelMap; import org.springframework.util.StringUtils; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.servlet.ModelAndView; import bjredcross.rainbowplans.common.ResultUtils; import bjredcross.rainbowplans.common.UUIDUtils; import bjredcross.rainbowplans.model.User; import bjredcross.rainbowplans.model.UserSex; import bjredcross.rainbowplans.service.UserService; import bjredcross.rainbowplans.service.UserSexService; @Controller @RequestMapping("/user") public class UserController { @Autowired private UserService userService; @Autowired private UserSexService userSexService; @RequestMapping(value = "list") public ModelAndView findAll(HttpServletRequest request, HttpServletResponse response){ //String username = request.getParameter("username").trim(); String getContextPath = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+getContextPath+"/"; String getRemoteAddress=request.getRemoteAddr(); String getServletPath =request.getServletPath(); String getRequestURL =request.getRequestURL().toString(); String getRequestURI =request.getRequestURI(); String getQueryString =request.getQueryString(); String getRemoteUser =request.getRemoteUser(); Map map = request.getParameterMap(); Set<String> set = map.keySet(); for(String name : set){ //获得每个文本域所对应的值 String[] vals = (String[]) map.get(name); System.out.print(name+":"); for(String val : vals){ System.out.print(val+" "); } System.out.println(); } ModelAndView model = new ModelAndView("user/list"); model.addObject("userList",userService.findAll()); return model; } @RequestMapping(value = "findById") public ModelAndView findById(String id){ ModelAndView model = new ModelAndView("user/edit"); if (id != null && !id.equals("") ) { model.addObject("user", userService.findById(id)); List<UserSex> sexList=userSexService.findAll(); model.addObject("usersex", sexList); } return model; } @RequestMapping(value = "editUser") @ResponseBody public Object editUser(User user){ ResultUtils res = new ResultUtils(); try{ if (!user.getId().equals("")){ userService.updateUser(user); } else { user.setId(UUIDUtils.getUUID()); userService.insertUser(user); } }catch (Exception e){ return res.errorResult(); } return res.successResult(); } @RequestMapping(value = "deleteById") @ResponseBody public Object deleteById(String id){ ResultUtils res = new ResultUtils(); try{ userService.deleteById(id); }catch (Exception e){ res.errorResult(); } return res.successResult(); } }
八、创建页面文件
1.common.ftl
<link rel="icon" type="image/x-icon" href="${request.contextPath}/favicon/favicon.ico">
<link rel="stylesheet" href="${request.contextPath}/css/bootstrap.min.css">
<link rel="stylesheet" href="${request.contextPath}/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="${request.contextPath}/css/fontAwesome.css">
<link rel="stylesheet" href="${request.contextPath}/css/light-box.css">
<link rel="stylesheet" href="${request.contextPath}/css/owl-carousel.css">
<link rel="stylesheet" href="${request.contextPath}/css/templatemo-style.css">
<link rel="stylesheet" href="${request.contextPath}/layer/skin/layer.css">
<script src="${request.contextPath}/js/jquery-3.3.1.min.js"></script>
<script src="${request.contextPath}/js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
<script src="${request.contextPath}/js/vendor/jquery-1.11.2.min.js">
<script src="${request.contextPath}/js/vendor/bootstrap.min.js"></script>
<script src="${request.contextPath}/js/plugins.js"></script>
<script src="${request.contextPath}/layer/layer.js"></script>
<script src="${request.contextPath}/js/main.js"></script>
<script src="${request.contextPath}/js/my.js"></script>
2.list.ftl
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>用户列表</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<#include "/common/common.ftl" />
</head>
<body>
<header class="nav-down responsive-nav hidden-lg hidden-md">
<button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#main-nav">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div id="main-nav" class="collapse navbar-collapse">
<nav>
<ul class="nav navbar-nav">
<li><a href="#top">Home</a></li>
</ul>
</nav>
</div>
</header>
<div class="sidebar-navigation hidde-sm hidden-xs">
<div class="logo">
<a href="#">Sen<em>tra</em></a>
</div>
<nav>
<ul>
<li>
<a href="#featured">
<span class="rect"></span>
<span class="circle"></span>
用户列表
</a>
</li>
</ul>
</nav>
</div>
<div class="page-content">
<section id="featured" class="content-section">
<div class="section-heading">
<h1>商品<br><em>列表</em></h1>
</div>
<div class="section-content">
<div>
<button type="button" onclick="edit(0);" class="btn btn-info" style="position: relative;float: left;margin-bottom: 10px;">
添加
</button>
</div>
<table class="table table-striped">
<tr>
<td>商品名称</td>
<td>商品规格</td>
<td>温度</td>
<td>价格</td>
<td>商品描述</td>
<td>操作一</td>
<td>操作二</td>
</tr>
<#list userList as user>
<tr>
<td>${user.id}</td>
<td>${user.nickname}</td>
<td>${user.loginpassword}</td>
<td>${user.email}</td>
<td>商品描述</td>
<td>
<button type="button" class="btn btn-warning" onclick="edit('${(user.id)}');">
修改
</button>
</td>
<td>
<button type="button" class="btn btn-danger" onclick="deleteById('${(user.id)!}')">
删除
</button>
</td>
</tr>
</#list>
</table>
</div>
</section>
<section id="contact" class="content-section">
</section>
</div>
<script>
function edit(id) {
var title = "新增商品";
if (id != 0) {
title = "编辑商品";
}
var ob = {
title: "<label>"+title+"</label>",
width: "800",
height: "400",
url: "findById?id="+id
};
my.open(ob);
}
function reload(){
window.location.reload();
}
function deleteById(id) {
my.confirm('是否确认删除?','是否确认删除?',function(){
$.get("deleteById", {id: id}, function(data) {
if (data.success) {
layer.msg("删除成功!",
{icon:6,time:1000},
function(){
reload();
})
} else {
my.alert('删除失败!');
}
});
});
}
</script>
</body>
</html>
3.edit.ftl
<!DOCTYPE html> <html lang="en"> <#include "/common/common.ftl" /> <body> <form class="form-horizontal" id="editForm" enctype="multipart/form-data"> <input type="hidden" name="id" value="${(user.id)!}" size=85/> <input type="hidden" name="email" id="email" value="${(user.email)!}" size=85/> <div class="form-group"> <label class="col-sm-2 control-label">商品名称</label> <div class="col-sm-4"> <input type="text" class="form-control" name="nickname" value="${(user.nickname)!}"> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label">商品规格</label> <div class="col-sm-4"> <input type="text" class="form-control" name="loginpassword" value="${(user.loginpassword)!}"> </div> </div> <div class="form-group"> <label class="col-sm-2 control-label">温度</label> <div class="col-sm-4"> <select class="form-control" id="selemail"> <#list usersex as sex> <#if sex.sexcode==user.email> <option value="${sex.sexcode}" selected="selected">${sex.sexname}</option> <#else> <option value="${sex.sexcode}">${sex.sexname}</option> </#if> </#list> </select> </div> </div> <div class="form-group"> <div class="col-sm-offset-2 col-sm-10"> <input onclick="submitForm();" class="btn btn-default" value="提交"> </div> </div> </form> <script> $("#selemail").change(function(){ $("#email").val($("#selemail").val()); }); function submitForm() { $.ajax({ type: "POST",//方法类型 dataType: "json",//预期服务器返回的数据类型 url: "/user/editUser", data: $('#editForm').serialize(), success: function (data) { if (data.success) { layer.msg("提交成功!", {icon:6,time:1000}, function(){ parent.reload(); }) } }, error: function () { my.alert("提交失败!"); } }); } </script> </body> </html>
浙公网安备 33010602011771号