完成房间pk榜单
This commit is contained in:
@@ -50,7 +50,7 @@ body {
|
|||||||
height: 1.21333rem;
|
height: 1.21333rem;
|
||||||
background: url(../images/time.png) no-repeat;
|
background: url(../images/time.png) no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
position: relative;
|
position: absolute;
|
||||||
top: 11.18667rem;
|
top: 11.18667rem;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
@@ -88,7 +88,7 @@ body {
|
|||||||
width: 4.49333rem;
|
width: 4.49333rem;
|
||||||
height: 1.02667rem;
|
height: 1.02667rem;
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 10.8rem;
|
top: 12.1rem;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
}
|
}
|
||||||
|
@@ -54,7 +54,7 @@ body {
|
|||||||
height: px2rem(91);
|
height: px2rem(91);
|
||||||
background: url(../images/time.png) no-repeat;
|
background: url(../images/time.png) no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
position: relative;
|
position: absolute;
|
||||||
top: px2rem(839);
|
top: px2rem(839);
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
@@ -92,7 +92,7 @@ body {
|
|||||||
width: px2rem(337);
|
width: px2rem(337);
|
||||||
height: px2rem(77);
|
height: px2rem(77);
|
||||||
position: relative;
|
position: relative;
|
||||||
top: 10.8rem;
|
top: 12.1rem;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
}
|
}
|
||||||
|
@@ -29,8 +29,8 @@
|
|||||||
<img src="./images/title.png" alt="" class="title">
|
<img src="./images/title.png" alt="" class="title">
|
||||||
<!-- 切换 -->
|
<!-- 切换 -->
|
||||||
<div class="tab">
|
<div class="tab">
|
||||||
<div class="tab1 act1"></div>
|
<div class="tab1"></div>
|
||||||
<div class="tab2"></div>
|
<div class="tab2 act2"></div>
|
||||||
<div class="tab3"></div>
|
<div class="tab3"></div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 时间结束展示tab -->
|
<!-- 时间结束展示tab -->
|
||||||
|
@@ -27,6 +27,10 @@ const toastMsg = (content = '操作完成', time = 2) => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
var leftTime;//倒计时暂存
|
var leftTime;//倒计时暂存
|
||||||
|
var timeOut2;//倒计时暂存
|
||||||
|
var rankType = 1;//1日榜2总榜
|
||||||
|
var date;//日期
|
||||||
|
var dateArr = [];//存放昨日和今日时间
|
||||||
// 初始化函数
|
// 初始化函数
|
||||||
$(function () {
|
$(function () {
|
||||||
getInfoFromClient()
|
getInfoFromClient()
|
||||||
@@ -47,22 +51,36 @@ $(function () {
|
|||||||
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
window.webkit.messageHandlers.closeWebView.postMessage(null)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
getRank();
|
getRank(rankType, date);
|
||||||
}, 100)
|
}, 100)
|
||||||
})
|
})
|
||||||
// 获取榜单接口
|
// 获取榜单接口
|
||||||
function getRank (rankType, date) {
|
function getRank (rankType, date) {
|
||||||
$('.list li').remove();
|
$('.list li').remove();
|
||||||
// showLoading()
|
showLoading()
|
||||||
networkRequest({
|
networkRequest({
|
||||||
type: 'get',
|
type: 'get',
|
||||||
url: urlPrefix + '',
|
url: urlPrefix + '/act/2023RoomPk/rank/getRank',
|
||||||
data: { rankType, date },
|
data: { rankType, date },
|
||||||
success (res) {
|
success (res) {
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
// 处理倒计时
|
// 处理倒计时
|
||||||
leftTime = res.data.endTime - res.timestamp;
|
leftTime = res.data.endTime - res.timestamp;
|
||||||
|
if (rankType == 1) {
|
||||||
|
const curTime = res.timestamp
|
||||||
|
const endTime = (new Date(`${res.data.dateList[res.data.dateList.length - 1]} 23:59:59`).getTime())
|
||||||
|
const hadEnd = (endTime - curTime) <= 0
|
||||||
|
if (hadEnd) {
|
||||||
|
rankType = 2;
|
||||||
|
date = null;
|
||||||
|
getRank(rankType, date)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
countup();
|
countup();
|
||||||
|
dateArr[0] = dateFormat(res.timestamp - 86400000, 'yyyy-MM-dd');
|
||||||
|
dateArr[1] = dateFormat(res.timestamp, 'yyyy-MM-dd');
|
||||||
// 处理前三
|
// 处理前三
|
||||||
var top3 = res.data.rankList.slice(0, 3);
|
var top3 = res.data.rankList.slice(0, 3);
|
||||||
var notTop3 = res.data.rankList.slice(3);
|
var notTop3 = res.data.rankList.slice(3);
|
||||||
@@ -112,8 +130,16 @@ function getRank (rankType, date) {
|
|||||||
// 榜单切换
|
// 榜单切换
|
||||||
$('.tab div').click(function () {
|
$('.tab div').click(function () {
|
||||||
var i = $(this).index() + 1;
|
var i = $(this).index() + 1;
|
||||||
|
rankType = i == 1 || i == 2 ? 1 : 2;
|
||||||
$('.tab div').removeClass('act1').removeClass('act3').removeClass('act2');
|
$('.tab div').removeClass('act1').removeClass('act3').removeClass('act2');
|
||||||
$(this).addClass(`act${i}`)
|
$(this).addClass(`act${i}`);
|
||||||
|
if (i == 1 || i == 2) {
|
||||||
|
date = dateArr[i - 1];
|
||||||
|
} else {
|
||||||
|
date = null;
|
||||||
|
}
|
||||||
|
getRank(rankType, date);
|
||||||
|
|
||||||
})
|
})
|
||||||
// 规则tab切换
|
// 规则tab切换
|
||||||
$('.rule .rule_in .tabs div').click(function () {
|
$('.rule .rule_in .tabs div').click(function () {
|
||||||
@@ -149,7 +175,7 @@ function countup () {
|
|||||||
var s = 0;
|
var s = 0;
|
||||||
//定义变量 d,h,m,s保存倒计时的时间
|
//定义变量 d,h,m,s保存倒计时的时间
|
||||||
var d, h, m, s;
|
var d, h, m, s;
|
||||||
if (leftTime >= 0) {
|
if (leftTime > 0) {
|
||||||
d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
|
d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
|
||||||
h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
|
h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
|
||||||
m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
|
m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
|
||||||
@@ -161,13 +187,15 @@ function countup () {
|
|||||||
$('.time .sp4').text(d);
|
$('.time .sp4').text(d);
|
||||||
leftTime = leftTime - 1000;
|
leftTime = leftTime - 1000;
|
||||||
//递归每秒调⽤countTime⽅法,显⽰动态时间效果
|
//递归每秒调⽤countTime⽅法,显⽰动态时间效果
|
||||||
|
} else if (leftTime == 0) {
|
||||||
|
getRank(rankType, date);
|
||||||
|
return
|
||||||
} else {
|
} else {
|
||||||
|
//todo 展示活动已结束
|
||||||
$('.timeOutTab').show();
|
$('.timeOutTab').show();
|
||||||
$('.timeOut').show();
|
$('.timeOut').show();
|
||||||
$('.tab').hide();
|
$('.tab').hide();
|
||||||
$('.time').hide();
|
$('.time').hide();
|
||||||
getRank(rankType, date);
|
|
||||||
return
|
|
||||||
}
|
}
|
||||||
timeOut2 = setTimeout(countup, 1000);
|
timeOut2 = setTimeout(countup, 1000);
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user