Compare commits

...

21 Commits

Author SHA1 Message Date
Dragon
7659a5db68 清除缓存 2024-03-29 16:30:02 +08:00
Dragon
3790ddf2b8 完善厨房音效特性 2024-03-29 16:27:27 +08:00
Dragon
78be3be98e 新增标头信息 2024-03-29 14:53:11 +08:00
Dragon
597d717c9d 厨房音效暂存 2024-03-29 14:42:50 +08:00
Dragon
00f179e786 优化名字 2024-03-28 10:58:09 +08:00
Dragon
ddc6d7e6c4 优化房间帮ui 2024-03-28 10:17:29 +08:00
Dragon
4f23c91703 替换图片 2024-03-27 17:59:34 +08:00
Dragon
bfac90f0d5 替换ui优化首页魔盒任务 2024-03-27 14:42:00 +08:00
Dragon
700c523190 修复bug 2024-03-26 20:48:39 +08:00
Dragon
26c35ac780 新增未直播跳转房间逻辑 2024-03-26 18:21:57 +08:00
Dragon
c9179fe6c7 修改倒计时判断内容 2024-03-26 17:21:31 +08:00
Dragon
c788cc4f9c 修复房间列表报错问题 2024-03-26 15:45:06 +08:00
Dragon
f62710be48 繁体化 2024-03-26 15:25:09 +08:00
Dragon
f17f734d6a 新增未开始倒计时判断 2024-03-26 15:22:57 +08:00
Dragon
aa1880de2d 新增图片 2024-03-25 19:05:14 +08:00
Dragon
f71a301cd1 完成愚人节活动 2024-03-25 19:05:14 +08:00
Dragon
880d9db326 首页暂存 2024-03-25 19:05:13 +08:00
Dragon
c2f227a79e 暂存 2024-03-25 19:05:13 +08:00
Dragon
c11b655899 新增幸运礼物账单 2024-03-25 15:33:38 +08:00
Dragon
913cb44d94 修改账单 2024-03-20 21:24:29 +08:00
Dragon
295eae5074 重新加载js 2024-03-20 21:15:55 +08:00
128 changed files with 6472 additions and 1040 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 232 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 252 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 455 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 248 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 299 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 103 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 202 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 240 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 329 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 345 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 198 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 248 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 414 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 945 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 414 KiB

View File

@@ -0,0 +1,269 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>愚樂派對</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css?v=1.0">
</head>
<body>
<!-- 頂部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
</div>
<!-- 頭部 -->
<div class="header">
<!-- 限定禮物 -->
<img src="./images/qualifyGift_icon.png" alt="" class="qualifyGift_icon">
<!-- 活動規則 -->
<img src="./images/rule_icon.png" alt="" class="rule_icon">
</div>
<!-- tab切換 -->
<div class="tabs">
<div class="tab1 act1"></div>
<div class="tab2"></div>
<div class="tab3"></div>
<div class="tab4"></div>
</div>
<!-- 頁面1 -->
<div class="page1">
<!-- 奇幻魔盒 -->
<div class="box1">
<img src="./images/pageBox1Rule_icon.png" alt="" class="pageBox1Rule_icon">
<div class="time">3分鐘倒計時: <span class="sp1">03</span><span class="sp2">00</span></div>
<div class="text">用戶在送出第一個奇幻魔盒後開啓3分鐘倒計時<br>在此期間內點亮所有禮物,可獲得<b>【愚人慶典】</b>禮物*1</div>
<div class="giftBoxs">
<!-- <div class="">
<img src="./images/pageBox1Gift1.png" alt="">
撲克士兵
</div>
<div>
<img src="./images/pageBox1Gift2.png" alt="">
咬咬鯊
</div>
<div>
<img src="./images/pageBox1Gift3.png" alt="">
兔子先生
</div>
<div>
<img src="./images/pageBox1Gift4.png" alt="">
甜心魔法
</div>
<div>
<img src="./images/pageBox1Gift5.png" alt="">
奇趣雜技
</div> -->
</div>
</div>
<!-- 奇幻榜 -->
<div class="box2">
<!-- 前三 -->
<div class="top3">
<div class="no1">
<img src="./images/page1Top1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
<div class="no2">
<img src="./images/page1Top2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
<div class="no3">
<img src="./images/page1Top3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
</div>
<!-- 非前三 -->
<ul>
<!-- <li>
<div class="num">1.</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值: 20</div>
</li> -->
</ul>
</div>
<!-- 自己榜單 -->
<div class="my">
<div class="num">1.</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值: 20</div>
</div>
</div>
<!-- 頁面2 -->
<div class="page2">
<!-- 更新 -->
<img src="./images/upDate.png" alt="" class="upDate">
<!-- 切換 -->
<div class="tab">
<div class="act1">牌照房間</div>
<div class="">個播房間</div>
</div>
<!-- 第一名房間 -->
<div class="topRoom">
<img src="./images/logo.png" alt="" class="tx">
<div class="roomName">房間昵稱</div>
<div class="score">房間進度值: <b>00.0%</b></div>
</div>
<!-- 第一名進度 -->
<div class="topLine">
<div></div>
<span>0/0</span>
</div>
<!-- 文案介紹 -->
<div class="text">房間進度值達到100%,即可開啓紅包雨</div>
<!-- 第一名房間跳轉 -->
<img src="./images/page2ToRoomBut.png" alt="" class="page2ToRoomBut">
<div class="page2NotTopTitle">其他房間推薦</div>
<!-- 其他房間 -->
<ul>
<li>
<img src="./images/logo.png" alt="" class="tx">
<div class="live">直播中</div>
<div class="roomName">房間昵稱</div>
<div class="score">房間進度值: <b>00.0%</b></div>
<div class="line_in">
<div></div>
<span>0/0</span>
</div>
<img src="./images/go.png" alt="" class="go">
<img src="./images/notGo.png" alt="" class="notGo">
</li>
</ul>
</div>
<!-- 頁面3 -->
<div class="page3"></div>
<!-- 頁面4 -->
<div class="page4 page41">
<!-- 切換 -->
<div class="page4_tab">
<div></div>
<div></div>
</div>
<!-- 日榜總榜切換 -->
<div class="dayTab">
<div class="act">日榜</div>
<div>總榜</div>
</div>
<!-- 日期切換 -->
<div class="timeTab">
<div class="act">3.27</div>
<div>3.27</div>
<div>3.27</div>
<div>3.27</div>
<div>3.27</div>
<div>3.27</div>
</div>
<!-- 前三 -->
<div class="top3">
<div class="no1">
<img src="./images/page1Top1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
<div class="no2">
<img src="./images/page1Top2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
<div class="no3">
<img src="./images/page1Top3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值:0</div>
</div>
</div>
<!-- 非前三 -->
<ul>
<li>
<div class="num">1.</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值: 20</div>
</li>
</ul>
<!-- 自己榜單 -->
<div class="my">
<div class="num">1.</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用戶昵稱</div>
<div class="score">奇幻值: 20</div>
</div>
</div>
<!-- 魔盒說明 -->
<div class="MagicBoxRule">
<div class="MagicBoxRule_in MagicBoxRule1">
<!-- 切換 -->
<div class="tab">
<div></div>
<div></div>
</div>
<!-- 切換頁面1 -->
<img src="./images/MagicBoxRule1Bg.png" alt="" class="MagicBoxRulePage1">
<!-- 切換頁面2 -->
<div class="MagicBoxRulePage2">
<ul>
<li>
<div>
<p>2024/3/19</p>
<b>14:07:07</b>
</div>
<div class="centen">用戶昵稱</div>
<div class="right">
<p>獲得:禮物名稱</p>
<b>0 <img src="./images/diamond.png" alt=""></b>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- 活動規則 -->
<div class="rule">
<div class="rule_in">
<div class="box">
<img src="./images/rule_in.png" alt="" srcset="">
</div>
</div>
</div>
<!-- 限定禮物規則 -->
<div class="limitedGift">
<div class="limitedGift_in">
<div class="box">
<img src="./images/limitedGift_in.png" alt="" srcset="">
</div>
</div>
</div>
</body>
</html>
</html>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="./js/index.js"></script>

View File

@@ -0,0 +1,566 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
let layerIndex
const showLoading = (content = '加載中...') => {
layer.open({
type: 2,
shadeClose: false,
content,
success (e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = '操作完成', time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var page = 1;
var isLock = true;
var timeOut = null;
var countupTime = 0;
var XIAO_CHOU_ROOM = 'XIAO_CHOU_ROOM_1';
var rankType = 1; //排行榜類型1=送禮日榜2=送禮總榜3=收禮日榜4=收禮總榜);
var data = null;//默認日榜;
var type = 'a';//a:送禮b:收禮;
var type2 = 'a';//a:日榜b:總榜;
var curDate; //當天日期;
// 初始化函數
$(function () {
getInfoFromClient()
setTimeout(function () {
// 頁面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 頂部返回事件
$('.back').click(() => {
if (browser.android) {
window.androidJsObj.closeWebView()
} else {
window.webkit.messageHandlers.closeWebView.postMessage(null)
}
})
getTime();
getRank();
}, 100)
})
// 獲取任務接口
function getTaskUser () {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/activity/task/user',
data: { componentCode: "QI_HUAN_MO_HE" },
success (res) {
if (res.code === 200) {
// 渲染愚人盛典禮物
$('.page1 .box1 .giftBoxs div').remove();
var str = '';
res.data[0].children.forEach((res, i) => {
var img = res.taskIcon.split("|");
str += `
<div class="${res.completed ? 'act' : ''}">
<img src = "${res.completed ? img[1] : img[0]}" alt = "" >
${res.taskName}
</div >
`
});
$('.page1 .box1 .giftBoxs').append(str);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
}
})
}
// 獲取倒計時接口
function getTime () {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/2024AprilFoolsDay/getTime',
data: { activityCode: "ACT_2024_APRIL_FOOLS_DAY", taskCode: "QI_HUAN_GIFT" },
success (res) {
if (res.code === 200) {
if (res.data) {
countupTime = res.data - res.timestamp;
countup();
}
getTaskUser();
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
}
})
}
// 倒計時
function countup () {
clearTimeout(timeOut)
//獲取當前時間
var d = 0;
var h = 0;
var m = 0;
var s = 0;
//定義變量 d,h,m,s保存倒計時的時間
var d, h, m, s;
if (countupTime >= 0) {
d = getzf(Math.floor(countupTime / 1000 / 60 / 60 / 24));
h = getzf(Math.floor(countupTime / 1000 / 60 / 60 % 24));
m = getzf(Math.floor(countupTime / 1000 / 60 % 60));
s = getzf(Math.floor(countupTime / 1000 % 60));
//將倒計時賦值到div中
$('.page1 .box1 .time .sp1').text(m);
$('.page1 .box1 .time .sp2').text(s);
countupTime = countupTime - 1000;
//遞歸每秒調⽤countTime⽅法顯⽰動態時間效果
} else {
getTime();
return
}
timeOut = setTimeout(countup, 1000);
}
//補0操作
function getzf (num) {
if (parseInt(num) < 10) {
num = '0' + num;
}
return num;
}
// tab切換
$('.tabs div').click(function () {
var i = $(this).index() + 1;
$('.tabs div').removeClass('act1').removeClass('act2').removeClass('act3').removeClass('act4');
$(this).addClass(`act${i}`);
$('.page1,.page2,.page3,.page4').hide();
$(`.page${i}`).show();
if (i == 1) {
getRank();
} else if (i == 2) {
getRooms();
} else if (i == 4) {
giftGetRank(rankType, data);
}
})
// 更新房間接口按鈕
$('.page2 .upDate').click(function () {
getRooms();
})
// 獲取奇幻榜接口
function getRank () {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/2023Halloween/rank/getRank',
data: { rankType: 4, pageSize: 15, },
success (res) {
if (res.code === 200) {
// 處理前三
var top3 = res.data.rankList.slice(0, 3);
var notTop3 = res.data.rankList.slice(3);
if (top3.length < 3) {
let arr = new Array(3 - top3.length).fill({
avatar: './images/logo.png',
nick: '虛位以待',
score: "0"
})
top3.push(...arr)
}
top3.forEach((res, i) => {
$(`.page1 .box2 .top3 .no${i + 1} .tx`).attr('src', res.avatar);
$(`.page1 .box2 .top3 .no${i + 1} .nick`).text(res.nick);
$(`.page1 .box2 .top3 .no${i + 1} .score`).html('奇幻值<br>' + unitProcessing(res.score, 10000, 1, 'w'))
})
// 非前三
var str = '';
$('.page1 .box2 ul li').remove();
notTop3.forEach((res, i) => {
str += `
<li>
<div class="num">${res.ranking}.</div>
<img src="${res.avatar}" alt="" class="tx">
<div class="nick">${res.nick}</div>
<div class="score">奇幻值: ${unitProcessing(res.score, 10000, 1, 'w')}</div>
</li>
`
})
$('.page1 .box2 ul').append(str);
// 處理自己榜單
$('.page1 .my .num').text(res.data.meRank.ranking == 0 ? '未上榜' : res.data.meRank.ranking);
$('.page1 .my .tx').attr('src', res.data.meRank.avatar);
$('.page1 .my .nick').text(res.data.meRank.nick);
$('.page1 .my .score').text('奇幻值' + unitProcessing(res.data.meRank.score, 10000, 1, 'w'));
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
}
})
}
// 頁面2切換
$('.page2 .tab div').click(function () {
var i = $(this).index() + 1;
$('.page2 .tab div').removeClass('act1').removeClass('act2');
$(this).addClass(`act${i}`);
XIAO_CHOU_ROOM = i == 1 ? 'XIAO_CHOU_ROOM_1' : 'XIAO_CHOU_ROOM_4';
getRooms();
})
// 獲取房間榜接口
function getRooms () {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/2024AprilFoolsDay/getRooms',
data: { activityCode: "ACT_2024_APRIL_FOOLS_DAY", taskCode: XIAO_CHOU_ROOM },
success (res) {
if (res.code === 200) {
var top = res.data.slice(0, 1);
if (top.length < 3) {
let arr = new Array(1 - top.length).fill({
roomAvatar: './images/logo.png',
roomTitle: '虛位以待',
percentage: 0,
activityValue: 0,
conditionValue: 0,
})
top.push(...arr)
}
console.log(top);
var notTop = res.data.slice(1);
// 第一房間
$('.page2 .topRoom .tx').attr('src', top[0].roomAvatar);
$('.page2 .topRoom .roomName').text(top[0].roomTitle);
$('.page2 .topRoom .score b').text(top[0].percentage + '%');
$('.page2 .topLine div').css('width', top[0].percentage + '%');
$('.page2 .topLine span').text(`${top[0].activityValue}/${top[0].conditionValue}`);
$('.page2 .page2ToRoomBut').attr("uid", top[0].roomUid);
$('.page2 .page2ToRoomBut').attr("src", top[0].isUnderway ? './images/page2ToRoomBut.png' : './images/page2ToRoomBut2.png');
$('.page2 .page2ToRoomBut').attr("isUnderway", top[0].isUnderway);
// 其他房間
$('.page2 ul li').remove();
var str = '';
notTop.forEach(res => {
str += `
<li>
<img src="${res.roomAvatar}" alt="" class="tx">
<div class="live" style="display:${res.isLive ? 'block' : 'none'}">直播中</div>
<div class="roomName">${res.roomTitle}</div>
<div class="score">房間進度值: <b>${res.percentage}%</b></div>
<div class="line_in">
<div style="width:${res.percentage}%"></div>
<span>${res.activityValue}/${res.conditionValue}</span>
</div>
<img style="display:${res.isUnderway ? 'block' : 'none'}" src="./images/go.png" alt="" class="go" uid=${res.roomUid}>
<img style="display:${!res.isUnderway ? 'block' : 'none'}" src="./images/notGo.png" alt="" class="notGo" uid=${res.roomUid}>
</li>
`
})
$('.page2 ul').append(str);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
}
})
}
// 房間最前面的跳轉按鈕
$('.page2 .page2ToRoomBut').click(function () {
var uid = $(this).attr('uid');
var isUnderway = $(this).attr('isUnderway');
if (isUnderway) {
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(uid);
}
}
}
})
// 其他房間跳轉房間按鈕
$('.page2 ul').on('click', ' li .go', function () {
var uid = $(this).attr('uid');
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(uid);
}
}
})
// 其他房間跳轉房間按鈕
$('.page2 ul').on('click', ' li .notGo', function () {
var uid = $(this).attr('uid');
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(uid);
}
}
})
// 頁面4切換
$('.page4 .page4_tab div').click(function () {
var i = $(this).index() + 1;
$('.page4').removeClass('page41').removeClass('page42');
$('.page4').addClass(`page4${i}`);
if (i == 1) {
type = 'a';
rankType = type2 == "a" ? 1 : 2;
} else {
type = 'b';
rankType = type2 == "a" ? 3 : 4;
}
giftGetRank(rankType, data);
})
// 頁面4 日榜/總榜切換
$('.page4 .dayTab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('act').siblings().removeClass('act')
if (i == 1) {
type2 = 'a';
rankType = type == "a" ? 1 : 3;
$('.page4 .timeTab').show();
} else {
type2 = 'b';
rankType = type == "a" ? 2 : 4;
$('.page4 .timeTab').hide();
}
giftGetRank(rankType, data);
})
// 頁面4 日期切換
$('.page4 .timeTab div').click(function () {
var i = $(this).index() + 1;
var datas = $(this).attr('data');
$(this).addClass('act').siblings().removeClass('act')
rankType = type == "a" ? 1 : 3;//排行榜類型1=甜蜜日榜2=甜蜜總榜3=愛意日榜4=愛意總榜)
data = datas;
giftGetRank(rankType, data);
})
// 獲取愚人榜單接口
function giftGetRank (rankType, date) {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/special/gift/getRank',
data: { rankType, date, pageSize: 30 },
success (res) {
if (res.code === 200) {
// 設置當天日期
curDate = res.data.curDate;
// 處理日期
if (res.data.dateList) {
res.data.dateList.forEach((res, i) => {
$('.page4 .timeTab div').eq(i).text(`${res[5]}${res[6]}.${res[8]}${res[9]}`);
$('.page4 .timeTab div').eq(i).attr('data', res);
if (res == curDate && date == null) {
$('.page4 .timeTab div').removeClass('act')
$('.page4 .timeTab div').eq(i).addClass('act');
}
})
}
// 處理前三
var top3 = res.data.rankList.slice(0, 3);
var notTop3 = res.data.rankList.slice(3);
if (top3.length < 3) {
let arr = new Array(3 - top3.length).fill({
avatar: './images/logo.png',
nick: '虛位以待',
score: "0"
})
top3.push(...arr)
}
top3.forEach((res, i) => {
$(`.page4 .top3 .no${i + 1} .tx`).attr('src', res.avatar);
$(`.page4 .top3 .no${i + 1} .nick`).text(res.nick);
$(`.page4 .top3 .no${i + 1} .score`).html(`${rankType == 1 || rankType == 2 ? '愚樂值' : '歡樂值'}<br>` + unitProcessing(res.score, 10000, 1, 'w'))
})
// 非前三
var str = '';
$('.page4 ul li').remove();
notTop3.forEach((res, i) => {
str += `
<li>
<div class="num">${res.ranking}.</div>
<img src="${res.avatar}" alt="" class="tx">
<div class="nick">${res.nick}</div>
<div class="score">${rankType == 1 || rankType == 2 ? '愚樂值' : '歡樂值'}: ${unitProcessing(res.score, 10000, 1, 'w')}</div>
</li>
`
})
$('.page4 ul').append(str);
// 處理自己榜單
$('.page4 .my .num').text(res.data.meRank.ranking == 0 ? '未上榜' : res.data.meRank.ranking);
$('.page4 .my .tx').attr('src', res.data.meRank.avatar);
$('.page4 .my .nick').text(res.data.meRank.nick);
$('.page4 .my .score').text(`${rankType == 1 || rankType == 2 ? '愚樂值' : '歡樂值'}` + unitProcessing(res.data.meRank.score, 10000, 1, 'w'));
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
}
})
}
// 魔盒切換
$('.MagicBoxRule .MagicBoxRule_in .tab div').click(function () {
var i = $(this).index() + 1;
$('.MagicBoxRule .MagicBoxRule_in').removeClass('MagicBoxRule1').removeClass('MagicBoxRule2');
$('.MagicBoxRule .MagicBoxRule_in').addClass(`MagicBoxRule${i}`);
$('.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage1,.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage2').hide();
$(`.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage${i}`).show();
return false;
})
// 獲取魔盒接口
function getRecordPage () {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/activity/task/user/record/page',
data: {
componentCode: "QI_HUAN_MO_HE",
activityCode: 'ACT_2024_APRIL_FOOLS_DAY',
pageNum: page,
pageSize: 20,
},
success (res) {
if (res.code === 200) {
var str = ''
if (res.data.records.length == 0) {
str = `
<li class="not">暫無記錄</li>
`
isLock = false;
} else {
res.data.records.forEach(res => {
str += `
<li>
<div>
<p>${dateFormat(res.createTime, 'yyyy/MM/dd')}</p>
<b>${dateFormat(res.createTime, 'hh:mm:ss')}</b>
</div>
<div class="centen">${res.nick}</div>
<div class="right">
<p>獲得:${res.rewardName}</p>
<b>${res.showValue} <img src="./images/diamond.png" alt=""></b>
</div>
</li>
`
})
isLock = true;
}
$('.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage2 ul').append(str);
} else {
toastMsg(res.message)
isLock = true;
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('網路錯誤,請退出重進')
isLock = true;
}
})
}
// 滾動
$('.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage2 ul').scroll(function () {
let scrollTop = $(this).scrollTop()
let scrollHeight = $('.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage2 ul')[0].scrollHeight
let ulHeight = $(this).innerHeight()
if (scrollTop + ulHeight + 100 >= scrollHeight) {
if (isLock) {
// 請求下一頁
page = page + 1;
getRecordPage();
isLock = false;
}
}
})
// 打開魔盒規則
$('.page1 .box1 .pageBox1Rule_icon').click(function () {
$('.MagicBoxRule .MagicBoxRule_in .MagicBoxRulePage2 ul li').remove();
getRecordPage();
$('.MagicBoxRule').show();
bodyScroolFun(true);
})
// 關閉魔盒規則
$('.MagicBoxRule').click(function () {
$('.MagicBoxRule').hide();
bodyScroolFun(false);
})
// 打開規則
$('.header .rule_icon').click(function () {
$('.rule').show();
bodyScroolFun(true);
})
// 關閉規則
$('.rule').click(function () {
$('.rule').hide();
bodyScroolFun(false);
})
// 打開限定禮物規則
$('.header .qualifyGift_icon').click(function () {
$('.limitedGift').show();
bodyScroolFun(true);
})
// 關閉限定禮物規則
$('.limitedGift').click(function () {
$('.limitedGift').hide();
bodyScroolFun(false);
})

