Skip to content

libai / fsActive

Go to a project
Commit 14a8b074 by libai
Options

ft活动上线

parent 99cae283
Inline Side-by-side
Showing with 208 additions and 5 deletions
activeFt/develop/css/index.css
......@@ -446,3 +446,61 @@
bottom: 0;
left: 0;
}
.layer-ok .layer-ok-p1 {
position: absolute;
color: #EAD0FF;
font-size: 0.4rem;
top: 4.8rem;
left: 2.5rem;
}
.layer-ok .layer-ok-p1 span {
color: #F83AFF;
}
.layer-ok .layer-ok-p2 {
position: absolute;
color: #EAD0FF;
font-size: 0.4rem;
top: 5.4rem;
left: 2.5rem;
}
.layer-ok .layer-ok-p2 span {
color: #F83AFF;
}
.layer-ok-btn1 {
width: 3.013rem;
height: 1.013rem;
background: url(../images/exc-btn1.png) no-repeat;
background-size: 100% 100%;
position: absolute;
top: 6.3rem;
left: 1.5rem;
}
.layer-ok-btn2 {
width: 3.013rem;
height: 1.013rem;
background: url(../images/exc-btn2.png) no-repeat;
background-size: 100% 100%;
position: absolute;
top: 6.3rem;
right: 1.5rem;
}
.layer-exc-ul {
width: 9rem;
height: 6.3rem;
position: relative;
top: 2rem;
left: 0.5rem;
}
.layer-exc-ul li {
height: 0.9rem;
line-height: 0.9rem;
}
.layer-exc-ul li > div {
width: 33.33%;
height: 0.9rem;
line-height: 0.9rem;
float: left;
text-align: center;
font-size: 0.3rem;
color: #FFFFFF;
}
activeFt/develop/css/index.less
......@@ -415,6 +415,7 @@
filter: grayscale(100%);
}
.layer-exc{
width: 9.986rem;
height: 9.04rem;
background: url(../images/layer-exc.png)no-repeat;
......@@ -448,4 +449,63 @@
bottom: 0;
left: 0;
}
.layer-ok-p1{
position: absolute;
color: #EAD0FF;
font-size: 0.4rem;
top: 4.8rem;
left: 2.5rem;
span{
color: #F83AFF;
}
}
.layer-ok-p2{
position: absolute;
color: #EAD0FF;
font-size: 0.4rem;
top: 5.4rem;
left: 2.5rem;
span{
color: #F83AFF;
}
}
}
.layer-ok-btn1{
width: 3.013rem;
height: 1.013rem;
background: url(../images/exc-btn1.png)no-repeat;
background-size: 100% 100%;
position: absolute;
top: 6.3rem;
left: 1.5rem;
}
.layer-ok-btn2{
width: 3.013rem;
height: 1.013rem;
background: url(../images/exc-btn2.png)no-repeat;
background-size: 100% 100%;
position: absolute;
top: 6.3rem;
right: 1.5rem;
}
.layer-exc-ul{
width: 9rem;
height: 6.3rem;
// background: pink;
position: relative;
top: 2rem;
left: 0.5rem;
li{
height: 0.9rem;
line-height: 0.9rem;
>div{
width: 33.33%;
height: 0.9rem;
line-height: 0.9rem;
float: left;
text-align: center;
font-size: 0.3rem;
color: #FFFFFF;
}
}
}
\ No newline at end of file
activeFt/develop/index.html
......@@ -30,14 +30,44 @@
</head>
<script src="lib/lottie-player.js"></script>
<body style="background: #210F2C;">
<div style="display: none;" class="layer-exc"></div>
<div style="display: none;" class="layer-exc">
<ul class="layer-exc-ul">
<!-- <li>
<div class="layer-exc-box1">獎品名稱預留</div>
<div class="layer-exc-box2">XXX個</div>
<div class="layer-exc-box3">6.15 19:30</div>
</li> -->
<!-- <li>
<div class="layer-exc-box1">獎品名稱預留</div>
<div class="layer-exc-box2">XXX個</div>
<div class="layer-exc-box3">6.15 19:30</div>
</li>
<li>
<div class="layer-exc-box1">獎品名稱預留</div>
<div class="layer-exc-box2">XXX個</div>
<div class="layer-exc-box3">6.15 19:30</div>
</li>
<li>
<div class="layer-exc-box1">獎品名稱預留</div>
<div class="layer-exc-box2">XXX個</div>
<div class="layer-exc-box3">6.15 19:30</div>
</li>
<li>
<div class="layer-exc-box1">獎品名稱預留</div>
<div class="layer-exc-box2">XXX個</div>
<div class="layer-exc-box3">6.15 19:30</div>
</li> -->
</ul>
</div>
<div style="display: none;" class="layer-ok">
<div class="layer-ok-gift">
<img src="images/g1.png" alt="">
<p class="layer-ok-name">獎品名稱預留</p>
</div>
<p class=""></p>
<p class=""></p>
<p class="layer-ok-p1">兌換所需應援卡：<span>153216</span></p>
<p class="layer-ok-p2">當前持有應援卡：<span>132546</span></p>
<div class="layer-ok-btn1"></div>
<div class="layer-ok-btn2"></div>
</div>
<div class="m-bg">
<img class="ref" src="images/ref.png" alt="">
......@@ -158,8 +188,31 @@ $(function(){
$(".exc-content").fadeIn(250)
}
})
var excName=['','美眉激勵卡','vip*7天','love','豪華座駕*30天']
var excRich=['','100','200','1000','9999']
$(".exc-btn").on("click",function(){
var _self=$(this);
$(".layer-ok-gift img").attr("images/g"+_self.attr("data-type")+".png")
$(".layer-ok-name").text(excName[_self.attr("data-type")])
$(".layer-ok-p1 span").text(excRich[_self.attr("data-type")])
$(".layer-ok-p2 span").text(sessionStorage.myCard)
layer.open({
type: 1,
title: false,
shadeClose: true,
skin: "yourclass5",
area: ["9.866rem", "8.533rem"],
content: $(".layer-ok"),
end: function () {
$(".layui-layer-shade").hide()
}
})
$(".layer-ok-btn1").unbind("click").on("click",function(){
exc(_self.attr("data-type"))
})
})
$(".layer-ok-btn2").on("click",function(){
layer.closeAll()
})
list()
var numTitle=['','第一關: 新秀出道','第二關: 嶄露頭角','第三關: 光芒萬丈']
......@@ -207,7 +260,13 @@ $(function(){
},
success:function(data){
console.log('应援卡兑换奖品',data)
if(data.code!=1){
layer.msg(data.msg)
return
}
layer.closeAll()
task()
layer.msg("兌換成功")
}
})
}
......@@ -331,11 +390,36 @@ $(function(){
}
})
}
$(".record-btn").on("click",function(){
record()
layer.open({
type: 1,
title: false,
shadeClose: true,
skin: "yourclass5",
area: ["9.986rem", "9.04rem"],
content: $(".layer-exc"),
end: function () {
$(".layui-layer-shade").hide()
}
})
})
function record(){
$.ajax({
url:$ip+'/actRaisingBeautifulGril/queryExchangeRecord.html',
success:function(data){
console.log('應援卡兌換記錄',data)
var html=[];
for(var i=0;i<data.result.length;i++){
var list=data.result[i]
html+='<li>';
html+='<div class="layer-exc-box1">'+list.prizeName+'</div>';
html+='<div class="layer-exc-box2">'+list.priceSupportCardNum+'個</div>';
html+='<div class="layer-exc-box3">'+timeGet(list.exchangeTimeStamp)[1]+'.'+timeGet(list.exchangeTimeStamp)[2]+' '+timeGet(list.exchangeTimeStamp)[3]+':'+timeGet(list.exchangeTimeStamp)[4]+'</div>';
html+='</li>';
}
$(".layer-exc-ul").html(html)
}
})
}
......
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 sign in to comment