Compare commits

...

28 Commits

Author SHA1 Message Date
dragon
a1df68fb6d 新增游戏账单 2024-06-03 16:52:18 +08:00
dragon
b098b7d509 更新游戏排行榜 2024-06-03 15:26:37 +08:00
dragon
3da905b683 适配苹果14公会 2024-06-03 13:12:29 +08:00
dragon
ea034c67af 调试公会顶部距离 2024-06-03 11:20:56 +08:00
dragon
ec8281f55c 清除缓存--铭牌 2024-06-03 10:45:56 +08:00
dragon
b04f17dee9 铭牌申请替换 2024-06-03 10:22:15 +08:00
dragon
405bb90f4b 替换贵族规则图 2024-05-31 17:35:18 +08:00
dragon
a2f91d0299 修改工会翻译 2024-05-31 16:00:22 +08:00
dragon
bf98ddeeba 修复部分公会样式问题 2024-05-31 15:48:38 +08:00
dragon
1ee9e303d0 多语言公会,修复账单类型 2024-05-31 15:27:21 +08:00
dragon
65a3c3467b 新增阿拉伯全服排行榜判断icon 2024-05-29 16:14:53 +08:00
dragon
1e2781a556 放开任务 2024-05-29 13:41:37 +08:00
dragon
88035c7d69 隐藏任务 2024-05-29 12:18:20 +08:00
dragon
bdbc6dc3b2 替换ui 2024-05-29 11:28:55 +08:00
dragon
39c2dbfca3 补ui展示 2024-05-28 21:44:12 +08:00
dragon
dfbc314b52 修复bug 2024-05-28 21:16:37 +08:00
dragon
f9acf867db 修复bug 2024-05-28 21:16:37 +08:00
dragon
9ee240c85f 新增儿童节活动 2024-05-28 21:16:36 +08:00
dragon
3588ddde48 修改阿拉伯公会自己信息字段 2024-05-27 15:53:50 +08:00
dragon
a7bf8c2ee5 修改邀请成员页面文件命名 2024-05-24 18:34:37 +08:00
dragon
154c451396 修复邀请成员页面打不开,新增账单类型 2024-05-24 18:22:52 +08:00
dragon
22ba0d9bd4 修复ui和bug 2024-05-24 17:31:01 +08:00
dragon
bebd0aca0c 修复bug 2024-05-22 16:39:32 +08:00
dragon
bc9e9877c9 修复接口报错问题 2024-05-22 16:25:06 +08:00
dragon
e958341e23 新增阿拉伯公会 2024-05-21 18:32:09 +08:00
dragon
edb98ff8d8 替换排行榜ui 2024-05-21 18:31:59 +08:00
dragon
f286f718fc 替换通用多语言ui 2024-05-21 17:48:06 +08:00
dragon
4b2864aa39 去除充值页面line联系方式 2024-05-17 16:47:53 +08:00
209 changed files with 12790 additions and 147 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 774 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 115 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 617 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 501 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 107 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 572 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 850 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1014 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 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: 1.1 KiB

View File

@@ -0,0 +1,212 @@
<!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/swiper-bundle.min.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<!-- 頂部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
</div>
<!-- header -->
<div class="header">
<img src="./images/rule_icon.png" alt="" class="rule_icon">
</div>
<!-- 限定禮物 -->
<div class="giftBox">
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="./images/gift4.png" alt="">
</div>
<div class="swiper-slide">
<img src="./images/gift1.png" alt="">
</div>
<div class="swiper-slide">
<img src="./images/gift2.png" alt="">
</div>
<div class="swiper-slide">
<img src="./images/gift3.png" alt="">
</div>
</div>
</div>
</div>
<!-- 遊戲地圖 -->
<div class="game">
<!-- 放大鏡數量 -->
<div class="magnifyingGlass">放大鏡數量:<b>0</b></div>
<!-- 遊戲記錄 -->
<div class="records">遊園記錄</div>
<!-- 榜單 -->
<img src="./images/list_icon.png" alt="" class="list_icon">
<!-- 任務 -->
<img src="./images/toast_icon.png" alt="" class="toast_icon">
<!-- 遊園按鈕 -->
<img src="./images/but_icon.png" alt="" class="but">
<!-- icon -->
<img src="./images/icon1.png" alt="" class="icon icon1">
<img src="./images/icon2.png" alt="" class="icon icon2">
<img src="./images/icon3.png" alt="" class="icon icon3">
<img src="./images/icon4.png" alt="" class="icon icon4">
<img src="./images/icon5.png" alt="" class="icon icon5">
<img src="./images/icon6.png" alt="" class="icon icon6">
<!-- 點擊圖標站位按鈕 -->
<div class="buts buts1"></div>
<div class="buts buts2"></div>
<div class="buts buts3"></div>
<div class="buts buts4"></div>
<div class="buts buts5"></div>
<div class="buts buts6"></div>
<!-- 贏結果頁 -->
<div class="result">
<img src="./images/logo.png" alt="" class="tx_left">
<img src="./images/logo.png" alt="" class="tx_right">
<div class="name_left">虛位以待</div>
<div class="name_right">虛位以待</div>
<div class="id_right">ID:0</div>
<img src="./images/resultText1.png" alt="" class="resultText">
<div class="text1">請收下妳的戰利品</div>
<div class="giftName">禮物昵稱</div>
<div class="giftBoxs">
<img src="./images/logo.png" alt="" class="giftImg">
</div>
<img src="./images/view.png" alt="" class="view">
<img src="./images/playAgain.png" alt="" class="playAgain">
</div>
<!-- 輸結果頁 -->
<div class="result2">
<img src="./images/logo.png" alt="" class="tx_left">
<div class="name_left">虛位以待</div>
<img src="./images/resultText2.png" alt="" class="resultText">
<div class="text1">請收下妳的戰利品</div>
<div class="giftName">禮物昵稱</div>
<div class="giftBoxs">
<img src="./images/logo.png" alt="" class="giftImg">
</div>
<img src="./images/view3.png" alt="" class="view">
<img src="./images/playAgain.png" alt="" class="playAgain">
</div>
</div>
<!-- 榜單彈窗 -->
<div class="list_pub">
<div class="list_pub_in">
<div class="tab">
<div class="act">搜捕榜</div>
<div>童趣榜</div>
<div>童年榜</div>
</div>
<!-- 前三 -->
<div class="top1">
<img src="./images/no1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">虛位以待</div>
<div class="score">童趣值:0</div>
</div>
<div class="top2">
<img src="./images/no2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">虛位以待</div>
<div class="score">童趣值:0</div>
</div>
<div class="top3">
<img src="./images/no3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">虛位以待</div>
<div class="score">童趣值:0</div>
</div>
<!-- 非前三 -->
<ul>
<li>
<div class="num">4</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="name">虛位以待</div>
<div class="score">童趣值:0</div>
</li>
</ul>
</div>
</div>
<!-- 任務彈窗 -->
<div class="toast_pub">
<div class="toast_pub_in">
<img src="./images/close.png" alt="" class="close">
<div class="toasts toasts1">
<p>登錄活動頁</p>
<span>獎勵:放大鏡*1</span>
<div class="but">未完成</div>
</div>
<div class="toasts toasts2">
<p>關註一位新的好友(0/3)</p>
<span>獎勵:放大鏡*1</span>
<div class="but">未完成</div>
</div>
<div class="toasts toasts3">
<p>房間停留10mins~(0/3)</p>
<span>獎勵:放大鏡*1</span>
<div class="but">未完成</div>
</div>
<div class="toasts toasts4">
<p>送出or收到1000金幣的61限定禮物</p>
<span>獎勵:放大鏡*1</span>
<i>今日已獲得:0</i>
<div class="but">未完成</div>
</div>
<div class="toasts toasts5">
<p>參與Greedy纍計獲得1000金幣</p>
<span>獎勵:放大鏡*1</span>
<i>今日已獲得:0</i>
<div class="but">未完成</div>
</div>
</div>
</div>
<!-- 遊戲記錄彈窗 -->
<div class="records_pub">
<div class="records_pub_in">
<div class="title">
<div>獲獎時間</div>
<div>獎品</div>
</div>
<ul>
<li>
<div>
<p>2024/01/22</p>
<b>23:59:59</b>
</div>
<div>
<p>禮物名稱</p>
<i>XX天</i>
</div>
</li>
</ul>
</div>
</div>
<!-- 規則 -->
<div class="rule">
<div class="rule_in">
<div class="tab">
<div class="act">活動規則</div>
<div>活動獎勵</div>
</div>
<div class="imgBox">
<img src="./images/rule1.png" alt="" class="img1">
<img src="./images/rule2.png" alt="" class="img2">
</div>
</div>
</div>
</body>
</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/swiper-bundle.min.js"></script>
<script src="./js/index.js"></script>

View File

