Compare commits

...

15 Commits
bill ... rank

Author SHA1 Message Date
dragon
8ffc89e22c 月榜奖励展示条件更新 2025-01-20 11:35:09 +08:00
dragon
aac6a9b4d3 修复异常 2025-01-20 11:35:09 +08:00
dragon
b694db22ef 修复数据异常问题 2025-01-20 11:35:08 +08:00
dragon
b6f276a862 未上榜修改 2025-01-20 11:35:08 +08:00
dragon
7e76f15a03 修复首页榜单 2025-01-20 11:35:08 +08:00
dragon
a10b2f2918 完成上周数据联调 2025-01-20 11:35:08 +08:00
dragon
d6861af5a8 替换背景图 2025-01-17 17:23:38 +08:00
dragon
5f86a2d8bc 修复数据 2025-01-17 16:47:09 +08:00
dragon
9311cd9740 修复年度页面异常问题 2025-01-17 16:10:23 +08:00
dragon
5aafa4b884 修改翻译 2025-01-17 15:26:32 +08:00
dragon
b72afa268a 完成年度 2025-01-17 15:01:45 +08:00
dragon
c9d75cc5e6 修复样式 2025-01-14 17:23:23 +08:00
dragon
faaa55dc68 修改样式 2025-01-14 15:43:33 +08:00
dragon
bb4ef6ae11 修改滑动到底部判断条件 2025-01-14 14:45:25 +08:00
dragon
b82260f07d 修改滑动条件以及日志输出 2025-01-14 14:45:25 +08:00
52 changed files with 1579 additions and 128 deletions

View File

@@ -0,0 +1,378 @@
html,
body {
width: 100%;
height: 100%;
background: #fff;
overflow-x: hidden;
}
.back {
width: 100%;
height: 0.58667rem;
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 1.2rem;
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;
z-index: 2;
}
.back p {
width: 100%;
height: 0.58667rem;
line-height: 0.58667rem;
position: absolute;
left: 0.24rem;
top: 0rem;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
}
.h5 {
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}
.h5 .pagesBox {
width: 100%;
height: 100%;
transition: all .5s;
transform: translateY(0%);
}
.h5 .pagesBox .page1 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img1.png) no-repeat center;
background-size: 10rem 100%;
}
.h5 .pagesBox .page1 .title {
width: 10rem;
height: 1.73333rem;
background: url(../images/title.png) no-repeat;
background-size: 100% 100%;
margin: 2.64rem auto 0.36rem;
}
.h5 .pagesBox .page1 p {
color: #fff;
font-size: 0.4rem;
font-weight: 500;
width: 8.45333rem;
margin: 0 auto 0;
line-height: 0.64rem;
}
.h5 .pagesBox .page1 .but {
width: 6.85333rem;
height: 1.57333rem;
line-height: 1.57333rem;
text-align: center;
color: #000000;
font-size: 0.50667rem;
font-weight: 600;
background: url(../images/but.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 1.98667rem;
}
.h5 .pagesBox .page2 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img2.png) no-repeat center;
background-size: 10rem 100%;
}
.h5 .pagesBox .page2 .tx {
width: 2.34667rem;
height: 2.4rem;
border: 0.06667rem solid #FFF36D;
border-radius: 50%;
box-sizing: border-box;
margin: 1.89333rem auto 0.18667rem;
display: block;
}
.h5 .pagesBox .page2 .name {
width: 8.33333rem;
margin: 0 auto 0.29333rem;
text-align: center;
color: #FFF36D;
font-size: 0.48rem;
font-weight: 500;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.h5 .pagesBox .page2 .id {
width: 8.33333rem;
margin: 0 auto 0.56rem;
text-align: center;
color: #FFF36D;
font-size: 0.4rem;
font-weight: 400;
}
.h5 .pagesBox .page2 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.65333rem;
}
.h5 .pagesBox .page2 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page3 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img3.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.56rem;
}
.h5 .pagesBox .page3 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.64rem;
}
.h5 .pagesBox .page3 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page4 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img4.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.32rem;
}
.h5 .pagesBox .page4 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.66667rem;
}
.h5 .pagesBox .page4 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page5 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img5.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.32rem;
}
.h5 .pagesBox .page5 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.66667rem;
}
.h5 .pagesBox .page5 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page6 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img6.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 4.90667rem;
}
.h5 .pagesBox .page6 .txl {
position: absolute;
width: 2.4rem;
height: 2.4rem;
border-radius: 50%;
border: 0.05333rem solid #FFF36D;
top: 2.01333rem;
left: 0.68rem;
}
.h5 .pagesBox .page6 .love {
width: 1.33333rem;
height: 1.33333rem;
position: absolute;
top: 2.54667rem;
left: 2.44rem;
z-index: 2;
}
.h5 .pagesBox .page6 .txr {
position: absolute;
width: 2.4rem;
height: 2.4rem;
border-radius: 50%;
border: 0.05333rem solid #FFF36D;
top: 2.01333rem;
left: 3.14667rem;
}
.h5 .pagesBox .page6 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.74667rem;
}
.h5 .pagesBox .page6 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page7 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img7.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.32rem;
}
.h5 .pagesBox .page7 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.74667rem;
}
.h5 .pagesBox .page7 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page8 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img8.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.32rem;
}
.h5 .pagesBox .page8 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.70667rem;
}
.h5 .pagesBox .page8 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .page9 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img9.png) no-repeat center;
background-size: 10rem 100%;
padding-top: 2.32rem;
}
.h5 .pagesBox .page9 p {
width: 8.33333rem;
color: #fff;
font-size: 0.4rem;
font-weight: 500;
line-height: 0.64rem;
margin: 0 auto 0.65333rem;
}
.h5 .pagesBox .page9 p b {
color: #FFF36D;
font-size: 0.53333rem;
}
.h5 .pagesBox .pages {
box-sizing: border-box;
}
.h5 .pagesBox .pages .more {
width: 0.8rem;
height: 0.8rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 0.65333rem;
}
.china .h5 .pagesBox .page1 .title {
background: url(../images/title-zh.png) no-repeat;
background-size: 100% 100%;
}
.Turkiye .h5 .pagesBox .page1 .title {
background: url(../images/title-tr.png) no-repeat;
background-size: 100% 100%;
}
.arabic .h5 .pagesBox .page1 .title {
background: url(../images/title-ar.png) no-repeat;
background-size: 100% 100%;
}

View File

