feat:初始化项目
No files matched your search
@@ -0,0 +1,45 @@
|
||||
{
|
||||
"ftp": {
|
||||
"host": "xx.xx.xx.xx",
|
||||
"port": "8021",
|
||||
"user": "tmt",
|
||||
"pass": "password",
|
||||
"remotePath": "remotePath",
|
||||
"includeHtml": true
|
||||
//ftp 上传是否包含 html
|
||||
},
|
||||
"sftp": {
|
||||
"host": "xx.xx.xx.xx",
|
||||
"port": "xx",
|
||||
"user": "tmt",
|
||||
"password": "password",
|
||||
"remotePath": "",
|
||||
"includeHtml": true
|
||||
},
|
||||
"livereload": {
|
||||
// /api 代理到的 url
|
||||
"proxyTarget": "http://apibeta.qxjiaoyou.com",
|
||||
//开启自动刷新
|
||||
"available": true,
|
||||
"port": 8080,
|
||||
"startPath": "index.html"
|
||||
},
|
||||
//路径相对于 tasks/plugins 目录
|
||||
"plugins": {
|
||||
"build_devAfter": [],
|
||||
"build_distAfter": [],
|
||||
"ftpAfter": [
|
||||
"ftp"
|
||||
]
|
||||
},
|
||||
"lazyDir": [
|
||||
"../slice"
|
||||
],
|
||||
//gulp-lazyImageCSS 寻找目录(https://github.com/weixin/gulp-lazyimagecss)
|
||||
|
||||
"supportWebp": false,
|
||||
"supportREM": false,
|
||||
"supportChanged": false,
|
||||
"reversion": true,
|
||||
"SVGGracefulDegradation": true
|
||||
}
|
||||
@@ -0,0 +1,278 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<title>初夏物语</title>
|
||||
|
||||
<%- include('../html_tpl/style.html') %>
|
||||
<link rel="stylesheet" href="css/carnival.css">
|
||||
|
||||
<%- include('../html_tpl/headScript.html') %>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="max">
|
||||
<div class="topNav topNav1">
|
||||
<div class="feedback"><img src="./img/carnival/feedback.png" alt=""></div>
|
||||
<ul>
|
||||
<li class="tab active">甜蜜夏日</li>
|
||||
<li class="tab">心动一夏</li>
|
||||
</ul>
|
||||
<div class="help"><img src="./img/carnival/rule-btn.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<div class="topNav topNav2">
|
||||
<div class="help"><img src="./img/carnival/rule-btn.png" alt=""></div>
|
||||
<ul>
|
||||
<li class="tab active">甜蜜夏日</li>
|
||||
<li class="tab">心动一夏</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="scrollMask">
|
||||
<div class="container"></div>
|
||||
<script type="text/html" id="scrollTmp">
|
||||
{{each scrollMaskList}}
|
||||
{{if scrollMaskList.length === 1}}
|
||||
<li></li>
|
||||
{{else}}
|
||||
<li>
|
||||
<span>{{$value.nick}}</span>在{{$value.table}}获得<span>{{$value.prizeName}}×{{$value.num}}</span>
|
||||
</li>
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<div class="rank-btn"><img src="./img/carnival/rank-btn.png" alt=""></div>
|
||||
<div class="record-btn"><img src="./img/carnival/record-btn.png" alt=""></div>
|
||||
|
||||
<div class="canvas">
|
||||
<div class="canvas-container">
|
||||
<div class="turntable">
|
||||
<div class="container1 first"></div>
|
||||
<canvas id="table" width="428" height="428"></canvas>
|
||||
<canvas id="table2" width="428" height="428"></canvas>
|
||||
<div class="pointer">
|
||||
<img src="./img/carnival/point.png" alt="">
|
||||
</div>
|
||||
<button class="btn">
|
||||
<img src="./img/carnival/draw-btn.png" alt="">
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info">
|
||||
<span>我的门票: <small class="ticketNum">0</small>张</span>
|
||||
<span><a href="./index.html"><img src="./img/carnival/gather-btn.png" alt=""></a></span>
|
||||
</div>
|
||||
|
||||
<div class="turnNum">
|
||||
<li class="active ball">
|
||||
<p class="num">1次</p>
|
||||
<p class="ticket">-</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="num">10次</p>
|
||||
<p class="ticket">-</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="num">100次</p>
|
||||
<p class="ticket">-</p>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<div class="experience">
|
||||
<div class="giftBox hide">
|
||||
<img src="" alt="">
|
||||
<span class="crit">暴击×5</span>
|
||||
<span class="times"></span>
|
||||
</div>
|
||||
<div class="exp-container exp-container1">
|
||||
<div class="strip exp-1"></div>
|
||||
</div>
|
||||
<div class="exp-num">
|
||||
<span class="num">0</span>
|
||||
<span>/</span>
|
||||
<span class="maxNum">0</span>
|
||||
</div>
|
||||
<div class="tips">
|
||||
<span>暴走值</span><span><img src="./img/carnival/rule-btn.png" alt=""></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="status-mask">
|
||||
<div class="title"></div>
|
||||
<div class="tips"></div>
|
||||
<div class="btn"></div>
|
||||
</div>
|
||||
|
||||
<div class="gather-mask">
|
||||
<div class="title">本轮获得</div>
|
||||
<div class="tips">· 可前往个人背包查看 ·</div>
|
||||
<ul class="gift-list"></ul>
|
||||
<script type="text/html" id="gatherListTmp">
|
||||
{{each gatherList}}
|
||||
<li>
|
||||
<p><img src="{{$value.prizeImgUrl}}" alt=""></p>
|
||||
<p>×{{$value.prizeNum}}</p>
|
||||
</li>
|
||||
{{/each}}
|
||||
</script>
|
||||
<div class="btn">知道了</div>
|
||||
</div>
|
||||
|
||||
<div class="rule-mask">
|
||||
<div class="nav">
|
||||
<div class="back"><img src="./img/carnival/back-btn.png" alt=""></div>
|
||||
<div class="title">活动规则</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<p><img src="./img/carnival/rule-text.png" alt=""></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rank-mask">
|
||||
<div class="nav">
|
||||
<div class="back"><img src="./img/carnival/back-btn.png" alt=""></div>
|
||||
<div class="title">排行榜</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="tab">
|
||||
<li class="active">捧场王</li>
|
||||
<li>万人迷</li>
|
||||
</div>
|
||||
<div class="tips">
|
||||
<p></p>
|
||||
</div>
|
||||
<div class="rank-yesterday-box">
|
||||
<div class="rank-title">- 昨日最佳 -</div>
|
||||
<div class="rank-box">
|
||||
<div class="rank-item rank-item1">
|
||||
<div class="rank-ava">
|
||||
<img src="" alt="" class="img-item">
|
||||
</div>
|
||||
<div class="rank-nick ddd"></div>
|
||||
<div class="rank-desc">奖励门票200张</div>
|
||||
</div>
|
||||
<div class="rank-item rank-item0">
|
||||
<div class="rank-ava">
|
||||
<img src="" alt="" class="img-item">
|
||||
</div>
|
||||
<div class="rank-nick ddd"></div>
|
||||
<div class="rank-desc">奖励门票300张</div>
|
||||
</div>
|
||||
<div class="rank-item rank-item2">
|
||||
<div class="rank-ava">
|
||||
<img src="" alt="" class="img-item">
|
||||
</div>
|
||||
<div class="rank-nick ddd"></div>
|
||||
<div class="rank-desc">奖励门票100张</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="remark">注:门票每日00:05分自动发放,请注意查收!</div>
|
||||
<div class="rank-title rank-title-today">- 今日排行 -</div>
|
||||
</div>
|
||||
<ul class="rank-container"></ul>
|
||||
<script type="text/html" id="rankListTmp">
|
||||
{{each rankList}}
|
||||
<li>
|
||||
{{if $index === 0}}
|
||||
<p><img src="./img/carnival/rank-1.png" alt=""></p>
|
||||
{{else if $index === 1}}
|
||||
<p><img src="./img/carnival/rank-2.png" alt=""></p>
|
||||
{{else if $index === 2}}
|
||||
<p><img src="./img/carnival/rank-3.png" alt=""></p>
|
||||
{{else}}
|
||||
<p>{{$value.rank}}</p>
|
||||
{{/if}}
|
||||
<p class="avatar" data-uid="{{$value.uid}}"><img src="{{$value.avatar}}" alt=""></p>
|
||||
<p class="info">
|
||||
<span>{{$value.nick}}</span>
|
||||
<span>ID:{{$value.erbanNo}}</span>
|
||||
</p>
|
||||
<p class="score">
|
||||
{{if $value.rank === 1 || !$value.rank}}
|
||||
<span class="align-center">No.1</span>
|
||||
{{else}}
|
||||
<span>
|
||||
<small>{{$value.distance}}</small>
|
||||
<small>距上名</small>
|
||||
</span>
|
||||
{{/if}}
|
||||
</p>
|
||||
</li>
|
||||
{{/each}}
|
||||
</script>
|
||||
</div>
|
||||
<div class="mine">
|
||||
<p class="rank-num"></p>
|
||||
<p class="avatar"><img src="" alt=""></p>
|
||||
<p class="info">
|
||||
<span class="nick"></span>
|
||||
<span class="score"></span>
|
||||
</p>
|
||||
<p class="rank-info">
|
||||
<span class="num"></span>
|
||||
<span class="distance"></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="record-mask">
|
||||
<div class="nav">
|
||||
<div class="back"><img src="./img/carnival/back-btn.png" alt=""></div>
|
||||
<div class="title">抽奖记录</div>
|
||||
</div>
|
||||
<div class="tab">
|
||||
<li class="active">
|
||||
<p>时间</p>
|
||||
<p></p>
|
||||
</li>
|
||||
<li>
|
||||
<p>价值</p>
|
||||
<p></p>
|
||||
</li>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="record-container"></div>
|
||||
<script type="text/html" id="recordTmp">
|
||||
{{each recordList}}
|
||||
<li>
|
||||
<p><img src="{{$value.prizeImgUrl}}" alt=""></p>
|
||||
<p>{{$value.prizeName}}×{{$value.prizeNum}}</p>
|
||||
<p>
|
||||
{{if worth}}
|
||||
<span class="num">{{$value.platformValue}}金币</span>
|
||||
{{else}}
|
||||
<span>
|
||||
<small>{{$value.hms}}</small>
|
||||
<small>{{$value.ymd}}</small>
|
||||
</span>
|
||||
{{/if}}
|
||||
</p>
|
||||
</li>
|
||||
{{/each}}
|
||||
</script>
|
||||
</div>
|
||||
<div class="loading">加载中...</div>
|
||||
<div class="tips">展示您最近300次中奖纪录</div>
|
||||
</div>
|
||||
|
||||
<div class="shade"></div>
|
||||
|
||||
<div class="exp-toast">暴走状态随机礼物5倍获得概率。1转盘次数=1暴走值,暴走值每小时清零</div>
|
||||
<div class="toast"></div>
|
||||
</div>
|
||||
<!-- <%- include('../html_tpl/downloadMask.html') %> -->
|
||||
</body>
|
||||
<%- include('../html_tpl/script.html') %>
|
||||
<script src="../../common/js/jQueryRotate.js"></script>
|
||||
<script src="js/carnival.js"></script>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,507 @@
|
||||
@function px2rem($px, $rem:67) {
|
||||
@return $px / $rem+rem;
|
||||
}
|
||||
|
||||
@import '../../../common/css/flex.scss';
|
||||
|
||||
.mask {
|
||||
z-index: 120;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
height: 60px;
|
||||
align-items: center;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
justify-content: space-between;
|
||||
padding: 0 8px;
|
||||
box-sizing: border-box;
|
||||
display: none;
|
||||
.logo {
|
||||
width: 40px;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.slogan {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
#download {
|
||||
border: 1px solid #fff;
|
||||
color: #fff;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
border-radius: 15px;
|
||||
line-height: 30px;
|
||||
a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
*{
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
}
|
||||
body{
|
||||
font-family:PingFang SC;
|
||||
background: #8CCFFA;
|
||||
z-index:-1;
|
||||
.max {
|
||||
max-width: px2rem(670);
|
||||
margin: 0 auto;
|
||||
.title-one {
|
||||
width: 100%;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.rule-btn {
|
||||
width: px2rem(116);
|
||||
height: px2rem(62);
|
||||
position: absolute;
|
||||
left: px2rem(0);
|
||||
top: px2rem(20);
|
||||
img {
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
.cloth-box {
|
||||
width:100%;
|
||||
padding-bottom:2.4rem;
|
||||
margin:-2.2rem auto 0;
|
||||
li {
|
||||
width: px2rem(640);
|
||||
height: px2rem(420);
|
||||
position:relative;
|
||||
margin:px2rem(10) auto 0;
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
background:url('../img/index/li-card.png') no-repeat 0 0 / 100% 100%;
|
||||
.h-title{
|
||||
position:absolute;
|
||||
margin: px2rem(32) auto 0;
|
||||
letter-spacing:.053333rem;
|
||||
font-size: px2rem(28);
|
||||
font-weight: bold;
|
||||
color: #58A1F5;
|
||||
line-height: px2rem(50);
|
||||
}
|
||||
.gift-img{
|
||||
width:px2rem(156);
|
||||
height: px2rem(156);
|
||||
position:absolute;
|
||||
box-sizing: border-box;
|
||||
left: px2rem(80);
|
||||
top: px2rem(115);
|
||||
@include flex;
|
||||
@include flex-align-center;
|
||||
@include flex-justify-center;
|
||||
img{
|
||||
box-sizing: border-box;
|
||||
padding: px2rem(10);
|
||||
width:100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
}
|
||||
.gift-text{
|
||||
position:absolute;
|
||||
left: px2rem(302);
|
||||
top: px2rem(105);
|
||||
p:first-child{
|
||||
font-size:px2rem(34);
|
||||
font-weight:bold;
|
||||
color: #16A4FF;
|
||||
letter-spacing:.026667rem;
|
||||
}
|
||||
p:nth-child(2){
|
||||
font-size:px2rem(28);
|
||||
font-weight:bold;
|
||||
color:#FF8F4C;
|
||||
}
|
||||
p:nth-child(3){
|
||||
font-size:px2rem(26);
|
||||
font-weight:500;
|
||||
text-decoration:line-through;
|
||||
color: #9C9C9C;
|
||||
line-height:px2rem(47);
|
||||
opacity:0.8;
|
||||
}
|
||||
p:last-child{
|
||||
font-size:px2rem(26);
|
||||
font-weight: 500;
|
||||
color: #9C9C9C;
|
||||
opacity:0.8;
|
||||
line-height: px2rem(47);
|
||||
}
|
||||
}
|
||||
.buy-btn{
|
||||
width: px2rem(300);
|
||||
height: px2rem(81);
|
||||
position:absolute;
|
||||
bottom: px2rem(45);
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
background: url('../img/index/buy.png') no-repeat 0 0 / 100% 100%;
|
||||
&.gray {
|
||||
background: url('../img/index/buy-gray.png') no-repeat 0 0 / 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.buy-mask {
|
||||
width: px2rem(616);
|
||||
height: px2rem(596);
|
||||
// border-radius:.213333rem;
|
||||
// background-color: #FFFFFF;
|
||||
position: fixed;
|
||||
left:50%;
|
||||
top:50%;
|
||||
transform:translate(-50%,-50%);
|
||||
background: url('../img/index/buy-bg.png') no-repeat 0 0 / 100% 100%;
|
||||
z-index: 1001;
|
||||
display: none;
|
||||
.b-box{
|
||||
padding: 0 px2rem(25);
|
||||
margin-top: px2rem(63);
|
||||
.b-title{
|
||||
color:#58A1F5;
|
||||
line-height: px2rem(52);
|
||||
text-align:center;
|
||||
font-size: px2rem(35);
|
||||
font-weight:bold;
|
||||
letter-spacing:.013333rem;
|
||||
.giftName{
|
||||
font-weight:bold;
|
||||
}
|
||||
}
|
||||
.b-number{
|
||||
padding:0 .906667rem;
|
||||
margin-top: px2rem(80);
|
||||
@include flex();
|
||||
.input-box{
|
||||
@include flex();
|
||||
@include flex-align-center;
|
||||
height:.64rem;
|
||||
margin-top:-0.066667rem;
|
||||
.remove-btn{
|
||||
width: px2rem(56);
|
||||
height: px2rem(56);
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
@include flex-align-center;
|
||||
border-radius: px2rem(24) 0 0 px2rem(24);
|
||||
background:rgba($color: #D4F4FF, $alpha: 0.6);
|
||||
.remove-icon{
|
||||
opacity: .6;
|
||||
display:block;
|
||||
width: px2rem(20);
|
||||
height: px2rem(4);
|
||||
background: url('../img/index/remove-icon.png') no-repeat 0 0 / 100% 100%;
|
||||
background-size:100% 100%;
|
||||
}
|
||||
}
|
||||
.b-input{
|
||||
width: px2rem(102);
|
||||
height: px2rem(56);
|
||||
background:#D4F4FF;
|
||||
text-align:center;
|
||||
font-size: px2rem(30);
|
||||
font-weight:500;
|
||||
color: #8FA4B8;
|
||||
margin:0 .106667rem;
|
||||
border:0;
|
||||
outline:none;
|
||||
}
|
||||
.add-btn{
|
||||
width: px2rem(56);
|
||||
height: px2rem(56);
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
@include flex-align-center;
|
||||
border-radius: 0 px2rem(24) px2rem(24) 0;
|
||||
background:rgba($color: #D4F4FF, $alpha: 0.6);
|
||||
.add-icon{
|
||||
display:block;
|
||||
width: px2rem(20);
|
||||
height: px2rem(20);
|
||||
background: url('../img/index/add-icon.png') no-repeat;
|
||||
background-size:100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.b-text{
|
||||
white-space:nowrap;
|
||||
font-size: px2rem(34);
|
||||
font-weight:500;
|
||||
color:rgba($color: #909090, $alpha: 1.0);
|
||||
line-height:.48rem;
|
||||
margin-bottom: px2rem(47);
|
||||
span:first-child{
|
||||
margin-right:.4rem;
|
||||
}
|
||||
}
|
||||
.b-day{
|
||||
padding:0 .906667rem;
|
||||
span:nth-child(2),span:last-child{
|
||||
color:#16A4FF;
|
||||
letter-spacing:.013333rem;
|
||||
}
|
||||
}
|
||||
.b-price{
|
||||
padding:0 .906667rem;
|
||||
span:nth-child(2),span:last-child{
|
||||
color: #FFA530;
|
||||
letter-spacing:.013333rem;
|
||||
}
|
||||
|
||||
}
|
||||
.b-btns{
|
||||
@include flex();
|
||||
@include flex-justify-around;
|
||||
margin-top: px2rem(55);
|
||||
.close-btn{
|
||||
width: px2rem(261);
|
||||
height: px2rem(107);
|
||||
background:url('../img/index/btn-cancel.png') no-repeat 0 0 / 100% 100%;
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
@include flex-align-center;
|
||||
}
|
||||
.confirm-btn{
|
||||
width: px2rem(261);
|
||||
height: px2rem(107);
|
||||
background: url('../img/index/btn-confirm.png') no-repeat 0 0 / 100% 100%;
|
||||
@include flex();
|
||||
@include flex-justify-center;
|
||||
@include flex-align-center;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rule-mask {
|
||||
width: px2rem(616);
|
||||
height: px2rem(596);
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%,-50%);
|
||||
z-index: 1001;
|
||||
// background-color:#FFFFFF;
|
||||
background: url('../img/index/buy-bg.png') no-repeat 0 0 / 100% 100%;
|
||||
border-radius:.213333rem;
|
||||
// overflow: hidden;
|
||||
display: none;
|
||||
.title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(40);
|
||||
color: #58A1F5;
|
||||
margin-top: px2rem(60);
|
||||
font-weight: bold;
|
||||
// background: linear-gradient(0deg, #FFE691 0%, #FEFAD5 100%);
|
||||
// -webkit-background-clip: text;
|
||||
// -webkit-text-fill-color: transparent;
|
||||
}
|
||||
.content {
|
||||
width: px2rem(524);
|
||||
height: px2rem(425);
|
||||
margin: 0 auto;
|
||||
margin-top:.4rem;
|
||||
overflow: auto;
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
p {
|
||||
width: 100%;
|
||||
height:13.333333rem;
|
||||
img {
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cancel {
|
||||
width: px2rem(70);
|
||||
height:px2rem(70);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: px2rem(-110);
|
||||
img {
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.statusMask {
|
||||
width: px2rem(616);
|
||||
height: px2rem(596);
|
||||
// border-radius:.213333rem;
|
||||
// background-color:#FFFFFF;
|
||||
background: url('../img/index/buy-bg.png') no-repeat 0 0 / 100% 100%;
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform:translate(-50%,-50%);
|
||||
z-index: 1001;
|
||||
display: none;
|
||||
.cancel {
|
||||
width: px2rem(70);
|
||||
height: px2rem(70);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translate(-50%,0);
|
||||
bottom: px2rem(-80);
|
||||
img {
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(40);
|
||||
color: #58A1F5;
|
||||
font-weight:bold;
|
||||
margin-top: px2rem(60);
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: px2rem(120);
|
||||
height: px2rem(120);
|
||||
margin: 0 auto;
|
||||
margin-top: px2rem(64);
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
|
||||
.tip {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: px2rem(30);
|
||||
color: #909090;
|
||||
}
|
||||
|
||||
.in-btn, .recharge {
|
||||
@include flex;
|
||||
@include flex-align-center;
|
||||
@include flex-justify-between;
|
||||
display: block;
|
||||
width: px2rem(300);
|
||||
height: px2rem(108);
|
||||
background:url('../img/index/btn.png') no-repeat 0 0 / 100% 100%;
|
||||
background-size:100% 100%;
|
||||
font-size: px2rem(36);
|
||||
line-height: px2rem(92);
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
margin: px2rem(60) auto 0;
|
||||
font-weight: bold;
|
||||
padding-bottom: px2rem(10);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.shade {
|
||||
width: 100%;
|
||||
position:fixed;
|
||||
z-index:1000;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
background:rgba(0,0,0,0.7);
|
||||
display: none;
|
||||
}
|
||||
.mine {
|
||||
@include flex();
|
||||
@include flex-justify-between;
|
||||
@include flex-align-center;
|
||||
width: 100%;
|
||||
height:1.866667rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient( #2578A7, #4E6BB3);
|
||||
z-index: 100;
|
||||
li {
|
||||
margin: 0 .533333rem;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
@include flex();
|
||||
@include flex-justify-start;
|
||||
@include flex-align-center;
|
||||
p {
|
||||
&:first-child {
|
||||
width:1.066667rem;
|
||||
height:1.066667rem;
|
||||
border-radius:50%;
|
||||
overflow: hidden;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-left:.266667rem;
|
||||
span {
|
||||
display: block;
|
||||
&:first-child {
|
||||
line-height: px2rem(38);
|
||||
font-size: px2rem(26);
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
}
|
||||
&:last-child {
|
||||
font-size: px2rem(22);
|
||||
font-weight: 500;
|
||||
color: rgba($color: #C1C4FD, $alpha: 1);
|
||||
b {
|
||||
color: rgba($color: #fff, $alpha: 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-top: px2rem(10);
|
||||
width: px2rem(180);
|
||||
height: px2rem(81);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/*提示信息样式*/
|
||||
.ajaxtiptext{
|
||||
position:fixed;
|
||||
top:50%;
|
||||
left:50%;
|
||||
transform:translate(-50%,-50%);
|
||||
text-align: center;
|
||||
color:#FFFFFF;
|
||||
padding:.2rem .4rem;
|
||||
border-radius:.333333rem;
|
||||
letter-spacing:.013333rem;
|
||||
background:rgba(0,0,0,0.8);
|
||||
animation:ajaxani 0.3s forwards;
|
||||
z-index:9999;
|
||||
white-space:nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,23 @@
|
||||
var gulp = require('gulp');
|
||||
var fs = require('fs');
|
||||
var path = require('path');
|
||||
|
||||
// 注册
|
||||
var deep = 3;
|
||||
run_tasks('_tasks');
|
||||
|
||||
function run_tasks(tasks_path) {
|
||||
if (--deep < 0) {
|
||||
throw new Error('something wrong in require tasks!');
|
||||
// eslint-disable-next-line no-unreachable
|
||||
return;
|
||||
}
|
||||
|
||||
tasks_path = path.join('../', tasks_path);
|
||||
|
||||
if (fs.existsSync(tasks_path)) {
|
||||
require(tasks_path)(gulp);
|
||||
} else {
|
||||
run_tasks(tasks_path);
|
||||
}
|
||||
}
|
||||
|
After Width: | Height: | Size: 208 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 851 B |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 939 B |
|
After Width: | Height: | Size: 989 B |
|
After Width: | Height: | Size: 5.2 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 785 B |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 3.9 KiB |
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 9.6 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 987 B |
|
After Width: | Height: | Size: 896 B |
|
After Width: | Height: | Size: 604 B |
|
After Width: | Height: | Size: 229 KiB |
|
After Width: | Height: | Size: 127 KiB |
|
After Width: | Height: | Size: 92 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 224 B |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 117 KiB |
|
After Width: | Height: | Size: 111 KiB |
|
After Width: | Height: | Size: 190 KiB |
|
After Width: | Height: | Size: 107 KiB |
|
After Width: | Height: | Size: 185 KiB |
|
After Width: | Height: | Size: 148 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 74 KiB |
|
After Width: | Height: | Size: 105 KiB |
|
After Width: | Height: | Size: 188 KiB |
|
After Width: | Height: | Size: 92 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 146 KiB |
|
After Width: | Height: | Size: 68 KiB |
|
After Width: | Height: | Size: 587 B |
|
After Width: | Height: | Size: 7.8 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 8.1 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 8.3 KiB |
|
After Width: | Height: | Size: 566 B |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 126 B |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 83 KiB |
|
After Width: | Height: | Size: 1005 KiB |
@@ -0,0 +1,80 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<title>初夏物语</title>
|
||||
<%- include('../html_tpl/style.html') %>
|
||||
<link rel="stylesheet" href="css/index.css">
|
||||
|
||||
<%- include('../html_tpl/headScript.html') %>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="max">
|
||||
<div class="title title-one"><img src="./img/index/title.png" alt=""></div>
|
||||
<div class="rule-btn"><img src="./img/index/rule-btn.png" alt=""></div>
|
||||
<ul class="cloth-box"></ul>
|
||||
<div class="mine">
|
||||
<li>
|
||||
<p class="avatar"><img src="" alt=""></p>
|
||||
<p>
|
||||
<span class="nick">-</span>
|
||||
<span>我的门票:<b class="score"></b></span>
|
||||
</p>
|
||||
</li>
|
||||
<li><a href="carnival.html"><img src="./img/index/in-btn.png" alt=""></a></li>
|
||||
</div>
|
||||
<!-- 弹窗start -->
|
||||
<div class="buy-mask">
|
||||
<div class="b-box">
|
||||
<h3 class="b-title">购买<b class="giftName"></b></h3>
|
||||
<div class="b-number">
|
||||
<p class="b-text"><span>数量:</span></p>
|
||||
<div class="input-box">
|
||||
<div class="remove-btn"><span class="remove-icon"></span></div>
|
||||
<input type="number" value="1" class="b-input">
|
||||
<div class="add-btn"><span class="add-icon"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="b-text b-day"><span>天数:</span><span class="day">1</span><span>天</span></p>
|
||||
<p class="b-text b-price"><span>金额:</span><span class="totalprice"></span><span>金币</span></p>
|
||||
<div class="b-btns">
|
||||
<div class="close-btn"></div>
|
||||
<div class="confirm-btn"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rule-mask">
|
||||
<div class="cancel">
|
||||
<img src="./img/common/cancel1.png" alt="">
|
||||
</div>
|
||||
<div class="title">玩法介绍</div>
|
||||
<div class="content">
|
||||
<p><img src="./img/index/rule-text.png" alt=""></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="statusMask">
|
||||
<div class="cancel">
|
||||
<img src="./img/common/cancel1.png" alt="">
|
||||
</div>
|
||||
<div class="title success">购买成功</div>
|
||||
<div class="title fail">余额不足</div>
|
||||
<div class="avatar success"><img src="./img/common/success-icon.png" alt=""></div>
|
||||
<div class="avatar fail"><img src="./img/common/enough-icon.png" alt=""></div>
|
||||
<div class="tip"></div>
|
||||
<a href="./carnival.html" class="in-btn success">进入会场</a>
|
||||
<div class="recharge android fail">去充值</div>
|
||||
<div class="recharge ios fail">知道了</div>
|
||||
</div>
|
||||
<div class="shade"></div>
|
||||
<!-- 弹窗end -->
|
||||
</div>
|
||||
<!-- <%- include('../html_tpl/downloadMask.html') %> -->
|
||||
</body>
|
||||
<%- include('../html_tpl/script.html') %>
|
||||
<script src="js/index.js"></script>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,946 @@
|
||||
// 指定全局变量
|
||||
/*global checkVersion locateJudge EnvCheck tools erbanMask wx wxConfig VConsole androidJsObj initNav template preloadImage */
|
||||
var info = {};
|
||||
var browser = checkVersion();
|
||||
var api = locateJudge();
|
||||
var env = EnvCheck();
|
||||
|
||||
var shareUrl = location.origin + '/activity';
|
||||
var share = {
|
||||
title: '',
|
||||
link: shareUrl,
|
||||
imgUrl: 'https://img.erbanyy.com/new-logo.png',
|
||||
desc: ''
|
||||
};
|
||||
// eslint-disable-next-line
|
||||
function getMessage (key, value) {
|
||||
info[key] = value;
|
||||
}
|
||||
|
||||
wx.ready(function () {
|
||||
wx.onMenuShareTimeline({
|
||||
title: share.title,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
desc: share.desc
|
||||
});
|
||||
|
||||
wx.onMenuShareAppMessage({
|
||||
title: share.title,
|
||||
desc: share.desc,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
type: 'link',
|
||||
dataUrl: ''
|
||||
});
|
||||
|
||||
wx.onMenuShareQQ({
|
||||
title: share.title,
|
||||
desc: share.desc,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl
|
||||
});
|
||||
});
|
||||
|
||||
erbanMask('activity-name', 'activity-name');
|
||||
initNav({
|
||||
type: 2,
|
||||
data: {
|
||||
msg: 'wewawa',
|
||||
link: share.link,
|
||||
title: share.title,
|
||||
showUrl: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
desc: share.desc
|
||||
}
|
||||
});
|
||||
|
||||
browser.weixin && wxConfig();
|
||||
|
||||
var requestScrollTimer
|
||||
var toastTimer
|
||||
var openSocketTimer
|
||||
var imgTimer
|
||||
var canvasTimer
|
||||
var rotateTimer
|
||||
var rotateTimer2
|
||||
var giftTimer
|
||||
|
||||
clearInterval(requestScrollTimer)
|
||||
requestScrollTimer = setInterval(function () {
|
||||
getScrollTip()
|
||||
}, 60000)
|
||||
|
||||
var clickTab = 0
|
||||
var clickTabFlag = false
|
||||
var clickNumIndex = 0
|
||||
var turntable = {
|
||||
0: {
|
||||
rotateBol: false,
|
||||
fontColor: [], // 字体颜色
|
||||
colors: [
|
||||
'#321C34',
|
||||
'#483446'
|
||||
], // 板块颜色
|
||||
prizeName: [], // 奖品名称
|
||||
prizeImg: [
|
||||
'img/gift/gift1.png',
|
||||
'img/gift/gift2.png',
|
||||
'img/gift/gift3.png',
|
||||
'img/gift/gift4.png',
|
||||
'img/gift/gift5.png',
|
||||
'img/gift/gift6.png',
|
||||
'img/gift/gift7.png',
|
||||
'img/gift/gift8.png'
|
||||
], // 奖品图片
|
||||
prizeImgArr: [], // 用于canvas绘画的图片
|
||||
prizeIndex: [] // 奖品下标
|
||||
},
|
||||
1: {
|
||||
rotateBol: false,
|
||||
fontColor: [], // 字体颜色
|
||||
colors: [
|
||||
'#001F53',
|
||||
'#361B6E'
|
||||
], // 板块颜色
|
||||
prizeName: [], // 奖品名称
|
||||
prizeImg: [
|
||||
'img/gift/gift1.png',
|
||||
'img/gift/gift9.png',
|
||||
'img/gift/gift10.png',
|
||||
'img/gift/gift11.png',
|
||||
'img/gift/gift12.png',
|
||||
'img/gift/gift13.png',
|
||||
'img/gift/gift14.png',
|
||||
'img/gift/gift15.png'
|
||||
], // 奖品图片
|
||||
prizeImgArr: [], // 用于canvas绘画的图片
|
||||
prizeIndex: [] // 奖品下标
|
||||
}
|
||||
}
|
||||
var giftIntro = {}
|
||||
|
||||
$(function () {
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
var main = {
|
||||
init: function () {
|
||||
this.getMsgFromDevice();
|
||||
setTimeout(() => {
|
||||
this.getData();
|
||||
if (info.appVersion >= '1.3.6' && info.appVersion) {
|
||||
$('.topNav1').show().siblings('.topNav2').hide();
|
||||
} else {
|
||||
$('.feedback,.topNav1').hide();
|
||||
$('.topNav2').show();
|
||||
}
|
||||
}, 100);
|
||||
this.eventRegister();
|
||||
},
|
||||
getMsgFromDevice: function () {
|
||||
if (browser.app) {
|
||||
if (browser.ios) {
|
||||
window.webkit.messageHandlers.getDeviceId.postMessage(null);
|
||||
window.webkit.messageHandlers.getRoomUid.postMessage(null);
|
||||
} else if (browser.android) {
|
||||
if (androidJsObj && typeof androidJsObj === 'object') {
|
||||
info.deviceId = window.androidJsObj.getDeviceId();
|
||||
info.roomUid = window.androidJsObj.getRoomUid()
|
||||
}
|
||||
}
|
||||
|
||||
info.uid = tools.nativeUtils.getUid();
|
||||
info.ticket = tools.nativeUtils.getTicket();
|
||||
info.appVersion = tools.nativeUtils.getAppVersion();
|
||||
} else {
|
||||
info.uid = 925506;
|
||||
info.roomUid = 923631
|
||||
info.deviceId = '8d9d6247-63a4-3acc-a164-01a6b1a3c098';
|
||||
info.ticket = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjo5MjU1MDYsInRpY2tldF9pZCI6IjQ1MTE0N2IyLTJkYjEtNDYwNi1hOWQyLTU0ZmZmM2NkMDhjNSIsImV4cCI6MzYwMCwiY2xpZW50X2lkIjoiZXJiYW4tY2xpZW50In0.X7gEBqfPDH0ejsAAsx0xdJeuRsyMhUJ9B3tVjAuwZq0';
|
||||
}
|
||||
},
|
||||
|
||||
eventRegister: function () {
|
||||
$('.topNav .tab').on('click', function () {
|
||||
if (clickTabFlag) {
|
||||
return
|
||||
}
|
||||
$(this).addClass('active').siblings().removeClass('active')
|
||||
clickTab = $(this).index()
|
||||
|
||||
if (clickTab === 0) {
|
||||
$('.exp-container').find('.strip').removeClass('exp-2').addClass('exp-1')
|
||||
$('.exp-container').removeClass('exp-container2').addClass('exp-container1')
|
||||
$('.canvas').find('.container1').removeClass('second').addClass('first')
|
||||
$('.canvas .pointer img').attr('src', 'img/carnival/point.png')
|
||||
$('.canvas .btn img').attr('src', 'img/carnival/draw-btn.png')
|
||||
preloadImg(clickTab)
|
||||
} else {
|
||||
$('.exp-container').find('.strip').removeClass('exp-1').addClass('exp-2')
|
||||
$('.exp-container').removeClass('exp-container1').addClass('exp-container2')
|
||||
$('.canvas').find('.container1').removeClass('first').addClass('second')
|
||||
$('.canvas .pointer img').attr('src', 'img/carnival/point-2.png')
|
||||
$('.canvas .btn img').attr('src', 'img/carnival/draw-btn-2.png')
|
||||
preloadImg(clickTab)
|
||||
}
|
||||
|
||||
info.clickStatu = false
|
||||
getGiftInfo()
|
||||
getticketChooseShow()
|
||||
})
|
||||
$('.turnNum').on('click', 'li', function () {
|
||||
$(this).addClass('active').siblings().removeClass('active')
|
||||
clickNumIndex = $(this).index()
|
||||
})
|
||||
|
||||
$('.experience').on('click', '.tips', function () {
|
||||
$('.exp-toast').fadeIn(300, function () {
|
||||
clearTimeout(toastTimer)
|
||||
toastTimer = setTimeout(function () {
|
||||
$('.exp-toast').hide()
|
||||
}, 8000)
|
||||
})
|
||||
})
|
||||
|
||||
$('.canvas').on('click', '.btn', function () {
|
||||
if (!info.clickStatu) {
|
||||
$('.toast').html('哎呀太挤了,请稍等').fadeIn(30).fadeOut(2000)
|
||||
return false
|
||||
}
|
||||
if (turntable[clickTab].rotateBol) return
|
||||
turntable[clickTab].rotateBol = true
|
||||
clickTabFlag = true
|
||||
var obj = {
|
||||
0: 'one',
|
||||
1: 'ten',
|
||||
2: 'hundred'
|
||||
}
|
||||
$.ajax({
|
||||
headers: {
|
||||
pub_ticket: info.ticket
|
||||
},
|
||||
type: 'POST',
|
||||
url: api + '/activities/draw/turnTable',
|
||||
data: {
|
||||
uid: info.uid,
|
||||
ticket: info.ticket,
|
||||
roomUid: info.roomUid,
|
||||
sendMessage: true,
|
||||
ruleType: obj[clickNumIndex],
|
||||
drawType: (clickTab === 0) ? 'turntable1' : 'turntable2',
|
||||
deviceId: info.deviceId
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
var maxValue = 0
|
||||
var prizeId
|
||||
var item
|
||||
for (var i in res.data.prizeItemList) {
|
||||
if (res.data.prizeItemList[i].platformValue > maxValue) {
|
||||
maxValue = res.data.prizeItemList[i].platformValue
|
||||
prizeId = res.data.prizeItemList[i].prizeId
|
||||
item = turntable[clickTab].prizeIndex.indexOf(prizeId)
|
||||
if (item == -1) {
|
||||
item = 0
|
||||
}
|
||||
}
|
||||
console.log(item);
|
||||
}
|
||||
// ---------------- 用户抽奖记录接口 -----------
|
||||
$.ajax({
|
||||
headers: {
|
||||
pub_ticket: info.ticket
|
||||
},
|
||||
type: 'POST',
|
||||
url: api + '/activities/draw/saveLog',
|
||||
data: {
|
||||
ticket: info.ticket,
|
||||
uid: info.uid,
|
||||
prizeids: JSON.stringify(res.data.prizeIdList),
|
||||
prizeIndex: item,
|
||||
createdTime: res.data.prizeItemList[0].createTime,
|
||||
prizeIdList: JSON.stringify(turntable[clickTab].prizeIndex)
|
||||
},
|
||||
success: function (res) {
|
||||
// eslint-disable-next-line no-empty
|
||||
if (res.code !== 200) console.log(res.message)
|
||||
},
|
||||
error: function (err) {
|
||||
console.log('报错了:', err)
|
||||
}
|
||||
})
|
||||
// ------------------ 用户抽奖记录接口 ------------
|
||||
$('.info').find('.ticketNum').html(res.data.remainKeyNum)
|
||||
rotateFunc(item, 8, res.data.prizeItemList, res.data.prizeIdList, clickTab)
|
||||
clearTimeout(rotateTimer)
|
||||
rotateTimer = setTimeout(function () {
|
||||
clickTabFlag = false
|
||||
clearTimeout(rotateTimer)
|
||||
}, 3000)
|
||||
clearTimeout(rotateTimer2)
|
||||
rotateTimer2 = setTimeout(function () {
|
||||
turntable[clickTab].rotateBol = false
|
||||
}, 1000)
|
||||
} else if (res.code === 10000) {
|
||||
// 门票不足
|
||||
$('.status-mask').find('.title').html('游玩失败')
|
||||
$('.status-mask').find('.tips').html('亲,门票不足了哦~')
|
||||
$('.status-mask').find('.btn').addClass('toGather').html('去收集')
|
||||
$('.shade,.status-mask').show()
|
||||
clickTabFlag = false
|
||||
turntable[clickTab].rotateBol = false
|
||||
} else if (res.code === 21111) {
|
||||
// 游玩限制
|
||||
$('.status-mask').find('.title').html('本日游玩限制')
|
||||
$('.status-mask').find('.tips').html('今日游玩次数已达上限哦~')
|
||||
$('.status-mask').find('.btn').removeClass('toGather').html('知道了')
|
||||
$('.shade,.status-mask').show()
|
||||
clickTabFlag = false
|
||||
} else {
|
||||
turntable[clickTab].rotateBol = false
|
||||
clickTabFlag = false
|
||||
$('.toast').html(res.message).fadeIn(30).fadeOut(3000)
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
$('.status-mask').on('click', '.btn', function () {
|
||||
if ($(this).hasClass('toGather')) {
|
||||
$('.status-mask').hide()
|
||||
$('.shade').hide()
|
||||
window.location.href = './index.html'
|
||||
} else {
|
||||
$('.status-mask').hide()
|
||||
$('.shade').hide()
|
||||
}
|
||||
})
|
||||
|
||||
$('.shade').on('click', function () {
|
||||
$('.status-mask').hide()
|
||||
$('.gather-mask').hide()
|
||||
$('.shade').hide()
|
||||
})
|
||||
|
||||
$('.help').on('click', function () {
|
||||
$('.rule-mask').animate({
|
||||
top: 0
|
||||
}, 500)
|
||||
})
|
||||
$('.rule-mask').on('click', '.back', function () {
|
||||
$('.rule-mask').animate({
|
||||
top: -1000
|
||||
}, 500)
|
||||
})
|
||||
|
||||
$('.rank-btn').on('click', function () {
|
||||
renderRank(false)
|
||||
})
|
||||
$('.rank-mask .tab').on('click', 'li', function () {
|
||||
rankTabIndex = $(this).index()
|
||||
$(this).addClass('active').siblings().removeClass('active')
|
||||
renderRank(true)
|
||||
})
|
||||
$('.rank-mask').on('click', '.back', function () {
|
||||
$('.rank-mask').animate({
|
||||
top: -1000
|
||||
}, 500)
|
||||
})
|
||||
|
||||
$('.status-mask').on('click', '.btn', function () {
|
||||
$('.shade').hide()
|
||||
$('.status-mask').hide()
|
||||
})
|
||||
|
||||
$('.record-btn').on('click', function () {
|
||||
renderRecord(false)
|
||||
})
|
||||
$('.record-mask .tab').on('click', 'li', function () {
|
||||
recordTabIndex = $(this).index()
|
||||
recordPageNum = 1
|
||||
scrollFlag = false
|
||||
$('.record-mask').find('.content').scrollTop(0)
|
||||
$(this).addClass('active').siblings().removeClass('active')
|
||||
renderRecord(true)
|
||||
})
|
||||
$('.record-mask').on('click', '.back', function () {
|
||||
$('.record-mask').animate({
|
||||
top: -1000
|
||||
}, 500)
|
||||
})
|
||||
$('.record-mask .content').scroll(function () {
|
||||
var scrollH = $(this).scrollTop()
|
||||
var contentH = $('.record-container').height()
|
||||
var viewH = $(this).height()
|
||||
if (Math.ceil(viewH + scrollH) >= contentH) {
|
||||
if (scrollFlag) {
|
||||
return
|
||||
}
|
||||
scrollFlag = !scrollFlag
|
||||
recordPageNum++
|
||||
renderRecord(true)
|
||||
}
|
||||
})
|
||||
$('.feedback').on('click', function () {
|
||||
tools.nativeUtils.jumpAppointPage('FEEDPACK_PAGE', 'DRAW');
|
||||
})
|
||||
},
|
||||
getData: function () {
|
||||
getScrollTip()
|
||||
getticketChooseShow()
|
||||
openSocket()
|
||||
getExp()
|
||||
getTicketNum()
|
||||
preloadImg(clickTab)
|
||||
getGiftInfo()
|
||||
}
|
||||
};
|
||||
|
||||
main.init();
|
||||
});
|
||||
|
||||
var scrollTimer
|
||||
var tabTimer
|
||||
var times
|
||||
// var timeFlag = 0
|
||||
var timeTimer
|
||||
// var cacheLine = 0
|
||||
var rankTabIndex = 0
|
||||
var recordTabIndex = 0
|
||||
var recordPageNum = 1
|
||||
|
||||
// 获取滚屏数据
|
||||
function getScrollTip () {
|
||||
$('.container').hide()
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/queryPrizeMsg',
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
for (var i in res.data) {
|
||||
if (res.data[i].nick.length > 4) {
|
||||
res.data[i].nick = res.data[i].nick.substring(0, 4) + '...'
|
||||
}
|
||||
if (res.data[i].drawType === 1) {
|
||||
res.data[i]['table'] = '甜蜜夏日'
|
||||
} else {
|
||||
res.data[i]['table'] = '心动一夏'
|
||||
}
|
||||
}
|
||||
res.data.push(res.data[0])
|
||||
var _data = {
|
||||
scrollMaskList: res.data
|
||||
}
|
||||
$('.container').html(template('scrollTmp', _data))
|
||||
$('.container').show()
|
||||
animateScroll()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 获取礼物信息
|
||||
function getGiftInfo () {
|
||||
turntable[clickTab].prizeIndex = []
|
||||
// turntable[0].prizeImg = [];
|
||||
// turntable[1].prizeImg = [];
|
||||
giftIntro['giftIdArr'] = []
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/queryPrizeInfo',
|
||||
timeout: 15000, // 超时时间:30秒
|
||||
data: {
|
||||
drawType: (clickTab === 0) ? 'turntable1' : 'turntable2'
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
for (var i in res.data) {
|
||||
turntable[clickTab].prizeIndex.push(res.data[i].prizeId)
|
||||
giftIntro.giftIdArr.push(res.data[i].prizeId)
|
||||
// if(clickTab === 0) {
|
||||
// turntable[0].prizeImg.push(res.data[i].prizeImgUrl)
|
||||
// }else{
|
||||
// turntable[1].prizeImg.push(res.data[i].prizeImgUrl)
|
||||
// }
|
||||
}
|
||||
// preloadImg(clickTab)
|
||||
// 成功后可点击
|
||||
info.clickStatu = true
|
||||
} else {
|
||||
$('.toast').html(res.message).fadeIn(30).fadeOut(2000)
|
||||
}
|
||||
},
|
||||
error: function (res) {
|
||||
$('.toast').html('哎呀太挤了,请稍等').fadeIn(30).fadeOut(2000)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 滚屏
|
||||
function animateScroll () {
|
||||
var length = $('.scrollMask').find('.container').height()
|
||||
var _top = 0
|
||||
clearInterval(scrollTimer)
|
||||
scrollTimer = setInterval(function () {
|
||||
if (length + _top > 30) {
|
||||
_top -= 30
|
||||
} else {
|
||||
$('.scrollMask').find('.container').css({
|
||||
top: 0
|
||||
})
|
||||
_top = 0
|
||||
}
|
||||
$('.scrollMask').find('.container').stop(true, true).animate({
|
||||
top: _top
|
||||
})
|
||||
}, 2000)
|
||||
}
|
||||
|
||||
// 获取消耗数据
|
||||
function getticketChooseShow () {
|
||||
var drawObj = {
|
||||
0: 'turntable1',
|
||||
1: 'turntable2'
|
||||
}
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/queryTicketRule',
|
||||
data: {
|
||||
drawType: drawObj[clickTab]
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
// $('.turnNum').find('.num').eq(0).html(res.data.one + '次')
|
||||
$('.turnNum').find('.ticket').eq(0).html('消耗' + res.data.one + '门票')
|
||||
// $('.turnNum').find('.num').eq(1).html(res.data.ten + '次')
|
||||
$('.turnNum').find('.ticket').eq(1).html('消耗' + res.data.ten + '门票')
|
||||
// $('.turnNum').find('.num').eq(2).html(res.data.hundred + '次')
|
||||
$('.turnNum').find('.ticket').eq(2).html('消耗' + res.data.hundred + '门票')
|
||||
|
||||
if (clickTab === 0) {
|
||||
$('.turnNum').find('li').removeClass('joy').addClass('ball')
|
||||
} else {
|
||||
$('.turnNum').find('li').removeClass('ball').addClass('joy')
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 打开socket链接
|
||||
function openSocket () {
|
||||
var socket = null
|
||||
var cacheType = 0
|
||||
if (typeof (WebSocket) === 'undefined') {
|
||||
alert('暂不支持转盘socket')
|
||||
} else {
|
||||
var _url = (window.location.href.match('apibeta') || window.location.href.match('local')) ? 'http://apibeta.qxjiaoyou.com:8081' : 'https://api.qxjiaoyou.com:8081'
|
||||
if (window.location.href.match('preview')) {
|
||||
_url = 'https://preview.qxjiaoyou.com:8081'
|
||||
}
|
||||
var socketUrl = _url + '/websocket/activity/' + info.roomUid
|
||||
socketUrl = socketUrl.replace('https', 'wss').replace('http', 'ws')
|
||||
if (socket !== null) {
|
||||
socket.close()
|
||||
socket = null
|
||||
}
|
||||
socket = new WebSocket(socketUrl)
|
||||
|
||||
socket.onopen = function () {
|
||||
// 监听开启socket后的判断逻辑
|
||||
clearInterval(tabTimer)
|
||||
tabTimer = setInterval(function () {
|
||||
if (cacheType !== clickTab) {
|
||||
cacheType = clickTab
|
||||
getExp()
|
||||
}
|
||||
}, 10)
|
||||
}
|
||||
|
||||
socket.onmessage = function (res) {
|
||||
// 监听服务端发送过来的数据
|
||||
|
||||
var data = JSON.parse(res.data)
|
||||
if (data.data) {
|
||||
renderExp(data.data)
|
||||
}
|
||||
}
|
||||
|
||||
socket.onclose = function () {
|
||||
socket = null
|
||||
clearTimeout(openSocketTimer)
|
||||
openSocketTimer = setTimeout(function () {
|
||||
openSocket()
|
||||
}, 5000)
|
||||
}
|
||||
|
||||
socket.onerror = function () {
|
||||
console.log('socket错误')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染经验值
|
||||
function getExp () {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/getRunawayData',
|
||||
data: {
|
||||
drawType: (clickTab === 0) ? 'turntable1' : 'turntable2',
|
||||
roomUid: info.roomUid
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
renderExp(res.data)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
var tableFlag
|
||||
function renderExp (val) {
|
||||
// console.log(val)
|
||||
tableFlag = (val.drawType === 'turntable1') ? 0 : 1
|
||||
if (val.runawaySwitch) {
|
||||
$('.experience').show()
|
||||
}
|
||||
|
||||
// 进度条计算
|
||||
if (tableFlag === clickTab) {
|
||||
var height = $('.exp-container').height()
|
||||
var percentage = val.curValue / val.runawayConfigValue
|
||||
var _top
|
||||
_top = height * percentage
|
||||
$('.strip').stop(true).animate({
|
||||
height: _top
|
||||
}, 200)
|
||||
$('.experience').find('.maxNum').html(val.runawayConfigValue)
|
||||
$('.experience').find('.num').html(val.curValue)
|
||||
}
|
||||
// 进度条计算
|
||||
|
||||
// 礼物显示
|
||||
if (JSON.stringify(val.poolPrize) !== '{}') {
|
||||
if (val.poolTime > 0 && tableFlag === clickTab) {
|
||||
renderTime(val)
|
||||
}
|
||||
// if (val.poolTime === val.runawayConfigTime && tableFlag === clickTab) {
|
||||
// timeFlag = 1
|
||||
// $('.giftBox').removeClass('hide')
|
||||
// renderTime(val.poolTime)
|
||||
// $('.giftBox').find('img').attr('src', val.poolPrize.prizeImgUrl)
|
||||
// }
|
||||
} else {
|
||||
$('.giftBox').addClass('hide')
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染倒计时
|
||||
function renderTime (val) {
|
||||
times = val.poolTime
|
||||
$('.giftBox').find('img').attr('src', val.poolPrize.prizeImgUrl)
|
||||
$('.giftBox').removeClass('hide')
|
||||
$('.experience').find('.times').html(times + '秒')
|
||||
clearInterval(timeTimer)
|
||||
timeTimer = setInterval(function () {
|
||||
times--
|
||||
if (times === 0) {
|
||||
// timeFlag = 0
|
||||
clearInterval(timeTimer)
|
||||
$('.giftBox').addClass('hide')
|
||||
}
|
||||
$('.experience').find('.times').html(times + '秒')
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
// 获取门票数
|
||||
function getTicketNum () {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/queryTicketNum',
|
||||
data: {
|
||||
uid: info.uid
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
$('.info').find('.ticketNum').html(res.data.num)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 预加载图片
|
||||
function preloadImg (val) {
|
||||
var img = {
|
||||
imageArr: turntable[val].prizeImg,
|
||||
doneFunc: function () {
|
||||
clearInterval(imgTimer)
|
||||
imgTimer = setTimeout(function () {
|
||||
getCanvas(val)
|
||||
}, 50)
|
||||
}
|
||||
}
|
||||
preloadImage(img)
|
||||
}
|
||||
|
||||
// 转盘
|
||||
function getCanvas (val) {
|
||||
var img
|
||||
if (val === 0) {
|
||||
$('#table').show()
|
||||
$('#table2').hide()
|
||||
} else {
|
||||
$('#table').hide()
|
||||
$('#table2').show()
|
||||
}
|
||||
for (let i in turntable[val].prizeImg) {
|
||||
img = new Image()
|
||||
img.src = turntable[val].prizeImg[i]
|
||||
turntable[val].prizeImgArr.push(img)
|
||||
}
|
||||
var count = turntable[val].prizeImg.length
|
||||
img.onload = function () {
|
||||
var baseAngle = Math.PI * 2 / count
|
||||
var _circle = (val === 0) ? document.getElementById('table') : document.getElementById('table2')
|
||||
var circle = _circle.getContext('2d')
|
||||
clearTimeout(canvasTimer)
|
||||
canvasTimer = setTimeout(function () {
|
||||
for (var i = 0; i < turntable[val].prizeImg.length; i++) {
|
||||
circle.save()
|
||||
circle.translate(_circle.width / 2, _circle.height / 2)
|
||||
circle.strokeStyle = 'transparent'
|
||||
var angle = i * baseAngle
|
||||
var colorIndex = i % 2
|
||||
circle.fillStyle = turntable[val].colors[colorIndex]
|
||||
circle.beginPath()
|
||||
circle.moveTo(0, 0)
|
||||
circle.arc(0, 0, 214, angle, angle + baseAngle, false)
|
||||
circle.stroke()
|
||||
circle.fill()
|
||||
circle.rotate(angle + baseAngle / 2 + Math.PI / 2)
|
||||
circle.imageSmoothEnabled = false
|
||||
circle.drawImage(turntable[val].prizeImgArr[i], -55, -210, 100, 100)
|
||||
circle.restore()
|
||||
}
|
||||
clearTimeout(canvasTimer)
|
||||
}, 10)
|
||||
}
|
||||
}
|
||||
|
||||
// 旋转
|
||||
function rotateFunc (item, count, data, idList, val) {
|
||||
// $('.canvas').css({
|
||||
// transform: 'scale(.5)'
|
||||
// })
|
||||
giftIntro['gatherId'] = item
|
||||
giftIntro['gatherIdList'] = idList
|
||||
console.log(giftIntro);
|
||||
var baseAngle = 360 / count
|
||||
var angle = 360 * 3 / 4 - (item * baseAngle) - baseAngle / 2
|
||||
giftIntro['angle'] = angle
|
||||
var $rotate = (val === 0) ? $('#table') : $('#table2')
|
||||
$rotate.stopRotate()
|
||||
$rotate.rotate({
|
||||
angle: 0,
|
||||
animateTo: angle + 360 * 5,
|
||||
duration: 3000,
|
||||
callback: function () {
|
||||
// 获取弹窗渲染
|
||||
var $data = {
|
||||
gatherList: data
|
||||
}
|
||||
$('.gift-list').html(template('gatherListTmp', $data))
|
||||
$('.gather-mask').show()
|
||||
$('.shade').show()
|
||||
clearTimeout(giftTimer)
|
||||
giftTimer = setTimeout(function () {
|
||||
$('.gather-mask').hide()
|
||||
$('.shade').hide()
|
||||
clearTimeout(giftTimer)
|
||||
}, 1500)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 渲染排行榜
|
||||
function renderRank (val) {
|
||||
var tipsObj = {
|
||||
0: '抽奖票数越多,排名越高哦~每日零点重置',
|
||||
1: '获得奖励价值越高,排名越高哦~每日零点重置'
|
||||
}
|
||||
var urlObj = {
|
||||
0: '/activities/rank/ticketList',
|
||||
1: '/activities/rank/giftList'
|
||||
}
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: api + urlObj[rankTabIndex],
|
||||
data: {
|
||||
uid: info.uid
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
$('.rank-mask').find('.tips p').html(tipsObj[rankTabIndex])
|
||||
for (var i in res.data.rankVoList) {
|
||||
if (res.data.rankVoList[i].nick.length > 5) {
|
||||
res.data.rankVoList[i].nick = res.data.rankVoList[i].nick.substring(0, 5) + '...'
|
||||
}
|
||||
if (i > 0) {
|
||||
var distance = res.data.rankVoList[i - 1].value - res.data.rankVoList[i].value
|
||||
if (distance > 10000) {
|
||||
res.data.rankVoList[i]['distance'] = (distance / 10000).toFixed(1) + '万'
|
||||
} else {
|
||||
res.data.rankVoList[i]['distance'] = distance
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!val) {
|
||||
$('.rank-mask').animate({
|
||||
top: 0
|
||||
}, 500, function () {
|
||||
var $data = {
|
||||
rankList: res.data.rankVoList
|
||||
}
|
||||
$('.rank-container').html(template('rankListTmp', $data)).fadeIn(500)
|
||||
})
|
||||
} else {
|
||||
var $data = {
|
||||
rankList: res.data.rankVoList
|
||||
}
|
||||
$('.rank-container').fadeOut(500, function () {
|
||||
$('.rank-container').html(template('rankListTmp', $data))
|
||||
}).fadeIn(500)
|
||||
}
|
||||
|
||||
if (res.data.myRank.nick.length > 5) {
|
||||
res.data.myRank.nick = res.data.myRank.nick.substring(0, 5) + '...'
|
||||
}
|
||||
if (res.data.myRank.value > 10000) {
|
||||
res.data.myRank.value = (res.data.myRank.value / 10000).toFixed(1) + '万'
|
||||
}
|
||||
|
||||
$('.mine').find('.rank-num').html(res.data.myRank.rank)
|
||||
$('.mine').find('.avatar img').attr('src', res.data.myRank.avatar)
|
||||
$('.mine').find('.nick').html(res.data.myRank.nick)
|
||||
if (rankTabIndex === 0) {
|
||||
$('.mine').find('.score').html('我的捧场值:' + res.data.myRank.value)
|
||||
$('.rank-yesterday-box').addClass('active')
|
||||
for (var i = 0; i < 3; i++) {
|
||||
var item = res.data.yesterdayRank[i] || ''
|
||||
$(`.rank-item${i} .rank-ava .img-item`).attr('src', item.avatar || 'img/carnival/noava.png')
|
||||
$(`.rank-item${i} .rank-nick`).html(item.nick || '虚位以待')
|
||||
}
|
||||
} else {
|
||||
$('.mine').find('.score').html('我的迷人值:' + res.data.myRank.value)
|
||||
$('.rank-yesterday-box').removeClass('active')
|
||||
}
|
||||
if (res.data.myRank.rank < 21) {
|
||||
if (res.data.myRank.rank > 10 && res.data.myRank.rank < 21) {
|
||||
$('.mine').find('.num').html(res.data.myRank.diffValue)
|
||||
$('.mine').find('.distance').html('距上榜')
|
||||
} else if (res.data.myRank.rank < 11 && res.data.myRank.rank > 1) {
|
||||
$('.mine').find('.num').html(res.data.myRank.diffValue)
|
||||
$('.mine').find('.distance').html('距上名')
|
||||
} else {
|
||||
$('.mine').find('.num').html(res.data.myRank.diffValue)
|
||||
}
|
||||
} else {
|
||||
$('.mine').find('.num').html(res.data.myRank.diffValue)
|
||||
$('.mine').find('.distance').html('未上榜')
|
||||
}
|
||||
// 跳转个人主页
|
||||
$('.rank-container').on('click', '.avatar', function () {
|
||||
var uid = $(this).attr('data-uid');
|
||||
tools.nativeUtils.jumpAppointPage('PERSON_PAGE', uid);
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
var recordCache = []
|
||||
var scrollFlag = false
|
||||
var recordTimer
|
||||
// 渲染抽奖记录
|
||||
function renderRecord (val) {
|
||||
var typeObj = {
|
||||
0: 'time',
|
||||
1: 'worth'
|
||||
}
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/drawRecord',
|
||||
data: {
|
||||
uid: info.uid,
|
||||
sortType: typeObj[recordTabIndex],
|
||||
page: recordPageNum,
|
||||
pageSize: 10
|
||||
},
|
||||
success: function (res) {
|
||||
if (res.code === 200) {
|
||||
if (res.data.length === 0) {
|
||||
return
|
||||
}
|
||||
if (recordTabIndex === 0) {
|
||||
for (var i in res.data) {
|
||||
var date = new Date(res.data[i].createTime)
|
||||
var year = date.getFullYear()
|
||||
var month = date.getMonth() + 1
|
||||
var day = date.getDate()
|
||||
var hour = date.getHours()
|
||||
var minute = date.getMinutes()
|
||||
var second = date.getSeconds()
|
||||
res.data[i].ymd = year + '-' + month + '-' + day
|
||||
res.data[i].hms = hour + ':' + minute + ':' + second
|
||||
}
|
||||
}
|
||||
if (scrollFlag) {
|
||||
if (res.data.length > 0) {
|
||||
for (var j in res.data) {
|
||||
recordCache.push(res.data[j])
|
||||
}
|
||||
} else {
|
||||
$('.loading').html('暂无更多数据')
|
||||
}
|
||||
var $data2 = {
|
||||
recordList: recordCache,
|
||||
// eslint-disable-next-line no-unneeded-ternary
|
||||
worth: (recordTabIndex === 1) ? true : false
|
||||
}
|
||||
$('.loading').show()
|
||||
clearTimeout(recordTimer)
|
||||
recordTimer = setTimeout(function () {
|
||||
$('.loading').hide()
|
||||
$('.record-container').html(template('recordTmp', $data2))
|
||||
scrollFlag = !scrollFlag
|
||||
}, 2000)
|
||||
return
|
||||
}
|
||||
if (!val) {
|
||||
recordCache = []
|
||||
$('.record-mask').animate({
|
||||
top: 0
|
||||
}, 500, function () {
|
||||
recordCache = res.data
|
||||
var $data = {
|
||||
recordList: recordCache,
|
||||
// eslint-disable-next-line no-unneeded-ternary
|
||||
worth: (recordTabIndex === 1) ? true : false
|
||||
}
|
||||
$('.record-container').html(template('recordTmp', $data)).fadeIn(500)
|
||||
})
|
||||
} else {
|
||||
recordCache = []
|
||||
recordCache = res.data
|
||||
var $data = {
|
||||
recordList: recordCache,
|
||||
// eslint-disable-next-line no-unneeded-ternary
|
||||
worth: (recordTabIndex === 1) ? true : false
|
||||
}
|
||||
$('.record-container').fadeOut(500, function () {
|
||||
$('.record-container').html(template('recordTmp', $data))
|
||||
}).fadeIn(500)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,386 @@
|
||||
// 指定全局变量
|
||||
/*global checkVersion locateJudge EnvCheck tools erbanMask wx wxConfig VConsole androidJsObj initNav */
|
||||
var info = {};
|
||||
var browser = checkVersion();
|
||||
var api = locateJudge();
|
||||
var env = EnvCheck();
|
||||
var totalPrice = 0;
|
||||
var shareUrl = location.origin + '/activity';
|
||||
var share = {
|
||||
title: '',
|
||||
link: shareUrl,
|
||||
imgUrl: 'https://img.erbanyy.com/new-logo.png',
|
||||
desc: ''
|
||||
};
|
||||
// eslint-disable-next-line
|
||||
function getMessage(key, value) {
|
||||
info[key] = value;
|
||||
}
|
||||
|
||||
wx.ready(function() {
|
||||
wx.onMenuShareTimeline({
|
||||
title: share.title,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
desc: share.desc
|
||||
});
|
||||
|
||||
wx.onMenuShareAppMessage({
|
||||
title: share.title,
|
||||
desc: share.desc,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
type: 'link',
|
||||
dataUrl: ''
|
||||
});
|
||||
|
||||
wx.onMenuShareQQ({
|
||||
title: share.title,
|
||||
desc: share.desc,
|
||||
link: share.link,
|
||||
imgUrl: share.imgUrl
|
||||
});
|
||||
});
|
||||
|
||||
erbanMask('activity-name', 'activity-name');
|
||||
initNav({
|
||||
type: 2,
|
||||
data: {
|
||||
msg: 'wewawa',
|
||||
link: share.link,
|
||||
title: share.title,
|
||||
showUrl: share.link,
|
||||
imgUrl: share.imgUrl,
|
||||
desc: share.desc
|
||||
}
|
||||
});
|
||||
|
||||
browser.weixin && wxConfig();
|
||||
|
||||
$(function() {
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
|
||||
var main = {
|
||||
init: function() {
|
||||
this.getMsgFromDevice();
|
||||
setTimeout(() => {
|
||||
this.getData();
|
||||
}, 100);
|
||||
this.eventRegister();
|
||||
},
|
||||
getMsgFromDevice: function() {
|
||||
if (browser.app) {
|
||||
if (browser.ios) {
|
||||
window.webkit.messageHandlers.getDeviceId.postMessage(null);
|
||||
} else if (browser.android) {
|
||||
if (androidJsObj && typeof androidJsObj === 'object') {
|
||||
info.deviceId = window.androidJsObj.getDeviceId();
|
||||
}
|
||||
}
|
||||
info.uid = tools.nativeUtils.getUid();
|
||||
info.ticket = tools.nativeUtils.getTicket();
|
||||
} else {
|
||||
// info.uid = 906238;
|
||||
info.uid = 906709;
|
||||
info.deviceId = 'safhksafhksajhfs1kjahsfkjsf0000aaaaaaaacaa';
|
||||
info.ticket = 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjo5MDYyMzgsInRpY2tldF9pZCI6IjdiZWQ2NzcwLWJmMjktNGRiYi04MzZmLTc0NzBmY2RiMDZjYSIsImV4cCI6MzYwMCwiY2xpZW50X2lkIjoiZXJiYW4tY2xpZW50In0.ye2Zv8nyZkqiT_bIWq-50qcS6_SCWmRpBjxxLX7mQvs';
|
||||
}
|
||||
},
|
||||
eventRegister: function() {
|
||||
// 打开规则弹窗
|
||||
$('.rule-btn').on('click', function() {
|
||||
$('.rule-mask,.shade').fadeIn(300);
|
||||
})
|
||||
// 关闭购买弹窗
|
||||
$('.buy-mask').on('click', '.close-btn', function() {
|
||||
$('.buy-mask,.shade').fadeOut(300);
|
||||
})
|
||||
// 关闭规则弹窗
|
||||
$('.rule-mask').on('click', '.cancel', function() {
|
||||
$('.rule-mask,.shade').fadeOut(300);
|
||||
})
|
||||
// 关闭购买之后弹窗
|
||||
$('.statusMask').on('click', '.cancel', function() {
|
||||
$('.statusMask,.shade').fadeOut(300);
|
||||
})
|
||||
// 关闭弹窗
|
||||
$('.shade').on('click', function() {
|
||||
$('.rule-mask,.buy-mask,.statusMask,.shade').fadeOut(300);
|
||||
})
|
||||
// 监听input输入
|
||||
$('.b-input').bind('input propertychange', function() {
|
||||
var _this = $(this);
|
||||
if (_this.val().length == 1) {
|
||||
_this.val(_this.val().replace(/[^1-9]/gi, ''));
|
||||
} else {
|
||||
_this.val(_this.val().replace(/[\D]/gi, ''));
|
||||
_this.val(parseInt(_this.val()));
|
||||
}
|
||||
if(_this.val() == '') {
|
||||
totalPrice = 0;
|
||||
$('.day').text(0);
|
||||
_this.val(0)
|
||||
}else{
|
||||
if(_this.val() >= 100000000) {
|
||||
_this.val(100000000)
|
||||
}
|
||||
totalPrice = parseInt(_this.val()) * parseInt(_this.attr('data-price'));
|
||||
$('.day').text(_this.val());
|
||||
}
|
||||
$('.totalprice').html(totalPrice);
|
||||
})
|
||||
// 增加按钮
|
||||
$('.add-btn').on('click', function() {
|
||||
var val = parseInt($('.b-input').val());
|
||||
var price = parseInt($('.b-input').attr('data-price'));
|
||||
val = val + 1;
|
||||
totalPrice = val * price;
|
||||
$('.day').text(val);
|
||||
$('.b-input').val(val);
|
||||
$('.totalprice').html(totalPrice);
|
||||
})
|
||||
// 减少按钮
|
||||
$('.remove-btn').on('click', function() {
|
||||
var val = parseInt($('.b-input').val());
|
||||
var price = parseInt($('.b-input').attr('data-price'));
|
||||
if(val > 1) {
|
||||
val = val - 1;
|
||||
}else{
|
||||
val = 1;
|
||||
}
|
||||
totalPrice = val * price;
|
||||
$('.day').text(val);
|
||||
$('.b-input').val(val);
|
||||
$('.totalprice').html(totalPrice);
|
||||
})
|
||||
// 购买确认
|
||||
$('.confirm-btn').on('click', function() {
|
||||
var packNum = $('.b-input').val();
|
||||
var packId = $(this).attr('data-pid');
|
||||
if(packNum == 0) {
|
||||
ajaxTip('最少购买一个哦~');
|
||||
return;
|
||||
}else{
|
||||
$.ajax({
|
||||
headers: {
|
||||
pub_ticket: info.ticket
|
||||
},
|
||||
type: 'POST',
|
||||
url: api + '/activity/pack/buy',
|
||||
data: {
|
||||
uid: info.uid,
|
||||
ticket: info.ticket,
|
||||
packId: packId,
|
||||
packNum: packNum
|
||||
},
|
||||
success: function(res) {
|
||||
if(res) {
|
||||
if (res.code == 200) { // 购买成功
|
||||
$('.buy-mask').hide().siblings('.statusMask').fadeIn(300);
|
||||
$('.success').show();
|
||||
$('.fail').hide();
|
||||
$('.statusMask .tip').html('获赠门票×' + res.data);
|
||||
renderTicket();
|
||||
} else if (res.code == 2103) { // 余额不足
|
||||
$('.buy-mask').hide().siblings('.statusMask').fadeIn(300);
|
||||
$('.buy-mask,.success').hide();
|
||||
$('.fail').show();
|
||||
$('.statusMask .tip').html('亲,余额不足~');
|
||||
if (browser.ios) {
|
||||
$('.android').hide();
|
||||
} else if (browser.android) {
|
||||
$('.ios').hide();
|
||||
}
|
||||
} else {
|
||||
ajaxTip(res.message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
// 充值跳转
|
||||
$('.recharge').on('click', function() {
|
||||
if (browser.ios) {
|
||||
$('.statusMask,.shade').fadeOut(300);
|
||||
} else {
|
||||
tools.nativeUtils.jumpAppointPage('RECHARGE_PAGE');
|
||||
}
|
||||
})
|
||||
},
|
||||
getData: function() {
|
||||
renderTicket();
|
||||
renderGift();
|
||||
}
|
||||
};
|
||||
main.init();
|
||||
});
|
||||
|
||||
// 渲染底部tab
|
||||
function renderTicket() {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/queryTicketNum',
|
||||
data: {
|
||||
uid: info.uid
|
||||
},
|
||||
success: function(res) {
|
||||
if(res.code === 200) {
|
||||
if (res.data.nick.length > 10) {
|
||||
res.data.nick = res.data.nick.substring(0, 10) + '...'
|
||||
}
|
||||
$('.mine').find('.avatar img').attr('src', res.data.avatar)
|
||||
$('.mine').find('.nick').html(res.data.nick)
|
||||
$('.mine').find('.score').html(res.data.num)
|
||||
}else{
|
||||
ajaxTip(res.message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 渲染礼包信息
|
||||
function renderGift() {
|
||||
$.ajax({
|
||||
headers: {
|
||||
pub_ticket: info.ticket
|
||||
},
|
||||
type: 'POST',
|
||||
url: api + '/activities/draw/getPackList',
|
||||
data: {
|
||||
uid: info.uid,
|
||||
ticket: info.ticket
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.code == 200) {
|
||||
var html = '';
|
||||
var num = '';
|
||||
res.data.forEach(function(item, index) {
|
||||
if(item.sellingPrice == 200) {
|
||||
num = '7-10'
|
||||
}else if(item.sellingPrice == 1000) {
|
||||
num = '30-50'
|
||||
}else if(item.sellingPrice == 2000) {
|
||||
num = '70-100'
|
||||
}else if(item.sellingPrice == 10000) {
|
||||
num = '300-500'
|
||||
}
|
||||
// 新增的档位20000,赠送600-1000门票,添加日期2020-12-08
|
||||
else if(item.sellingPrice == 20000) {
|
||||
num = '600-1000'
|
||||
}
|
||||
html += '<li data-id="' + item.id + '">' +
|
||||
'<h3 class="h-title">限定装扮' + NoToChinese(index + 1) + '</h3>' +
|
||||
'<div class="gift-img"><img src="' + item.imgUrl + '" alt=""></div>' +
|
||||
'<div class="gift-text">' +
|
||||
'<p>' + item.name + '</p>' +
|
||||
'<p><span class="price" data-money="' + item.sellingPrice + '">' + item.sellingPrice + '</span>金币/天</p>' +
|
||||
'<p>' + item.originalPrice + '金币/天</p>' +
|
||||
'<p>随机赠送门票' + num + '张</p>' +
|
||||
'</div>' +
|
||||
'<div class="buy-btn gray" data-gid="' + item.id + '"></div>' +
|
||||
'</li>'
|
||||
})
|
||||
$('.cloth-box').html(html);
|
||||
renderBuyStatus();
|
||||
// 购买弹窗
|
||||
$('.cloth-box').on('click', '.buy-btn', function() {
|
||||
var packId = $(this).attr('data-gid');
|
||||
var name = $(this).siblings('.gift-text').find('p:first').text();
|
||||
var sellingPrice = $(this).siblings('.gift-text').find('.price').attr('data-money');
|
||||
$('.buy-mask .day').text(1);
|
||||
$('.buy-mask .b-input').val(1);
|
||||
$('.buy-mask .giftName').html(name);
|
||||
$('.buy-mask .totalprice').html(sellingPrice);
|
||||
$('.buy-mask .confirm-btn').attr('data-pid', packId);
|
||||
$('.buy-mask .b-input').attr('data-price', sellingPrice);
|
||||
$('.shade,.buy-mask').fadeIn(300);
|
||||
})
|
||||
}else{
|
||||
ajaxTip(res.message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
// 渲染购买状态
|
||||
function renderBuyStatus() {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: api + '/activities/draw/getDate',
|
||||
data: {},
|
||||
success: function(res) {
|
||||
if(res.code == 200) {
|
||||
var date = new Date().getTime();
|
||||
var start = (browser.ios) ? res.data.start : res.data.start;
|
||||
var end = (browser.ios) ? res.data.end : res.data.end;
|
||||
if (start < date && date < end) {
|
||||
$('.buy-btn').removeClass('gray').prop('disabled', false);
|
||||
} else {
|
||||
$('.buy-btn').removeClass().addClass('buy-btn gray').prop('disabled', true);
|
||||
}
|
||||
}else{
|
||||
ajaxTip(res.message);
|
||||
return;
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 封装提示信息
|
||||
function ajaxTip(callText) {
|
||||
var thisBody = document.getElementsByTagName('body')[0];
|
||||
var Div = document.createElement('div');
|
||||
var text = "<p class='ajaxtiptext'>" + callText + '</p>'
|
||||
Div.setAttribute('class', 'ajaxtiplayer');
|
||||
Div.innerHTML = text;
|
||||
Div.style.display = 'block';
|
||||
thisBody.appendChild(Div);
|
||||
setTimeout(function() {
|
||||
thisBody.removeChild(Div);
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
// 将数字转为中文数字
|
||||
function NoToChinese(num) {
|
||||
if (!/^\d*(\.\d*)?$/.test(num)) {
|
||||
alert('Number is wrong!');
|
||||
return 'Number is wrong!';
|
||||
}
|
||||
// eslint-disable-next-line no-array-constructor
|
||||
var AA = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九');
|
||||
// eslint-disable-next-line no-array-constructor
|
||||
var BB = new Array('', '十', '百', '千', '万', '亿', '点', '');
|
||||
var a = ('' + num).replace(/(^0*)/g, '').split('.');
|
||||
var k = 0;
|
||||
var re = '';
|
||||
for (var i = a[0].length - 1; i >= 0; i--) {
|
||||
switch (k) {
|
||||
case 0:
|
||||
re = BB[7] + re;
|
||||
break;
|
||||
case 4:
|
||||
if (!new RegExp('0{4}\\d{' + (a[0].length - i - 1) + '}$').test(a[0])) { re = BB[4] + re; }
|
||||
break;
|
||||
case 8:
|
||||
re = BB[5] + re;
|
||||
BB[7] = BB[5];
|
||||
k = 0;
|
||||
break;
|
||||
}
|
||||
if (k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0) re = AA[0] + re;
|
||||
if (a[0].charAt(i) != 0) re = AA[a[0].charAt(i)] + BB[k % 4] + re;
|
||||
k++;
|
||||
}
|
||||
if (a.length > 1) {
|
||||
re += BB[6];
|
||||
// eslint-disable-next-line no-redeclare
|
||||
for (var i = 0; i < a[1].length; i++) re += AA[a[1].charAt(i)];
|
||||
}
|
||||
return re;
|
||||
}
|
||||
|
||||