|
|
|
|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<title>套餐详情</title>
|
|
|
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
|
|
|
<script type="text/javascript" src="__TMPL__/static/js/base.js"></script>
|
|
|
<link rel="stylesheet" type="text/css" href="__TMPL__/static/assets/css/weui.min.css" />
|
|
|
<link rel="stylesheet" type="text/css" href="__TMPL__/static/assets/css/swiper-3.4.2.min.css" />
|
|
|
<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_773803_3se1rq7vwl5.css" />
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/font/iconfont.js">
|
|
|
</script>
|
|
|
<link rel="stylesheet" href="__TMPL__/static/css/packageDetails.css" />
|
|
|
<script language="JavaScript" src="__TMPL__/static/cjjs/mydate.js"></script>
|
|
|
<style type="text/css">
|
|
|
.swiper-container {
|
|
|
height: 3.6rem;
|
|
|
}
|
|
|
|
|
|
.swiper-container-horizontal>.swiper-pagination-bullets,
|
|
|
.swiper-pagination-custom,
|
|
|
.swiper-pagination-fraction {
|
|
|
left: 44%;
|
|
|
}
|
|
|
|
|
|
.niuniu {
|
|
|
display: none;
|
|
|
height: 4.4rem;
|
|
|
}
|
|
|
|
|
|
.mold_out {
|
|
|
display: none;
|
|
|
}
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<!--轮播图-->
|
|
|
<div class='pic'>
|
|
|
<div class="swiper-container ">
|
|
|
<div class="swiper-wrapper">
|
|
|
<volist name="info.banner" id="vo" key="k">
|
|
|
<div class="swiper-slide">
|
|
|
<img src="{$vo.banner}" alt="" />
|
|
|
</div>
|
|
|
</volist>
|
|
|
</div>
|
|
|
<div class="swiper-pagination">
|
|
|
<img src="__TMPL__/static/images/banner.png" alt="" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!--===============最新活动==========-->
|
|
|
<div class="piclist">
|
|
|
<div class="newxia">
|
|
|
<div class="left">
|
|
|
<div class="qing">
|
|
|
{$info.name}
|
|
|
</div>
|
|
|
<div class="nianout">
|
|
|
<div class="nian">
|
|
|
<div class="pelpe pl">
|
|
|
|
|
|
<span>¥{$info.display_price}起/人</span>
|
|
|
</div>
|
|
|
<div class="count pelpe" id="change">
|
|
|
<i class='iconfont icon-calendar shian'></i>
|
|
|
<span class="showcang">请选择出发批次</span>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
<!--灰色间隔-->
|
|
|
<div class="hui"></div>
|
|
|
<!--预定信息-->
|
|
|
<div class="piclist1">
|
|
|
<div class="newxia1">
|
|
|
<li class="yu">
|
|
|
预定信息
|
|
|
</li>
|
|
|
</div>
|
|
|
<div class="dis">
|
|
|
<span class="dingjin">
|
|
|
定金: 600/总价1190
|
|
|
</span>
|
|
|
<span class="yishou">
|
|
|
已售,1剩余29
|
|
|
</span>
|
|
|
</div>
|
|
|
<div class="newxia2 " id="newxia2">
|
|
|
<span class="tao active1" id="tao">
|
|
|
套餐详情
|
|
|
</span>
|
|
|
<span class="can" id="can">
|
|
|
套餐参数
|
|
|
</span>
|
|
|
|
|
|
<span class="yu1" id="yu1">
|
|
|
预定须知
|
|
|
</span>
|
|
|
|
|
|
<span class="yong" id="yong">
|
|
|
用户评价
|
|
|
</span>
|
|
|
</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="xianshi_two">
|
|
|
<img src="../images/banner.png" alt="" />
|
|
|
|
|
|
</div>
|
|
|
<!--选项卡-->
|
|
|
<volist name="info.comment_list" id="vo">
|
|
|
<div class="niuniu">
|
|
|
<div class="xianshi1">
|
|
|
<div>
|
|
|
<span class="tu">
|
|
|
<img src="{$vo.avatar}" alt="" />
|
|
|
</span>
|
|
|
<span class="niu">{$vo.user_nickname}</span>
|
|
|
<div class="xing">
|
|
|
{$vo.star}
|
|
|
</div>
|
|
|
</div>
|
|
|
<span class="nianxian">2018.08.07</span>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span class="pan">这次攀岩超刺激,特别安全!</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</volist>
|
|
|
|
|
|
<!--====底部=====-->
|
|
|
<a href="orders_submitted.html">
|
|
|
<footer class="foot ok">
|
|
|
立即预定
|
|
|
</footer>
|
|
|
</a>
|
|
|
<div class='mold_out'>
|
|
|
<div class='mold_center'>
|
|
|
<div class="scroll_out">
|
|
|
<div class="scroll">
|
|
|
<volist name="info.schedule" id="vo">
|
|
|
<div class="money">
|
|
|
<div class="year_change">
|
|
|
<img src="__TMPL__/static/images/circle.png"/>
|
|
|
<span>{$vo.start_time} 至 {$vo.end_time}</span>
|
|
|
</div>
|
|
|
<div class="price">¥{$vo.price}</div>
|
|
|
</div>
|
|
|
</volist>
|
|
|
</div>
|
|
|
|
|
|
<button class="bottom_button" value="">确定</button>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/jquery-2.1.0.js"></script>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/swiper-3.4.2.min.js"></script>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/weui.js"></script>
|
|
|
<script type="text/javascript" src="__TMPL__/static/index.js"></script>
|
|
|
<script>
|
|
|
var xianshi_two = $('.xianshi_two');
|
|
|
var yu1 = $('.yu1');
|
|
|
var can = $('.can');
|
|
|
var xianshi = $('.xianshi');
|
|
|
var niuniu = $('.niuniu');
|
|
|
var yong = $('.yong');
|
|
|
var tao = $('.tao');
|
|
|
var xianshi = $('.xianshi2');
|
|
|
tao.click(function() {
|
|
|
xianshi_two.css('display', 'block');
|
|
|
$("#tao").attr("class", "tao active1");
|
|
|
$("#can").attr("class", "can");
|
|
|
$("#yu1").attr("class", "yu1");
|
|
|
$("#yong").attr("class", "yong");
|
|
|
niuniu.css('display', 'none');
|
|
|
})
|
|
|
can.click(function() {
|
|
|
// xianshi.css('display', 'block');
|
|
|
xianshi_two.css('display', 'block');
|
|
|
niuniu.css('display', 'none');
|
|
|
// xianshi2.css('display', 'none');
|
|
|
$("#tao").attr("class", "tao");
|
|
|
$("#can").attr("class", "can active1");
|
|
|
$("#yu1").attr("class", "yu1");
|
|
|
$("#yong").attr("class", "yong");
|
|
|
// xianshi2.css('display', 'none');
|
|
|
})
|
|
|
yu1.click(function() {
|
|
|
// xianshi.css('display', 'none');
|
|
|
xianshi_two.css('display', 'block');
|
|
|
niuniu.css('display', 'none');
|
|
|
$("#tao").attr("class", "tao");
|
|
|
$("#yu1").attr("class", "yu1 active1");
|
|
|
$("#can").attr("class", "can");
|
|
|
$("#yong").attr("class", "yong");
|
|
|
// xianshi2.css('display', 'none');
|
|
|
})
|
|
|
yong.click(function() {
|
|
|
// xianshi.css('display', 'none');
|
|
|
niuniu.css('display', 'block');
|
|
|
$("#tao").attr("class", "tao");
|
|
|
$("#can").attr("class", "can");
|
|
|
$("#yong").attr("class", "yong active1");
|
|
|
$("#yu1").attr("class", "yu1");
|
|
|
// xianshi2.css('display', 'none');
|
|
|
|
|
|
xianshi_two.css('display', 'none');
|
|
|
})
|
|
|
</script>
|
|
|
</body>
|
|
|
|
|
|
</html>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/jquery-2.1.0.js"></script>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/swiper-3.4.2.min.js"></script>
|
|
|
<script type="text/javascript" src="__TMPL__/static/assets/js/weui.js"></script>
|
|
|
<!--<script type="text/javascript" src="index.js"></script>-->
|
|
|
<script>
|
|
|
var mySwiper = new Swiper('.swiper-container', {
|
|
|
pagination: '.swiper-pagination',
|
|
|
autoplay: 1500, //可选选项,自动滑动
|
|
|
loop: true
|
|
|
})
|
|
|
$('.money img').click(function(event) {
|
|
|
$(this).attr("src", "/themes/simpleboot3/static/images/circle1.png");
|
|
|
$(this).parents('.money').siblings().find('img').attr("src", "/themes/simpleboot3/static/images/circle.png");
|
|
|
});
|
|
|
//点击确定弹框隐藏
|
|
|
$('.count').click(function() {
|
|
|
if($('.mold_out').css('display') == 'block') {
|
|
|
$('.mold_out').css('display', 'none');
|
|
|
} else {
|
|
|
$('.mold_out').css('display', 'block');
|
|
|
}
|
|
|
|
|
|
})
|
|
|
//点击页面弹框隐藏
|
|
|
$('body').click(function() {
|
|
|
$('.mold_out').css('display', 'none');
|
|
|
})
|
|
|
$('#change').click(function(event) {
|
|
|
event.stopPropagation();
|
|
|
})
|
|
|
var index = 0;
|
|
|
var num = 0;
|
|
|
$('.bottom_button').click(function() {
|
|
|
var inputLength = $('.mold_center').find('i').length;
|
|
|
for(var i = 0; i < inputLength; i++) {
|
|
|
if($('.mold_center').find('i').eq(i).attr("class")=="iconfont icon-yuandianxiao") {
|
|
|
num = num + 1;
|
|
|
index = i;
|
|
|
}
|
|
|
}
|
|
|
if(num == 0) {
|
|
|
$('.mold_out').css('display', 'none');
|
|
|
} else {
|
|
|
$('.showcang').html($('.mold_center').find('span').eq(index).html());
|
|
|
$('.mold_out').css('display', 'none');
|
|
|
}
|
|
|
|
|
|
})
|
|
|
$('.mold_out').click(function() {
|
|
|
event.stopPropagation();
|
|
|
|
|
|
})
|
|
|
change
|
|
|
</script> |
|
|
\ No newline at end of file |
...
|
...
|
|