admin 管理员组文章数量: 1086019
JavaWeb传统商城(MVC三层架构)的评价模块增删改查(CURD)的详细开发过程以及原理详解
文章目录
- 一 . 课程商城的评价模块的增删改查需求开发记录
- 1.1 项目背景
- 1.2 本次需求
- 1.3 需求分析与UI设计
- 1.4 评价模块数据库设计与详解
- 1.5 开发顺序
- 1.6 效果抢先看
- 二.对应商品的评价和查询
- 2.1 某商品的该商品的所有评价渲染
- 2.1.1 Dao层
- 2.1.2 Service层
- 2.1.3 Servlet层
- 2.1.4 JSP页面
- 2.1.5 评价列表效果展示截图
- 2.2 用户提交评价
- 2.2.1 JSP页面
- 2.2.2 Serclet层
- 2.2.3 Service层
- 2.2.4 Dao层
- 2.2.5 用户提交评价效果截图
- 三. 评价的权限删除和修改
- 3.1 删除评价功能
- 3.1.1 JSP 页面
- 3.1.2 Serclet层
- 3.1.3 Service层
- 3.1.4 Dao层
- 3.1.4 删除评价功能效果展示
- 3.2 修改评论功能
- 3.2.1 JSP页面
- 3.2.2 Serclet层
- 3.2.3 Service层
- 3.2.4 Dao层
📗系列专栏: 本文写在上进小菜猪的JavaWeb专栏想要了解更多,请访问本专栏
一 . 课程商城的评价模块的增删改查需求开发记录
1.1 项目背景
这是JavaWeb的结课大作业。该作业要求设计一个原生的Javaweb项目。
- 本项目类型为:传统商城
- 本项目使用原生JavaWeb采用MVC架构,项目包括前台和后台
- 前台用于用户购买产品
- 后台用于管理
- 本项目数据库采用Mysql
- 本需求难度:易
1.2 本次需求
系统新增功能扩展或优化功能:大家可以在本系统的基础上进行系统新增功能扩展或优化。如:评价,好评,差评,促销,优惠券,分期付款,售后,销售统计分析等等,这些只是一些提示,并不限于此。大家可以上淘宝、京东等网站找找系统新增功能扩展的思路。 11月5日晚7:00检查系统新增功能。
需求:
评价模块的增删改查
基于本次的任务需求,我认为相当有一点复杂的就是评价(包括好评,差评)模块,所以抽了点时间写了一下评价模块。其余的模块较为简单,日后在写。
1.3 需求分析与UI设计
由于最近手中项目较多,决定不使用jqurey的开源模板进行美化,本次开发记录笔记也以简洁为主,故本次任务核心:能用就行。
这个评价模块其实是一个类淘宝的评价功能,所以初步样式概念设计如下:
1.4 评价模块数据库设计与详解
上述字段介绍:
- comment_id :评价条目id,主键,自增。
- curriculum_id :课程id。作用:用于之后的各个不同的课程商品渲染本商品的评价列表。
- user_id:用户id。作用记录当前的发起评价事件的用户id。
- user_name:用户姓名。原打算用user_id来联立user表,后发现在前端表单${user.name }可以直接获取到用户名称。
- text :用户评价内容。
- bad :差评。
- good : 好评。
- 注释:bad和good可以使用一个字段,当时时间较为紧张,没有细想,不过经过后端处理可以满足评价需求。
- datatime :datatime类型。存储用户评价时间。
1.5 开发顺序
1.先写目标商品页的所有评价列表渲染。
2.再写当前登录用户评价提交表单。
3.权限删除和修改评价。
1.6 效果抢先看
采用MVC三层架构的JavaWeb商城项目的评价模块功能视频演示
评论循环渲染效果图:
删除和修改效果图
修改效果图:
二.对应商品的评价和查询
2.1 某商品的该商品的所有评价渲染
当前页面为某商品的商品详情页:按照惯例,我们应该在下面增加本次评价模块。
2.1.1 Dao层
本层用于完成对数据库的操作。
1.使用有参方式构造QueryRunner对象。
QueryRunner queryRunner = new QueryRunner(DataSourceUtils.getDataSource());
2.编写占位符形式的sql语句。
String sql = "select * from `comment` where curriculum_id = ? order by datatime desc";
3.执行sql语句查询,将结果封装在Employee中。
return queryRunner.query(sql, new BeanListHandler<Comment>(Comment.class),id);
解释/作用:
id为目标商品id。sql语句是根据商品id筛选出目标商品的全部评价详情,并且降序排序封装在Employee后返回给CommentService。
2.1.2 Service层
service层为了方便扩展和维护。
1.新建指定类型List
List<Comment> com=null;
2.调用到Dao层。
com = ComDao.getCommentById(id);
3.记得抛出异常,这里返回 Com。
2.1.3 Servlet层
1.将前面Service返回的值,赋值给指定类型List。
List<Comment> list= gService1.getCommentById(id);
2.使用JSP内置对象的setAttribute方法存储。
request.setAttribute("orderList", list);
3.带参转发到目的url。
request.getRequestDispatcher("/Curriculums_detail.jsp").forward(request, response);
2.1.4 JSP页面
1.目标orderList的类型为class java.util.ArrayList。写一个循环来进行循环渲染评价列表:
<c:forEach items="${orderList}" var="item" >
</c:forEach>
2.为了节省时间,采用一个简单的 HTML 表格来完成这个需求:(架子)
<table border="1"><tr><td rowspan="2"><img src="./images/zhu.jpg" style="width: 100px ;height: 100px"></td><td><br/></td></tr><tr><td></td></tr>
</table>
3.在表格里面显示评论用户的名称。
<span style="color:#1b6d85;"><c:out value="${item.curriculum_name}"></c:out></span>
4.根据数据库的值来判断渲染好评还是差评。
<c:if test="${item.good==1 }"><span style="color:red;">赏了好评</span></c:if><c:if test="${item.good==0 }"><span style="color:red;">给了差评</span></c:if>
5.输出数据库里存储的时间。
<c:out value="${item.datatime}"></c:out>
6.记得渲染评论内容。
<c:out value="${item.text}"></c:out>
2.1.5 评价列表效果展示截图
页面截图:
数据库截图:
2.2 用户提交评价
2.2.1 JSP页面
本功能使用form表单向后端发起请求,将相关的内容等信息存储到sql中。
1.先输出一个当前登录的用户名和当前课程。
<span>当前登录的用户名为:${user.name } 。当前课程为:${g.name }</span>
- 用户的id,名字,商品名字id等等我们在隐藏input里传输即可。
<input type="hidden" name="user_id" value="${user.id }" placeholder="user_id" >
<input type="hidden" name="curriculum_id" value="${g.id }" placeholder="curriculum_id">
<input type="hidden" name="curriculum_name" value="${user.name }" placeholder="curriculum_name">
3.输入评价框框。
<input type="text" name="text" placeholder="请输入评价" style="width: 800px;height: 50px;">
4.好评、差评的单选框。
<input type="radio" name="haohuai" value="1" checked>好评
<input type="radio" name="haohuai" value="0">差评
5.form的请求路径为:/Comment
2.2.2 Serclet层
@WebServlet(name = "Comment",urlPatterns = "/Comment")
1.由于数据库设计的失误,所以后端在拼接List的时候,先进行一下赋值操作。
int haohuai = Integer.parseInt(req.getParameter("haohuai"));
int good = 0, bad = 0;
if (haohuai==1) {good = 0;bad = 1;
}
if (haohuai==0){good = 1;bad = 0;
}
2.将前端传递的值进行一个拼接List。
List<String> list = new ArrayList<>();
list.add(String.valueOf(Integer.parseInt(req.getParameter("curriculum_id"))));
list.add(String.valueOf(Integer.parseInt(req.getParameter("user_id"))));
list.add(req.getParameter("text"));
list.add(String.valueOf(good));
list.add(String.valueOf(bad));
list.add(String.valueOf(req.getParameter("curriculum_name")));
3.传给Service层。返回值为字符,其实返回值没啥用。
String g = gService1.getCommentall(list);
4.用户评价完之后进行一个重定向。
这块我其实写不太好,应该用异步传输,时间原因,懒得写了,完成需求就行。
String zhu ="/Curriculums_detail?id=";
resp.sendRedirect(zhu+req.getParameter("curriculum_id"));
2.2.3 Service层
和2.1差不多。调用Dao进行数据库增加操作。
com = ComDao.getCommentall(list);
2.2.4 Dao层
1.获取该用户提交评价时候的时间:
Date date = new Date();
Timestamp t= new Timestamp(date.getTime());
2.使用有参方式构造QueryRunner对象。
QueryRunner r = new QueryRunner(DataSourceUtils.getDataSource());
3…编写占位符形式的sql语句。
String sql = "insert into comment(curriculum_id,user_id,text,bad,good,curriculum_name,datatime) values(?,?,?,?,?,?,?)";
4.3.执行sql语句添加。
r.update(sql,list.get(0),list.get(1),list.get(2),list.get(3),list.get(4),list.get(5),t);
2.2.5 用户提交评价效果截图
1.先找一个没有用户评价过的商品,进入。
2.登录账号进行评价:
3.提交效果图:
4.登录其他账号再次进行评价:
三. 评价的权限删除和修改
3.1 删除评价功能
3.1.1 JSP 页面
1.权限判断,我们的删除只能由评论该评论的用户进行点击删除:
<c:if test="${user.id == item.user_id}">
</c:if>
2.在权限判断的EL语句里写一个a标签,然后将a标签带参访问。
<a href="/CommentDelete?Commentid=${itemment_id}&curriculum_id=${g.id }" class="add-cart item_add" >删除</a>
commentid=评论的ID。
curriculum_id=商品的ID。
3.1.2 Serclet层
1.注册映射路径:
@WebServlet(name = "CommentDelete",urlPatterns = "/CommentDelete")
2.获得评论id:
int comment_id = Integer.parseInt(req.getParameter("Commentid"));
String co = gService1.getCommentDeleteID(comment_id);
3.重定向:
String zhu ="/Curriculums_detail?id=";
resp.sendRedirect(zhu+req.getParameter("curriculum_id"));
3.1.3 Service层
com = ComDao.getCommentDeleteID(commentid);
3.1.4 Dao层
1.执行sql语句,根据comment_id(评论id)删除本条评论。
String sql = "delete from comment where comment_id=?";
3.1.4 删除评价功能效果展示
点击删除:
删除成功:
3.2 修改评论功能
3.2.1 JSP页面
- 修改按钮,写一个js控制器:
<button οnclick="show1(${itemment_id})" class="item_add" style=""><div id="xiugai${itemment_id}">修改</div></button>
- show1,让button显示出来:并且点击改变文字,把修改二字改为修改中。
function show1(id) {document.getElementById("button"+id).style.display = "block";y = document.getElementById("xiugai"+id)y.innerHTML = "修改中"
};
- show2,让button隐藏起来。
function show2(id) {document.getElementById("button"+id).style.display = "none";y = document.getElementById("xiugai"+id)y.innerHTML = "修改"
}
4.重新写一个表单,把当前评论id传入到后端进行一个处理:
<div id="button${itemment_id}"><form action="/CommentUpdate" method="post"><span>当前登录的用户名为:${user.name } 。当前评论id为:${itemment_id}</span><input type="hidden" name="comment_id" value="${itemment_id }" placeholder="comment_id" ><input type="hidden" name="user_id" value="${user.id }" placeholder="user_id" ><input type="hidden" name="curriculum_id" value="${g.id }" placeholder="curriculum_id"><br><input type="text" name="text" placeholder="请输入评价" style="width: 800px;height: 50px;"><input type="hidden" name="curriculum_name" value="${user.name }" placeholder="curriculum_name"><br><input type="radio" name="haohuai" value="1" checked>好评<br><input type="radio" name="haohuai" value="0">差评<div class="text-center"><button οnclick="show2(${itemment_id})" class="item_add" type="button">取消</button><input type="submit" value="提交" class="add-cart item_add"></div></form>
</div>
3.2.2 Serclet层
基本和2.2的Serclet层代码一样,区别是:
3.2.3 Service层
com = ComDao.getCommentUpdate(list);
3.2.4 Dao层
本出可以参考2.2的dao层解释,原理一样。
Date date = new Date();
Timestamp t= new Timestamp(date.getTime());
System.out.println(t);
QueryRunner r = new QueryRunner(DataSourceUtils.getDataSource());
String sql = "update comment set curriculum_id=?,user_id=?,text=?,bad=?,good=?,curriculum_name=?,datatime=? where comment_id=?";
r.update(sql,list.get(0),list.get(1),list.get(2),list.get(3),list.get(4),list.get(5),t,list.get(6));
本文标签: JavaWeb传统商城(MVC三层架构)的评价模块增删改查(CURD)的详细开发过程以及原理详解
版权声明:本文标题:JavaWeb传统商城(MVC三层架构)的评价模块增删改查(CURD)的详细开发过程以及原理详解 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.roclinux.cn/b/1693583135a230601.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论