@@ -0,0 +1,474 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
var langReplace;
var localLang;
// 封裝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 magnifyingGlass = 0;
var listType = 1;
var gameType = true;
// 初始化函數
$(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)
}
})
swiperFun();
getInfo();
}, 100)
})
// 禮物輪播
function swiperFun() {
var mySwiper = new Swiper('.swiper', {
direction: "vertical",
loop: true,
autoplay: {
delay: 3000,//
disableOnInteraction: false
}
})
}
// 活動信息接口
function getInfo() {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/activity/info',
data: { activityCode: 'ACT_2024_CHILDREN_DAY' },
success(res) {
if (res.code === 200) {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/activity/currency',
data: { redisKey: 'act_user_task_extra_data' },
success(res) {
if (res.code === 200) {
magnifyingGlass = res.data
$('.game .magnifyingGlass b').text(magnifyingGlass);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
}
// 打開榜單
$('.game .list_icon').click(function () {
listFun(listType)
$('.list_pub').show();
bodyScroolFun(true);
})
// 榜單切換
$('.list_pub .list_pub_in .tab div').click(function () {
var i = $(this).index() + 1;
listType = i;
$(this).addClass('act').siblings().removeClass('act');
listFun(listType)
return false;
})
// 活動信息接口
function listFun(type) {
var str = '';
$('.list_pub .list_pub_in ul li').remove();
showLoading()
if (type == 1) {
networkRequest({
type: 'get',
url: urlPrefix + '/allrank/geth5',
data: {
uid: pubInfo.uid,
type: 5,
datetype: 3,
pageNum: 1,
pageSize: 999999999,
},
success(res) {
if (res.code === 200) {
var listTo3 = res.data.rankVoList.slice(0, 3);
var notListTo3 = res.data.rankVoList.slice(3);
if (listTo3.length < 3) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
nick: '虛位以待',
totalNum: "0"
})
listTo3.push(...arr)
}
// 處理前三
listTo3.forEach((res, i) => {
if (res.score > 10000) {
res.score = ((Math.floor(res.totalNum / 1000)) / 10).toFixed(1) + 'W'
}
$(`.list_pub .list_pub_in .top${i + 1} .tx`).attr("src", res.avatar);
$(`.list_pub .list_pub_in .top${i + 1} .name`).text(res.nick);
$(`.list_pub .list_pub_in .top${i + 1} .score`).text('搜捕值:' + res.totalNum);
});
notListTo3.forEach((res, i) => {
if (res.score > 10000) {
res.score = ((Math.floor(res.score / 1000)) / 10).toFixed(1) + 'W'
}
str += `
<li>
<div class="num">${i + 4}</div>
<img src="${res.avatar}" alt="" class="tx">
<div class="name">${res.nick}</div>
<div class="score">搜捕值:${res.totalNum}</div>
</li>
`
})
$('.list_pub .list_pub_in ul').append(str);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
} else {
networkRequest({
type: 'get',
url: urlPrefix + '/act/special/gift/getRank',
data: {
pageSize: 999999999,
rankType: type == 2 ? 4 : 2,
},
success(res) {
if (res.code === 200) {
var listTo3 = res.data.rankList.slice(0, 3);
var notListTo3 = res.data.rankList.slice(3);
if (listTo3.length < 3) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
nick: '虛位以待',
score: "0"
})
listTo3.push(...arr)
}
// 處理前三
listTo3.forEach((res, i) => {
if (res.score > 10000) {
res.score = ((Math.floor(res.score / 1000)) / 10).toFixed(1) + 'W'
}
$(`.list_pub .list_pub_in .top${i + 1} .tx`).attr("src", res.avatar);
$(`.list_pub .list_pub_in .top${i + 1} .name`).text(res.nick);
$(`.list_pub .list_pub_in .top${i + 1} .score`).text(`${type == 2 ? '童趣值:' : "童年值:"}`+res.score);
});
notListTo3.forEach((res,i) => {
if (res.score > 10000) {
res.score = ((Math.floor(res.score / 1000)) / 10).toFixed(1) + 'W'
}
str += `
<li>
<div class="num">${i + 4}</div>
<img src="${res.avatar}" alt="" class="tx">
<div class="name">${res.nick}</div>
<div class="score">${type == 2 ? '童趣值:' : "童年值:" }${res.score}</div>
</li>
`
})
$('.list_pub .list_pub_in ul').append(str);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
}
}
// 關閉榜單
$('.list_pub').click(function () {
$('.list_pub').hide();
bodyScroolFun(false);
})
// 打開任務
$('.game .toast_icon').click(function () {
getTask();
})
// 活動信息接口
function getTask() {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/children/task',
success(res) {
if (res.code === 200) {
res.data.isLoginTask ? $('.toast_pub .toast_pub_in .toasts1 .but').addClass('act') : $('.toast_pub .toast_pub_in .toasts1 .but').removeClass('act');
res.data.isLoginTask ? $('.toast_pub .toast_pub_in .toasts1 .but').text('已完成') : $('.toast_pub .toast_pub_in .toasts1 .but').text('未完成');
$('.toast_pub .toast_pub_in .toasts2 p').text(`關註一位新的好友(${res.data.userFollowCount}/3)`);
res.data.isUserFollowTask ? $('.toast_pub .toast_pub_in .toasts2 .but').addClass('act') : $('.toast_pub .toast_pub_in .toasts2 .but').removeClass('act');
res.data.isUserFollowTask ? $('.toast_pub .toast_pub_in .toasts2 .but').text('已完成') : $('.toast_pub .toast_pub_in .toasts2 .but').text('未完成');
$('.toast_pub .toast_pub_in .toasts3 p').text(`房間停留10mins~(${res.data.keepTimeCount}/3)`);
res.data.isKeepTimeTask ? $('.toast_pub .toast_pub_in .toasts3 .but').addClass('act') : $('.toast_pub .toast_pub_in .toasts3 .but').removeClass('act');
res.data.isKeepTimeTask ? $('.toast_pub .toast_pub_in .toasts3 .but').text('已完成') : $('.toast_pub .toast_pub_in .toasts3 .but').text('未完成');
$('.toast_pub .toast_pub_in .toasts4 i').text(`今日已獲得:${res.data.limitGiftCount}`);
res.data.isLimitGiftFor61Task ? $('.toast_pub .toast_pub_in .toasts4 .but').addClass('act') : $('.toast_pub .toast_pub_in .toasts4 .but').removeClass('act');
res.data.isLimitGiftFor61Task ? $('.toast_pub .toast_pub_in .toasts4 .but').text('已完成') : $('.toast_pub .toast_pub_in .toasts4 .but').text('未完成');
$('.toast_pub .toast_pub_in .toasts5 i').text(`今日已獲得:${res.data.joinGreedyFor1000Count}`);
res.data.isJoinGreedyFor1000Task ? $('.toast_pub .toast_pub_in .toasts5 .but').addClass('act') : $('.toast_pub .toast_pub_in .toasts5 .but').removeClass('act');
res.data.isJoinGreedyFor1000Task ? $('.toast_pub .toast_pub_in .toasts5 .but').text('已完成') : $('.toast_pub .toast_pub_in .toasts5 .but').text('未完成');
$('.toast_pub').show();
bodyScroolFun(true);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
}
// 關閉任務
$('.toast_pub .toast_pub_in .close').click(function () {
$('.toast_pub').hide();
bodyScroolFun(false);
})
// 關閉結果彈窗
$('.game .result .view').click(function () {
$('.result,.result2').hide();
var roomUid = $(this).attr('uid');
if (gameType) {
// 跳转房间
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(roomUid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(roomUid);
}
}
}
// 打开主页
if (browser.ios) {
window.webkit.messageHandlers.openPersonPage.postMessage(roomUid);
setTimeout(function () { lock = true; }, 200)
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openPersonPage(roomUid);
}
}
})
$('.game .result2 .view').click(function () {
$('.result,.result2').hide();
})
$('.game .result,.game .result2').click(function () {
$('.result,.result2').hide();
})
// 關閉記錄彈窗
$('.records_pub').click(function () {
$('.records_pub').hide();
bodyScroolFun(false);
})
// 切換規則按鈕
$('.rule .rule_in .tab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('act').siblings().removeClass('act')
$('.rule .rule_in .imgBox img').hide();
$(`.rule .rule_in .imgBox .img${i}`).show();
return false;
})
// 打開規則
$('.header .rule_icon').click(function () {
$('.rule').show();
bodyScroolFun(true);
})
// 關閉規則
$('.rule').click(function () {
$('.rule').hide();
bodyScroolFun(false);
})
// 記錄接口
function record(page) {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/activity/task/user/record/page',
data: { activityCode: 'ACT_2024_CHILDREN_DAY', componentCode: 'TONG_QU_LE_YUAN', pageNum: page, pageSize: 10 },
success(res) {
if (res.code === 200) {
var str = '';
if (res.data.records.length == 0 && page == 1) {
str += `<li class="null"><div>暫無</div><div>暫無</div></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>
<p>${res.rewardName}</p>
<i>${res.rewardNum}${rewardTypeFun(res.rewardType).unit}</i>
</div>
</li>`
})
if (res.data.records.length == 0) {
isLock = false;
} else {
isLock = true;
}
}
$('.records_pub .records_pub_in ul').append(str);
$('.records_pub').show();
bodyScroolFun(true);
} else {
isLock = true;
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
isLock = true;
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
}
// 兌換記錄滾動
$('.records_pub .records_pub_in ul').scroll(function () {
let scrollTop = $(this).scrollTop()
let scrollHeight = $('.records_pub .records_pub_in ul')[0].scrollHeight
let ulHeight = $(this).innerHeight()
if (scrollTop + ulHeight + 100 >= scrollHeight) {
if (isLock) {
// 請求下一頁
page = page + 1;
record(page)
isLock = false;
}
}
})
// 打開記錄
$('.game .records').click(function () {
$('.records_pub .records_pub_in ul li').remove();
page = 1;
record(page);
})
// 關閉記錄
$('.records_pub').click(function () {
$('.records_pub').hide();
bodyScroolFun(false);
})
// 逮捕按鈕
$('.game .buts,.game .but,.game .result .playAgain,.game .result2 .playAgain').click(function () {
$('.game .result2,.game .result1').hide();
draw();
})
// 活動信息接口
function draw() {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/children/draw',
success(res) {
if (res.code === 200) {
if (res.data.isWin) {
// 中獎
$('.game .result .tx_left').attr('src', res.data.avatar);
$('.game .result .tx_right').attr('src', res.data.anchorAvatar);
$('.game .result .tx_right').attr('uid', res.data.anchorRoomUid);
$('.game .result .view').attr('uid', res.data.anchorRoomUid);
gameType = res.data.isOnline;
gameType ? $('.game .result .view').attr('src', './images/view2.png') : $('.game .result .view').attr('src', './images/view.png');
$('.game .result .name_left').text('我');
$('.game .result .name_Right').text(res.data.anchorNick);
$('.game .result .id_right').text("ID:" + res.data.anchorErBanNo);
$('.game .result .giftBoxs img').attr("src", res.data.rewardIcon);
$('.game .result .giftName').text(res.data.rewardName);
$('.game .result').show();
} else {
// 非中獎
$('.game .result2 .tx_left').attr('src', res.data.avatar);
$('.game .result2 .name_left').text('我');
$('.game .result2 .giftBoxs img').attr("src", res.data.rewardIcon);
$('.game .result2 .giftName').text(res.data.rewardName);
$('.game .result2').show();
}
getInfo();
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤')
}
})
}
// 跳轉主播房間
$('.game .result .tx_right').click(function () {
var roomUid = $(this).attr('uid');
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(roomUid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(roomUid);
}
}
})

File diff suppressed because one or more lines are too long

View File

@@ -13,7 +13,7 @@
.max {
width: 10rem;
height: 30.84rem;
background: url("../images/max.png") no-repeat;
background: url("../images/max.png?v=1.0") no-repeat;
background-size: 100% 100%;
font-family: 'pingfang-bold';
}

View File

@@ -22,7 +22,7 @@
.max {
width: px2rem(750);
height: px2rem(2313);
background: url('../images/max.png') no-repeat;
background: url('../images/max.png?v=1.0') no-repeat;
background-size: 100% 100%;
font-family: 'pingfang-bold';

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

@@ -20,7 +20,7 @@
<title>精美铭牌送不停</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css?v=10">
<link rel="stylesheet" href="./css/index.css?v=11">
<script src="../../common/js/flexible.js"></script>
</head>

View File

@@ -831,6 +831,10 @@ function langCodeFun(langCode) {
if (langCode == "ar") {
document.documentElement.setAttribute("dir", "rtl");
document.body.classList.add('arabic');
if (window.location.href.match(/guildAr/)) {
document.documentElement.setAttribute("dir", "ltr");
}
}
}
// 获取整条url

View File

@@ -0,0 +1,302 @@
html,
body {
width: 100%;
background: #fff;
}
.back {
width: 100%;
height: 0.58667rem;
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 0.93333rem;
text-align: center;
color: #FFFFFF;
font-size: 0.42667rem;
font-weight: bold;
z-index: 10;
}
.back img {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 0rem;
}
.header {
width: 10rem;
height: 10.90667rem;
position: relative;
margin: 0 auto 0;
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
}
.header .tab {
position: absolute;
top: 1.90667rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
background: rgba(255, 255, 255, 0.2);
height: 0.74667rem;
line-height: 0.74667rem;
border-radius: 0.74667rem;
font-size: 0.37333rem;
font-weight: 500;
overflow: hidden;
}
.header .tab div {
padding: 0rem 0.58667rem;
color: #fff;
text-align: center;
border-radius: 0.74667rem;
}
.header .tab .act {
background: #fff;
color: #83C2D2;
}
.header .no1 {
width: 7.14667rem;
height: 3.89333rem;
position: absolute;
top: 2.73333rem;
left: 50%;
transform: translateX(-50%);
}
.header .no1 .ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.header .no1 .tx {
width: 1.84rem;
height: 1.84rem;
border-radius: 50%;
position: absolute;
top: 1.22667rem;
left: 50%;
transform: translateX(-50%);
}
.header .no1 .nick {
width: 53%;
text-align: center;
color: #B1784D;
font-size: 0.4rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.66667rem;
font-weight: 500;
padding-top: 0.1rem;
}
.header .no2 {
width: 3.54667rem;
height: 2.98667rem;
position: absolute;
top: 6.14667rem;
left: 0.09333rem;
}
.header .no2 .ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.header .no2 .tx {
width: 1.84rem;
height: 1.84rem;
border-radius: 50%;
position: absolute;
top: 0.70667rem;
left: 50%;
transform: translateX(-50%);
}
.header .no2 .nick {
width: 100%;
text-align: center;
color: #B1784D;
font-size: 0.4rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.06667rem;
font-weight: 500;
padding-top: 0.1rem;
}
.header .no3 {
width: 3.54667rem;
height: 2.98667rem;
position: absolute;
top: 6.14667rem;
right: 0.09333rem;
}
.header .no3 .ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.header .no3 .tx {
width: 1.84rem;
height: 1.84rem;
border-radius: 50%;
position: absolute;
top: 0.70667rem;
left: 50%;
transform: translateX(-50%);
}
.header .no3 .nick {
width: 100%;
text-align: center;
color: #B1784D;
font-size: 0.4rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.06667rem;
font-weight: 500;
padding-top: 0.1rem;
}
ul {
width: 10rem;
max-height: 11.3rem;
min-height: 6.66667rem;
background: linear-gradient(0deg, #FFFFFF 85%, #D2FEFF 100%);
position: relative;
margin: -0.66667rem auto 0;
box-sizing: border-box;
padding: 0.4rem 0;
border-radius: 0.77333rem 0.77333rem 0px 0px;
overflow-y: scroll;
}
ul::-webkit-scrollbar {
display: none;
}
ul .top {
width: 100%;
height: 2.13333rem;
position: absolute;
left: 0;
top: 0;
background: linear-gradient(0deg, #FFFFFF 0%, #D2FEFF 100%);
}
ul li {
width: 100%;
height: 1.12rem;
margin-bottom: 0.8rem;
overflow: hidden;
box-sizing: border-box;
padding: 0 0.88rem 0 0.61333rem;
}
ul li .num {
text-align: center;
color: #000000;
font-size: 0.37333rem;
margin-right: 0.32rem;
float: left;
font-weight: bold;
width: 0.8rem;
height: 100%;
line-height: 1.12rem;
}
ul li .tx {
width: 1.12rem;
height: 1.12rem;
border-radius: 50%;
float: left;
margin-right: 0.44rem;
}
ul li .nick {
width: 3rem;
height: 100%;
line-height: 1.12rem;
color: #000;
font-size: 0.37333rem;
font-weight: bold;
float: left;
}
ul li .score {
float: right;
line-height: 1.12rem;
height: 100%;
}
ul li .score img {
display: inline-block;
width: 0.37333rem;
height: 0.37333rem;
vertical-align: middle;
}
ul li .score b {
color: #000;
font-weight: bold;
vertical-align: middle;
}
ul li:nth-child(1) .num {
width: 0.8rem;
height: 0.74667rem;
background: url(../images/num1.png) no-repeat;
background-size: 100% 100%;
margin-top: 0.17333rem;
}
ul li:nth-child(2) .num {
width: 0.8rem;
height: 0.74667rem;
background: url(../images/num2.png) no-repeat;
background-size: 100% 100%;
margin-top: 0.17333rem;
}
ul li:nth-child(3) .num {
width: 0.8rem;
height: 0.74667rem;
background: url(../images/num3.png) no-repeat;
background-size: 100% 100%;
margin-top: 0.17333rem;
}

View File

@@ -0,0 +1,315 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
background: #fff;
}
.back {
width: 100%;
height: px2rem(44);
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(70);
text-align: center;
color: #FFFFFF;
font-size: px2rem(32);
font-weight: bold;
z-index: 10;
img {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: px2rem(0);
}
}
.header {
width: px2rem(750);
height: px2rem(818);
position: relative;
margin: 0 auto 0;
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
.tab {
position: absolute;
top: px2rem(143);
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
background: rgba(255, 255, 255, .2);
height: px2rem(56);
line-height: px2rem(56);
border-radius: px2rem(56);
font-size: px2rem(28);
font-weight: 500;
overflow: hidden;
div {
padding: px2rem(0) px2rem(44);
color: #fff;
text-align: center;
border-radius: px2rem(56);
}
.act {
background: #fff;
color: #83C2D2;
}
}
.no1 {
width: px2rem(536);
height: px2rem(292);
position: absolute;
top: px2rem(205);
left: 50%;
transform: translateX(-50%);
.ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.tx {
width: px2rem(138);
height: px2rem(138);
border-radius: 50%;
position: absolute;
top: px2rem(92);
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 53%;
text-align: center;
color: #B1784D;
font-size: px2rem(30);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(275);
font-weight: 500;
padding-top: 0.1rem;
}
}
.no2 {
width: px2rem(266);
height: px2rem(224);
position: absolute;
top: px2rem(461);
left: px2rem(7);
.ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.tx {
width: px2rem(138);
height: px2rem(138);
border-radius: 50%;
position: absolute;
top: px2rem(53);
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
text-align: center;
color: #B1784D;
font-size: px2rem(30);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(230);
font-weight: 500;
padding-top: 0.1rem;
}
}
.no3 {
width: px2rem(266);
height: px2rem(224);
position: absolute;
top: px2rem(461);
right: px2rem(7);
.ts {
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
position: absolute;
}
.tx {
width: px2rem(138);
height: px2rem(138);
border-radius: 50%;
position: absolute;
top: px2rem(53);
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
text-align: center;
color: #B1784D;
font-size: px2rem(30);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(230);
font-weight: 500;
padding-top: 0.1rem;
}
}
}
ul {
width: px2rem(750);
max-height: 11.3rem;
min-height: px2rem(500);
background: linear-gradient(0deg, #FFFFFF 85%, #D2FEFF 100%);
position: relative;
margin: px2rem(-50) auto 0;
box-sizing: border-box;
padding: px2rem(30) 0;
border-radius: px2rem(58) px2rem(58) 0px 0px;
overflow-y: scroll;
&::-webkit-scrollbar {
display: none;
}
.top {
width: 100%;
height: px2rem(160);
position: absolute;
left: 0;
top: 0;
background: linear-gradient(0deg, #FFFFFF 0%, #D2FEFF 100%);
}
li {
width: 100%;
height: px2rem(84);
margin-bottom: px2rem(60);
overflow: hidden;
box-sizing: border-box;
padding: 0 px2rem(66) 0 px2rem(46);
.num {
text-align: center;
color: #000000;
font-size: px2rem(28);
margin-right: px2rem(24);
float: left;
font-weight: bold;
width: px2rem(60);
height: 100%;
line-height: px2rem(84);
}
.tx {
width: px2rem(84);
height: px2rem(84);
border-radius: 50%;
float: left;
margin-right: px2rem(33);
}
.nick {
width: 3rem;
height: 100%;
line-height: px2rem(84);
color: #000;
font-size: px2rem(28);
font-weight: bold;
float: left;
}
.score {
float: right;
line-height: px2rem(84);
height: 100%;
img {
display: inline-block;
width: px2rem(28);
height: px2rem(28);
vertical-align: middle;
}
b {
color: #000;
font-weight: bold;
vertical-align: middle;
}
}
&:nth-child(1) {
.num {
width: px2rem(60);
height: px2rem(56);
background: url(../images/num1.png) no-repeat;
background-size: 100% 100%;
margin-top: px2rem(13);
}
}
&:nth-child(2) {
.num {
width: px2rem(60);
height: px2rem(56);
background: url(../images/num2.png) no-repeat;
background-size: 100% 100%;
margin-top: px2rem(13);
}
}
&:nth-child(3) {
.num {
width: px2rem(60);
height: px2rem(56);
background: url(../images/num3.png) no-repeat;
background-size: 100% 100%;
margin-top: px2rem(13);
}
}
}
}

View File

@@ -0,0 +1,26 @@
html,
body {
width: 100%;
background: #E7FEFF;
}
ul {
width: 10rem;
margin: 0 auto 0;
box-sizing: border-box;
padding: 0.4rem 0.4rem;
}
ul h3 {
font-weight: bold;
font-size: 0.4rem;
color: #47AEB3;
margin-bottom: 0.26667rem;
margin-top: 0.4rem;
}
ul p {
color: #6E8485;
font-size: 0.32rem;
margin-bottom: 0.13333rem;
}

View File

@@ -0,0 +1,30 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
background: #E7FEFF;
}
ul {
width: px2rem(750);
margin: 0 auto 0;
box-sizing: border-box;
padding: px2rem(30) px2rem(30);
h3 {
font-weight: bold;
font-size: px2rem(30);
color: #47AEB3;
margin-bottom: px2rem(20);
margin-top: px2rem(30);
}
p {
color: #6E8485;
font-size: px2rem(24);
margin-bottom: px2rem(10);
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 542 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 219 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 191 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="titles"></title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<!-- 頂部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
<b class="titles"></b>
</div>
<!-- 头部 -->
<div class="header">
<!-- 日榜&周榜 -->
<div class="tab">
<div class="text1 act"></div>
<div class="text2"></div>
</div>
<!-- 前三 -->
<div class="no no1">
<img src="./images/no1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick text3"></div>
</div>
<div class="no no2">
<img src="./images/no2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick text3"></div>
</div>
<div class="no no3">
<img src="./images/no3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<div class="nick text3"></div>
</div>
</div>
<!-- 非前三 -->
<ul>
<!-- <li class="other">
<div class="num"></div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">虚位以待</div>
<div class="score">
<img src="./images/gold.png" alt="">
<b>0</b>
</div>
</li> -->
</ul>
</body>
</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="./local/ar.js"></script>
<script src="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./js/index.js"></script>
<script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,177 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
var langReplace;
var localLang;
let layerIndex;
const showLoading = (content = langReplace(localLang.demoModule.text5)) => {
layer.open({
type: 2,
shadeClose: false,
content,
success(e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = langReplace(localLang.demoModule.text6), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var num = 1;
var datetype = 1;
var isLock = true;
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
setTimeout(function () {
// 頁面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 頂部返回事件
$('.back img').click(() => {
if (browser.android) {
window.androidJsObj.closeWebView()
} else {
window.webkit.messageHandlers.closeWebView.postMessage(null)
}
})
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
get()
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.titles').text(langReplace(localLang.demoModule.titles));
$('.text1').text(langReplace(localLang.demoModule.text1));
$('.text2').text(langReplace(localLang.demoModule.text2));
$('.text3').text(langReplace(localLang.demoModule.text3));
}
// 配置接口
function get(pageNum) {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/allrank/geth5',
data: {
type: 4,
datetype,
uid: pubInfo.uid,
pageNum,
pageSize: 10,
},
success(res) {
if (res.code === 200) {
var str = '';
if (res.data.rankVoList.length == 0) {
isLock = false;
}
var listTo3 = res.data.rankVoList.slice(0, 3);
var notListTo3 = res.data.rankVoList;
if (listTo3.length < 3) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
nick: langReplace(localLang.demoModule.text3),
uid: null,
})
listTo3.push(...arr)
}
listTo3.forEach((res, i) => {
$(`.header .no${i + 1} .ts`).attr("uid", res.uid);
$(`.header .no${i + 1} .tx`).attr("src", res.avatar);
$(`.header .no${i + 1} .nick`).text(res.nick);
})
notListTo3.forEach((res, i) => {
str += `
<li class="other">
<div class="num">${i > 2 ? i + 1 : ''}</div>
<img src="${res.avatar}" uid=${res.uid} alt="" class="tx">
<div class="nick">${res.nick}</div>
<div class="score">
<img src="./images/gold.png" alt="">
<b>${unitProcessingAr(res.totalNum, 1)}</b>
</div>
</li>
`
})
$('ul').append(str);
} else {
isLock = true;
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
isLock = true;
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.text4))
}
})
}
// 切換日榜周榜
$('.header .tab div').click(function () {
$(this).addClass('act').siblings().removeClass('act');
var i = $(this).index() + 1;
datetype = i;
pageNum = 1;
get(pageNum);
$('ul li').remove();
})
// 監聽滑動分頁
$('ul').scroll(function () {
let scrollTop = $(this).scrollTop()
let scrollHeight = $('ul')[0].scrollHeight
let ulHeight = $(this).innerHeight()
if (scrollTop + ulHeight + 100 >= scrollHeight) {
if (isLock) {
// 請求下一頁
page = page + 1;
get(pageNum);
isLock = false;
}
}
})
// 点击非前三跳转主页
$('ul').on('click', 'li .tx', function () {
var uid = $(this).attr("uid");
if (browser.ios) {
window.webkit.messageHandlers.openPersonPage.postMessage(uid);
setTimeout(function () { lock = true; }, 200)
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openPersonPage(uid);
}
}
})
// 点击前三跳转主页
$('.header .no .ts').click(function () {
var uid = $(this).attr("uid");
if (browser.ios) {
window.webkit.messageHandlers.openPersonPage.postMessage(uid);
setTimeout(function () { lock = true; }, 200)
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openPersonPage(uid);
}
}
})

View File

@@ -0,0 +1,52 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let ruleMode = getQueryString().ruleMode;
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封裝layer消息提醒框
var langReplace;
var localLang;
let layerIndex;
const showLoading = (content = langReplace(localLang.demoModule.text5)) => {
layer.open({
type: 2,
shadeClose: false,
content,
success(e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = langReplace(localLang.demoModule.text6), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
setTimeout(function () {
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.titleRule').html(langReplace(localLang.demoModule.titleRule));
if (ruleMode == 1) {
$('ul').html(langReplace(localLang.demoModule.ruleText1));
} else if (ruleMode == 2) {
$('ul').html(langReplace(localLang.demoModule.ruleText2));
}
}

View File

@@ -0,0 +1,43 @@
// 阿拉伯
langAr = {
// 模块
demoModule: {
titles: `ترتيب LUDO`,
text1: `ترتيب اليومي`,
text2: `ترتيب الأسبوعي`,
text3: `شاغر`,
text4: `خطأ في الشبكة`,
text5: `جار التحميل...`,
text6: `تم العملية`, titleRule: `قواعد اللعبة`,
ruleText1: `
<li>
<h3>الإقلاع من القاعدة</h3>
<p>رمي النرد للبدء باللعبة، والحصول على رمي إضافي؛ إذا حصلت على 6 ثلاث مرات متتالية، ينتهي الجولة.</p>
</li>
<li>
<h3>الفوز باللعبة</h3>
<p>يتطلب الوضع الكلاسيكي وصول 4 قطع إلى النهاية للفوز.</p>
</li>
<li>
<h3>العناصر المساعدة في اللعبة</h3>
<p>1. اللاعبون الذين يحصلون على "النرد الذهبي" يجب أن يرموا 6.</p>
<p>2. اللاعبون الذين يحصلون على "المغناطيس" يمكنهم التقدم 8 خطوات حتى يعوقهم الآخرون.</p>
<p>3. اللاعبون الذين يحصلون على "القنبلة" يمكنهم تفجير 8 خطوات، مما يؤدي إلى إزالة الخصم إلى القاعدة.</p>
</li>
`,
ruleText2: `
<li>
<h3>فتح المسار النهائي</h3>
<p>1. يمكنك دخول المسار النهائي فقط بعد قتل قطعة واحدة من أي لاعب آخر.</p>
<p>2. يتطلب الوضع السريع فقط وصول قطعة واحدة إلى النهاية للفوز.</p>
</li>
<li>
<h3>مكان آمن</h3>
<p>ستحمى قطعك من القتل عندما تكون على المربع البداية والمربع النجمي.</p>
</li>
<li>
<h3>سرعة اللعبة أسرع</h3>
<p>عند بدء اللعبة، هناك قطعة في نقطة البداية.</p>
</li>`
}
}

View File

@@ -0,0 +1,44 @@
// 英文
langEn = {
// 模块
demoModule: {
titles: `LUDO Leaderboard`,
text1: `Daily Leaderboard`,
text2: `Weekly Leaderboard`,
text3: `Vacancy`,
text4: `Network Error`,
text5: `Loading...`,
text6: `Operation Completed`,
titleRule: `Game Rules`,
ruleText1: `
<li>
<h3>Take off from the base</h3>
<p>Throw 6 to start, and get 1 extra throw; if you throw 6 three times in a row, the round ends.</p>
</li>
<li>
<h3>Win the game</h3>
<p>Classic mode requires 4 pieces to reach the end to win.</p>
</li>
<li>
<h3>Game props</h3>
<p>1. Players who earn 'gold dice' must throw 6.</p>
<p>2. Players who earn the 'magnet' can advance 8 steps until blocked by others.</p>
<p>3. Players who earn the 'bomb' can bomb 8 steps, eliminating the opponent back to the base.</p>
</li>
`,
ruleText2: `
<li>
<h3>Unlock finish track</h3>
<p>1. You can enter the finish track only after killing 1 piece of any other player.</p>
<p>2. Quick Mode only requires one piece to reach the end to win.</p>
</li>
<li>
<h3>Safe place</h3>
<p>Your pieces will be protected from being killed on the starting square and the star square.</p>
</li>
<li>
<h3>Faster game pace</h3>
<p>When the game starts, there is a piece at the starting point.</p>
</li>`
}
}

View File

@@ -0,0 +1,45 @@
// 中文
langZh = {
// 模塊
demoModule: {
titles: `LUDO排行榜`,
text1: `日榜`,
text2: `周榜`,
text3: `虛位以待`,
text4: `網絡錯誤`,
text5: `加載中...`,
text6: `操作完成`,
titleRule: `遊戲規則`,
ruleText1: `
<li>
<h3>從基地出發</h3>
<p>投擲6開始出發併獎勵1次額外的投擲如果連續3次投擲6則本輪結束</p>
</li>
<li>
<h3>贏得比賽</h3>
<p>經典模式需要4枚棋子達到終點才能獲勝</p>
</li>
<li>
<h3>遊戲道具</h3>
<p>1.贏得“金色骰子”的玩家必須投擲6。</p>
<p>2.贏得“磁鐵”的玩家可以嚮前進8步直到被其他玩家阻擋。</p>
<p>3.贏得“炸彈”的玩家可以炸掉8步將對手消滅併送回基地。</p>
</li>
`,
ruleText2: `
<li>
<h3>解鎖終點通道</h3>
<p>1.只有在消滅其他任何一位玩家的一枚棋子後,您才能進入終點通道。</p>
<p>2.快速模式只需要一枚棋子達到終點即可獲勝。</p>
</li>
<li>
<h3>安全區域</h3>
<p>在起點和星星方格上,您的棋子將受到保護,不會被消滅。</p>
</li>
<li>
<h3>遊戲節奏更快</h3>
<p>遊戲開始時,起點上有一枚棋子。</p>
</li>
`,
}
}

View File

@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="titleRule"></title>
<!-- 游戏规则 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/rule.css">
</head>
<body>
<ul>
</ul>
</body>
</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="./local/ar.js"></script>
<script src="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./js/rule.js"></script>
<script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title>
<!-- 添加管理员页面 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/adminSet.css?v=1.0">
</head>
<body>
<!-- 顶部 -->
<div class="back">
<img src="./images/travel/backB.png" alt="" class="backs">
<img src="./images/fdj.png" alt="" class="fdj">
<input class="text16" type="text" placeholder="">
<div class="text text2"></div>
</div>
<!-- 内容 -->
<ul>
<!-- <li>
<img src="./images/logo.png" alt="" class="tx">
<div class="user">
<p>昵称昵称昵称昵称</p>
<img src="./images/boy.png" alt="" class="sex">
<img src="./images/icon1.png" alt="" class="wealth">
<img src="./images/icon2.png" alt="" class="charm">
<b>ID:0</b>
</div>
<div class="but">إضافة </div>
</li> -->
<li class="null">
<img src="./images/null.png" alt="">
<span class="text3"></span>
</li>
</ul>
<!-- 设置管理员弹窗 -->
<div class="pub">
<div class="pub_in">
<p class="text4"></p>
<div class="butBox">
<div class="close"></div>
<div class="ok"></div>
</div>
</div>
</div>
</body>
</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="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./local/ar.js"></script>
<script src="./js/adminSet.js"></script>
<script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="text1"></title>
<!-- 移除管理员页面 -->
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/adminSet2.css?v=1.0">
</head>
<body>
<!-- 顶部 -->
<div class="back">
<img src="./images/travel/backB.png" alt="" class="backs">
<div class="title text2"> </div>
<div class="text text3"></div>
</div>
<!-- 内容 -->
<ul>
<!-- <li>
<img src="./images/logo.png" alt="" class="tx">
<div class="user">
<p>昵称昵称昵称昵称</p>
<img src="./images/boy.png" alt="" class="sex">
<img src="./images/icon1.png" alt="" class="wealth">
<img src="./images/icon2.png" alt="" class="charm">
<b>ID:0</b>
</div>
<div class="but">حذف </div>
</li> -->
<li class="null">
<img src="./images/null.png" alt="">
<span class="text4"></span>
</li>
</ul>
<!-- 设置管理员弹窗 -->
<div class="pub">
<div class="pub_in">
<!-- 移除管理员 -->
<p class="text5"></p>
<div class="butBox">
<div class="close text6"></div>
<div class="ok text7"></div>
</div>
</div>
</div>
</body>
</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="./local/en.js"></script>
<script src="./local/zh.js"></script>
<script src="./local/ar.js"></script>
<script src="./js/adminSet2.js"></script>
<script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,276 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #eaeaec;
}
.back {
width: 100%;
height: 2.8rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 54%;
}
.back .fdj {
width: 0.42667rem;
height: 0.42667rem;
position: absolute;
top: 58%;
left: 1.41333rem;
z-index: 2;
}
.back input {
border: none;
outline: none;
background: #eaeaec;
width: 6.8rem;
height: 0.74667rem;
line-height: 0.74667rem;
border-radius: 0.74667rem;
box-sizing: border-box;
padding-left: 0.72rem;
position: absolute;
left: 1.22667rem;
top: 65%;
transform: translateY(-50%);
color: #333;
font-size: 0.32rem;
}
.back input::placeholder {
color: #BCBDCB;
font-size: 0.29333rem;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.73333rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
ul {
width: 10rem;
height: 18rem;
margin: 2.53333rem auto 0;
overflow-y: scroll;
padding-top: 0.34667rem;
box-sizing: border-box;
}
ul::-webkit-scrollbar {
display: none;
}
ul li {
width: 9.06667rem;
height: 2.13333rem;
box-sizing: border-box;
overflow: hidden;
margin: 0 auto 0.44rem;
position: relative;
background: #fff;
border-radius: 0.13333rem;
}
ul li .tx {
width: 1.06667rem;
height: 1.06667rem;
border-radius: 1.06667rem;
float: left;
margin-right: 0.14667rem;
margin-left: 0.13333rem;
display: block;
margin-top: 0.44rem;
}
ul li .user {
float: left;
width: 6rem;
}
ul li .user p {
color: #515665;
font-size: 0.37333rem;
font-weight: bold;
display: inline-block;
margin-right: 0.10667rem;
margin-bottom: 0.16rem;
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: 0.66667rem;
}
ul li .user b {
display: block;
color: #A4ABB2;
font-size: 0.32rem;
}
ul li .user .sex {
width: 0.24rem;
height: 0.24rem;
display: inline-block;
margin-top: 0.81333rem;
margin-right: 0.10667rem;
}
ul li .user .wealth,
ul li .user .charm {
display: inline-block;
width: 0.96rem;
height: 0.48rem;
margin-top: 0.64rem;
}
ul li .but {
width: 1.17333rem;
height: 0.56rem;
background: #AA6CF5;
border-radius: 0.56rem;
position: absolute;
right: 0.34667rem;
top: 1.18667rem;
text-align: center;
color: #fff;
line-height: 0.56rem;
font-size: 0.34667rem;
font-weight: 400;
}
ul li .chairman {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
}
ul li .administrator {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
}
ul .null {
width: 100%;
height: 100%;
position: relative;
}
ul .null img {
width: 1.96rem;
height: 2.01333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
ul .null span {
width: 100%;
left: 0;
top: 55%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: 0.4rem;
font-weight: 400;
position: absolute;
text-align: center;
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 11;
display: none;
}
.pub .pub_in {
background: #fff;
border-radius: 0.4rem;
box-sizing: border-box;
padding: 0.66667rem 0.45333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.pub .pub_in p {
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox {
width: 6.85333rem;
display: flex;
justify-content: space-between;
margin: 0.66667rem auto 0;
}
.pub .pub_in .butBox div {
width: 3.2rem;
height: 1.01333rem;
text-align: center;
line-height: 1.01333rem;
border-radius: 1.01333rem;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox .close {
background: #F5F5F5;
color: #999999;
}
.pub .pub_in .butBox .ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}

View File

@@ -0,0 +1,280 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #eaeaec;
}
.back {
width: 100%;
height: px2rem(210);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 54%;
}
.fdj {
width: px2rem(32);
height: px2rem(32);
position: absolute;
top:58%;
left: px2rem(106);
z-index: 2;
}
input {
border: none;
outline: none;
background: #eaeaec;
width: px2rem(510);
height: px2rem(56);
line-height: px2rem(56);
border-radius: px2rem(56);
box-sizing: border-box;
padding-left: px2rem(54);
position: absolute;
left: px2rem(92);
top: 65%;
transform: translateY(-50%);
color: #333;
font-size: px2rem(24);
&::placeholder {
color: #BCBDCB;
font-size: px2rem(22);
}
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(280);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
}
ul {
width: px2rem(750);
height: px2rem(1350);
margin: px2rem(190) auto 0;
overflow-y: scroll;
padding-top: px2rem(26);
box-sizing: border-box;
&::-webkit-scrollbar {
display: none;
}
li {
width: px2rem(680);
height: px2rem(160);
box-sizing: border-box;
overflow: hidden;
margin: 0 auto px2rem(33);
position: relative;
background: #fff;
border-radius: px2rem(10);
.tx {
width: px2rem(80);
height: px2rem(80);
border-radius: px2rem(80);
float: left;
margin-right: px2rem(11);
margin-left: px2rem(10);
display: block;
margin-top: px2rem(33);
}
.user {
float: left;
width: 6rem;
p {
color: #515665;
font-size: px2rem(28);
font-weight: bold;
display: inline-block;
margin-right: px2rem(8);
margin-bottom: px2rem(12);
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: px2rem(50);
}
b {
display: block;
color: #A4ABB2;
font-size: px2rem(24);
}
.sex {
width: px2rem(18);
height: px2rem(18);
display: inline-block;
margin-top: px2rem(61);
margin-right: px2rem(8);
}
.wealth,
.charm {
display: inline-block;
width: px2rem(72);
height: px2rem(36);
margin-top: px2rem(48);
}
}
.but {
width: px2rem(88);
height: px2rem(42);
background: #AA6CF5;
border-radius: px2rem(42);
position: absolute;
right: px2rem(26);
top: px2rem(89);
text-align: center;
color: #fff;
line-height: px2rem(42);
font-size: px2rem(26);
font-weight: 400;
}
.chairman {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
}
.administrator {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
}
}
.null {
width: 100%;
height: 100%;
position: relative;
img {
width: px2rem(147);
height: px2rem(151);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
span {
width: 100%;
left: 0;
top: 55%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: px2rem(30);
font-weight: 400;
position: absolute;
text-align: center;
}
}
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .6);
z-index: 11;
display: none;
.pub_in {
background: #fff;
border-radius: px2rem(30);
box-sizing: border-box;
padding: px2rem(50) px2rem(34);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
p {
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.butBox {
width: px2rem(514);
display: flex;
justify-content: space-between;
margin: px2rem(50) auto 0;
div {
width: px2rem(240);
height: px2rem(76);
text-align: center;
line-height: px2rem(76);
border-radius: px2rem(76);
font-size: px2rem(34);
font-weight: bold;
}
.close {
background: #F5F5F5;
color: #999999;
}
.ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
}
}
}

View File

@@ -0,0 +1,257 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #eaeaec;
}
.back {
width: 100%;
height: 2.8rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 54%;
}
.back .title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: 3.6rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.6rem;
color: #333333;
font-size: 0.4rem;
}
ul {
width: 10rem;
height: 18rem;
margin: 2.93333rem auto 0;
overflow-y: scroll;
padding-top: 0.34667rem;
box-sizing: border-box;
}
ul::-webkit-scrollbar {
display: none;
}
ul li {
width: 9.06667rem;
height: 2.13333rem;
box-sizing: border-box;
overflow: hidden;
margin: 0 auto 0.44rem;
position: relative;
background: #fff;
border-radius: 0.13333rem;
}
ul li .tx {
width: 1.06667rem;
height: 1.06667rem;
border-radius: 1.06667rem;
float: left;
margin-right: 0.14667rem;
margin-left: 0.13333rem;
display: block;
margin-top: 0.44rem;
}
ul li .user {
float: left;
width: 6rem;
}
ul li .user p {
color: #515665;
font-size: 0.37333rem;
font-weight: bold;
display: inline-block;
margin-right: 0.10667rem;
margin-bottom: 0.16rem;
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: 0.66667rem;
}
ul li .user b {
display: block;
color: #A4ABB2;
font-size: 0.32rem;
}
ul li .user .sex {
width: 0.24rem;
height: 0.24rem;
display: inline-block;
margin-top: 0.81333rem;
margin-right: 0.10667rem;
}
ul li .user .wealth,
ul li .user .charm {
display: inline-block;
width: 0.96rem;
height: 0.48rem;
margin-top: 0.64rem;
}
ul li .but {
width: 1.17333rem;
height: 0.56rem;
background: #71BCDB;
border-radius: 0.56rem;
position: absolute;
right: 0.34667rem;
top: 1.18667rem;
text-align: center;
color: #fff;
line-height: 0.56rem;
font-size: 0.34667rem;
font-weight: 400;
}
ul li .chairman {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
display: none;
}
ul li .administrator {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
display: none;
}
ul .null {
width: 100%;
height: 100%;
position: relative;
}
ul .null img {
width: 1.96rem;
height: 2.01333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
ul .null span {
width: 100%;
left: 0;
top: 57%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: 0.4rem;
font-weight: 400;
position: absolute;
text-align: center;
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 11;
display: none;
}
.pub .pub_in {
background: #fff;
border-radius: 0.4rem;
box-sizing: border-box;
padding: 0.66667rem 0.45333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.pub .pub_in p {
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox {
width: 6.85333rem;
display: flex;
justify-content: space-between;
margin: 0.66667rem auto 0;
}
.pub .pub_in .butBox div {
width: 3.2rem;
height: 1.01333rem;
text-align: center;
line-height: 1.01333rem;
border-radius: 1.01333rem;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox .close {
background: #F5F5F5;
color: #999999;
}
.pub .pub_in .butBox .ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}

View File

@@ -0,0 +1,261 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #eaeaec;
}
.back {
width: 100%;
height: px2rem(210);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 54%;
}
.title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: px2rem(270);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(270);
color: #333333;
font-size: px2rem(30);
}
}
ul {
width: px2rem(750);
height: px2rem(1350);
margin: px2rem(220) auto 0;
overflow-y: scroll;
padding-top: px2rem(26);
box-sizing: border-box;
&::-webkit-scrollbar {
display: none;
}
li {
width: px2rem(680);
height: px2rem(160);
box-sizing: border-box;
overflow: hidden;
margin: 0 auto px2rem(33);
position: relative;
background: #fff;
border-radius: px2rem(10);
.tx {
width: px2rem(80);
height: px2rem(80);
border-radius: px2rem(80);
float: left;
margin-right: px2rem(11);
margin-left: px2rem(10);
display: block;
margin-top: px2rem(33);
}
.user {
float: left;
width: 6rem;
p {
color: #515665;
font-size: px2rem(28);
font-weight: bold;
display: inline-block;
margin-right: px2rem(8);
margin-bottom: px2rem(12);
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: px2rem(50);
}
b {
display: block;
color: #A4ABB2;
font-size: px2rem(24);
}
.sex {
width: px2rem(18);
height: px2rem(18);
display: inline-block;
margin-top: px2rem(61);
margin-right: px2rem(8);
}
.wealth,
.charm {
display: inline-block;
width: px2rem(72);
height: px2rem(36);
margin-top: px2rem(48);
}
}
.but {
width: px2rem(88);
height: px2rem(42);
background: #71BCDB;
border-radius: px2rem(42);
position: absolute;
right: px2rem(26);
top: px2rem(89);
text-align: center;
color: #fff;
line-height: px2rem(42);
font-size: px2rem(26);
font-weight: 400;
}
.chairman {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
display: none;
}
.administrator {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
display: none;
}
}
.null {
width: 100%;
height: 100%;
position: relative;
img {
width: px2rem(147);
height: px2rem(151);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
span {
width: 100%;
left: 0;
top: 57%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: px2rem(30);
font-weight: 400;
position: absolute;
text-align: center;
}
}
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .6);
z-index: 11;
display: none;
.pub_in {
background: #fff;
border-radius: px2rem(30);
box-sizing: border-box;
padding: px2rem(50) px2rem(34);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
p {
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.butBox {
width: px2rem(514);
display: flex;
justify-content: space-between;
margin: px2rem(50) auto 0;
div {
width: px2rem(240);
height: px2rem(76);
text-align: center;
line-height: px2rem(76);
border-radius: px2rem(76);
font-size: px2rem(34);
font-weight: bold;
}
.close {
background: #F5F5F5;
color: #999999;
}
.ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
}
}
}

View File

@@ -0,0 +1,242 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
}
.back {
width: 100%;
height: 2.38667rem;
line-height: 3.2rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
z-index: 10;
background: url(../images/topBg.png) no-repeat top;
background-size: 100% 7rem;
}
.back img {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 58%;
}
.top {
width: 9.25333rem;
height: 1.18667rem;
line-height: 0.78667rem;
background: #fff;
border-radius: 0.26667rem 0.26667rem 0 0;
margin: 2.5rem auto 0;
color: #333;
font-size: 0.42667rem;
box-sizing: border-box;
padding: 0 0.4rem;
}
.top .left {
height: 1.18667rem;
line-height: 1.18667rem;
float: left;
}
.top img {
float: right;
display: block;
width: 0.58667rem;
height: 0.58667rem;
margin-top: 0.33333rem;
}
ul {
width: 9.25333rem;
height: 16.81333rem;
overflow-y: scroll;
margin: 0 auto;
border-radius: 0 0 0.26667rem 0.26667rem;
background: #fff;
}
ul::-webkit-scrollbar {
display: none;
}
ul li {
width: 100%;
height: 2.13333rem;
overflow: hidden;
box-sizing: border-box;
padding: 0 0.26667rem 0 0.2rem;
position: relative;
}
ul li .num {
color: #000000;
font-size: 0.4rem;
font-weight: bold;
width: 1.01333rem;
height: 1.01333rem;
line-height: 1.01333rem;
text-align: center;
float: left;
margin-top: 0.66667rem;
}
ul li .ts {
width: 1.70667rem;
height: 1.37333rem;
position: absolute;
z-index: 2;
left: 1.09333rem;
top: 0.49333rem;
}
ul li .tx {
width: 1.33333rem;
height: 1.33333rem;
position: absolute;
left: 1.28rem;
top: 0.52rem;
border-radius: 50%;
}
ul li .user {
float: left;
margin-left: 1.66667rem;
}
ul li .user p {
width: 2.5rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #515665;
font-size: 0.32rem;
margin-bottom: 0.38667rem;
font-weight: bold;
box-sizing: border-box;
padding-top: 0.70667rem;
}
ul li .user b {
color: #A4ABB2;
font-size: 0.32rem;
font-weight: 500;
}
ul li .but {
width: 1.54667rem;
height: 0.56rem;
line-height: 0.56rem;
background: #7F95FF;
border-radius: 0.56rem;
float: right;
margin-top: 0.76rem;
text-align: center;
color: #fff;
font-size: 0.26667rem;
}
ul li:nth-child(odd) {
background: rgba(50, 39, 79, 0.06);
}
ul li:nth-child(1) .num {
background: url(../images/no1.png) no-repeat;
background-size: 100% 100%;
}
ul li:nth-child(1) .ts {
width: 1.78667rem;
height: 1.78667rem;
left: 1.05333rem;
top: 0.18667rem;
}
ul li:nth-child(2) .num {
background: url(../images/no2.png) no-repeat;
background-size: 100% 100%;
}
ul li:nth-child(2) .ts {
width: 1.78667rem;
height: 1.78667rem;
left: 1.05333rem;
top: 0.18667rem;
}
ul li:nth-child(3) .num {
background: url(../images/no3.png) no-repeat;
background-size: 100% 100%;
}
ul li:nth-child(3) .ts {
width: 1.78667rem;
height: 1.78667rem;
left: 1.05333rem;
top: 0.18667rem;
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 11;
display: none;
}
.pub .pub_in {
background: #fff;
border-radius: 0.4rem;
box-sizing: border-box;
padding: 0.66667rem 0.45333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.pub .pub_in p {
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox {
width: 6.85333rem;
display: flex;
justify-content: space-between;
margin: 0.66667rem auto 0;
}
.pub .pub_in .butBox div {
width: 3.2rem;
height: 1.01333rem;
text-align: center;
line-height: 1.01333rem;
border-radius: 1.01333rem;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox .close {
background: #F5F5F5;
color: #999999;
}
.pub .pub_in .butBox .ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}

View File

@@ -0,0 +1,254 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #F5F7F9;
}
.back {
width: 100%;
height: px2rem(179);
line-height: px2rem(240);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
z-index: 10;
background: url(../images/topBg.png) no-repeat top;
background-size: 100% 7rem;
img {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 58%;
}
}
.top {
width: px2rem(694);
height: px2rem(89);
line-height: px2rem(59);
background: #fff;
border-radius: px2rem(20) px2rem(20) 0 0;
margin: 2.5rem auto 0;
color: #333;
font-size: px2rem(32);
box-sizing: border-box;
padding: 0 px2rem(30);
.left {
height: px2rem(89);
line-height: px2rem(89);
float: left;
}
img {
float: right;
display: block;
width: px2rem(44);
height: px2rem(44);
margin-top: px2rem(25);
}
}
ul {
width: px2rem(694);
height: px2rem(1261);
overflow-y: scroll;
margin: 0 auto;
border-radius: 0 0 px2rem(20) px2rem(20);
background: #fff;
&::-webkit-scrollbar {
display: none;
}
li {
width: 100%;
height: px2rem(160);
overflow: hidden;
box-sizing: border-box;
padding: 0 px2rem(20) 0 px2rem(15);
position: relative;
.num {
color: #000000;
font-size: px2rem(30);
font-weight: bold;
width: px2rem(76);
height: px2rem(76);
line-height: px2rem(76);
text-align: center;
float: left;
margin-top: px2rem(50);
}
.ts {
width: px2rem(128);
height: px2rem(103);
position: absolute;
z-index: 2;
left: px2rem(82);
top: px2rem(37);
}
.tx {
width: px2rem(100);
height: px2rem(100);
position: absolute;
left: px2rem(96);
top: px2rem(39);
border-radius: 50%;
}
.user {
float: left;
margin-left: px2rem(125);
p {
width: 2.5rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #515665;
font-size: px2rem(24);
margin-bottom: px2rem(29);
font-weight: bold;
box-sizing: border-box;
padding-top: px2rem(53);
}
b {
color: #A4ABB2;
font-size: px2rem(24);
font-weight: 500;
}
}
.but {
width: px2rem(116);
height: px2rem(42);
line-height: px2rem(42);
background: #7F95FF;
border-radius: px2rem(42);
float: right;
margin-top: px2rem(57);
text-align: center;
color: #fff;
font-size: px2rem(20);
}
&:nth-child(odd) {
background: rgba(50, 39, 79, .06);
}
&:nth-child(1) {
.num {
background: url(../images/no1.png) no-repeat;
background-size: 100% 100%;
}
.ts {
width: px2rem(134);
height: px2rem(134);
left: px2rem(79);
top: px2rem(14);
}
}
&:nth-child(2) {
.num {
background: url(../images/no2.png) no-repeat;
background-size: 100% 100%;
}
.ts {
width: px2rem(134);
height: px2rem(134);
left: px2rem(79);
top: px2rem(14);
}
}
&:nth-child(3) {
.num {
background: url(../images/no3.png) no-repeat;
background-size: 100% 100%;
}
.ts {
width: px2rem(134);
height: px2rem(134);
left: px2rem(79);
top: px2rem(14);
}
}
}
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .6);
z-index: 11;
display: none;
.pub_in {
background: #fff;
border-radius: px2rem(30);
box-sizing: border-box;
padding: px2rem(50) px2rem(34);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
p {
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.butBox {
width: px2rem(514);
display: flex;
justify-content: space-between;
margin: px2rem(50) auto 0;
div {
width: px2rem(240);
height: px2rem(76);
text-align: center;
line-height: px2rem(76);
border-radius: px2rem(76);
font-size: px2rem(34);
font-weight: bold;
}
.close {
background: #F5F5F5;
color: #999999;
}
.ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
}
}
}

View File

@@ -0,0 +1,120 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
box-sizing: border-box;
padding: 0 0.42667rem;
}
.back {
width: 100%;
height: 2.66667rem;
line-height: 3.46667rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #333333;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back img {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 54%;
}
.nick {
margin-top: 2.93333rem;
color: #333333;
font-size: 0.42667rem;
font-weight: 800;
}
.nick input {
border: none;
outline: none;
background: #F5F7F9;
width: 5.4rem;
height: 0.66667rem;
border-radius: 0.66667rem;
box-sizing: border-box;
color: #333;
font-size: 0.42667rem;
box-sizing: border-box;
padding-left: 0.13333rem;
margin-bottom: 0.74667rem;
}
.nick input::placeholder {
color: #515665;
}
.bg {
width: 100%;
height: 2.26667rem;
position: relative;
}
.bg span {
display: inline-block;
color: #333;
font-size: 0.42667rem;
line-height: 2.26667rem;
font-weight: 800;
}
.bg img {
width: 2.26667rem;
height: 2.26667rem;
position: absolute;
top: 0;
left: 2.53333rem;
z-index: 1;
border-radius: 0.13333rem;
}
.bg .upload {
width: 2.26667rem;
height: 2.26667rem;
position: absolute;
top: 0;
left: 2.53333rem;
z-index: 2;
}
.boxBut {
width: 7.06667rem;
height: 0.93333rem;
margin: 1.73333rem auto 0;
display: flex;
justify-content: space-between;
}
.boxBut .close {
width: 2.88rem;
height: 0.93333rem;
line-height: 0.93333rem;
border-radius: 0.93333rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
background: #CCCBCE;
}
.boxBut .ok {
width: 2.88rem;
height: 0.93333rem;
line-height: 0.93333rem;
border-radius: 0.93333rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
background: linear-gradient(90deg, #867FFF, #66E3FF);
}

View File

@@ -0,0 +1,124 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #F5F7F9;
box-sizing: border-box;
padding: 0 px2rem(32);
}
.back {
width: 100%;
height: px2rem(200);
line-height: px2rem(260);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #333333;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
img {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 54%;
}
}
.nick {
margin-top: px2rem(220);
color: #333333;
font-size: px2rem(32);
font-weight: 800;
input {
border: none;
outline: none;
background: #F5F7F9;
width: 5.4rem;
height: px2rem(50);
border-radius: px2rem(50);
box-sizing: border-box;
color: #333;
font-size: px2rem(32);
box-sizing: border-box;
padding-left: px2rem(10);
margin-bottom: px2rem(56);
&::placeholder {
color: #515665;
}
}
}
.bg {
width: 100%;
height: px2rem(170);
position: relative;
span {
display: inline-block;
color: #333;
font-size: px2rem(32);
line-height: px2rem(170);
font-weight: 800;
}
img {
width: px2rem(170);
height: px2rem(170);
position: absolute;
top: 0;
left: px2rem(190);
z-index: 1;
border-radius: px2rem(10);
}
.upload {
width: px2rem(170);
height: px2rem(170);
position: absolute;
top: 0;
left: px2rem(190);
z-index: 2;
}
}
.boxBut {
width: px2rem(530);
height: px2rem(70);
margin: px2rem(130) auto 0;
display: flex;
justify-content: space-between;
.close {
width: px2rem(216);
height: px2rem(70);
line-height: px2rem(70);
border-radius: px2rem(70);
text-align: center;
color: #fff;
font-size: px2rem(32);
background: #CCCBCE;
}
.ok {
width: px2rem(216);
height: px2rem(70);
line-height: px2rem(70);
border-radius: px2rem(70);
text-align: center;
color: #fff;
font-size: px2rem(32);
background: linear-gradient(90deg, #867FFF, #66E3FF);
}
}

View File

@@ -0,0 +1,436 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #e4e4e7;
}
.back {
width: 100%;
height: 0.58667rem;
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 0.93333rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
}
.back img {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 0rem;
}
.back b {
width: 75%;
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.header {
width: 10rem;
height: 8.98667rem;
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
position: relative;
margin: 0 auto 0rem;
}
.header .tx {
width: 2.64rem;
height: 2.53333rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 1.85333rem;
border-radius: 50%;
}
.header .ts {
width: 2.77333rem;
height: 2.77333rem;
position: absolute;
top: 1.73333rem;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.header .nick {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #fff;
font-size: 0.53333rem;
font-weight: bold;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 4.85333rem;
}
.header .id {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #fff;
font-size: 0.34667rem;
font-weight: 500;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 5.64rem;
}
.header .adminSet {
padding: 0rem 0.21333rem;
box-sizing: border-box;
height: 0.58667rem;
line-height: 0.58667rem;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
border-radius: 0.58667rem 0px 0px 0.58667rem;
position: absolute;
right: 0;
top: 2.45333rem;
display: none;
}
.header .guildInfoSet {
padding: 0rem 0.21333rem;
box-sizing: border-box;
height: 0.58667rem;
line-height: 0.58667rem;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
border-radius: 0.58667rem 0px 0px 0.58667rem;
position: absolute;
right: 0;
top: 3.18667rem;
display: none;
}
.header .memberFlow {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem;
position: absolute;
left: 2.08rem;
top: 6.21333rem;
display: none;
}
.header .memberFlowMy {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem 0 0 0.18667rem;
position: absolute;
right: 0rem;
top: 2.90667rem;
display: none;
}
.header .inveMember {
width: 2.77333rem;
height: 0.74667rem;
line-height: 0.74667rem;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
border-radius: 0.18667rem;
position: absolute;
right: 2.08rem;
top: 6.21333rem;
display: none;
}
.header .guildNick {
width: 100%;
position: absolute;
left: 0;
top: 6.30667rem;
color: #FFFFFF;
opacity: 0.8;
font-size: 0.32rem;
text-align: center;
display: none;
}
.guildList {
width: 9.25333rem;
height: 13.33333rem;
border-radius: 0.26667rem;
margin: -1.66667rem auto 0rem;
position: relative;
background: #fff;
overflow: hidden;
}
.guildList .top {
width: 100%;
box-sizing: border-box;
padding: 0 0.33333rem;
height: 0.4rem;
line-height: 0.4rem;
margin-top: 0.41333rem;
position: relative;
}
.guildList .top b {
float: left;
font-size: 0.32rem;
color: #333;
font-weight: bold;
display: block;
margin-right: 0.09333rem;
}
.guildList .top i {
display: block;
color: #666;
font-size: 0.29333rem;
float: left;
font-style: normal;
}
.guildList .top img {
float: right;
display: block;
width: 0.42667rem;
height: 0.42667rem;
position: absolute;
left: 3.68rem;
top: 51%;
transform: translateY(-50%);
z-index: 2;
display: none;
}
.guildList .top input {
border: none;
outline: none;
background: #F5F7F9;
width: 5.4rem;
height: 0.66667rem;
border-radius: 0.66667rem;
box-sizing: border-box;
padding-left: 0.72rem;
position: absolute;
left: 3.49333rem;
top: 50%;
transform: translateY(-50%);
color: #333;
display: none;
}
.guildList .top input::placeholder {
color: #BCBDCB;
font-size: 0.29333rem;
}
.guildList ul {
width: 100%;
height: 8.4rem;
margin: 0.52rem auto 0;
overflow-y: scroll;
}
.guildList ul::-webkit-scrollbar {
display: none;
}
.guildList ul li {
width: 100%;
height: 1.33333rem;
box-sizing: border-box;
overflow: hidden;
margin-bottom: 0.44rem;
position: relative;
box-sizing: border-box;
padding-left: 0.13333rem;
}
.guildList ul li .tx {
width: 1.06667rem;
height: 1.06667rem;
border-radius: 1.06667rem;
float: left;
margin-right: 0.14667rem;
margin-left: 0.13333rem;
display: block;
}
.guildList ul li .user {
float: left;
width: 6rem;
}
.guildList ul li .user p {
color: #515665;
font-size: 0.37333rem;
font-weight: bold;
display: inline-block;
margin-right: 0.10667rem;
margin-bottom: 0.18667rem;
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: 0.10667rem;
}
.guildList ul li .user b {
display: block;
color: #A4ABB2;
font-size: 0.32rem;
}
.guildList ul li .user .sex {
width: 0.24rem;
height: 0.24rem;
display: inline-block;
margin-top: 0.16rem;
margin-right: 0.10667rem;
}
.guildList ul li .user .wealth,
.guildList ul li .user .charm {
display: inline-block;
width: 0.96rem;
height: 0.48rem;
}
.guildList ul li .but {
width: 1.17333rem;
height: 0.56rem;
background: #7F95FF;
border-radius: 0.56rem;
position: absolute;
right: 0.34667rem;
top: 0.09333rem;
text-align: center;
color: #fff;
line-height: 0.56rem;
font-size: 0.34667rem;
font-weight: 400;
}
.guildList ul li .chairman {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.26667rem;
top: 0.94667rem;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
display: none;
}
.guildList ul li .administrator {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.26667rem;
top: 0.94667rem;
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
display: none;
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 11;
display: none;
}
.pub .pub_in {
background: #fff;
border-radius: 0.4rem;
box-sizing: border-box;
padding: 0.66667rem 0.45333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.pub .pub_in p {
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox {
width: 6.85333rem;
display: flex;
justify-content: space-between;
margin-top: 0.66667rem;
margin: 0.66667rem auto 0;
}
.pub .pub_in .butBox div {
width: 3.2rem;
height: 1.01333rem;
text-align: center;
line-height: 1.01333rem;
border-radius: 1.01333rem;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox .close {
background: #F5F5F5;
color: #999999;
}
.pub .pub_in .butBox .ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}

View File

@@ -0,0 +1,442 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #e4e4e7;
}
.back {
width: 100%;
height: px2rem(44);
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(70);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
img {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: px2rem(0);
}
b {
width: 75%;
display: inline-block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
.header {
width: px2rem(750);
height: px2rem(674);
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
position: relative;
margin: 0 auto px2rem(0);
.tx {
width: px2rem(198);
height: px2rem(190);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(139);
border-radius: 50%;
}
.ts {
width: px2rem(208);
height: px2rem(208);
position: absolute;
top: px2rem(130);
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.nick {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #fff;
font-size: px2rem(40);
font-weight: bold;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(364);
}
.id {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #fff;
font-size: px2rem(26);
font-weight: 500;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(423);
}
.adminSet {
padding: px2rem(0) px2rem(16);
box-sizing: border-box;
height: px2rem(44);
line-height: px2rem(44);
color: #fff;
font-size: px2rem(32);
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
border-radius: px2rem(44) 0px 0px px2rem(44);
position: absolute;
right: 0;
top: px2rem(184);
display: none;
}
.guildInfoSet {
padding: px2rem(0) px2rem(16);
box-sizing: border-box;
height: px2rem(44);
line-height: px2rem(44);
color: #fff;
font-size: px2rem(32);
font-weight: 400;
background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
border-radius: px2rem(44) 0px 0px px2rem(44);
position: absolute;
right: 0;
top: px2rem(239);
display: none;
}
.memberFlow {
width: px2rem(208);
height: px2rem(56);
line-height: px2rem(56);
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14);
position: absolute;
left: px2rem(156);
top: px2rem(466);
display: none;
}
.memberFlowMy {
width: px2rem(208);
height: px2rem(56);
line-height: px2rem(56);
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14) 0 0 px2rem(14);
position: absolute;
right: px2rem(0);
top: px2rem(218);
display: none;
}
.inveMember {
width: px2rem(208);
height: px2rem(56);
line-height: px2rem(56);
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 400;
background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
border-radius: px2rem(14);
position: absolute;
right: px2rem(156);
top: px2rem(466);
display: none;
}
.guildNick {
width: 100%;
position: absolute;
left: 0;
top: px2rem(473);
color: #FFFFFF;
opacity: 0.8;
font-size: px2rem(24);
text-align: center;
display: none;
}
}
.guildList {
width: px2rem(694);
height: px2rem(1000);
border-radius: px2rem(20);
margin: px2rem(-125) auto px2rem(0);
position: relative;
background: #fff;
overflow: hidden;
.top {
width: 100%;
box-sizing: border-box;
padding: 0 px2rem(25);
height: px2rem(30);
line-height: px2rem(30);
margin-top: px2rem(31);
position: relative;
// margin-left: px2rem(-13);
b {
float: left;
font-size: px2rem(24);
color: #333;
font-weight: bold;
display: block;
margin-right: px2rem(7);
}
i {
display: block;
color: #666;
font-size: px2rem(22);
float: left;
font-style: normal;
}
img {
float: right;
display: block;
width: px2rem(32);
height: px2rem(32);
position: absolute;
left: 3.68rem;
top: 51%;
transform: translateY(-50%);
z-index: 2;
display: none;
}
input {
border: none;
outline: none;
background: #F5F7F9;
width: 5.4rem;
height: px2rem(50);
border-radius: px2rem(50);
box-sizing: border-box;
padding-left: px2rem(54);
position: absolute;
left: 3.49333rem;
top: 50%;
transform: translateY(-50%);
color: #333;
display: none;
&::placeholder {
color: #BCBDCB;
font-size: px2rem(22);
}
}
}
ul {
width: 100%;
height: 8.4rem;
margin: px2rem(39) auto 0;
overflow-y: scroll;
&::-webkit-scrollbar {
display: none;
}
li {
width: 100%;
height: px2rem(100);
box-sizing: border-box;
overflow: hidden;
margin-bottom: px2rem(33);
position: relative;
box-sizing: border-box;
padding-left: px2rem(10);
.tx {
width: px2rem(80);
height: px2rem(80);
border-radius: px2rem(80);
float: left;
margin-right: px2rem(11);
margin-left: px2rem(10);
display: block;
}
.user {
float: left;
width: 6rem;
p {
color: #515665;
font-size: px2rem(28);
font-weight: bold;
display: inline-block;
margin-right: px2rem(8);
margin-bottom: px2rem(14);
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: border-box;
padding-top: px2rem(8);
}
b {
display: block;
color: #A4ABB2;
font-size: px2rem(24);
}
.sex {
width: px2rem(18);
height: px2rem(18);
display: inline-block;
margin-top: px2rem(12);
margin-right: px2rem(8);
}
.wealth,
.charm {
display: inline-block;
width: px2rem(72);
height: px2rem(36);
}
}
.but {
width: px2rem(88);
height: px2rem(42);
background: #7F95FF;
border-radius: px2rem(42);
position: absolute;
right: px2rem(26);
top: px2rem(7);
text-align: center;
color: #fff;
line-height: px2rem(42);
font-size: px2rem(26);
font-weight: 400;
}
.chairman {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(20);
top: px2rem(71);
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
display: none;
}
.administrator {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(20);
top: px2rem(71);
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
display: none;
}
}
}
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .6);
z-index: 11;
display: none;
.pub_in {
background: #fff;
border-radius: px2rem(30);
box-sizing: border-box;
padding: px2rem(50) px2rem(34);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
p {
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.butBox {
width: px2rem(514);
display: flex;
justify-content: space-between;
margin-top: px2rem(50);
margin: px2rem(50) auto 0;
div {
width: px2rem(240);
height: px2rem(76);
text-align: center;
line-height: px2rem(76);
border-radius: px2rem(76);
font-size: px2rem(34);
font-weight: bold;
}
.close {
background: #F5F5F5;
color: #999999;
}
.ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
}
}
}

View File

@@ -0,0 +1,274 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #eaeaec;
}
.back {
width: 100%;
height: 2.53333rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 59%;
}
.back .fdj {
width: 0.42667rem;
height: 0.42667rem;
position: absolute;
top: 66%;
left: 1.41333rem;
z-index: 2;
}
.back input {
border: none;
outline: none;
background: #eaeaec;
width: 6.8rem;
height: 0.74667rem;
line-height: 0.74667rem;
border-radius: 0.74667rem;
box-sizing: border-box;
padding-left: 0.72rem;
position: absolute;
left: 1.22667rem;
top: 75%;
transform: translateY(-50%);
color: #333;
font-size: 0.32rem;
}
.back input::placeholder {
color: #BCBDCB;
font-size: 0.29333rem;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.73333rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
ul {
width: 10rem;
height: 18rem;
margin: 2.4rem auto 0;
overflow-y: scroll;
padding-top: 0.34667rem;
box-sizing: border-box;
}
ul::-webkit-scrollbar {
display: none;
}
ul li {
width: 9.06667rem;
height: 2.13333rem;
box-sizing: border-box;
overflow: hidden;
margin: 0 auto 0.44rem;
position: relative;
background: #fff;
border-radius: 0.13333rem;
}
ul li .tx {
width: 1.06667rem;
height: 1.06667rem;
border-radius: 1.06667rem;
float: left;
margin-right: 0.14667rem;
margin-left: 0.13333rem;
display: block;
margin-top: 0.44rem;
}
ul li .user {
float: left;
width: 6rem;
}
ul li .user p {
color: #515665;
font-size: 0.37333rem;
font-weight: bold;
display: inline-block;
margin-right: 0.10667rem;
margin-top: 0.74667rem;
margin-bottom: 0.16rem;
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
ul li .user b {
display: block;
color: #A4ABB2;
font-size: 0.32rem;
}
ul li .user .sex {
width: 0.24rem;
height: 0.24rem;
display: inline-block;
margin-top: 0.81333rem;
margin-right: 0.10667rem;
}
ul li .user .wealth,
ul li .user .charm {
display: inline-block;
width: 0.96rem;
height: 0.48rem;
margin-top: 0.64rem;
}
ul li .but {
width: 1.17333rem;
height: 0.56rem;
background: #F08ED3;
border-radius: 0.56rem;
position: absolute;
right: 0.34667rem;
top: 1.18667rem;
text-align: center;
color: #fff;
line-height: 0.56rem;
font-size: 0.34667rem;
font-weight: 400;
}
ul li .chairman {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
}
ul li .administrator {
width: 1.04rem;
height: 0.34667rem;
line-height: 0.34667rem;
border-radius: 0.34667rem;
text-align: center;
color: #333;
font-size: 0.29333rem;
font-weight: 400;
position: absolute;
left: 0.16rem;
top: 0.94667rem;
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
}
ul .null {
width: 100%;
height: 100%;
position: relative;
}
ul .null img {
width: 1.96rem;
height: 2.01333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
ul .null span {
width: 100%;
left: 0;
top: 55%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: 0.4rem;
font-weight: 400;
position: absolute;
text-align: center;
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 11;
}
.pub .pub_in {
background: #fff;
border-radius: 0.4rem;
box-sizing: border-box;
padding: 0.66667rem 0.45333rem;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.pub .pub_in p {
text-align: center;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox {
width: 6.85333rem;
display: flex;
justify-content: space-between;
margin: 0.66667rem auto 0;
}
.pub .pub_in .butBox div {
width: 3.2rem;
height: 1.01333rem;
text-align: center;
line-height: 1.01333rem;
border-radius: 1.01333rem;
font-size: 0.45333rem;
font-weight: bold;
}
.pub .pub_in .butBox .close {
background: #F5F5F5;
color: #999999;
}
.pub .pub_in .butBox .ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}

View File

@@ -0,0 +1,278 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #eaeaec;
}
.back {
width: 100%;
height: px2rem(190);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 59%;
}
.fdj {
width: px2rem(32);
height: px2rem(32);
position: absolute;
top: 66%;
left: px2rem(106);
z-index: 2;
}
input {
border: none;
outline: none;
background: #eaeaec;
width: px2rem(510);
height: px2rem(56);
line-height: px2rem(56);
border-radius: px2rem(56);
box-sizing: border-box;
padding-left: px2rem(54);
position: absolute;
left: px2rem(92);
top: 75%;
transform: translateY(-50%);
color: #333;
font-size: px2rem(24);
&::placeholder {
color: #BCBDCB;
font-size: px2rem(22);
}
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(280);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
}
ul {
width: px2rem(750);
height: px2rem(1350);
margin: px2rem(180) auto 0;
overflow-y: scroll;
padding-top: px2rem(26);
box-sizing: border-box;
&::-webkit-scrollbar {
display: none;
}
li {
width: px2rem(680);
height: px2rem(160);
box-sizing: border-box;
overflow: hidden;
margin: 0 auto px2rem(33);
position: relative;
background: #fff;
border-radius: px2rem(10);
.tx {
width: px2rem(80);
height: px2rem(80);
border-radius: px2rem(80);
float: left;
margin-right: px2rem(11);
margin-left: px2rem(10);
display: block;
margin-top: px2rem(33);
}
.user {
float: left;
width: 6rem;
p {
color: #515665;
font-size: px2rem(28);
font-weight: bold;
display: inline-block;
margin-right: px2rem(8);
margin-top: px2rem(56);
margin-bottom: px2rem(12);
width: 2.7rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
b {
display: block;
color: #A4ABB2;
font-size: px2rem(24);
}
.sex {
width: px2rem(18);
height: px2rem(18);
display: inline-block;
margin-top: px2rem(61);
margin-right: px2rem(8);
}
.wealth,
.charm {
display: inline-block;
width: px2rem(72);
height: px2rem(36);
margin-top: px2rem(48);
}
}
.but {
width: px2rem(88);
height: px2rem(42);
background: #F08ED3;
border-radius: px2rem(42);
position: absolute;
right: px2rem(26);
top: px2rem(89);
text-align: center;
color: #fff;
line-height: px2rem(42);
font-size: px2rem(26);
font-weight: 400;
}
.chairman {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(90deg, #FFEB67, #FFFCE7);
}
.administrator {
width: px2rem(78);
height: px2rem(26);
line-height: px2rem(26);
border-radius: px2rem(26);
text-align: center;
color: #333;
font-size: px2rem(22);
font-weight: 400;
position: absolute;
left: px2rem(12);
top: px2rem(71);
background: linear-gradient(-90deg, #FBE1FF, #F090FF);
}
}
.null {
width: 100%;
height: 100%;
position: relative;
img {
width: px2rem(147);
height: px2rem(151);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
span {
width: 100%;
left: 0;
top: 55%;
transform: translateY(-50%);
color: #A9A9A9;
font-size: px2rem(30);
font-weight: 400;
position: absolute;
text-align: center;
}
}
}
.pub {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .6);
z-index: 11;
.pub_in {
background: #fff;
border-radius: px2rem(30);
box-sizing: border-box;
padding: px2rem(50) px2rem(34);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
p {
text-align: center;
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.butBox {
width: px2rem(514);
display: flex;
justify-content: space-between;
margin: px2rem(50) auto 0;
div {
width: px2rem(240);
height: px2rem(76);
text-align: center;
line-height: px2rem(76);
border-radius: px2rem(76);
font-size: px2rem(34);
font-weight: bold;
}
.close {
background: #F5F5F5;
color: #999999;
}
.ok {
background: linear-gradient(90deg, #53C7D4, #7C5EFD);
color: #fff;
}
}
}
}

View File

@@ -0,0 +1,256 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
}
.back {
width: 100%;
height: 2.4rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 58%;
z-index: 2;
}
.back .title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.4rem;
}
.timeBox {
width: 9.46667rem;
height: 2.54667rem;
background: #fff;
border-radius: 0.4rem;
margin: 2.53333rem auto 0.25333rem;
position: relative;
}
.timeBox .line {
width: 0.02667rem;
height: 1.90667rem;
background: #D7DCE6;
position: absolute;
left: 2.92rem;
top: 50%;
transform: translateY(-50%);
border-radius: 0.02667rem;
}
.timeBox .year {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.33333rem;
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.timeBox .startTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.96rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .startTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .startTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .endTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 1.62667rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .endTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .endTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .right {
width: 5.5rem;
height: 2.54667rem;
position: absolute;
right: 0.55rem;
top: 0;
display: flex;
justify-content: space-between;
}
.timeBox .right div {
width: 50%;
text-align: center;
overflow: hidden;
}
.timeBox .right div p {
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
margin-top: 0.53333rem;
margin-bottom: 0.33333rem;
line-height: 0.34rem;
}
.timeBox .right div b {
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.list {
width: 9.46667rem;
height: 12.8rem;
background: #fff;
border-radius: 0.4rem;
margin: 0.25333rem auto 0.13333rem;
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
}
.list::-webkit-scrollbar {
display: none;
}
.list .top {
height: 1.5rem;
width: 9.46667rem;
box-sizing: border-box;
padding: 0.53333rem 0.26667rem 0;
display: flex;
justify-content: space-between;
line-height: 0.4rem;
position: fixed;
left: 50%;
transform: translateX(-50%);
top: 5.3rem;
background: #fff;
border-radius: 0.4rem 0.4rem 0 0;
}
.list .top div {
width: 25%;
text-align: center;
color: #5D95FF;
font-size: 0.29333rem;
font-weight: 600;
}
.list .other {
width: 8.76rem;
height: 2.01333rem;
margin: 0 auto 0;
border-bottom: 0.02667rem solid #D7DCE6;
display: flex;
justify-content: space-between;
}
.list .other:last-child {
border: none;
}
.list .other div {
width: 25%;
text-align: center;
height: 100%;
line-height: 2.01333rem;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
white-space: nowrap;
}
.list .other div img {
display: block;
margin: 0.45333rem auto 0.06667rem;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
}
.list .other div p {
width: 98%;
height: 0.33333rem;
line-height: 0.32rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
margin-bottom: 0.12rem;
}
.list .other div .id {
width: 100%;
text-align: center;
color: #A4ABB2;
font-size: 0.24rem;
}
.list .other .div11 {
line-height: 0rem;
}

View File

@@ -0,0 +1,263 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: px2rem(1334);
background: #F5F7F9;
}
.back {
width: 100%;
height: px2rem(180);
position: fixed;
left: 0;
top: px2rem(0);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
font-weight: bold;
z-index: 10;
background: #fff;
.backs {
width: px2rem(44);
height: px2rem(44);
position: absolute;
left: px2rem(18);
top: 58%;
z-index: 2;
}
.title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(34);
font-weight: bold;
}
.text {
position: absolute;
right: px2rem(47);
height: 100%;
top: 0;
line-height: px2rem(260);
color: #333333;
font-size: px2rem(30);
}
}
.timeBox {
width: px2rem(710);
height: px2rem(191);
background: #fff;
border-radius: px2rem(30);
margin: px2rem(190) auto px2rem(19);
position: relative;
.line {
width: px2rem(2);
height: px2rem(143);
background: #D7DCE6;
position: absolute;
left: px2rem(219);
top: 50%;
transform: translateY(-50%);
border-radius: px2rem(2);
}
.year {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(25);
color: #A4ABB2;
font-size: px2rem(24);
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.startTime {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(72);
color: #848D9C;
font-size: px2rem(28);
font-weight: bold;
// text-align: center;
b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
margin-top: 0.1rem;
}
}
.endTime {
width: px2rem(219);
position: absolute;
left: 0;
top: px2rem(122);
color: #848D9C;
font-size: px2rem(28);
font-weight: bold;
// text-align: center;
b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
img {
width: px2rem(24);
height: px2rem(16);
display: inline-block;
margin-top: 0.1rem;
}
}
.right {
width: 5.5rem;
height: px2rem(191);
position: absolute;
right: 0.55rem;
top: 0;
display: flex;
justify-content: space-between;
div {
width: 50%;
text-align: center;
overflow: hidden;
p {
color: #A4ABB2;
font-size: px2rem(24);
font-weight: bold;
margin-top: px2rem(40);
margin-bottom: px2rem(25);
line-height: 0.34rem;
}
b {
color: #848D9C;
font-size: px2rem(28);
font-weight: bold;
}
}
}
}
.list {
width: px2rem(710);
height: px2rem(960);
background: #fff;
border-radius: px2rem(30);
margin: px2rem(19) auto px2rem(10);
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
&::-webkit-scrollbar {
display: none;
}
.top {
height: 1.5rem;
width: px2rem(710);
box-sizing: border-box;
padding: px2rem(40) px2rem(20) 0;
display: flex;
justify-content: space-between;
line-height: 0.4rem;
position: fixed;
left: 50%;
transform: translateX(-50%);
top: 5.3rem;
background: #fff;
border-radius: px2rem(30) px2rem(30) 0 0;
div {
width: 25%;
text-align: center;
color: #5D95FF;
font-size: px2rem(22);
font-weight: 600;
}
}
.other {
width: px2rem(657);
height: px2rem(151);
margin: 0 auto 0;
border-bottom: px2rem(2) solid #D7DCE6;
display: flex;
justify-content: space-between;
// background: pink;
&:last-child {
border: none;
}
div {
width: 25%;
text-align: center;
height: 100%;
line-height: px2rem(151);
color: #848D9C;
font-size: px2rem(24);
font-weight: 500;
white-space: nowrap;
img {
display: block;
margin: px2rem(34) auto px2rem(5);
width: px2rem(32);
height: px2rem(32);
border-radius: 50%;
}
p {
width: 98%;
height: px2rem(25);
line-height: 0.32rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #848D9C;
font-size: px2rem(24);
margin-bottom: px2rem(9);
}
.id {
width: 100%;
text-align: center;
color: #A4ABB2;
font-size: px2rem(18);
}
}
.div11 {
line-height: 0rem;
}
}
}

View File

@@ -0,0 +1,269 @@
html,
body {
width: 100%;
height: 17.78667rem;
background: #F5F7F9;
}
.back {
width: 100%;
height: 2.4rem;
position: fixed;
left: 0;
top: 0rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
font-weight: bold;
z-index: 10;
background: #fff;
}
.back .backs {
width: 0.58667rem;
height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 58%;
z-index: 2;
}
.back .title {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.45333rem;
font-weight: bold;
}
.back .text {
position: absolute;
right: 0.62667rem;
height: 100%;
top: 0;
line-height: 3.46667rem;
color: #333333;
font-size: 0.4rem;
}
.timeBox {
width: 9.46667rem;
height: 2.54667rem;
background: #fff;
border-radius: 0.4rem;
margin: 2.53333rem auto 0.25333rem;
position: relative;
}
.timeBox .line {
width: 0.02667rem;
height: 1.90667rem;
background: #D7DCE6;
position: absolute;
left: 2.92rem;
top: 50%;
transform: translateY(-50%);
border-radius: 0.02667rem;
}
.timeBox .year {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.33333rem;
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
text-align: center;
text-indent: -0.8rem;
}
.timeBox .startTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 0.96rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .startTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .startTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .endTime {
width: 2.92rem;
position: absolute;
left: 0;
top: 1.62667rem;
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
}
.timeBox .endTime b {
margin-right: 0.1rem;
text-indent: 0.45rem;
display: inline-block;
}
.timeBox .endTime img {
width: 0.32rem;
height: 0.21333rem;
display: inline-block;
margin-top: 0.1rem;
}
.timeBox .right {
width: 5.5rem;
height: 2.54667rem;
position: absolute;
right: 0.55rem;
top: 0;
display: flex;
justify-content: space-between;
}
.timeBox .right div {
width: 50%;
text-align: center;
overflow: hidden;
position: relative;
}
.timeBox .right div p {
color: #A4ABB2;
font-size: 0.32rem;
font-weight: bold;
margin-top: 0.53333rem;
margin-bottom: 0.33333rem;
line-height: 0.34rem;
}
.timeBox .right div b {
color: #848D9C;
font-size: 0.37333rem;
font-weight: bold;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0.6rem;
}
.timeBox .right .goToExchangeGold {
position: absolute;
top: 2.06667rem;
right: 0rem;
color: #D25555;
font-size: 0.26667rem;
}
.list {
width: 9.46667rem;
height: 12.8rem;
background: #fff;
border-radius: 0.4rem;
margin: 0.25333rem auto 0.13333rem;
overflow-y: scroll;
position: relative;
padding-top: 1.45rem;
box-sizing: border-box;
}
.list::-webkit-scrollbar {
display: none;
}
.list .top {
height: 1.5rem;
width: 9.46667rem;
box-sizing: border-box;
padding: 0.53333rem 0.26667rem 0;
display: flex;
justify-content: space-between;
line-height: 0.4rem;
position: fixed;
left: 50%;
transform: translateX(-50%);
top: 5.3rem;
background: #fff;
border-radius: 0.4rem 0.4rem 0 0;
}
.list .top div {
width: 25%;
text-align: center;
color: #5D95FF;
font-size: 0.29333rem;
font-weight: 600;
}
.list .other {
width: 8.76rem;
height: 2.01333rem;
margin: 0 auto 0;
border-bottom: 0.02667rem solid #D7DCE6;
display: flex;
justify-content: space-between;
}
.list .other:last-child {
border: none;
}
.list .other div {
width: 25%;
text-align: center;
height: 100%;
line-height: 2.01333rem;
color: #848D9C;
font-size: 0.32rem;
font-weight: 500;
white-space: nowrap;
}
.list .other div img {
display: block;
margin: 0.45333rem auto 0.06667rem;
width: 0.42667rem;
height: 0.42667rem;
border-radius: 50%;
}
.list .other div p {
width: 98%;
height: 0.33333rem;
line-height: 0.32rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
color: #848D9C;
font-size: 0.32rem;
margin-bottom: 0.12rem;
}
.list .other div .id {
width: 100%;
text-align: center;
color: #A4ABB2;
font-size: 0.24rem;
}
.list .other .div11 {
line-height: 0rem;
}

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