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>

2. 用户的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页面

1. 修改按钮，写一个js控制器：

<button οnclick="show1(${itemment_id})"  class="item_add" style=""><div id="xiugai${itemment_id}">修改</div></button>

2. show1，让button显示出来：并且点击改变文字，把修改二字改为修改中。

function show1(id) {document.getElementById("button"+id).style.display = "block";y = document.getElementById("xiugai"+id)y.innerHTML = "修改中"
};

3. 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)的详细开发过程以及原理详解