@@ -0,0 +1,395 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
height: 100%;
background: #fff;
overflow-x: hidden;
}
.back {
width: 100%;
height: px2rem(44);
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(90);
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);
z-index: 2;
}
p {
width: 100%;
height: px2rem(44);
line-height: px2rem(44);
position: absolute;
left: px2rem(18);
top: px2rem(0);
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
}
}
.h5 {
display: block;
width: 100%;
height: 100%;
overflow: hidden;
// background: rgba(0, 0, 0, .6);
.pagesBox {
width: 100%;
height: 100%;
// overflow: hidden;
transition: all .5s;
transform: translateY(-0%);
.page1 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img1.png) no-repeat center;
background-size: px2rem(750) 100%;
.title {
width: px2rem(750);
height: px2rem(130);
background: url(../images/title.png) no-repeat;
background-size: 100% 100%;
margin: px2rem(198) auto px2rem(27);
}
p {
color: #fff;
font-size: px2rem(30);
font-weight: 500;
width: px2rem(634);
margin: 0 auto 0;
line-height: px2rem(48);
}
.but {
width: px2rem(514);
height: px2rem(118);
line-height: px2rem(118);
text-align: center;
color: #000000;
font-size: px2rem(38);
font-weight: 600;
background: url(../images/but.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: px2rem(149);
}
}
.page2 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img2.png) no-repeat center;
background-size: px2rem(750) 100%;
.tx {
width: px2rem(176);
height: px2rem(180);
border: px2rem(5) solid #FFF36D;
border-radius: 50%;
box-sizing: border-box;
margin: px2rem(142) auto px2rem(14);
display: block;
}
.name {
width: px2rem(625);
margin: 0 auto px2rem(22);
text-align: center;
color: #FFF36D;
font-size: px2rem(36);
font-weight: 500;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.id {
width: px2rem(625);
margin: 0 auto px2rem(42);
text-align: center;
color: #FFF36D;
font-size: px2rem(30);
font-weight: 400;
}
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(49);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page3 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img3.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(192);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(48);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page4 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img4.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(174);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(50);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page5 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img5.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(174);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(50);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page6 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img6.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(368);
.txl {
position: absolute;
width: px2rem(180);
height: px2rem(180);
border-radius: 50%;
border: px2rem(4) solid #FFF36D;
top: px2rem(151);
left: px2rem(51);
}
.love {
width: px2rem(100);
height: px2rem(100);
position: absolute;
top: px2rem(191);
left: px2rem(183);
z-index: 2;
}
.txr {
position: absolute;
width: px2rem(180);
height: px2rem(180);
border-radius: 50%;
border: px2rem(4) solid #FFF36D;
top: px2rem(151);
left: px2rem(236);
}
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(56);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page7 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img7.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(174);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(56);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page8 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img8.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(174);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(53);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.page9 {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/img9.png) no-repeat center;
background-size: px2rem(750) 100%;
padding-top: px2rem(174);
p {
width: px2rem(625);
color: #fff;
font-size: px2rem(30);
font-weight: 500;
line-height: px2rem(48);
margin: 0 auto px2rem(49);
b {
color: #FFF36D;
font-size: px2rem(40);
}
}
}
.pages {
box-sizing: border-box;
.more {
width: px2rem(60);
height: px2rem(60);
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: px2rem(49);
}
}
}
}
.china {
.h5 .pagesBox .page1 .title{
background: url(../images/title-zh.png) no-repeat;
background-size: 100% 100%;
}
}
.Turkiye {
.h5 .pagesBox .page1 {
.title {
background: url(../images/title-tr.png) no-repeat;
background-size: 100% 100%;
}
}
}
.arabic {
.h5 .pagesBox .page1 {
.title {
background: url(../images/title-ar.png) no-repeat;
background-size: 100% 100%;
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 684 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 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,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title class="title"></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="">
</div>
<div class="h5">
<div class="pagesBox text1">
</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="./local/tr.js"></script>
<script src="./js/index.js"></script>
<script src="../../common/local/langHandler.js"></script>

View File

@@ -0,0 +1,146 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
var length;
// 封裝layer消息提醒框
let layerIndex
const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
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.layerIndex2), time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
$(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)
}
})
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
get();
}, 100)
})
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.title').html(langReplace(localLang.demoModule.title));
$('.text1').html(langReplace(localLang.demoModule.text1));
// 監聽滑動事件
let startY
length = $('.h5 .pages').length - 1;//
var index = 0;
var touchLength = 100;
$('body .h5').on('touchstart', function (e) {
startY = e.touches[0].pageY
})
$('body .h5').on('touchend', function (e) {
let endY = e.originalEvent.changedTouches[0].pageY
// 上滑
if (startY - endY >= 50) {
if (index > length - 1) {
return;
} else {
index = index + 1;
$('.pagesBox').css("transform", `translateY(-${index * touchLength}%)`);
// animatedImplementFun(index);
}
}
//下滑
else if (endY - startY >= 50) {
if (index > 0) {
index = index - 1;
$('.pagesBox').css("transform", `translateY(-${index * touchLength}%)`);
// animatedImplementFun(index);
}
}
})
$('.h5 .pagesBox').on('click', '.page1 .but', function () {
index = index + 1;
$('.pagesBox').css("transform", `translateY(-${index * touchLength}%)`);
})
}
// 接口
function get() {
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/user/yearReport/get',
success(res) {
if (res.code === 200) {
$('.h5 .pagesBox .page2 .tx').attr('src', res.data.me.avatar);
$('.h5 .pagesBox .page2 .name').text(res.data.me.nick);
$('.h5 .pagesBox .page2 .id').text('ID:' + res.data.me.erbanNo);
$('.h5 .pagesBox .page2 p b').text(res.data.createTime);
$('.h5 .pagesBox .page3 p b').text(res.data.createDays);
$('.h5 .pagesBox .page4 p .b1').text(res.data.experienceValue);
$('.h5 .pagesBox .page4 p .b2').text(res.data.experienceTitle);
$('.h5 .pagesBox .page4 p .b3').text(res.data.createDays);
$('.h5 .pagesBox .page5 p .b1').text(res.data.charmValue);
$('.h5 .pagesBox .page5 p .b2').text(res.data.charmTitle);
$('.h5 .pagesBox .page7 p .b1').text(res.data.giftWallCount);
$('.h5 .pagesBox .page7 p .b2').text(res.data.giftName);
// cp
if (res.data.cp) {
$(`.h5 .pagesBox .page6 p .b1`).text(res.data.cpCreateTime)
$(`.h5 .pagesBox .page6 p .b2`).text(res.data.cp.nick)
$(`.h5 .pagesBox .page6 p .b3`).text(res.data.cpCreateDays)
$('.h5 .pagesBox .page6 .txl').attr('src', res.data.me.avatar);
$('.h5 .pagesBox .page6 .txr').attr('src', res.data.cp.avatar);
} else {
$('.h5 .pagesBox .page6').hide();
length = length - 1;
}
// 转赠金币
if (res.data.giveDiamond) {
$('.h5 .pagesBox .page8 p .b1').text(res.data.giveDiamond);
} else {
$('.h5 .pagesBox .page8').hide();
length = length - 1;
}
console.log(length);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.layerIndex3))
}
})
}

View File