View File

@@ -40,6 +40,14 @@ html {
top: 1.18667rem;
}
.header .muciek {
width: 0.8rem;
height: 0.8rem;
position: absolute;
right: 0.55rem;
top: 1.8rem;
}
.header .record_icon {
width: 1.57333rem;
height: 0.61333rem;

View File

@@ -43,6 +43,15 @@ html {
top: px2rem(89);
}
.muciek {
width: px2rem(60);
height: px2rem(60);
position: absolute;
right: 0.55rem;
// top: 2.0rem;
top: 1.8rem;
}
.record_icon {
width: px2rem(118);
height: px2rem(46);

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

View File

@@ -7,7 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>瘋狂動物園</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css?v=1.0">
<link rel="stylesheet" href="./css/index.css?v=1.1">
</head>
<body>
@@ -17,6 +17,7 @@
<img src="./images/rule_icon.png" alt="" class="rule_icon">
<img src="./images/record_icon.png" alt="" class="record_icon">
<img src="./images/rank_icon.png" alt="" class="rank_icon">
<img src="./images/bo.png" alt="" class="muciek" id="muciek">
<!-- <div class="headerH3">選擇鉆石 > 選擇圖標</div> -->
</div>
<!-- 食材大盒子 -->
@@ -311,6 +312,19 @@
</div>
</div>
</div>
<!-- 投入音效 -->
<audio style="display: none;" id="draw">
<source src="./images/draw.mp3" type="audio/mp3">
</audio>
<!-- 开奖中音效 -->
<audio style="display: none;" id="lotteryMusic">
<source src="./images/lotteryMusic.mp3" type="audio/mp3">
</audio>
<!-- 背景音效 -->
<audio style="display: none;" id="backgroundMusic" autoplay loop>
<source src="./images/backgroundMusic.mp3" type="audio/mp3">
</audio>
</body>
</html>
@@ -321,4 +335,4 @@
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/svga.min.js"></script>
<script src="./js/wow.js"></script>
<script src="./js/index.js?v=1.1"></script>
<script src="./js/index.js?v=1.2"></script>

View File

@@ -39,11 +39,29 @@ let type = 1
let pageSize = 20
let page = 1
let pageSizeLack = true;
var audioIf = true;
var backgroundMusic = document.getElementById('backgroundMusic');
backgroundMusic.volume = 0.5;
var lotteryMusic = document.getElementById('lotteryMusic');
var drawBut = document.getElementById("draw");
$(function () {
getInfoFromClient()
setTimeout(function () {
getNewestAct();
}, 100)
let startPlayPromise = backgroundMusic.play();
if (startPlayPromise !== undefined) {
startPlayPromise.catch(error => {
if (error.name === "NotAllowedError") {
// 弹窗引导用户与页面做交互,只需要一个简单的按钮即可
// 记得在按钮上绑定一个带有play()方法的回调函数以element-plus的组件为例
audioIf = false;
$('.muciek').attr('src', './images/jin.png');
toastMsg('检测到您的设备因权限问题,无法播放音乐,请在右上角打开音乐')
}
}).then(() => {
});
}
})
// 獲取用戶相關信息
function getUserInfo () {
@@ -96,6 +114,9 @@ function getNewestAct () {
listItem(roundId);
if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) {
// 第一階段
if (audioIf) {
backgroundMusic.play();
}
console.log("第一階段");
countupTimes = Math.floor(((drawStageStartTime - startTime) - (userComeinTime - startTime)) / 1000 + 1);
countup(1);
@@ -103,6 +124,13 @@ function getNewestAct () {
$('.result_popup').hide();
} else if (drawStageStartTime <= userComeinTime && userComeinTime < showResultStageStartTime) {
// 第二階段
backgroundMusic.pause();
lotteryMusic.currentTime = 0;
lotteryMusic.volume = 100 / 100;
if (audioIf) {
lotteryMusic.play();
}
console.log("第二階段");
countupTimes = Math.floor(((showResultStageStartTime - drawStageStartTime) - (userComeinTime - drawStageStartTime)) / 1000 + 1);
countup(2);
@@ -116,6 +144,10 @@ function getNewestAct () {
}, 100);
} else if (showResultStageStartTime <= userComeinTime && userComeinTime < endTime) {
// 第三階段
lotteryMusic.pause();
if (audioIf) {
backgroundMusic.play();
}
console.log("第三階段");
countupTimes = Math.floor(((endTime - showResultStageStartTime) - (userComeinTime - showResultStageStartTime)) / 1000 + 1);
countup(3);
@@ -300,6 +332,12 @@ function draw (itemId, tais) {
$('.box .box_in .sBox').click(function () {
var id = $(this).attr('id');
// $(this).children('.qp').show();
drawBut.pause();
drawBut.currentTime = 0; // 将当前时间设置为0可选
if (audioIf) {
drawBut.play();
}
draw(id, $(this));
})
// 去充值按鈕
@@ -491,7 +529,19 @@ $('.shade-mask-fragmentNum .shade-content-fragmentNum .fragmentNum-btn-wrap .con
}
$('.shade-mask-fragmentNum').hide()
})
$('.muciek').click(function () {
audioIf = !audioIf;
if (audioIf) {
$(this).attr('src', './images/bo.png')
backgroundMusic.play();
lotteryMusic.volume = 0;
lotteryMusic.play();
} else {
$(this).attr('src', './images/jin.png')
backgroundMusic.pause();
lotteryMusic.pause();
}
})
//返回页面 重新请求接口
// var hiddenProperty = 'hidden' in document ? 'hidden' :
// 'webkitHidden' in document ? 'webkitHidden' :

View File

@@ -7,6 +7,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>piko</title>
<link rel="shortcut icon" href="./images/logo.png" type="image/x-icon">
<meta property="og:type" content="website" />
<meta property="og:title" content="Piko與心動聲音不期而遇" />
<meta property="og:description" content="聊天玩遊戲交朋友隨時隨地在Piko" />
<meta class="content_image" property="og:image" content="https://image.pekolive.com/piko_logo.png" />
<meta property="og:image:width" content="256">
<meta property="og:image:height" content="256">
<meta property="og:image:type" content="image/png">
<link rel="stylesheet" href="../common/css/reset.css">
<link rel="stylesheet" href="./css/animate.css">
<link rel="stylesheet" href="./css/index.css?v=1.1">

View File

@@ -1 +1 @@
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>piko</title><link href=./static/css/app.e1c5b4d3113417db88cae215171789bc.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.0c646111b37e0727341b.js></script><script type=text/javascript src=./static/js/vendor.549947ec2550614f506c.js></script><script type=text/javascript src=./static/js/app.f56d535f53d3c277e0fd.js></script></body></html>
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>piko</title><link href=./static/css/app.f2934688930b9900e8d33da24fc10e60.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.cc2c082479de04d6b9d8.js></script><script type=text/javascript src=./static/js/vendor.549947ec2550614f506c.js></script><script type=text/javascript src=./static/js/app.f56d535f53d3c277e0fd.js></script></body></html>

View File

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

View File

Before

Width:  |  Height:  |  Size: 40 KiB

After

Width:  |  Height:  |  Size: 40 KiB

View File

Before

Width:  |  Height:  |  Size: 19 KiB

After

Width:  |  Height:  |  Size: 19 KiB

View File

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 60 KiB

View File

Before

Width:  |  Height:  |  Size: 62 KiB

After

Width:  |  Height:  |  Size: 62 KiB

View File

Before

Width:  |  Height:  |  Size: 208 KiB

After

Width:  |  Height:  |  Size: 208 KiB

View File

@@ -1 +0,0 @@
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>piko</title><link href=./static/css/app.f28780edec4bbb06351c63c43d46b092.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.52adb06e7cb7bf02e373.js></script><script type=text/javascript src=./static/js/vendor.549947ec2550614f506c.js></script><script type=text/javascript src=./static/js/app.f56d535f53d3c277e0fd.js></script></body></html>

File diff suppressed because one or more lines are too long

View File

@@ -1,2 +1,2 @@
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,f){for(var a,i,u,d=0,s=[];d<r.length;d++)i=r[d],t[i]&&s.push(t[i][0]),t[i]=0;for(a in c)Object.prototype.hasOwnProperty.call(c,a)&&(e[a]=c[a]);for(n&&n(r,c,f);s.length;)s.shift()();if(f)for(d=0;d<f.length;d++)u=o(o.s=f[d]);return u};var r={},t={15:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],f=document.createElement("script");f.type="text/javascript",f.charset="utf-8",f.async=!0,f.timeout=12e4,o.nc&&f.setAttribute("nonce",o.nc),f.src=o.p+"static/js/"+e+"."+{0:"ec4de892f04f94b4c2f6",1:"c2ef46c6dcac24931ba4",2:"17debe0f6011a97521e8",3:"fe32c1237c8826c80886",4:"95d3c8221db60b228eb2",5:"17af78067186c41627dc",6:"0e7ac399b5d59483b7f2",7:"c60dff0fd854d6fc291f",8:"43a07f21010bbe7fcd6c",9:"d02156509389fc441584",10:"68b3b250aa24f55d8a82",11:"5d316356ba01de644f13",12:"34fff916cd789ce22038"}[e]+".js";var a=setTimeout(i,12e4);function i(){f.onerror=f.onload=null,clearTimeout(a);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return f.onerror=f.onload=i,c.appendChild(f),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.52adb06e7cb7bf02e373.js.map
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,f){for(var a,i,u,d=0,s=[];d<r.length;d++)i=r[d],t[i]&&s.push(t[i][0]),t[i]=0;for(a in c)Object.prototype.hasOwnProperty.call(c,a)&&(e[a]=c[a]);for(n&&n(r,c,f);s.length;)s.shift()();if(f)for(d=0;d<f.length;d++)u=o(o.s=f[d]);return u};var r={},t={15:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],f=document.createElement("script");f.type="text/javascript",f.charset="utf-8",f.async=!0,f.timeout=12e4,o.nc&&f.setAttribute("nonce",o.nc),f.src=o.p+"static/js/"+e+"."+{0:"ec4de892f04f94b4c2f6",1:"c2ef46c6dcac24931ba4",2:"17debe0f6011a97521e8",3:"fe32c1237c8826c80886",4:"95d3c8221db60b228eb2",5:"658019f2d8814df62ca2",6:"0e7ac399b5d59483b7f2",7:"c60dff0fd854d6fc291f",8:"43a07f21010bbe7fcd6c",9:"d02156509389fc441584",10:"68b3b250aa24f55d8a82",11:"5d316356ba01de644f13",12:"34fff916cd789ce22038"}[e]+".js";var a=setTimeout(i,12e4);function i(){f.onerror=f.onload=null,clearTimeout(a);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return f.onerror=f.onload=i,c.appendChild(f),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.cc2c082479de04d6b9d8.js.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,544 @@
html,
body {
width: 100%;
background: linear-gradient(0deg, #020B27 0%, #1D181B 99%);
backdrop-filter: blur(0px);
overflow: hidden;
}
.back {
position: fixed;
top: 0.26667rem;
left: 0.32rem;
z-index: 99;
width: 0.82667rem;
height: 0.82667rem;
}
.back img {
width: 100%;
height: 100%;
}
.back p {
color: #fff;
font-size: 0.42667rem;
position: absolute;
width: 9rem;
left: 0;
top: 0;
height: 100%;
text-align: center;
line-height: 0.82667rem;
}
.largestBox {
width: 10rem;
min-height: 15.38667rem;
background: url(../images/bg.png) no-repeat;
background-size: 10rem 15.38667rem;
margin: 0 auto;
position: relative;
box-sizing: border-box;
padding: 1.2rem 0 0 0;
}
.largestBox .title {
width: 7.06667rem;
height: 1.14667rem;
position: absolute;
top: -0.14667rem;
left: 50%;
transform: translateX(-50%);
}
.largestBox .tab {
width: 3.65333rem;
height: 0.53333rem;
line-height: 0.53333rem;
display: flex;
justify-content: space-between;
margin: 0 auto 0;
}
.largestBox .tab div {
position: relative;
color: rgba(255, 255, 255, 0.7);
font-size: 0.37333rem;
font-weight: 600;
}
.largestBox .tab div span {
background: none;
width: 0.32rem;
height: 0.08rem;
border-radius: 0.08rem;
position: absolute;
bottom: -0.10667rem;
left: 50%;
transform: translateX(-50%);
}
.largestBox .tab .tabColor1 {
color: #fff;
font-size: 0.37333rem;
}
.largestBox .tab .tabColor1 span {
background: #FA7814;
}
.largestBox .tab .tabColor2 {
color: #fff;
}
.largestBox .tab .tabColor2 span {
background: #A34DFF;
}
.largestBox .dayTab {
width: 3.33333rem;
height: 0.61333rem;
margin: 0.34667rem auto 0;
display: flex;
justify-content: space-between;
}
.largestBox .dayTab div {
width: 1.33333rem;
height: 0.61333rem;
line-height: 0.61333rem;
border-radius: 0.61333rem;
text-align: center;
color: rgba(255, 255, 255, 0.7);
background: rgba(210, 172, 252, 0.4);
font-size: 0.32rem;
font-weight: 500;
}
.largestBox .dayTab .dayTabColor1 {
background: #fff;
color: #FA7814;
}
.largestBox .dayTab .dayTabColor2 {
background: #fff;
color: #A34DFF;
}
.largestBox .top3 {
width: 8.8rem;
height: 0.01333rem;
margin: 3.04rem auto 0;
position: relative;
}
.largestBox .top3 .no1 {
width: 3.17333rem;
height: 2.88rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -2.88rem;
}
.largestBox .top3 .no1 .box {
width: 100%;
height: 100%;
position: absolute;
}
.largestBox .top3 .no1 .box .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.largestBox .top3 .no1 .box .tx {
width: 2.08rem;
height: 2.08rem;
position: absolute;
left: 50%;
top: 0.58667rem;
transform: translateX(-50%);
border-radius: 50%;
}
.largestBox .top3 .no1 .box p {
width: 100%;
position: absolute;
left: 0;
bottom: -0.56rem;
text-align: center;
}
.largestBox .top3 .no1 .box p span {
vertical-align: middle;
color: #E6ECF5;
font-size: 0.37333rem;
}
.largestBox .top3 .no1 .box p .sp {
width: 0.37333rem;
height: 0.37333rem;
border-radius: 50%;
display: inline-block;
}
.largestBox .top3 .no1 .box p .sp img {
display: inline-block;
width: 0.21333rem;
height: 0.21333rem;
border-radius: 50%;
margin: 0.06667rem auto 0;
}
.largestBox .top3 .no1 .box p .boy {
background: #6BB3FF;
}
.largestBox .top3 .no1 .box p .woman {
background: #FF80CC;
}
.largestBox .top3 .no1 .box .icon {
width: 100%;
height: 0.48rem;
position: absolute;
left: 0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
bottom: -1.12rem;
padding: 0 0.6rem;
}
.largestBox .top3 .no1 .box .icon img {
display: block;
width: 0.96rem;
height: 0.48rem;
}
.largestBox .top3 .no1 .box .score {
width: 100%;
text-align: center;
color: #FFDA24;
font-size: 0.32rem;
font-weight: 500;
position: absolute;
left: 0;
bottom: -1.53333rem;
}
.largestBox .top3 .no2 {
width: 2.66667rem;
height: 2.37333rem;
position: absolute;
left: 0;
top: -2.4rem;
}
.largestBox .top3 .no2 .box {
width: 100%;
height: 100%;
position: absolute;
}
.largestBox .top3 .no2 .box .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.largestBox .top3 .no2 .box .tx {
width: 1.70667rem;
height: 1.70667rem;
position: absolute;
left: 50%;
top: 0.45333rem;
transform: translateX(-50%);
border-radius: 50%;
}
.largestBox .top3 .no2 .box p {
width: 100%;
position: absolute;
left: 0;
bottom: -0.56rem;
text-align: center;
}
.largestBox .top3 .no2 .box p span {
vertical-align: middle;
color: #E6ECF5;
font-size: 0.37333rem;
}
.largestBox .top3 .no2 .box p .sp {
width: 0.37333rem;
height: 0.37333rem;
border-radius: 50%;
display: inline-block;
}
.largestBox .top3 .no2 .box p .sp img {
display: inline-block;
width: 0.21333rem;
height: 0.21333rem;
border-radius: 50%;
margin: 0.06667rem auto 0;
}
.largestBox .top3 .no2 .box p .boy {
background: #6BB3FF;
}
.largestBox .top3 .no2 .box p .woman {
background: #FF80CC;
}
.largestBox .top3 .no2 .box .icon {
width: 100%;
height: 0.48rem;
position: absolute;
left: 0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
bottom: -1.12rem;
padding: 0 0.33333rem;
}
.largestBox .top3 .no2 .box .icon img {
display: block;
width: 0.96rem;
height: 0.48rem;
}
.largestBox .top3 .no2 .box .score {
width: 100%;
text-align: center;
color: #FFDA24;
font-size: 0.32rem;
font-weight: 500;
position: absolute;
left: 0;
bottom: -1.53333rem;
}
.largestBox .top3 .no3 {
width: 2.66667rem;
height: 2.37333rem;
position: absolute;
right: 0;
top: -2.4rem;
}
.largestBox .top3 .no3 .box {
width: 100%;
height: 100%;
position: absolute;
}
.largestBox .top3 .no3 .box .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.largestBox .top3 .no3 .box .tx {
width: 1.70667rem;
height: 1.70667rem;
position: absolute;
left: 50%;
top: 0.45333rem;
transform: translateX(-50%);
border-radius: 50%;
}
.largestBox .top3 .no3 .box p {
width: 100%;
position: absolute;
left: 0;
bottom: -0.56rem;
text-align: center;
}
.largestBox .top3 .no3 .box p span {
vertical-align: middle;
color: #E6ECF5;
font-size: 0.37333rem;
}
.largestBox .top3 .no3 .box p .sp {
width: 0.37333rem;
height: 0.37333rem;
border-radius: 50%;
display: inline-block;
}
.largestBox .top3 .no3 .box p .sp img {
display: inline-block;
width: 0.21333rem;
height: 0.21333rem;
border-radius: 50%;
margin: 0.06667rem auto 0;
}
.largestBox .top3 .no3 .box p .boy {
background: #6BB3FF;
}
.largestBox .top3 .no3 .box p .woman {
background: #FF80CC;
}
.largestBox .top3 .no3 .box .icon {
width: 100%;
height: 0.48rem;
position: absolute;
left: 0;
display: flex;
justify-content: space-between;
box-sizing: border-box;
bottom: -1.12rem;
padding: 0 0.33333rem;
}
.largestBox .top3 .no3 .box .icon img {
display: block;
width: 0.96rem;
height: 0.48rem;
}
.largestBox .top3 .no3 .box .score {
width: 100%;
text-align: center;
color: #FFDA24;
font-size: 0.32rem;
font-weight: 500;
position: absolute;
left: 0;
bottom: -1.53333rem;
}
.largestBox ul {
width: 9.57333rem;
height: 7.70667rem;
margin: 1.81333rem auto 0;
background: rgba(255, 167, 141, 0.16);
border-radius: 0.42667rem 0.42667rem 0px 0px;
border: 0.02667rem solid rgba(255, 217, 115, 0.5);
backdrop-filter: blur(7px);
border-bottom: none;
box-sizing: border-box;
padding: 0.21333rem 0 1.86667rem;
overflow-y: scroll;
}
.largestBox ul::-webkit-scrollbar {
display: none;
}
.largestBox ul li {
width: 100%;
height: 1.92rem;
box-sizing: border-box;
padding: 0 0.33333rem;
overflow: hidden;
}
.largestBox ul li .num {
width: 0.53333rem;
height: 100%;
line-height: 1.92rem;
text-align: center;
color: #E6ECF5;
font-size: 0.42667rem;
font-weight: 500;
float: left;
margin-right: 0.16rem;
}
.largestBox ul li .tx {
display: block;
float: left;
width: 1.28rem;
height: 1.28rem;
border-radius: 1.28rem;
margin-top: 0.32rem;
margin-right: 0.21333rem;
}
.largestBox ul li .userInfo {
width: 2.8rem;
float: left;
}
.largestBox ul li .userInfo p {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-top: 0.4rem;
margin-bottom: 0.10667rem;
color: #E6ECF5;
font-size: 0.37333rem;
font-weight: 500;
}
.largestBox ul li .userInfo img {
display: inline-block;
width: 0.96rem;
height: 0.48rem;
margin-right: 0.10667rem;
}
.largestBox ul li .score {
float: right;
text-align: right;
}
.largestBox ul li .score p {
color: #E6ECF5;
font-size: 0.37333rem;
font-weight: 600;
margin-top: 0.48rem;
margin-bottom: 0.06667rem;
}
.largestBox ul li .score span {
color: #B1B5BD;
font-size: 0.29333rem;
font-weight: 400;
display: block;
}
.layui-m-layershade {
background-color: transparent !important;
}
.layui-m-layer2 .layui-m-layerchild {
width: 3rem !important;
height: 3rem !important;
border: none !important;
box-shadow: none !important;
color: #fff !important;
background: rgba(0, 0, 0, 0.6) !important;
}
.layui-m-layer2 .layui-m-layercont {
text-align: center !important;
padding: 0 !important;
line-height: 0 !important;
margin-top: 0.8rem !important;
}

Some files were not shown because too many files have changed in this diff Show More