Contents
1 Introduction 1
1.1 Background and significance of topic selection 1
1.2 Development status 1
1.2.1 Current status of tourism abroad 1
1.2.2 Current status of domestic tourism 2
1.2.3 Development trend 3
1.3 Research main content 4
2 Key technologies 6
2.1 Java Language 7
2.2 Spring Framework Introduction 8
2.3 Spring Boot Framework Introduction 9
2.4 MyBatis Framework Introduction 9
2.5 Development Environment 10
3 System Analysis 11
3.1 System Feasibility Analysis 11
3.1.1 Technical Feasibility 11
3.1.2 Economic Feasibility 12
3.1.3 Society Feasibility12
3.2 Business process analysis14
3.3 Basic model of system UML15
3.3.1 Use case diagram15
3.3.2 Class diagram16
4 System design21
4.1 System function design21
4.2 System database design22
4.2.1 Conceptual structure design23
4.2. 2 Database table design 26
5 System implementation error! Bookmark not defined.
5.1 Login module 32
5.2 First interface 35
5.3 Travel route interface 36
5.4 User registration and query interface 37
5.5 Add various information interface 39
6 System test error! Bookmark not defined.
6.1 Tasks and objectives of testing 42
6.1.1 Tasks of testing 42
6.1.2 Importance and objectives of testing 42
6.2 Testing schemes 43
6.2.1 Module testing 44
6.2.2 Integration testing 44
6.2.3 Acceptance testing 45
6.2.4 Parallel Operation 46
6.3 System evaluation 47
Summary 48
References 49
Acknowledgments 50
4.1 System function design
User management: including user registration, login, personal information management, etc. Users can register an account on the website and log in to perform various operations, such as querying scenic spot information, planning trips, and booking products. Users can also manage their own personal information, including personal data, order records, browsing history, etc.
Product management: including product classification, product list, product details, etc. The website administrator can add, modify and delete product information in the background management system, including scenic spot tickets, tour groups, air tickets and hotels, etc. Users can learn about product information by browsing the product list, and make reservations and payments through the product detail page.
Order management: including order creation, query, modification, deletion, etc. Users can book products and generate orders through the website, and can query their own order records and modify or delete them. The administrator can review the order and confirm the payment, and can also perform operations such as order settlement and refund.
Payment settlement: including payment method, price settlement, invoice management, etc. Users can choose different payment methods to pay, including online payment, bank transfer, cash on delivery, etc. Administrators can manage the price system and settlement methods of the website, including product prices, promotional activities, and settlement cycles. Users and administrators can also manage their own invoice information and invoice records.
Comments and evaluations: including scenic spot evaluations, product evaluations, etc. Users can comment and comment on their travel experience, including scenic spot ratings, product ratings, text reviews, etc. Other users can decide their own travel plans based on ratings and reviews.
Data statistics: including user behavior analysis, product sales analysis, order statistics, etc. The website administrator can conduct data analysis and statistics through the background management system, so as to understand user needs, product sales, order process, etc. The administrator can optimize the website according to the statistical results [5].
The functional module diagram of the management system is shown in Figure 4-1:
Figure 4-1 Functional module diagram of the management system
<!DOCTYPE html>
<html
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
layout:decorate="~{base/layout}">
<div layout:fragment="content">
<!--slider section-->
<div class="slider_wrapper">
<div class="slider-pro" id="my-slider">
<div class="sp-slides">
<div class="sp-slide">
<h3 class="sp-layer sp-black sp-padding hide-small-screen" data-width="80%" data-position="topRight"
data-horizontal="8%" data-vertical="25%" data-show-transition="right" data-hide-transition="up"
data-show-delay="800" data-hide-delay="100">
<span class="title-aaa">银杏湖景区乐游系统</span>——占地十五平方公里！全省规模最大的生态主题游乐项目。银杏湖乐园分为游乐区、生态休闲区、水世界、商务区、高尔夫球场、酒店别墅区。 该乐园位于江宁谷里街道的银杏湖大道520号，以银杏湖为中心，依山傍水。,你还可以在这里分享你的游玩日记与生活动态,即时分享你的快乐.找攻略、订酒店、查交通全都有,给你提供一站式的旅游社区化服务.
<span class="read-more"><a href="javascript:void(0);">查看更多</a></span>
</h3>
</div>
<div class="sp-slide">
<h3 class="sp-layer sp-black sp-padding hide-small-screen" data-width="80%" data-position="topRight"
data-horizontal="8%" data-vertical="25%" data-show-transition="right" data-hide-transition="up"
data-show-delay="800" data-hide-delay="100">
<span class="title-aaa">银杏湖景区乐游系统</span>
——欢迎大家的到来
——欢迎大家的到来
<span class="read-more"><a href="javascript:void(0);">查看更多</a></span>
</h3>
</div>
</div>
</div>
</div>
<div class="main-page-container">
<div class="container">
<div class="row med_toppadder30">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="cy-title">
<h2>热门酒店</h2>
<div class="pull-right">
<div class="main-tabs">
<ul class="nav nav-tabs">
<li>
<a th:href="@{/reserve/reserveHotelListUI}">更多 <i
class="fa fa-angle-right"></i></a>
</li>
</ul>
</div>
</div>
</div>
<div class="main-cont">
<div class="tab-content">
<div class="tab-pane active" id="c01">
<div id="oc-news" class="owl-carousel owl-theme">
<div th:each="hotel:${top10Hotel}" class="item">
<div class="cy-news-post clearfix">
<div class="entry-image">
<a th:href="@{/reserve/hotelDetailsUI(id=${hotel.id})}"><img
class="image_fade"
th:src="@{'/images/'+ ${hotel.image} +'.jpg'}"
alt="Image"></a>
</div>
<div class="entry-title">
<h4><a th:href="@{/reserve/hotelDetailsUI(id=${hotel.id})}"
data-toggle="tooltip"
data-container="body"
th:title="${hotel.name}" th:text="${hotel.name}"></a>
</h4>
</div>
<div class="entry-content">
<p th:text="${hotel.describe}">
</p>
</div>
<ul class="entry-meta clearfix">
<li th:text="${#calendars.format(hotel.createDate,'yyyy-MM-dd')}"><i
class="fa fa-calendar"></i></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row med_bottompadder30">
<div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
<div class="cy-title">
<h2>热门景点</h2>
<div class="pull-right">
<div class="main-tabs">
<a th:href="@{/reserve/reserveAttractionsListUI}">更多 <i
class="fa fa-angle-right"></i></a>
</li>
</ul>
</div>
</div>
</div>
<div class="main-cont">
<div class="tab-content">
<div class="tab-pane active" id="cp01">
<div id="oc-kx" class="owl-carousel owl-theme">
<div th:each="attractions:${top10Attractions}" class="item">
<div class="cy-kx-post clearfix">
<a th:href="@{/reserve/attractionsDetailsUI(id=${attractions.id})}">
<div class="entry-image">
<img th:src="@{'/images/'+ ${attractions.image} +'.jpg'}"
alt="Image">
</div>
<div class="entry-content">
<p th:text="${attractions.name}"></p>
</div>
</a>
</div>
</div>
<!--<div class="item">-->
<!--<div class="cy-kx-post clearfix">-->
<!--<a href="javascript:void(0);">-->
<!--<div class="entry-image">-->
<!--<img class="image_fade" src="images/pic-kx04.jpg" alt="Image">-->
<!--</div>-->
<!--<div class="entry-content">-->
<!--<p>xxxxxxxxxxxx</p>-->
<!--</div>-->
<!--</a>-->
<!--</div>-->
<!--</div>-->
</div>
</div>
<!-- <div class="tab-pane" id="c02">...</div> -->
</div>
</div>
<div class="cy-title">
<h2>景区游玩攻略</h2>
<div class="pull-right">
<div class="main-tabs">
<ul class="nav nav-tabs">
<li>
<a th:href="@{/strategy/travelStrategyListUI}">更多 <i
class="fa fa-angle-right"></i></a>
</li>
</ul>
</div>
</div>
</div>
<ul class="main-cy-thesis">
<li th:each="strategy:${top10Strategy}"><a th:href="@{/strategy/travelStrategyDetailsUI(id=${strategy.id})}"
data-toggle="tooltip" data-container="body"
th:title="${strategy.title}" th:text="${strategy.title}">xxxxxxxxxxxx</a>
</li>
</ul>
<div class="cy-title">
<h2>热门路线</h2>
<div class="pull-right">
<div class="main-tabs">
<ul class="nav nav-tabs">
<li>
<a th:href="@{/route/travelRouteListUI}">更多 <i
class="fa fa-angle-right"></i></a>
</li>
</ul>
</div>
</div>
</div>
<ul class="main-cy-thesis">
<li th:each="route:${top10Route}"><a th:href="@{/route/travelRouteDetailsUI(id=${route.id})}"
data-toggle="tooltip" data-container="body"
th:title="${route.name}" th:text="${route.name}">xxxxxxxxxxxx</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
<div class="cy-title">
<h2>订阅信息</h2>
</div>
<div class="text-center med_toppadder5">
<img src="images/pic-wx-qrcode1.jpg" width="200px" alt="">
<p class="med_toppadder10">请关注微信号</p>
</div>
<div class="cy-title">
<h2>联系我们</h2>
</div>
<ul class="cy-contact">
<li><i class="fa fa-map-marker"></i> 地址：南京季磊旅游文化公司大楼</li>
<li><i class="fa fa-compass"></i> 邮编：434000</li>
<li><i class="fa fa-phone"></i> 电话：158XXXX8644</li>
<li><i class="fa fa-envelope"></i> 电子邮箱：9377XXXXX@qq.com</li>
</ul>
</div>
</div>
</div>
</div>
<!--main section end-->
<script src="js/jquery_min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/wow.min.js"></script>
<script src="plugins/slider-pro/js/jquery.sliderPro.min.js"></script>
<script src="plugins/owlcarousel/js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
<!--js code-->
<script type="text/javascript">
$(document).ready(function () {
$('#my-slider').sliderPro({
arrows: true,
waitForLayers: true,
autoplay: false,
fade: true,
buttons: false,
autoScaleLayers: false,
width: 1170,
height: 400
});
$('.image_fade').hover(function () {
$(this).filter(':not(:animated)').animate({
opacity: 0.8}, 400);
}, function () {
$(this).animate({
opacity: 1}, 400);
});
$("#oc-news").owlCarousel({
margin: 30,
nav: true,
loop: true,
// autoplay:true,
// autoplayTimeout:6000,
// autoplayHoverPause: true,
dots: false,
navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
responsive: {
0: {
items: 1},
480: {
items: 2},
768: {
items: 3},
992: {
items: 4}
}
});
$("#oc-kx").owlCarousel({
margin: 15,
nav: true,
loop: true,
// autoplay:true,
// autoplayTimeout:5000,
// autoplayHoverPause: true,
dots: false,
navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
responsive: {
0: {
items: 1},
480: {
items: 2},
768: {
items: 3},
992: {
items: 4}
}
});
setInterval(function () {
var buy = $('.sp-previous-arrow')[0];//给你的a标签加一个id :btnBuy
buy.click();
}, 5000)//后面的500是以毫秒为单位。
});
</script>
</div>
</html>