@@ -0,0 +1,81 @@
// 阿拉伯
langAr = {
// 模块
demoModule: {
layerIndex1: 'جار التحميل...',
layerIndex2: 'تم الانتهاء من العملية',
layerIndex3: 'خطأ في الشبكة، يرجى الخروج وإعادة الدخول',
title: 'التقرير السنوي',
text1: `
<!-- الصفحة 1 -->
<div class="pages page1" id="img1">
<div class="title"></div>
<p class="p1">
في عالم الإنترنت الواسع، أنت مثل نجم ساطع. هنا، لا نرى فقط ضوءك، بل نشعر أيضًا بالفرح الذي تجلبه - أنت جزء لا غنى عنه من Molistar.
</p>
<div class="but">انقر لتوليد</div>
</div>
<!-- الصفحة 2 -->
<div class="pages page2" id="img2">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">الاسم</div>
<div class="id">ID: 0</div>
<p><b>2024-11-23</b> هو أول يوم لك في Molistar.</p>
<p>منذ ذلك اليوم، جربنا الكثير معًا: تكوين صداقات جديدة، الدردشة عن الحياة، وتحدي متعة الألعاب معًا.</p>
<p>كل لحظة نسجت رابطًا لا ينفصم بيننا.</p>
</div>
<!-- الصفحة 3 -->
<div class="pages page3" id="img3">
<img src="./images/more.png" alt="" class="more">
<p>لقد قضيت <b>0</b> أيام مليئة بالضحك في Molistar.</p>
<p>مشاركتك النشطة تجعل الغرفة مليئة بالحيوية، كل محادثة حيوية ومثيرة، وكل لعبة مليئة بالضحك.</p>
<p>بفضلك، أصبح هذا المكان أكثر جمالًا.</p>
</div>
<!-- الصفحة 4 -->
<div class="pages page4" id="img4">
<img src="./images/more.png" alt="" class="more">
<p>في رحلة هذا العام، أرسلت <b class="b1">0</b> عملات، وهو ما يجعلك مستحقًا بكل جدارة <b class="b2">محرّك الثروة.</b></p>
<p>كل نقطة تجربة هي شهادة على عملك الشاق، وكل ترقية تسجل تقدمك.</p>
<p>من دخولك إلى المنصة لأول مرة اليوم، اجتهادك.</p>
</div>
<!-- الصفحة 5 -->
<div class="pages page5" id="img5">
<img src="./images/more.png" alt="" class="more">
<p>في هذا العام، جمعت <b class="b1">0</b> نقاط تجربة سحرية.</p>
<p>كل نقطة هي أفضل دليل على عملك الشاق وموهبتك.</p>
<p>مبروك لك على كونك أفضل <b class="b2">بالا بالا</b> على منصتنا!!!</p>
</div>
<!-- الصفحة 6 -->
<div class="pages page6" id="img6">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="txl">
<img src="./images/love.png" alt="" class="love">
<img src="./images/logo.png" alt="" class="txr">
<p>لقد استلمت هدية CP المحددة في <b class="b1">2024-11-23 00:00:00</b>.</p>
<p>من تلك اللحظة، أصبحت أنت و <b class="b2">مومو</b> ثنائيًا رائعًا.</p>
<p>حتى الآن، كانت علاقتكما دافئة لمدة <b class="b3">0</b> أيام.</p>
<p>نتمنى لكما طريق حب مشرق دائمًا واستمرار كتابة فصول أكثر جمالًا!</p>
</div>
<!-- الصفحة 7 -->
<div class="pages page7" id="img7">
<img src="./images/more.png" alt="" class="more">
<p>هذا العام، لم تكسب فقط ذكريات جميلة لا تعد ولا تحصى في Molistar، بل أظهرت أيضًا حماسك ودعمك بإضاءة <b class="b1">0</b> هدايا.</p>
<p>هديةك المفضلة هي <b class="b2">مومو</b></p>
<p>هذه الهدية الخاصة هي ليست فقط انعكاسًا فريدًا لذوقك، بل أيضًا جسرًا مهمًا للتواصل مع المستخدمين الآخرين.</p>
</div>
<!-- الصفحة 8 -->
<div class="pages page8" id="img8">
<img src="./images/more.png" alt="" class="more">
<p>في 2024، كنت وكيل الشحن المحترم لدينا، وقد حولت إجمالي <b class="b1">0</b> عملات.</p>
<p>شكرًا لجهودك في العام الماضي.</p>
</div>
<!-- الصفحة 9 -->
<div class="pages page9" id="img9">
<p>الآن، دعنا نتقدم إلى 2025 يدًا بيد، نواصل كتابة قصصنا الخاصة، ونخلق المزيد من الذكريات التي لا تُنسى.</p>
<p>نتمنى أن يكون كل يوم في المستقبل أكثر إشراقًا بفضل وجود بعضنا البعض!</p>
</div>
`,
}
}

View File

@@ -0,0 +1,87 @@
// 英文
langEn = {
// 模块
demoModule: {
layerIndex1: 'Loading...',
layerIndex2: 'Operation completed',
layerIndex3: 'Network error, please exit and re-enter',
title:'Annual Report',
text1: `
<!-- 頁面1 -->
<div class="pages page1" id="img1">
<div class="title"></div>
<p class="p1">
In the vast online world, you are like a shining star.Here, we not only see your light, but also
feel the joy you bring - you are an indispensable part of Molistar.
</p>
<div class="but">Click Generate</div>
</div>
<!-- 頁面2 -->
<div class="pages page2" id="img2">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">名称</div>
<div class="id">ID:0</div>
<p><b>2024-11-23</b> is your first day at Molistar.</p>
<p>Since that day, we have experienced a lot together: making new friends, chatting about life, and
challenging the fun of games together.</p>
<p>Every moment has woven an inseparable bond between us.</p>
</div>
<!-- 頁面3 -->
<div class="pages page3" id="img3">
<img src="./images/more.png" alt="" class="more">
<p>You have spent <b>0</b> days full of laughter at Molistar.</p>
<p>Your active participation makes the room full of vitality, every conversation is so lively and
interesting, and every game is full of laughter.</p>
<p>Because of you, this place has become more beautiful.</p>
</div>
<!-- 頁面4 -->
<div class="pages page4" id="img4">
<img src="./images/more.png" alt="" class="more">
<p>In this year's journey, you have sent <b class="b1">0</b> coins, which is well deserved <b class="b2">Wealth Germinator.</b>.
</p>
<p>Every experience point is a testimony to your hard work, and every upgrade records your progress.</p>
<p>From entering the platform for the first time today, your persistence </p>
</div>
<!-- 頁面5 -->
<div class="pages page5" id="img5">
<img src="./images/more.png" alt="" class="more">
<p>In this year, you have accumulated <b class="b1">0</b> charm experience points. </p>
<p>Every point is the best proof of your hard work and talent. </p>
<p>Congratulations on becoming the best <b class="b2">巴拉巴拉</b> on our platform!!!</p>
</div>
<!-- 頁面6 -->
<div class="pages page6" id="img6">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="txl">
<img src="./images/love.png" alt="" class="love">
<img src="./images/logo.png" alt="" class="txr">
<p>You received the designated CP gift on <b class="b1">2024-11-23 00:00:00</b>.</p>
<p>From that moment on, you and <b class="b2">momo</b> became an enviable CP.</p>
<p>So far, your relationship has been warm for <b class="b3">0</b> days.</p>
<p>May your love path always be full of sunshine and continue to write more beautiful chapters!</p>
</div>
<!-- 頁面7 -->
<div class="pages page7" id="img7">
<img src="./images/more.png" alt="" class="more">
<p>This year, you not only gained countless beautiful memories in Molistar, but also showed your
enthusiasm and support by lighting up <b class="b1">0</b> gifts.</p>
<p>Your favorite gift is <b class="b2">momo</b></p>
<p>This special gift is not only a unique reflection of your taste, but also an important bridge for you
to communicate with other users.</p>
</div>
<!-- 頁面8 -->
<div class="pages page8" id="img8">
<img src="./images/more.png" alt="" class="more">
<p>In 2024, you were our valued recharge agent, and you have transferred a total of <b class="b1">0</b> coins.</p>
<p>Thank you for your efforts in the past year.</p>
</div>
<!-- 頁面9 -->
<div class="pages page9" id="img9">
<p>Now, let us move forward to 2025 hand in hand, continue to write our own stories, and create more
unforgettable memories.</p>
<p>May every day in the future be brighter because of each other's existence!</p>
</div>
`,
}
}

View File

@@ -0,0 +1,83 @@
// 土耳其
langTr = {
// 模塊
demoModule: {
layerIndex1: "Yükleniyor...",
layerIndex2: "İşlem tamamlandı",
layerIndex3: "Ağ hatası, lütfen çıkın ve tekrar girin",
title: "Yıllık Rapor",
text1: `
<!-- Sayfa 1 -->
<div class="pages page1" id="img1">
<div class="title"></div>
<p class="p1">
Geniş çevrimiçi dünyada, sen parlayan bir yıldız gibisin. Burada, sadece ışığını görmekle kalmıyor,
aynı zamanda getirdiğin mutluluğu da hissediyoruz - sen Molistar'ın vazgeçilmez bir parçasısın.
</p>
<div class="but">Oluşturmayı Tıkla</div>
</div>
<!-- Sayfa 2 -->
<div class="pages page2" id="img2">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">Ad</div>
<div class="id">ID:0</div>
<p><b>2024-11-23</b> senin Molistar'daki ilk günündü.</p>
<p>O günden itibaren birlikte çok şey deneyimledik: yeni arkadaşlar edinmek, hayat hakkında sohbetler yapmak ve oyunların eğlencesine birlikte meydan okumak.</p>
<p>Her an, aramızda ayrılmaz bir bağ ördü.</p>
</div>
<!-- Sayfa 3 -->
<div class="pages page3" id="img3">
<img src="./images/more.png" alt="" class="more">
<p>Molistar'da <b>0</b> gün kahkahalarla geçirdin.</p>
<p>Aktif katılımın, odayı canlı tutuyor, her sohbet çok hareketli ve eğlenceli, her oyun kahkahalarla dolu.</p>
<p>Sadece senin yüzünden, bu yer daha güzel oldu.</p>
</div>
<!-- Sayfa 4 -->
<div class="pages page4" id="img4">
<img src="./images/more.png" alt="" class="more">
<p>Bu yılki yolculuğunda, <b class="b1">0</b> coin gönderdin, bu da seni <b class="b2">Zenginlik Tohumcusu</b> yaptı.</p>
<p>Her deneyim puanı, sıkı çalışmanın bir kanıtıdır ve her yükselme, ilerlemeni kaydeder.</p>
<p>Bugün ilk kez platforma katıldığından beri, azmin sayesinde...</p>
</div>
<!-- Sayfa 5 -->
<div class="pages page5" id="img5">
<img src="./images/more.png" alt="" class="more">
<p>Bu yıl, toplamda <b class="b1">0</b> çekicilik deneyim puanı biriktirdin.</p>
<p>Her puan, sıkı çalışmanın ve yeteneğinin en iyi kanıtıdır.</p>
<p>Platformumuzda en iyi <b class="b2">巴拉巴拉</b> olduğun için tebrikler!!!</p>
</div>
<!-- Sayfa 6 -->
<div class="pages page6" id="img6">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="txl">
<img src="./images/love.png" alt="" class="love">
<img src="./images/logo.png" alt="" class="txr">
<p>2024-11-23 00:00:00 tarihinde belirlenen CP hediyesini aldın.</p>
<p>O andan itibaren, <b class="b2">momo</b> ile kıskanılacak bir CP oldunuz.</p>
<p>Şu ana kadar ilişkiniz <b class="b3">0</b> gün boyunca sıcak bir şekilde devam etti.</p>
<p>Sevgi yolculuğunuzun her zaman güneşle dolu olmasını ve daha güzel bölümler yazmanızı dilerim!</p>
</div>
<!-- Sayfa 7 -->
<div class="pages page7" id="img7">
<img src="./images/more.png" alt="" class="more">
<p>Bu yıl, sadece Molistar'da sayısız güzel anı biriktirmekle kalmadın, aynı zamanda <b class="b1">0</b> hediyeyi ışıklandırarak heyecanını ve desteğini gösterdin.</p>
<p>En sevdiğin hediye <b class="b2">momo</b></p>
<p>Bu özel hediye, sadece zevkinin eşsiz bir yansıması olmakla kalmaz, aynı zamanda diğer kullanıcılarla iletişim kurman için önemli bir köprüdür.</p>
</div>
<!-- Sayfa 8 -->
<div class="pages page8" id="img8">
<img src="./images/more.png" alt="" class="more">
<p>2024 yılında, değerli bir yükleme ajanı oldun ve toplamda <b class="b1">0</b> coin transfer ettin.</p>
<p>Geçen yılki çabaların için teşekkür ederiz.</p>
</div>
<!-- Sayfa 9 -->
<div class="pages page9" id="img9">
<p>Şimdi, 2025'e el birliğiyle ilerleyelim, kendi hikayelerimizi yazmaya devam edelim ve daha unutulmaz anılar yaratalım.</p>
<p>Gelecekteki her gün, birbirimizin varlığı sayesinde daha parlak olsun!</p>
</div>
`
}
}

View File

