Commit 889d162c authored by zhangjianguo's avatar zhangjianguo

1,完成(下次旅行计划)H5所有计划的编写,

2,完成生日H5的页面字段的绑定
parent 3e243539
...@@ -24,14 +24,14 @@ ...@@ -24,14 +24,14 @@
<div class="bg_9 animated fadeInUp"></div> <div class="bg_9 animated fadeInUp"></div>
<div class="Blessings"> <div class="Blessings">
<p class="animated fadeIn">王苒,您好!</p> <p class="p1 animated fadeIn">某某,您好!</p>
<p class="animated fadeIn">不知不觉,我们已相识 230 天</p> <p class="p2 animated fadeIn">不知不觉,我们已相识 0 天</p>
<p class="animated fadeIn">今天是您20岁生日</p> <p class="p3 animated fadeIn">今天是您0岁生日</p>
<p class="animated fadeIn">全球通蜀汉路门市携手印象之 旅,在此祝您:</p> <p class="p4 animated fadeIn">某门市携手印象之旅,在此祝您:</p>
<span class="animated fadeIn">生日快乐~</span> <span class="animated fadeIn">生日快乐~</span>
</div> </div>
<div class="exclusive animated fadeIn"> <div class="exclusive animated fadeIn">
<p>您的专属旅游顾问:罗超,17308037817</p> <p>您的专属旅游顾问:某某,xxxxxxxxx</p>
</div> </div>
</div> </div>
...@@ -51,6 +51,23 @@ ...@@ -51,6 +51,23 @@
async: false, async: false,
success: function(res) { success: function(res) {
let data =res.data!=null? res.data:{};
if(data.GuestName!=null){
$('.p1').text(data.GuestName + ',您好!')
}
if(data.Day!=null){
$('.p2').text('不知不觉,我们已相识 '+data.Day+' 天')
}
if(data.Old!=null){
$('.p3').text('今天是您'+data.Old+'岁生日')
}
if(data.CustomerName!=null){
$('.p4').text(data.CustomerName+'门市携手印象之旅,在此祝您:')
}
$('.exclusive').text('您的专属旅游顾问:'+data.EmName +','+data.EmMobile)
}, },
error: function(res) { error: function(res) {
......
...@@ -30,19 +30,69 @@ ...@@ -30,19 +30,69 @@
<div class="sun animated fadeInUp"></div> <div class="sun animated fadeInUp"></div>
<div class="b1"></div> <div class="b1"></div>
<div class="text_bg animated fadeInDown"></div> <div class="text_bg animated fadeInDown">
</div>
<div class="shanpo"></div>
<div class="c_l"></div> <div class="c_l"></div>
<div class="c_r"></div> <div class="c_r"></div>
<div class="text_bg2 animated fadeIn"></div> <div class="text_bg2 animated fadeIn">
<div class="textc">
<p>您好,还记得您在2月12日留下的”半年内想要去欧洲旅游”的计划吗?看看有没有你喜欢的旅程吧~</p>
<div class="xian"></div>
<div class="gwen">您的专属旅游顾问:罗超,17308037817</div>
</div>
</div>
<div class="wangx animated fadeIn"></div>
<div class="flower1 animated fadeIn"></div>
<div class="flower2 animated fadeIn"></div>
<div class="flower3 animated fadeIn"></div>
<div class="Arc"></div>
</div>
<!--<img src="./img/Travelplan/b5.png" alt="" style="width: 100%;height: 0.1rem">-->
<div class="bottom_box">
<div class="b_top">
<div class="t_l"></div>
<div class="t_c">热门精选</div>
<div class="t_r"></div>
</div>
<div class="cp">
<div class="cp_l">
<img src="http://t8.baidu.com/it/u=4269609316,2027584941&fm=79&app=86&f=JPEG?w=1500&h=1000" alt="" class="cp_img">
<p class="cp_tilte">欧洲XXX</p>
<p class="cp_cen">迪士尼/落地签/xxxx</p>
<div class="cp_btn">
查看详情
</div>
</div>
<div class="cp_r">
<img src="http://t8.baidu.com/it/u=4269609316,2027584941&fm=79&app=86&f=JPEG?w=1500&h=1000" alt="" class="cp_img">
<p class="cp_tilte">欧洲XXX</p>
<p class="cp_cen">迪士尼/落地签/xxxx</p>
<div class="cp_btn">
查看详情
</div>
</div>
</div>
<div class="More">
<div class="more_box">查看更多</div>
</div>
<div class="logo"></div>
</div> </div>
</body> </body>
<script src="../../js/moveJs/jquery.min.js"></script> <script src="../../js/moveJs/jquery.min.js"></script>
<script> <script>
$('.wangx').click(function () {
$('html,body').animate({scrollTop:$('.logo').offset().top}, 800)
})
</script> </script>
......
...@@ -18,7 +18,7 @@ p{ ...@@ -18,7 +18,7 @@ p{
height: 5rem; height: 5rem;
background-image: linear-gradient(#C1E5A7, #F2E5C5); background-image: linear-gradient(#C1E5A7, #F2E5C5);
position: relative; position: relative;
overflow: hidden; /*overflow: hidden;*/
} }
.yezi_l{ .yezi_l{
width: 0.84rem; width: 0.84rem;
...@@ -141,6 +141,7 @@ p{ ...@@ -141,6 +141,7 @@ p{
left: 0.795rem; left: 0.795rem;
top: 0.725rem; top: 0.725rem;
-webkit-animation-delay:1s; -webkit-animation-delay:1s;
} }
.text_bg2{ .text_bg2{
width: 2.5rem; width: 2.5rem;
...@@ -152,6 +153,9 @@ p{ ...@@ -152,6 +153,9 @@ p{
left: 0.63rem; left: 0.63rem;
top: 2.145rem; top: 2.145rem;
-webkit-animation-delay:1.8s; -webkit-animation-delay:1.8s;
display: flex;
flex-direction: column;
align-items: center;
} }
.sun{ .sun{
width: 0.44rem; width: 0.44rem;
...@@ -183,4 +187,188 @@ p{ ...@@ -183,4 +187,188 @@ p{
position: absolute; position: absolute;
right: -0.2rem; right: -0.2rem;
bottom: -0.25rem; bottom: -0.25rem;
}
.shanpo{
width: 100%;
height:1.54rem;
background-image: url('../img/Travelplan/shanpo.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 0rem;
bottom: -0.2rem;
}
.wangx{
width: 0.19rem;
height:0.19rem;
background-image: url('../img/Travelplan/wangdown.gif');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 1.78rem;
top: 3.93rem;
-webkit-animation-delay:2.1s;
}
.flower1{
width: 0.21rem;
height:0.18rem;
background-image: url('../img/Travelplan/flower1.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 2.34rem;
bottom: 0.95rem;
-webkit-animation-delay:2s;
}
.flower2{
width: 0.24rem;
height:0.18rem;
background-image: url('../img/Travelplan/flower2.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 1.63rem;
bottom: 0.45rem;
-webkit-animation-delay:2.3s;
}
.flower3{
width: 0.27rem;
height:0.245rem;
background-image: url('../img/Travelplan/flower3.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 2.34rem;
bottom: 0.1rem;
-webkit-animation-delay:2.6s;
}
.bottom_box{
width: 100%;
height: 4.32rem;
position: relative;
overflow: hidden;
background: #008B78;
}
.b_top{
width: 100%;height: 0.3rem;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
font-size: 0.18rem;
color: #FFFFFF;
margin-top: 0.2rem;
}
.t_l,.t_r{
width: 0.95rem;
height:0.1rem;
background-image: url('../img/Travelplan/b2.png');
background-size: 100% 100%;
background-repeat: no-repeat
}
.cp{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
margin-top: 0.2rem;
}
.cp_l,.cp_r {
width: 1.57rem;
height: 2.035rem;
background: white;
display: flex;
flex-direction: column;
}
.cp_img{
width: 1.57rem;
height: 1.175rem;
}
.cp_tilte{
font-size: 0.15rem;
color: #000000;
margin: 0.1rem 0 0 0.1rem;
}
.cp_cen{
font-size: 0.11rem;
color: #666666;
margin: 0.05rem 0 0 0.1rem;
}
.cp_btn{
width: 0.7rem;
height: 0.23rem;
border-radius: 0.115rem;
background: #FC8F00;
font-size: 0.12rem;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
margin:0.05rem 0 0 0.435rem
}
.More{
width: 100%;
height: 0.25rem;
display: flex;
align-items: center;
justify-content: center;
margin-top: 0.4rem;
}
.more_box{
width: 0.7rem;
height: 0.23rem;
border-radius: 0.115rem;
background: #13A08D;
font-size: 0.12rem;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
.logo{
width: 2.1rem;
height: 0.285rem;
background-image: url('../img/Travelplan/logo.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 0.84rem;
bottom: 0.155rem;
}
.Arc{
width: 100%;
height: 0.1rem;
background-image: url('../img/Travelplan/b5.png');
background-size: 100% 100%;
background-repeat: no-repeat;
position: absolute;
left: 0;
bottom: 0;
}
.textc{
width: 2rem;
height: 1.6rem;
margin-top: 0.16rem;
}
.textc p {
font-size: 0.16rem;
color: white;
line-height: 0.25rem;
}
.xian{
width: 2rem;height: 1px;
background: white;
margin-top: 0.1rem;
}
.gwen{
font-size: 0.10rem;
color: white;
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment