文章目录

1、详情功能---界面展示
2、详情功能--后台代码
- RouteServiceTest
- 扩展Route实体类
- Seller.java
- RouteImg.java
- RouteService
- 查找路线数据RouteDao.java
- 查分类CategoryDao.java
- 查询商家数据SellerDao.java
- 查找图片RouteImgDao.java
- RouteDetailServlet
- Mybatis中扫描映射文件
3、详情功能--前台代码
- route_detail.jsp页面

1、详情功能—界面展示

2、详情功能–后台代码

RouteServiceTest

@Testpublic void test03() throws JsonProcessingException {//业务，根据 路线的rid查找 路线的数据，商家的数据，分类的数据，收藏的数据RouteService routeService = new RouteService();int rid = 1;Route route = routeService.findRouteById(rid);System.out.println(route);}

需要返回的route对象内部包含路线的数据，商家的数据，分类的数据，图片的数据

扩展Route实体类

    //分类数据private Category category;//商家数据private Seller  seller;//图片数据private List<RouteImg> imgList;

Seller.java

public class Seller {private int sid;//商家idprivate String sname;//商家名称private String consphone;//商家电话private String address;//商家地址}

RouteImg.java

public class RouteImg {private int rgid;//商品图片idprivate int rid;//旅游商品idprivate String bigPic;//详情商品大图private String smallPic;//详情商品小图}

RouteService

(1)通过分析，数据来自四个表，所以可以考虑2，或者3查询方案
(2)使用Mybatis其实核心是开发者的sql能力。

# rid =1
# 路线表 tab_route
# 商家表 tab_seller
# 图片表 tab_route_img
# 分类表 tab_category
select * from tab_route r where r.rid =1 ;select *
from tab_route r,tab_seller s
where r.rid =1
and r.sid=s.sid ;# 方式1：内连接查询的话，因为出现重复的数据，放弃
select *
from tab_route r,tab_seller s,tab_route_img i
where r.rid =1
and r.sid=s.sid
and r.rid = i.rid;# 方式2：内连接查询的话，必须一对一
# 一个路线属于一个商家, 一个路线属于一个分类
# 一个路线可以包含多个图片select *
from tab_route r,tab_seller s,tab_category c
where r.rid =1
and r.sid=s.sid
and r.cid = c.cid;# 还差图片数据
select * from  tab_route_img i where i.rid=1;#方式3： 详情数据来自四个表，拆成四个查询语句select * from tab_route r where r.rid = 1; #路线
select * from tab_seller s where s.sid = 1; #商家数据
select * from  tab_route_img i where i.rid=1;#图片数据
select * from  tab_category c where c.cid =1;#分类数据

    public Route findRouteById(int rid) {//数据来自四个表，执行四个查找方法//路线数据RouteDao routeDao = MySessionUtils2.getMapper(RouteDao.class);Route route =routeDao.findOneByRid(rid);//分类数据CategoryDao categoryDao = MySessionUtils2.getMapper(CategoryDao.class);Category category = categoryDao.findOneByCid(route.getCid());//设置给route对象route.setCategory(category);//商家数据SellerDao sellerDao = MySessionUtils2.getMapper(SellerDao.class);Seller seller = sellerDao.findOneBySid(route.getSid());//设置给route对象route.setSeller(seller);//图片数据  XxxxDaoRouteImgDao routeImgDao = MySessionUtils2.getMapper(RouteImgDao.class);List<RouteImg> list= routeImgDao.findAllImgByRid(route.getRid());route.setImgList(list);return route;}

查找路线数据RouteDao.java

 //select * from tab_route r where r.rid = 1;Route findOneByRid(int rid);

<!--    //select * from tab_route r where r.rid = 1;-->
<!--    Route findOneByRid(int rid);--><select id="findOneByRid" parameterType="int" resultType="route">select * from tab_route r where r.rid =#{rid};</select>

查分类CategoryDao.java

  //select * from  tab_category c where c.cid =1;Category findOneByCid(int cid);

<!--    //select * from  tab_category c where c.cid =1;-->
<!--    Category findOneByCid(int cid);--><select id="findOneByCid" parameterType="int" resultType="category">select * from  tab_category c where c.cid =#{cid}</select>

查询商家数据SellerDao.java

public interface SellerDao {//select * from tab_seller s where s.sid = 1;Seller findOneBySid(int sid) ;
}

<!--    //select * from tab_seller s where s.sid = 1;-->
<!--    Seller findOneBySid(int sid) ;--><select id="findOneBySid" parameterType="int" resultType="seller">select * from tab_seller s where s.sid =#{sid};</select>

查找图片RouteImgDao.java

public interface RouteImgDao {//select * from  tab_route_img i where i.rid=1;List<RouteImg> findAllImgByRid(int rid);
}

RouteDetailServlet

@WebServlet("/routedetail/*")
public class RouteDetailServlet extends BaseServlet {// /routedetail/findpublic  void find(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//1 接收请求，获取参数//业务，根据 路线的rid查找 路线的数据，商家的数据，分类的数据，图片的数据String ridStr = request.getParameter("rid");int rid = 1; //"1"try {rid = Integer.parseInt(ridStr);} catch (NumberFormatException e) { //Ctrl+Alt+Te.printStackTrace();}//2 处理参数RouteService routeService = new RouteService();Route route = routeService.findRouteById(rid);//3 响应浏览器String json = toJson(200,route);response.getWriter().println(json);}}

Mybatis中扫描映射文件

 <mappers><mapper resource="com/wzx/dao/UserDao.xml"/><mapper resource="com/wzx/dao/CategoryDao.xml"/><mapper resource="com/wzx/dao/RouteDao.xml"/><mapper resource="com/wzx/dao/SellerDao.xml"/></mappers>

3、详情功能–前台代码

route_detail.jsp页面

查看详情连接添加rid

<p><a href="route_detail.jsp?rid='+route.rid+'">查看详情</a></p>\n

route_detail.jsp页面
将 route_detail.html转 route_detail.jsp
获取上个页面传过来的rid
使用rid发送请求获取json
先显示详情页面的所有文字
再使用循环拼接详情页的图片

<head><meta charset="utf-8"><title>路线详情</title><link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"><link rel="stylesheet" type="text/css" href="css/common.css"><link rel="stylesheet" type="text/css" href="css/route-detail.css"><script type="text/javascript" src="js/jquery-1.11.0.min.js"></script><script type="text/javascript" src="js/getParameter.js"></script><script type="text/javascript">$(function () {///route_detail.jsp?rid=3var rid = getParameter("rid")// 当前页面需要取得 由【查看详情】传过来的rid$.get('routedetail/find?rid=' + rid, function (data) {// 发请求 给 routedetail/find?rid=3 可以获取rid对应的json数据if (200 == data.code) {//console.log(data.data)var route = data.data;// 并json数据的值 赋给当前的标签 html()  $(id)$("#category").html(route.category.cname)$("#rname").html(route.rname)$("#title").html(route.rname)$("#introduce").html(route.routeIntroduce)$("#sname").html('商家名称:' + route.seller.sname)$("#consphone").html('商家电话' + route.seller.consphone)$("#address").html('地址' + route.seller.address)$("#price").html(route.price)//图片//左侧一张大图$('#big_img').attr('src', route.rimage)//右侧多张小图  前四张可见，第五张起，需要点击才可见var alist = '';//向上的箭头alist += '<a class="up_img up_img_disable"></a>'var list = route.imgListfor (var i = 0; i < list.length; i++) {var routeImg = list[i]//var a = ''if(i<4){ //前四张a = '<a title="" class="little_img" data-bigpic="'+routeImg.bigPic+'" >\n' +'                        <img src="'+routeImg.smallPic+'">\n' +'                        </a>'}else{a = '<a title="" class="little_img" data-bigpic="'+routeImg.bigPic+'" style="display:none;" >\n' +'                        <img src="'+routeImg.smallPic+'">\n' +'                        </a>'}alist+=a //将多个a标签拼接}//向下的箭头alist += '<a class="down_img down_img_disable" style="margin-bottom: 0;"></a>'$('#small_imgs').html(alist)//给小图添加事件clickImgs()}}, "json")})</script>
</head>

基于JavaWeb的旅游项目--详情功能相关推荐

Java旅游项目线路收藏_基于JavaWeb的旅游项目--详情功能
文章目录 1.详情功能---界面展示 2.详情功能--后台代码 RouteServiceTest 扩展Route实体类 Seller.java RouteImg.java RouteService 查 ...
基于javaweb的旅游管理系统(java+jsp+html5+bootstrap+servlet+mysql)
基于javaweb的旅游管理系统(java+jsp+html5+bootstrap+servlet+mysql) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse ...
day17--途牛旅游项目-激活功能
day17–途牛旅游项目-激活功能 UUID介绍 (1)什么是uuid 全球唯一的,不会重复的固定长度的随机字符串 25fd9bcf50ad4dc39aa38f084d1801c8 (2)复制UUI ...
day17--途牛旅游项目-注册功能
day17–途牛旅游项目-注册功能注册功能_功能分析注册功能_功能实现 Test方法 @Testpublic void test03() {UserService userService = ne ...
day17--途牛旅游项目-登录功能V2
day17–途牛旅游项目-登录功能V2 学习目标 (1)改进登录 (2)注册功能 MySessionUtils改进 (1) A依赖B,移除B,A报错,耦合 public static <T> ...
[教程+论文+答辩PPT+开题报告+源码等]基于javaweb的旅游网站
下载:https://download.csdn.net/download/m0_68856272/85052024 项目介绍: <基于javaweb实现的旅游网> 系统说明: 前端使用技 ...
JavaWeb旅游项目登陆功能
分析登录功能实现UserService&UserDao 生成UserService与测试逻辑测试逻辑 @Testpublic void test01(){//将用户输入的账号密码传到后台U ...
基于Javaweb的小项目(类似于qqzone) 5 ——登录功能实现
功能描述用户输入用户名.密码,经过登录验证后,登录成功后能够访问主页面实体POJO类:UserBasic DAO接口及其实现类:UserBasicDAO UserBasicDAOImpl serv ...
网上书店(基于JavaWeb和Mysql)项目
基本介绍: 本项目用jsp框架实现,用mysql做数据库,前端还涉及到js.jQuery.bootstrap等的一些技术,是面向客户端的网上书店(即不包含数据管理模块):项目采用经典的MVC模型,由J ...

基于JavaWeb的旅游项目--详情功能