@@ -0,0 +1,81 @@
// 中文
langZh = {
// 模塊
demoModule: {
layerIndex1: '載入中...',
layerIndex2: '操作完成',
layerIndex3: '網絡錯誤,請退出並重新進入',
title: '年度報告',
text1: `
<!-- 頁面1 -->
<div class="pages page1" id="img1">
<div class="title"></div>
<p class="p1">
在廣闊的網絡世界中你就像一顆閃亮的星星。在這裡我們不僅看到了你的光芒也感受到了你帶來的快樂——你是Molistar中不可或缺的一部分。
</p>
<div class="but">點擊生成</div>
</div>
<!-- 頁面2 -->
<div class="pages page2" id="img2">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="tx">
<div class="name">名稱</div>
<div class="id">ID: 0</div>
<p><b>2024-11-23</b> 是你在Molistar的第一天。</p>
<p>從那天起,我們一起經歷了很多:結交新朋友,談論生活,並一起挑戰遊戲的樂趣。</p>
<p>每一刻都編織了一條無法分割的紐帶。</p>
</div>
<!-- 頁面3 -->
<div class="pages page3" id="img3">
<img src="./images/more.png" alt="" class="more">
<p>你在Molistar度過了<b>0</b>天充滿笑聲的時光。</p>
<p>你的積極參與讓房間充滿了活力,每次對話都那麼生動有趣,每場遊戲都充滿了歡笑。</p>
<p>因為有你,這個地方變得更加美麗。</p>
</div>
<!-- 頁面4 -->
<div class="pages page4" id="img4">
<img src="./images/more.png" alt="" class="more">
<p>在這一年的旅程中,你送出了<b class="b1">0</b>個幣,當之無愧是<b class="b2">財富播種者。</b></p>
<p>每一個經驗值都是你努力的見證,每一次升級都記錄了你的進步。</p>
<p>從今天第一次進入平台起,你的堅持。</p>
</div>
<!-- 頁面5 -->
<div class="pages page5" id="img5">
<img src="./images/more.png" alt="" class="more">
<p>在這一年裡,你累積了<b class="b1">0</b>點魅力經驗值。</p>
<p>每一點都是你努力和才華的最佳證明。</p>
<p>恭喜你成為我們平台上最棒的<b class="b2">巴拉巴拉</b></p>
</div>
<!-- 頁面6 -->
<div class="pages page6" id="img6">
<img src="./images/more.png" alt="" class="more">
<img src="./images/logo.png" alt="" class="txl">
<img src="./images/love.png" alt="" class="love">
<img src="./images/logo.png" alt="" class="txr">
<p>你在<b class="b1">2024-11-23 00:00:00</b>收到了指定的CP禮物。</p>
<p>從那一刻起,你和<b class="b2">momo</b>成為了令人羨慕的CP。</p>
<p>到目前為止,你們的關係已經保持了<b class="b3">0</b>天。</p>
<p>願你們的愛情之路永遠充滿陽光,繼續書寫更多美好的篇章!</p>
</div>
<!-- 頁面7 -->
<div class="pages page7" id="img7">
<img src="./images/more.png" alt="" class="more">
<p>今年你在Molistar中不僅獲得了無數美好的回憶還通過點亮<b class="b1">0</b>個禮物展示了你的熱情和支持。</p>
<p>你最喜歡的禮物是<b class="b2">momo</b></p>
<p>這份特殊的禮物不僅是你品味的獨特體現,還是你與其他用戶溝通的重要橋樑。</p>
</div>
<!-- 頁面8 -->
<div class="pages page8" id="img8">
<img src="./images/more.png" alt="" class="more">
<p>在2024年你是我們尊敬的充值代理並且你總共轉帳了<b class="b1">0</b>個幣。</p>
<p>感謝你在過去一年的努力。</p>
</div>
<!-- 頁面9 -->
<div class="pages page9" id="img9">
<p>現在讓我們手牽手向2025年邁進繼續書寫我們的故事創造更多難忘的回憶。</p>
<p>願未來的每一天都因為彼此的存在而更加光明!</p>
</div>
`,
}
}

View File

