JavaWeb黑马旅游网-学习笔记08【旅游线路详情】
生活随笔
收集整理的這篇文章主要介紹了
JavaWeb黑马旅游网-学习笔记08【旅游线路详情】
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
- Java后端 學(xué)習(xí)路線 筆記匯總表【黑馬程序員】
目錄
43-旅游線路詳情_分析
44-旅游線路詳情_代碼實(shí)現(xiàn)_后臺代碼
RouteServlet.java
SellerDao.java
RouteDao.java
RouteDaoImpl.java
RouteService.java
RouteImgDao.java
RouteImgDaoImpl.java
RouteServiceImpl.java
45-旅游線路詳情_代碼實(shí)現(xiàn)_前臺代碼
route_detail.html
43-旅游線路詳情_分析
分析：
44-旅游線路詳情_代碼實(shí)現(xiàn)_后臺代碼
RouteServlet.java
package cn.itcast.travel.web.servlet;import cn.itcast.travel.domain.PageBean; import cn.itcast.travel.domain.Route; import cn.itcast.travel.domain.User; import cn.itcast.travel.service.FavoriteService; import cn.itcast.travel.service.RouteService; import cn.itcast.travel.service.impl.FavoriteServiceImpl; import cn.itcast.travel.service.impl.RouteServiceImpl;import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException;@WebServlet("/route/*") public class RouteServlet extends BaseServlet {private RouteService routeService = new RouteServiceImpl();private FavoriteService favoriteService = new FavoriteServiceImpl();/*** 根據(jù)id查詢一個旅游線路的詳細(xì)信息** @param request* @param response* @throws ServletException* @throws IOException*/public void findOne(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//1.接收idString rid = request.getParameter("rid");//2.調(diào)用service查詢route對象Route route = routeService.findOne(rid);//3.轉(zhuǎn)為json寫回客戶端writeValue(route, response);} }SellerDao.java
package cn.itcast.travel.dao;import cn.itcast.travel.domain.Seller;public interface SellerDao {/*** 根據(jù)id查詢** @param id* @return*/public Seller findById(int id); }RouteDao.java
package cn.itcast.travel.dao;import cn.itcast.travel.domain.Route;import java.util.List;public interface RouteDao {/*** 根據(jù)cid查詢總記錄數(shù)*/public int findTotalCount(int cid, String rname);/*** 根據(jù)cid，start,pageSize查詢當(dāng)前頁的數(shù)據(jù)集合*/public List<Route> findByPage(int cid, int start, int pageSize, String rname);/*** 根據(jù)id查詢** @param rid* @return*/public Route findOne(int rid); }RouteDaoImpl.java
package cn.itcast.travel.dao.impl;import cn.itcast.travel.dao.RouteDao; import cn.itcast.travel.domain.Route; import cn.itcast.travel.util.JDBCUtils; import org.springframework.jdbc.core.BeanPropertyRowMapper; import org.springframework.jdbc.core.JdbcTemplate;import java.util.ArrayList; import java.util.List;public class RouteDaoImpl implements RouteDao {private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());@Overridepublic Route findOne(int rid) {String sql = "select * from tab_route where rid = ?";return template.queryForObject(sql, new BeanPropertyRowMapper<Route>(Route.class), rid);} }RouteService.java
RouteImgDao.java
package cn.itcast.travel.dao;import cn.itcast.travel.domain.RouteImg;import java.util.List;public interface RouteImgDao {/*** 根據(jù)route的id查詢圖片** @param rid* @return*/public List<RouteImg> findByRid(int rid); }RouteImgDaoImpl.java
package cn.itcast.travel.dao.impl;import cn.itcast.travel.dao.RouteImgDao; import cn.itcast.travel.domain.RouteImg; import cn.itcast.travel.util.JDBCUtils; import org.springframework.jdbc.core.BeanPropertyRowMapper; import org.springframework.jdbc.core.JdbcTemplate;import java.util.List;public class RouteImgDaoImpl implements RouteImgDao {private JdbcTemplate template = new JdbcTemplate(JDBCUtils.getDataSource());@Overridepublic List<RouteImg> findByRid(int rid) {String sql = "select * from tab_route_img where rid = ? ";return template.query(sql, new BeanPropertyRowMapper<RouteImg>(RouteImg.class), rid);} }RouteServiceImpl.java
package cn.itcast.travel.service.impl;import cn.itcast.travel.dao.FavoriteDao; import cn.itcast.travel.dao.RouteDao; import cn.itcast.travel.dao.RouteImgDao; import cn.itcast.travel.dao.SellerDao; import cn.itcast.travel.dao.impl.FavoriteDaoImpl; import cn.itcast.travel.dao.impl.RouteDaoImpl; import cn.itcast.travel.dao.impl.RouteImgDaoImpl; import cn.itcast.travel.dao.impl.SellerDaoImpl; import cn.itcast.travel.domain.PageBean; import cn.itcast.travel.domain.Route; import cn.itcast.travel.domain.RouteImg; import cn.itcast.travel.domain.Seller; import cn.itcast.travel.service.RouteService;import java.util.List;public class RouteServiceImpl implements RouteService {private RouteDao routeDao = new RouteDaoImpl();private RouteImgDao routeImgDao = new RouteImgDaoImpl();private SellerDao sellerDao = new SellerDaoImpl();private FavoriteDao favoriteDao = new FavoriteDaoImpl();@Overridepublic Route findOne(String rid) {//1.根據(jù)id去route表中查詢route對象Route route = routeDao.findOne(Integer.parseInt(rid));//2.根據(jù)route的id 查詢圖片集合信息List<RouteImg> routeImgList = routeImgDao.findByRid(route.getRid());//2.2將集合設(shè)置到route對象route.setRouteImgList(routeImgList);//3.根據(jù)route的sid（商家id）查詢商家對象Seller seller = sellerDao.findById(route.getSid());route.setSeller(seller);//4. 查詢收藏次數(shù)int count = favoriteDao.findCountByRid(route.getRid());route.setCount(count);return route;} }45-旅游線路詳情_代碼實(shí)現(xiàn)_前臺代碼
Route_detail.html中加載后
route_detail.html
<!DOCTYPE html> <html lang="en"> <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"> </head> <body> <!--引入頭部--> <div id="header"></div> <!-- 詳情 start --> <div class="wrap"><div class="bread_box"><a href="/">首頁</a><span> ></span><a href="#">國內(nèi)游</a><span> ></span><a href="#">全國-曼谷6-7天自由行 泰國出境旅游 特價往返機(jī)票自由行二次確認(rèn)</a></div><div class="prosum_box"><dl class="prosum_left"><dt><img alt="" class="big_img"src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m49788843d72171643297ccc033d9288ee.jpg"></dt><dd id="dd"><a class="up_img up_img_disable"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m40920d0669855e745d97f9ad1df966ebb.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m20920d0669855e745d97f9ad1df966ebb.jpg"></a><a title="" class="little_img cur_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m49788843d72171643297ccc033d9288ee.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m29788843d72171643297ccc033d9288ee.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4531a8dbceefa2c44e6d0e35627cd2689.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2531a8dbceefa2c44e6d0e35627cd2689.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m46d8cb900e9f6c0a762aca19eae40c00c.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m26d8cb900e9f6c0a762aca19eae40c00c.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m45ea00f6eba562a767b5095bbf8cffe07.jpg"style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m25ea00f6eba562a767b5095bbf8cffe07.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4265ec488cd1bc7ce749bc8c9b34b87bc.jpg"style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2265ec488cd1bc7ce749bc8c9b34b87bc.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4e7e964909d7dd1a9f6e5494d4dc0c847.jpg"style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2e7e964909d7dd1a9f6e5494d4dc0c847.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m467db00e1b76718fab0fe8b96e10f4d35.jpg"style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m267db00e1b76718fab0fe8b96e10f4d35.jpg"></a><a title="" class="little_img"data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m487bbbc6e43eba6aa6a36cc1a182f7a20.jpg"style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m287bbbc6e43eba6aa6a36cc1a182f7a20.jpg"></a><a class="down_img down_img_disable" style="margin-bottom: 0;"></a></dd></dl><div class="prosum_right"><p class="pros_title" id="rname">【尾單特賣】全國-曼谷6-7天自由行 泰國出境旅游 特價往返機(jī)票自由行二次確認(rèn)</p><p class="hot" id="routeIntroduce">1-2月出發(fā)，網(wǎng)付立享￥1099/2人起！爆款位置有限，搶完即止！</p><div class="pros_other"><p>經(jīng)營商家：<span id="sname">黑馬國旅</span></p><p>咨詢電話: <span id="consphone">400-618-9090</span></p><p>地址：<span id="address">傳智播客黑馬程序員</span></p></div><div class="pros_price"><p class="price"><strong id="price">￥2699.00</strong><span>起</span></p><p class="collect"><a class="btn" id="favorite" onclick="addFavorite();"><iclass="glyphicon glyphicon-heart-empty"></i>點(diǎn)擊收藏</a><!-- <a class="btn already" disabled="disabled"><i class="glyphicon glyphicon-heart-empty"></i>點(diǎn)擊收藏</a>--><span id="favoriteCount">已收藏100次</span></p></div></div></div><div class="you_need_konw"><span>旅游須知</span><div class="notice"><p>1、旅行社已投保旅行社責(zé)任險。建議游客購買旅游意外保險 <br><p>2、旅游者參加打獵、潛水、海邊游泳、漂流、滑水、滑雪、滑草、蹦極、跳傘、滑翔、乘熱氣球、騎馬、賽車、攀巖、水療、水上飛機(jī)等屬于高風(fēng)險性游樂項(xiàng)目的，敬請旅游者務(wù)必在參加前充分了解項(xiàng)目的安全須知并確保身體狀況能適應(yīng)此類活動；如旅游者不具備較好的身體條件及技能，可能會造成身體傷害。</p><p>3、參加出海活動時，請務(wù)必穿著救生設(shè)備。參加水上活動應(yīng)注意自己的身體狀況，有心臟病、冠心病、高血壓、感冒、發(fā)燒和飲酒及餐后不可以參加水上活動及潛水。在海里活動時，嚴(yán)禁觸摸海洋中各種魚類，水母，海膽，珊瑚等海洋生物，避免被其蟄傷。老人和小孩必須有成年人陪同才能參加合適的水上活動。在海邊游玩時，注意保管好隨身攜帶的貴重物品。</p><p>4、根據(jù)中國海關(guān)總署的規(guī)定，旅客在境外購買的物品，在進(jìn)入中國海關(guān)時可能需要征收關(guān)稅。詳細(xì)內(nèi)容見《中華人民共和國海關(guān)總署公告2010年第54號文件》。</p><p>5、建議出發(fā)時行李托運(yùn)，貴重物品、常用物品、常用藥品、御寒衣物等請隨身攜帶，盡量不要托運(yùn)。行李延誤屬于不可抗力因素，我司將全力協(xié)助客人跟進(jìn)后續(xù)工作，但我司對此不承擔(dān)任何責(zé)任。</p><p>1、旅行社已投保旅行社責(zé)任險。建議游客購買旅游意外保險 <br><p>2、旅游者參加打獵、潛水、海邊游泳、漂流、滑水、滑雪、滑草、蹦極、跳傘、滑翔、乘熱氣球、騎馬、賽車、攀巖、水療、水上飛機(jī)等屬于高風(fēng)險性游樂項(xiàng)目的，敬請旅游者務(wù)必在參加前充分了解項(xiàng)目的安全須知并確保身體狀況能適應(yīng)此類活動；如旅游者不具備較好的身體條件及技能，可能會造成身體傷害。</p><p>3、參加出海活動時，請務(wù)必穿著救生設(shè)備。參加水上活動應(yīng)注意自己的身體狀況，有心臟病、冠心病、高血壓、感冒、發(fā)燒和飲酒及餐后不可以參加水上活動及潛水。在海里活動時，嚴(yán)禁觸摸海洋中各種魚類，水母，海膽，珊瑚等海洋生物，避免被其蟄傷。老人和小孩必須有成年人陪同才能參加合適的水上活動。在海邊游玩時，注意保管好隨身攜帶的貴重物品。</p><p>4、根據(jù)中國海關(guān)總署的規(guī)定，旅客在境外購買的物品，在進(jìn)入中國海關(guān)時可能需要征收關(guān)稅。詳細(xì)內(nèi)容見《中華人民共和國海關(guān)總署公告2010年第54號文件》。</p><p>5、建議出發(fā)時行李托運(yùn)，貴重物品、常用物品、常用藥品、御寒衣物等請隨身攜帶，盡量不要托運(yùn)。行李延誤屬于不可抗力因素，我司將全力協(xié)助客人跟進(jìn)后續(xù)工作，但我司對此不承擔(dān)任何責(zé)任。</p></div></div> </div> <!-- 詳情 end --> <!--引入頭部--> <div id="footer"></div> <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> <script src="js/jquery-3.3.1.js"></script> <!-- Include all compiled plugins (below), or include individual files as needed --> <script src="js/bootstrap.min.js"></script> <!--導(dǎo)入布局js，共享header和footer--> <script type="text/javascript" src="js/include.js"></script> <script src="js/getParameter.js"></script> <script>$(document).ready(function () {//自動播放goImg();// var timer = setInterval("auto_play()", 5000);});function goImg() {//焦點(diǎn)圖效果//點(diǎn)擊圖片切換圖片$('.little_img').on('mousemove', function () {$('.little_img').removeClass('cur_img');var big_pic = $(this).data('bigpic');$('.big_img').attr('src', big_pic);$(this).addClass('cur_img');});//上下切換var picindex = 0;var nextindex = 4;$('.down_img').on('click', function () {var num = $('.little_img').length;if ((nextindex + 1) <= num) {$('.little_img:eq(' + picindex + ')').hide();$('.little_img:eq(' + nextindex + ')').show();picindex = picindex + 1;nextindex = nextindex + 1;}});$('.up_img').on('click', function () {var num = $('.little_img').length;if (picindex > 0) {$('.little_img:eq(' + (nextindex - 1) + ')').hide();$('.little_img:eq(' + (picindex - 1) + ')').show();picindex = picindex - 1;nextindex = nextindex - 1;}});}//自動輪播方法function auto_play() {var cur_index = $('.prosum_left dd').find('a.cur_img').index();cur_index = cur_index - 1;var num = $('.little_img').length;var max_index = 3;if ((num - 1) < 3) {max_index = num - 1;}if (cur_index < max_index) {var next_index = cur_index + 1;var big_pic = $('.little_img:eq(' + next_index + ')').data('bigpic');$('.little_img').removeClass('cur_img');$('.little_img:eq(' + next_index + ')').addClass('cur_img');$('.big_img').attr('src', big_pic);} else {var big_pic = $('.little_img:eq(0)').data('bigpic');$('.little_img').removeClass('cur_img');$('.little_img:eq(0)').addClass('cur_img');$('.big_img').attr('src', big_pic);}}$(function () {/*<dd><a class="up_img up_img_disable"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m40920d0669855e745d97f9ad1df966ebb.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m20920d0669855e745d97f9ad1df966ebb.jpg"></a><a title="" class="little_img cur_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m49788843d72171643297ccc033d9288ee.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m29788843d72171643297ccc033d9288ee.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4531a8dbceefa2c44e6d0e35627cd2689.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2531a8dbceefa2c44e6d0e35627cd2689.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m46d8cb900e9f6c0a762aca19eae40c00c.jpg"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m26d8cb900e9f6c0a762aca19eae40c00c.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m45ea00f6eba562a767b5095bbf8cffe07.jpg" style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m25ea00f6eba562a767b5095bbf8cffe07.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4265ec488cd1bc7ce749bc8c9b34b87bc.jpg" style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2265ec488cd1bc7ce749bc8c9b34b87bc.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m4e7e964909d7dd1a9f6e5494d4dc0c847.jpg" style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m2e7e964909d7dd1a9f6e5494d4dc0c847.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m467db00e1b76718fab0fe8b96e10f4d35.jpg" style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m267db00e1b76718fab0fe8b96e10f4d35.jpg"></a><a title="" class="little_img" data-bigpic="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size4/201703/m487bbbc6e43eba6aa6a36cc1a182f7a20.jpg" style="display:none;"><img src="http://www.jinmalvyou.com/Public/uploads/goods_img/img_size2/201703/m287bbbc6e43eba6aa6a36cc1a182f7a20.jpg"></a><a class="down_img down_img_disable" style="margin-bottom: 0;"></a></dd>*///1.獲取ridvar rid = getParameter("rid");//2.發(fā)送請求請求 route/findOne$.get("route/findOne", {rid: rid}, function (route) {//3.解析數(shù)據(jù)填充html$("#rname").html(route.rname);$("#routeIntroduce").html(route.routeIntroduce);$("#price").html("￥" + route.price);$("#sname").html(route.seller.sname);$("#consphone").html(route.seller.consphone);$("#address").html(route.seller.address);//設(shè)置收藏次數(shù)$("#favoriteCount").html("已收藏" + route.count + "次");//圖片展示var ddstr = '<a class="up_img up_img_disable"></a>';//遍歷routeImgListfor (var i = 0; i < route.routeImgList.length; i++) {var astr;if (i >= 4) {astr = '<a title="" class="little_img" data-bigpic="' + route.routeImgList[i].bigPic + '" style="display:none;">\n' +' <img src="' + route.routeImgList[i].smallPic + '">\n' +' </a>';} else {astr = '<a title="" class="little_img" data-bigpic="' + route.routeImgList[i].bigPic + '">\n' +' <img src="' + route.routeImgList[i].smallPic + '">\n' +' </a>';}ddstr += astr;}ddstr += '<a class="down_img down_img_disable" style="margin-bottom: 0;"></a>';$("#dd").html(ddstr);//圖片展示和切換代碼調(diào)用goImg();});});$(function () {// 發(fā)送請求，判斷用戶是否收藏過該線路var rid = getParameter("rid");$.get("route/isFavorite", {rid: rid}, function (flag) {if (flag) {// 用戶已經(jīng)收藏過//<a class="btn already" disabled="disabled">//設(shè)置收藏按鈕的樣式$("#favorite").addClass("already");$("#favorite").attr("disabled", "disabled");//刪除按鈕的點(diǎn)擊事件$("#favorite").removeAttr("onclick");} else {// 用戶沒有收藏}});});//點(diǎn)擊收藏按鈕觸發(fā)的方法function addFavorite() {var rid = getParameter("rid");//1. 判斷用戶是否登錄$.get("user/findOne", {}, function (user) {if (user) {//用戶登錄了//添加功能$.get("route/addFavorite", {rid: rid}, function () {//代碼刷新頁面location.reload();});} else {//用戶沒有登錄alert("您尚未登錄，請登錄");location.href = "http://localhost/travel/login.html";}})} </script> </body> </html>寒冷到了極致時，太陽就要光臨。
總結(jié)
以上是生活随笔為你收集整理的JavaWeb黑马旅游网-学习笔记08【旅游线路详情】的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： JavaWeb黑马旅游网-学习笔记06【
- 下一篇： JavaWeb黑马旅游网-学习笔记09【