@@ -1 +1 @@
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>molistar</title><link href=./static/css/app.d1c2b68dc5139c43e9ebe1829075d68c.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.f8cc02553244364f2c4b.js></script><script type=text/javascript src=./static/js/vendor.ef63a6e67767f10f7bb6.js></script><script type=text/javascript src=./static/js/app.d54d862a2d7e9c963263.js></script></body></html>
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>molistar</title><link href=./static/css/app.10c895b5758e9983fe14f37279a40de6.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.ec0a7344145e64a70dff.js></script><script type=text/javascript src=./static/js/vendor.ef63a6e67767f10f7bb6.js></script><script type=text/javascript src=./static/js/app.d54d862a2d7e9c963263.js></script></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -1,2 +1,2 @@
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,a,c){for(var f,i,u,d=0,b=[];d<r.length;d++)i=r[d],t[i]&&b.push(t[i][0]),t[i]=0;for(f in a)Object.prototype.hasOwnProperty.call(a,f)&&(e[f]=a[f]);for(n&&n(r,a,c);b.length;)b.shift()();if(c)for(d=0;d<c.length;d++)u=o(o.s=c[d]);return u};var r={},t={15:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var a=document.getElementsByTagName("head")[0],c=document.createElement("script");c.type="text/javascript",c.charset="utf-8",c.async=!0,c.timeout=12e4,o.nc&&c.setAttribute("nonce",o.nc),c.src=o.p+"static/js/"+e+"."+{0:"870a31b2b5a5125962ab",1:"f7fd3566ec61ced38fe8",2:"48bde5b1f5f3eaa3c75f",3:"00bcf5022e7d98b672a2",4:"c9d5b75efaa28b779e79",5:"93d874959b80a4ee1da1",6:"de3228ef1e13c7d6649c",7:"a1746a1c89c587b75f6f",8:"67319477a4c5ac59b510",9:"cf187b6df4a386b203eb",10:"f6e85397f46b6b94d58d",11:"a5e798e367bdaa3003e9",12:"b8ac2b08a54dd44dc799"}[e]+".js";var f=setTimeout(i,12e4);function i(){c.onerror=c.onload=null,clearTimeout(f);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return c.onerror=c.onload=i,a.appendChild(c),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.f8cc02553244364f2c4b.js.map
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,a,c){for(var f,i,u,d=0,b=[];d<r.length;d++)i=r[d],t[i]&&b.push(t[i][0]),t[i]=0;for(f in a)Object.prototype.hasOwnProperty.call(a,f)&&(e[f]=a[f]);for(n&&n(r,a,c);b.length;)b.shift()();if(c)for(d=0;d<c.length;d++)u=o(o.s=c[d]);return u};var r={},t={15:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var a=document.getElementsByTagName("head")[0],c=document.createElement("script");c.type="text/javascript",c.charset="utf-8",c.async=!0,c.timeout=12e4,o.nc&&c.setAttribute("nonce",o.nc),c.src=o.p+"static/js/"+e+"."+{0:"870a31b2b5a5125962ab",1:"cfae085c8ebaaa759b24",2:"4eed7dde0e78f0a7578d",3:"00bcf5022e7d98b672a2",4:"c9d5b75efaa28b779e79",5:"93d874959b80a4ee1da1",6:"de3228ef1e13c7d6649c",7:"a1746a1c89c587b75f6f",8:"67319477a4c5ac59b510",9:"cf187b6df4a386b203eb",10:"f6e85397f46b6b94d58d",11:"a5e798e367bdaa3003e9",12:"b8ac2b08a54dd44dc799"}[e]+".js";var f=setTimeout(i,12e4);function i(){c.onerror=c.onload=null,clearTimeout(f);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return c.onerror=c.onload=i,a.appendChild(c),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.ec0a7344145e64a70dff.js.map

View File

@@ -11,7 +11,7 @@ body {
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 1.33333rem;
top: 1.2rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
@@ -41,6 +41,35 @@ body {
font-weight: 600;
}
.newText1 {
width: 100%;
position: fixed;
height: 2rem;
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.newText11 {
width: 100%;
position: fixed;
height: 2rem;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
overflow: hidden;
}
.header {
width: 10rem;
height: 17rem;
@@ -110,7 +139,7 @@ body {
display: flex;
justify-content: space-between;
overflow: hidden;
z-index: 2;
z-index: 4;
}
.header .sTab div {
@@ -142,6 +171,7 @@ body {
color: #000;
font-size: 0.34667rem;
font-weight: 500;
display: none;
}
.header .monthlyRewards p {

View File

@@ -15,7 +15,7 @@ body {
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(100);
top: px2rem(90);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
@@ -45,6 +45,38 @@ body {
}
}
.newText1 {
width: 100%;
position: fixed;
height: 2rem;
// background: rgba(0, 0, 0, .8);
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.newText11 {
width: 100%;
position: fixed;
height: 2rem;
// background:rgba(0, 0, 0, .65);
// background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
overflow: hidden;
}
.header {
width: px2rem(750);
// height: px2rem(1229);
@@ -115,7 +147,7 @@ body {
display: flex;
justify-content: space-between;
overflow: hidden;
z-index: 2;
z-index: 4;
div {
min-width: px2rem(170);
@@ -147,7 +179,7 @@ body {
color: #000;
font-size: px2rem(26);
font-weight: 500;
// display: none;
display: none;
p {
position: absolute;

View File

@@ -6,12 +6,12 @@ body {
}
.back {
width: 100%;
width: 0.66667rem;
height: 0.58667rem;
line-height: 0.58667rem;
position: fixed;
left: 0;
top: 1.33333rem;
top: 1.2rem;
text-align: center;
color: #FFFFFF;
font-size: 0.50667rem;
@@ -41,6 +41,35 @@ body {
font-weight: 600;
}
.newText2 {
width: 100%;
position: fixed;
height: 2rem;
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.newText22 {
width: 100%;
position: fixed;
height: 2rem;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: 0.42667rem;
font-weight: 600;
line-height: 3rem;
overflow: hidden;
}
.header {
width: 10rem;
height: 17rem;
@@ -50,8 +79,8 @@ body {
.header .tabBox {
width: 10rem;
height: 1.12rem;
line-height: 1.12rem;
height: 0.8rem;
line-height: 0.8rem;
display: flex;
justify-content: space-evenly;
position: absolute;
@@ -65,14 +94,14 @@ body {
.header .tabBox div {
position: relative;
width: 2.32rem;
height: 1.12rem;
width: 2.13333rem;
height: 0.8rem;
border-radius: 0.8rem;
color: #FFF8C2;
font-size: 0.37333rem;
font-weight: 600;
background: url(../images/tab.png) no-repeat;
background-size: 100% 100%;
text-align: center;
background: rgba(0, 0, 0, 0.5);
}
.header .tabBox div span {
@@ -90,8 +119,7 @@ body {
.header .tabBox .act {
color: #000;
font-weight: bold;
background: url(../images/tabAct.png) no-repeat;
background-size: 100% 100%;
background: linear-gradient(0deg, #FFDC7D, #FFEEBC);
}
.header .tabBox .act span {
@@ -342,17 +370,17 @@ body {
}
.header1 {
background: url(../images/header1.png) no-repeat;
background: url(../images/header11.png) no-repeat;
background-size: 100% 14.26667rem;
}
.header2 {
background: url(../images/header2.png) no-repeat;
background: url(../images/header22.png) no-repeat;
background-size: 100% 14.26667rem;
}
.header3 {
background: url(../images/header3.png) no-repeat;
background: url(../images/header33.png) no-repeat;
background-size: 100% 14.26667rem;
}

View File

@@ -10,12 +10,12 @@ body {
}
.back {
width: 100%;
width: px2rem(50);
height: px2rem(44);
line-height: px2rem(44);
position: fixed;
left: 0;
top: px2rem(100);
top: px2rem(90);
text-align: center;
color: #FFFFFF;
font-size: px2rem(38);
@@ -45,6 +45,37 @@ body {
}
}
.newText2 {
width: 100%;
position: fixed;
height: 2rem;
// background:rgba(0, 0, 0, .65);
background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
transition: all 0.5s;
height: 0;
overflow: hidden;
}
.newText22 {
width: 100%;
position: fixed;
height: 2rem;
// background:rgba(0, 0, 0, .65);
// background: #000;
z-index: 9;
text-align: center;
color: #FFF8C2;
font-size: px2rem(32);
font-weight: 600;
line-height: 3rem;
overflow: hidden;
}
.header {
width: px2rem(750);
// height: px2rem(1229);
@@ -54,8 +85,8 @@ body {
.tabBox {
width: px2rem(750);
height: px2rem(84);
line-height: px2rem(84);
height: px2rem(60);
line-height: px2rem(60);
display: flex;
justify-content: space-evenly;
position: absolute;
@@ -68,14 +99,14 @@ body {
div {
position: relative;
width: px2rem(174);
height: px2rem(84);
width: px2rem(160);
height: px2rem(60);
border-radius: px2rem(60);
color: #FFF8C2;
font-size: px2rem(28);
font-weight: 600;
background: url(../images/tab.png) no-repeat;
background-size: 100% 100%;
text-align: center;
background: rgba(0, 0, 0, .5);
span {
width: px2rem(37);
@@ -93,8 +124,7 @@ body {
.act {
color: #000;
font-weight: bold;
background: url(../images/tabAct.png) no-repeat;
background-size: 100% 100%;
background: linear-gradient(0deg, #FFDC7D, #FFEEBC);
span {
display: block;
@@ -352,17 +382,17 @@ body {
}
.header1 {
background: url(../images/header1.png) no-repeat;
background: url(../images/header11.png) no-repeat;
background-size: 100% px2rem(1070);
}
.header2 {
background: url(../images/header2.png) no-repeat;
background: url(../images/header22.png) no-repeat;
background-size: 100% px2rem(1070);
}
.header3 {
background: url(../images/header3.png) no-repeat;
background: url(../images/header33.png) no-repeat;
background-size: 100% px2rem(1070);
.top {

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 425 KiB

After

Width:  |  Height:  |  Size: 425 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 310 KiB

After

Width:  |  Height:  |  Size: 308 KiB

View File

@@ -15,6 +15,8 @@
<img src="./images/travel/back.png" alt="">
<!-- <p class="newText1">Honor Ranking</p> -->
</div>
<p class="newText1"></p>
<p class="newText11"></p>
<!-- 头部 -->
<div class="header header1">
<div class="tabBox">
@@ -26,7 +28,7 @@
<div class="sTab">
<div class="act text5" type="1"></div>
<div class="text6" type="2"></div>
<!-- <div class="newText2" type="5"></div> -->
<div class="newText2" type="5"></div>
</div>
<!-- 奖励 -->
<div class="monthlyRewards">

View File

@@ -27,8 +27,9 @@ const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time
})
}
var listType = 2;//2爱意榜 1魅力榜 3房间榜
var timeType = 1;//1日 2周
var timeType = 1;//1日 2周 5月
var type = 1;
var partitionId;
// 初始化函數
$(function () {
getInfoFromClient();
@@ -55,6 +56,7 @@ $(function () {
translateFun();
showLoading()
geth5()
userInfo()
}, 100)
})
function translateFun() {
@@ -68,12 +70,36 @@ function translateFun() {
$('.text6').html(langReplace(localLang.demoModule.text6));
$('.newText1').html(langReplace(localLang.demoModule.newText1));
$('.newText2').html(langReplace(localLang.demoModule.newText2));
$('.newText11').html(langReplace(localLang.demoModule.newText11));
$('.newText3').html(langReplace(localLang.demoModule.newText3));
$('.newText4').html(langReplace(localLang.demoModule.newText4));
$('.newText5').html(langReplace(localLang.demoModule.newText5));
}
// 榜单接口
function userInfo() {
networkRequest({
type: 'get',
url: urlPrefix + '/web-user',
success(res) {
if (res.code === 200) {
partitionId = res.data.partitionId;
if (partitionId == 4) {
$('.header .sTab .newText2').hide();
$(`.header .monthlyRewards`).hide();
}
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err) {
hideLoading(layerIndex)
toastMsg(langReplace(localLang.demoModule.layerIndex3))
}
})
}
// 榜单接口
function geth5() {
$('ul li').remove();
$('.header .sTab').show();
@@ -89,6 +115,7 @@ function geth5() {
data: {
type: listType,
datetype: timeType,
periodType: 1,
uid: pubInfo.uid
},
success(res) {
@@ -101,7 +128,7 @@ function geth5() {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
nick: langReplace(localLang.demoModule.newText7),
totalNum: "",
diffNum: "",
uid: "0",
})
listTo3.push(...arr)
@@ -111,7 +138,7 @@ function geth5() {
$(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
$(`.header .top .top${i + 1} .nick`).text(res.nick);
// if (i > 0) {
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.totalNum, 1));
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.diffNum, 1));
// }
});
// 非前三
@@ -125,7 +152,7 @@ function geth5() {
<div class="score">
<b>${langReplace(localLang.demoModule.newText3)}</b>
<img src="./images/${type}.png" alt="">
<span>${unitProcessingAr(res.totalNum, 1)}</span>
<span>${unitProcessingAr(res.diffNum, 1)}</span>
</div> -->
</li>
`
@@ -134,9 +161,9 @@ function geth5() {
// 处理自己
$('.my .box .tx').attr('src', my.avatar);
$('.my .box .nick').text(my.nick);
$('.my .box .seqNo').text(my.totalNum <= 0 ? '-' : my.seqNo);
$('.my .box .score span').text(my.totalNum <= 0 ? '-' : unitProcessingAr(my.totalNum, 1));
if (my.totalNum <= 0) {
$('.my .box .seqNo').text(my.seqNo <= 0 ? '-' : my.seqNo);
$('.my .box .score span').text(my.diffNum <= 0 ? '-' : unitProcessingAr(my.diffNum, 1));
if (my.diffNum <= 0) {
$('.my .box .score b').hide();
}
} else {
@@ -162,6 +189,9 @@ function listRank(type) {
networkRequest({
type: 'get',
url: urlPrefix + '/clan/listRank',
data: {
periodType: 1,
},
success(res) {
if (res.code === 200) {
var my = res.data.me;
@@ -173,7 +203,7 @@ function listRank(type) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
name: langReplace(localLang.demoModule.newText7),
totalNum: "",
diffNum: "",
uid: "0",
})
listTo3.push(...arr)
@@ -183,7 +213,7 @@ function listRank(type) {
$(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
$(`.header .top .top${i + 1} .nick`).text(res.name);
// if (i > 0) {
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.income, 1));
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.diffNum, 1));
// }
});
// 非前三
@@ -197,7 +227,7 @@ function listRank(type) {
<div class="score">
<b>${langReplace(localLang.demoModule.newText3)}</b>
<img src="./images/${type}.png" alt="">
<span>${unitProcessingAr(res.income, 1)}</span>
<span>${unitProcessingAr(res.diffNum, 1)}</span>
</div>-->
</li>
`
@@ -226,7 +256,7 @@ $('.header .tabBox div').click(function () {
$('.top').removeClass('tops1').removeClass('tops2').removeClass('tops3').removeClass('tops4');
$(`.top`).addClass(`tops${i}`);
$('ul li .tx').removeClass('actTx');
// $('.header .monthlyRewards').hide();
$('.header .monthlyRewards').hide();
$(`.header .top .top1 .ts`).attr('src', './images/no1.png')
$(`.header .top .top2 .ts`).attr('src', './images/no2.png')
$(`.header .top .top3 .ts`).attr('src', './images/no3.png')
@@ -254,6 +284,12 @@ $('.header .tabBox div').click(function () {
$(`.header .top .top3 .ts`).attr('src', './images/no33.png')
listRank(4);
$('ul li .tx').addClass('actTx');
$('.header .monthlyRewards').show();
}
if (partitionId == 4) {
$('.header .sTab .newText2').hide();
$(`.header .monthlyRewards`).hide();
}
})
// 日榜周榜切换tab
@@ -261,11 +297,15 @@ $('.header .sTab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('act').siblings().removeClass('act');
timeType = $(this).attr('type');
// if (timeType == 5) {
// $('.header .monthlyRewards').show();
// } else {
// $('.header .monthlyRewards').hide();
// }
if (timeType == 5) {
$('.header .monthlyRewards').show();
} else {
$('.header .monthlyRewards').hide();
}
if (listType == 3) {
$('.header .monthlyRewards').hide();
}
geth5();
})
// 前三跳转个人页
@@ -294,4 +334,16 @@ $('ul').on('click', 'li .tx', function () {
// 跳转奖励页面
$('.header .monthlyRewards').click(function () {
window.location.href = './monthlyRewards.html'
})
})
window.addEventListener('scroll', function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
console.log('页面下滑距顶部的距离:', scrollTop);
if (scrollTop >= 30) {
$('.newText11').hide();
$('.newText1').css('height', '2rem')
} else if (scrollTop < 30) {
$('.newText1').css('height', '0rem')
$('.newText11').show();
}
});

View File

@@ -48,8 +48,8 @@ $(function () {
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
// showLoading()
// geth5()
showLoading()
geth5()
}, 100)
})
function translateFun() {
@@ -63,6 +63,7 @@ function translateFun() {
$('.text6').html(langReplace(localLang.demoModule.text6));
$('.newText1').html(langReplace(localLang.demoModule.newText1));
$('.newText2').html(langReplace(localLang.demoModule.newText2));
$('.newText22').html(langReplace(localLang.demoModule.newText22));
$('.newText3').html(langReplace(localLang.demoModule.newText3));
$('.newText4').html(langReplace(localLang.demoModule.newText4));
$('.newText5').html(langReplace(localLang.demoModule.newText5));
@@ -86,6 +87,7 @@ function geth5() {
data: {
type: listType,
datetype: timeType,
periodType: 2,
uid: pubInfo.uid
},
success(res) {
@@ -97,8 +99,8 @@ function geth5() {
if (listTo3.length < 3) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
nick: '',
totalNum: "",
nick: langReplace(localLang.demoModule.newText7),
diffNum: "",
uid: "0",
})
listTo3.push(...arr)
@@ -108,34 +110,9 @@ function geth5() {
$(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
$(`.header .top .top${i + 1} .nick`).text(res.nick);
// if (i > 0) {
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.totalNum, 1));
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.diffNum, 1));
// }
});
// 非前三
var str = '';
notListTo3.forEach((res, i) => {
str += `
<li>
<div class="seqNo">${res.seqNo}</div>
<img src="${res.avatar}" uid="${res.uid}" alt="" class="tx">
<div class="nick">${res.nick}</div>
<div class="score">
<b>${langReplace(localLang.demoModule.newText3)}</b>
<img src="./images/gold.png" alt="">
<span>${unitProcessingAr(res.totalNum, 1)}</span>
</div>
</li>
`
})
$('ul').append(str);
// 处理自己
$('.my .box .tx').attr('src', my.avatar);
$('.my .box .nick').text(my.nick);
$('.my .box .seqNo').text(my.totalNum <= 0 ? '-' : my.totalNum);
$('.my .box .score span').text(my.totalNum <= 0 ? '-' : unitProcessingAr(my.totalNum, 1));
if (my.totalNum <= 0) {
$('.my .box .score b').hide();
}
} else {
toastMsg(res.message)
}
@@ -148,7 +125,7 @@ function geth5() {
})
}
// 公会接口
function listRank() {
function listRank(type) {
$('ul li').remove();
$('.header .sTab').hide();
$('.my').hide()
@@ -159,17 +136,21 @@ function listRank() {
networkRequest({
type: 'get',
url: urlPrefix + '/clan/listRank',
data: {
periodType: 2,
},
success(res) {
if (res.code === 200) {
var my = res.data.me;
var listTo3 = res.data.slice(0, 3);
var notListTo3 = res.data.slice(3);
notListTo3 = notListTo3.slice(0, 27)
// 处理前三
if (listTo3.length < 3) {
let arr = new Array(3 - listTo3.length).fill({
avatar: './images/logo.png',
name: '',
totalNum: "",
name: langReplace(localLang.demoModule.newText7),
diffNum: "",
uid: "0",
})
listTo3.push(...arr)
@@ -179,26 +160,9 @@ function listRank() {
$(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
$(`.header .top .top${i + 1} .nick`).text(res.name);
// if (i > 0) {
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.income, 1));
$(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.diffNum, 1));
// }
});
// 非前三
var str = '';
notListTo3.forEach((res, i) => {
str += `
<li>
<div class="seqNo">${i + 4}</div>
<img src="${res.avatar}" uid="${res.clanElderUid}" alt="" class="tx">
<div class="nick">${res.name}</div>
<div class="score">
<b>${langReplace(localLang.demoModule.newText3)}</b>
<img src="./images/gold.png" alt="">
<span>${unitProcessingAr(res.income, 1)}</span>
</div>
</li>
`
})
$('ul').append(str);
} else {
toastMsg(res.message)
}
@@ -232,13 +196,13 @@ $('.header .tabBox div').click(function () {
$('.rewards').addClass(`reward${i}`);
if (i == 1) {
listType = 2;
// geth5();
geth5();
} else if (i == 2) {
listType = 1;
// geth5();
geth5();
} else if (i == 3) {
listType = 3;
// geth5();
listRank();
$('.header .top .score img').attr('src', `./images/${4}.png`);
$(`.header .top .top1 .ts`).attr('src', './images/no11.png')
$(`.header .top .top2 .ts`).attr('src', './images/no22.png')
@@ -257,4 +221,17 @@ $('.header .top .ts').click(function () {
window.androidJsObj.openPersonPage(uid);
}
}
})
})
window.addEventListener('scroll', function () {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
console.log('页面下滑距顶部的距离:', scrollTop);
if (scrollTop >= 30) {
$('.newText22').hide();
$('.newText2').css('height', '2rem')
} else if (scrollTop < 30) {
$('.newText2').css('height', '0rem')
$('.newText22').show();
}
});

View File

@@ -13,7 +13,9 @@ langAr = {
text6: 'أسبوعي ',
text7: 'غير مدرج',
newText1: 'تصنيف الشرف',
newText2: 'شهري',
newText11: 'تصنيف الشرف',
newText2: 'شهري المكافآت',
newText22: 'شهري المكافآت',
newText3: 'خلف',
newText4: 'شهري',
newText5: 'المكافآت',

View File

@@ -13,7 +13,9 @@ langEn = {
text6: "Weekly ",
text7: "Not Listed",
newText1:`Honor Ranking`,
newText2:`Monthly`,
newText11:`Honor Ranking`,
newText2:`Monthly Rewards`,
newText22:`Monthly Rewards`,
newText3:`Behind`,
newText4:`Monthly`,
newText5:`Rewards`,

View File

@@ -13,7 +13,9 @@ langTr = {
text6: 'Haftalık ',
text7: 'Listeye Girmedi',
newText1: 'Onur Sıralaması',
newText2: 'Aylık',
newText11: 'Onur Sıralaması',
newText2: 'Aylık Ödüller',
newText22: 'Aylık Ödüller',
newText3: 'Geride',
newText4: 'Aylık',
newText5: 'Ödüller',

View File

@@ -13,7 +13,9 @@ langZh = {
text6: '每週 ',
text7: '未上榜',
newText1: '榮譽排行',
newText2: '每月',
newText11: '榮譽排行',
newText2: '每月獎勵',
newText22: '每月獎勵',
newText3: '落後',
newText4: '每月',
newText5: '獎勵',

View File

@@ -13,8 +13,10 @@
<!-- 頂部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
<!-- <p class="newText1">Honor Ranking</p> -->
<!-- -->
</div>
<p class="newText2"></p>
<p class="newText22"></p>
<!-- 头部 -->
<div class="header header1">
<div class="tabBox">

View File

@@ -366,11 +366,13 @@ export default {
return Array.from(resultMap.values());
},
handleScroll(event) {
const container = event.target; // 获取滚动容器
if (
container.scrollHeight - container.scrollTop ===
container.clientHeight
) {
// const container = event.target; // 获取滚动容器
const { scrollTop, clientHeight, scrollHeight } = event.target;
console.log(scrollTop);
console.log(clientHeight);
console.log(scrollHeight);
console.log("--------------");
if (scrollTop + clientHeight + 50 >= scrollHeight) {
// 滚动到底部
console.log("已经到底部");
if (this.lock) {

View File

@@ -300,11 +300,12 @@ export default {
return Array.from(resultMap.values());
},
handleScroll(event) {
const container = event.target; // 获取滚动容器
if (
container.scrollHeight - container.scrollTop ===
container.clientHeight
) {
// const container = event.target; // 获取滚动容器
// container.scrollHeight - container.scrollTop ===
// container.clientHeight
const { scrollTop, clientHeight, scrollHeight } = event.target;
if (scrollTop + clientHeight + 50 >= scrollHeight) {
// 滚动到底部
console.log("已经到底部");
if (this.lock) {