完成ss公会
227
view/molistar/activity/ssGuild/css/peak.css
Normal file
@@ -0,0 +1,227 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #440402;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar,
|
||||
body::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: 0.58667rem;
|
||||
line-height: 0.58667rem;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0.86667rem;
|
||||
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;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 10rem;
|
||||
height: 7.90667rem;
|
||||
background: url(../images/headerPeak.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto 0rem;
|
||||
box-sizing: border-box;
|
||||
padding-top: 5.50667rem;
|
||||
}
|
||||
|
||||
.header .tab {
|
||||
width: 9.86667rem;
|
||||
height: 1.30667rem;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto 0rem;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
line-height: 0.49333rem;
|
||||
}
|
||||
|
||||
.header .tab div {
|
||||
width: 4.82667rem;
|
||||
height: 1.6rem;
|
||||
background: url(../images/peakTab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 600;
|
||||
box-sizing: border-box;
|
||||
padding-top: 0.26667rem;
|
||||
}
|
||||
|
||||
.header .tab .act {
|
||||
background: url(../images/peakTabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.text {
|
||||
width: 7.72rem;
|
||||
height: 0.8rem;
|
||||
line-height: 0.50667rem;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 500;
|
||||
margin: -0.66667rem auto 0.29333rem;
|
||||
}
|
||||
|
||||
.t {
|
||||
width: 10rem;
|
||||
height: 2.16rem;
|
||||
background: url(../images/t.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.c {
|
||||
width: 10rem;
|
||||
height: auto;
|
||||
background: url(../images/c.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
padding-bottom: 0.1rem;
|
||||
}
|
||||
|
||||
.c ul {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.c ul .null {
|
||||
width: 3.28rem;
|
||||
height: 3.28rem;
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
}
|
||||
|
||||
.c ul .month {
|
||||
width: 8.77333rem;
|
||||
margin: 0 auto 0;
|
||||
}
|
||||
|
||||
.c ul .month .box {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.c ul .month .box .title {
|
||||
width: 4.10667rem;
|
||||
height: 1.41333rem;
|
||||
line-height: 1.41333rem;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.42667rem;
|
||||
font-weight: 600;
|
||||
margin: 0 auto 0.16rem;
|
||||
background: url(../images/m_title.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.c ul .month .box .leveIcon {
|
||||
width: 5.70667rem;
|
||||
margin: 0 auto 0.32rem;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox {
|
||||
width: 8rem;
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 0;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBox {
|
||||
width: 3.86667rem;
|
||||
height: 4.8rem;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBox .ts {
|
||||
position: absolute;
|
||||
width: 3.86667rem;
|
||||
height: 3.86667rem;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBox .tx {
|
||||
position: absolute;
|
||||
width: 3.2rem;
|
||||
height: 3.2rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 0.33333rem;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBox p {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.4rem;
|
||||
font-weight: 500;
|
||||
margin-top: 3.72rem;
|
||||
margin-bottom: 0.22667rem;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBox b {
|
||||
display: block;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.c ul .month .box .guileBox .sBoxNull {
|
||||
width: 3.28rem;
|
||||
height: 3.28rem;
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.b {
|
||||
width: 10rem;
|
||||
height: 1.73333rem;
|
||||
background: url(../images/bb.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: -0.29333rem auto 0;
|
||||
}
|
||||
|
||||
.activityText {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: 400;
|
||||
margin: 0.26667rem auto 0.66667rem;
|
||||
}
|
236
view/molistar/activity/ssGuild/css/peak.scss
Normal file
@@ -0,0 +1,236 @@
|
||||
@function px2rem($px) {
|
||||
@return $px / 75+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #440402;
|
||||
overflow-x: hidden;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.back {
|
||||
width: 100%;
|
||||
height: px2rem(44);
|
||||
line-height: px2rem(44);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: px2rem(65);
|
||||
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);
|
||||
}
|
||||
}
|
||||
|
||||
.header {
|
||||
width: px2rem(750);
|
||||
height: px2rem(593);
|
||||
background: url(../images/headerPeak.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
margin: 0 auto px2rem(0);
|
||||
box-sizing: border-box;
|
||||
padding-top: px2rem(413);
|
||||
|
||||
.tab {
|
||||
width: px2rem(740);
|
||||
height: px2rem(98);
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 auto px2rem(0);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
line-height: px2rem(37);
|
||||
|
||||
div {
|
||||
width: px2rem(362);
|
||||
height: px2rem(120);
|
||||
background: url(../images/peakTab.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 600;
|
||||
box-sizing: border-box;
|
||||
padding-top: px2rem(20);
|
||||
}
|
||||
|
||||
.act {
|
||||
background: url(../images/peakTabAct.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
width: px2rem(579);
|
||||
height: px2rem(60);
|
||||
line-height: px2rem(38);
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 500;
|
||||
margin: px2rem(-50) auto px2rem(22);
|
||||
}
|
||||
|
||||
|
||||
.t {
|
||||
width: px2rem(750);
|
||||
height: px2rem(162);
|
||||
background: url(../images/t.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.c {
|
||||
width: px2rem(750);
|
||||
height: auto;
|
||||
background: url(../images/c.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
position: relative;
|
||||
padding-bottom: 0.1rem;
|
||||
|
||||
ul {
|
||||
width: 100%;
|
||||
|
||||
.null {
|
||||
width: px2rem(246);
|
||||
height: px2rem(246);
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: 0 auto 0;
|
||||
}
|
||||
|
||||
.month {
|
||||
width: px2rem(658);
|
||||
margin: 0 auto 0;
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
|
||||
.title {
|
||||
width: px2rem(308);
|
||||
height: px2rem(106);
|
||||
line-height: px2rem(106);
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(32);
|
||||
font-weight: 600;
|
||||
margin: 0 auto px2rem(12);
|
||||
background: url(../images/m_title.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.leveIcon {
|
||||
width: px2rem(428);
|
||||
margin: 0 auto px2rem(24);
|
||||
display: block;
|
||||
}
|
||||
|
||||
.guileBox {
|
||||
width: px2rem(600);
|
||||
height: auto;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
overflow: hidden;
|
||||
margin: 0 auto 0;
|
||||
|
||||
.sBox {
|
||||
width: px2rem(290);
|
||||
height: px2rem(360);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-bottom: px2rem(18);
|
||||
|
||||
.ts {
|
||||
position: absolute;
|
||||
width: px2rem(290);
|
||||
height: px2rem(290);
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tx {
|
||||
position: absolute;
|
||||
width: px2rem(240);
|
||||
height: px2rem(240);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: px2rem(25);
|
||||
}
|
||||
|
||||
p {
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(30);
|
||||
font-weight: 500;
|
||||
margin-top: px2rem(279);
|
||||
margin-bottom: px2rem(17);
|
||||
}
|
||||
|
||||
b {
|
||||
display: block;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(28);
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.sBoxNull{
|
||||
width: px2rem(246);
|
||||
height: px2rem(246);
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.b {
|
||||
width: px2rem(750);
|
||||
height: px2rem(130);
|
||||
background: url(../images/bb.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin: px2rem(-22) auto 0;
|
||||
}
|
||||
|
||||
|
||||
.activityText {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #FFEDBA;
|
||||
font-size: px2rem(26);
|
||||
font-weight: 400;
|
||||
margin: px2rem(20) auto px2rem(50);
|
||||
}
|
||||
|
||||
.english {}
|
||||
|
||||
.arabic {}
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.8 KiB |
BIN
view/molistar/activity/ssGuild/images/b_t.png
Normal file
After Width: | Height: | Size: 752 KiB |
BIN
view/molistar/activity/ssGuild/images/bb.png
Normal file
After Width: | Height: | Size: 48 KiB |
Before Width: | Height: | Size: 5.8 KiB |
BIN
view/molistar/activity/ssGuild/images/c.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 122 KiB |
Before Width: | Height: | Size: 549 KiB After Width: | Height: | Size: 332 KiB |
Before Width: | Height: | Size: 554 KiB |
Before Width: | Height: | Size: 554 KiB After Width: | Height: | Size: 340 KiB |
BIN
view/molistar/activity/ssGuild/images/headerPeak.png
Normal file
After Width: | Height: | Size: 450 KiB |
Before Width: | Height: | Size: 47 KiB |
BIN
view/molistar/activity/ssGuild/images/logo.png
Normal file
After Width: | Height: | Size: 4.0 KiB |
BIN
view/molistar/activity/ssGuild/images/m_title.png
Normal file
After Width: | Height: | Size: 47 KiB |
Before Width: | Height: | Size: 47 KiB |
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 19 KiB |
Before Width: | Height: | Size: 113 KiB |
Before Width: | Height: | Size: 119 KiB |
Before Width: | Height: | Size: 119 KiB |
BIN
view/molistar/activity/ssGuild/images/page1liBg.png
Normal file
After Width: | Height: | Size: 110 KiB |
BIN
view/molistar/activity/ssGuild/images/page1myBg.png
Normal file
After Width: | Height: | Size: 127 KiB |
Before Width: | Height: | Size: 244 KiB |
BIN
view/molistar/activity/ssGuild/images/page2Reards.png
Normal file
After Width: | Height: | Size: 45 KiB |
Before Width: | Height: | Size: 64 KiB |
Before Width: | Height: | Size: 70 KiB |
Before Width: | Height: | Size: 70 KiB |
Before Width: | Height: | Size: 20 KiB |
BIN
view/molistar/activity/ssGuild/images/peak.png
Normal file
After Width: | Height: | Size: 73 KiB |
BIN
view/molistar/activity/ssGuild/images/peakTab.png
Normal file
After Width: | Height: | Size: 27 KiB |
BIN
view/molistar/activity/ssGuild/images/peakTabAct.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
view/molistar/activity/ssGuild/images/peakTs.png
Normal file
After Width: | Height: | Size: 36 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsPage1-ar.png
Normal file
After Width: | Height: | Size: 391 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsPage1.png
Normal file
After Width: | Height: | Size: 401 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsPage2-ar.png
Normal file
After Width: | Height: | Size: 41 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsPage3-ar.png
Normal file
After Width: | Height: | Size: 41 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsText.png
Normal file
After Width: | Height: | Size: 45 KiB |
BIN
view/molistar/activity/ssGuild/images/rewardsText2.png
Normal file
After Width: | Height: | Size: 44 KiB |
BIN
view/molistar/activity/ssGuild/images/sTitle.png
Normal file
After Width: | Height: | Size: 12 KiB |
BIN
view/molistar/activity/ssGuild/images/ssTitle.png
Normal file
After Width: | Height: | Size: 13 KiB |
BIN
view/molistar/activity/ssGuild/images/t.png
Normal file
After Width: | Height: | Size: 73 KiB |
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 17 KiB |
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 34 KiB |
BIN
view/molistar/activity/ssGuild/images/top11.png
Normal file
After Width: | Height: | Size: 206 KiB |
Before Width: | Height: | Size: 93 KiB |
BIN
view/molistar/activity/ssGuild/images/top22.png
Normal file
After Width: | Height: | Size: 125 KiB |
Before Width: | Height: | Size: 26 KiB |
Before Width: | Height: | Size: 93 KiB |
BIN
view/molistar/activity/ssGuild/images/top33.png
Normal file
After Width: | Height: | Size: 125 KiB |
Before Width: | Height: | Size: 9.4 KiB |
BIN
view/molistar/activity/ssGuild/images/ts1.png
Normal file
After Width: | Height: | Size: 206 KiB |
BIN
view/molistar/activity/ssGuild/images/ts2.png
Normal file
After Width: | Height: | Size: 126 KiB |
BIN
view/molistar/activity/ssGuild/images/ts3.png
Normal file
After Width: | Height: | Size: 126 KiB |
Before Width: | Height: | Size: 12 KiB |
@@ -16,104 +16,223 @@
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header">
|
||||
<!-- 活动时间 -->
|
||||
<div class="actTime"><span class="text2"></span><b></b></div>
|
||||
<!-- 倒计时 -->
|
||||
<div class="time">
|
||||
<div class="day">
|
||||
<div class="days">
|
||||
<b>00</b>
|
||||
<span class="text3"></span>
|
||||
<span class="text2"></span>
|
||||
</div>
|
||||
<div class="hour">
|
||||
<b>00</b>
|
||||
<span class="text4"></span>
|
||||
<span class="text3"></span>
|
||||
</div>
|
||||
<div class="min">
|
||||
<b>00</b>
|
||||
<span class="text5"></span>
|
||||
<span class="text4"></span>
|
||||
</div>
|
||||
<div class="sec">
|
||||
<b>00</b>
|
||||
<span class="text6"></span>
|
||||
<span class="text5"></span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 文字内容 -->
|
||||
<div class="content "><div class="text7"></div>
|
||||
</div>
|
||||
<!-- tab切换 -->
|
||||
<div class="peak text6"></div>
|
||||
<div class="tab">
|
||||
<div class="act text8"></div>
|
||||
<div class="text9"></div>
|
||||
<div class="act text7" type="1"></div>
|
||||
<div class="text8" type="2"></div>
|
||||
<div class="text9" type="3"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 文案展示 -->
|
||||
<div class="top30 text10"></div>
|
||||
<!-- 页面1 -->
|
||||
<div class="page1">
|
||||
<!-- 前三 -->
|
||||
<div class="cloud">
|
||||
<div class="no1">
|
||||
<img src="./images/tsBig.png" alt="" class="ts">
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<div class="name"></div>
|
||||
<div class="id"></div>
|
||||
<img src="./images/SS.png" alt="" class="grade">
|
||||
<div class="page1_in">
|
||||
<div class="t">
|
||||
<div class="sTab">
|
||||
<div class="act text11"></div>
|
||||
<div class="text12"></div>
|
||||
</div>
|
||||
<div class="top1">
|
||||
<img src="./images/ts1.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
</div>
|
||||
<div class="top2">
|
||||
<img src="./images/ts2.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
<div class="top3">
|
||||
<img src="./images/ts3.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="no2">
|
||||
<img src="./images/ts.png" alt="" class="ts">
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<div class="name"></div>
|
||||
<div class="id"></div>
|
||||
<img src="./images/SS.png" alt="" class="grade">
|
||||
<div class="c">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="num">04</div>
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<span>Behind:0</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="no3">
|
||||
<img src="./images/ts.png" alt="" class="ts">
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<div class="name"></div>
|
||||
<div class="id"></div>
|
||||
<img src="./images/SS.png" alt="" class="grade">
|
||||
</div>
|
||||
</div>
|
||||
<!-- 非前三 -->
|
||||
<ul>
|
||||
<!-- <li>
|
||||
<div class="b"></div>
|
||||
<div class="my">
|
||||
<div class="num">04</div>
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>虚位以待</p>
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<img src="./images/SS.png" alt="" class="grade">
|
||||
</li> -->
|
||||
</ul>
|
||||
<!-- 规则 -->
|
||||
<img src="./images/page1Rule.png" alt="" class="rule img1">
|
||||
<!-- 自己 -->
|
||||
<div class="my">
|
||||
<div class="num">04</div>
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p></p>
|
||||
<b></b>
|
||||
<div class="right">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<span>Behind:0</span>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/SS.png" alt="" class="grade">
|
||||
</div>
|
||||
<div class="page2_in">
|
||||
<div class="t">
|
||||
<div class="sTab">
|
||||
<div class="text11">Ranking</div>
|
||||
<div class="act text12">Rewards</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="c">
|
||||
<div class="rewards"></div>
|
||||
</div>
|
||||
<div class="b"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 页面2 -->
|
||||
<div class="page2">
|
||||
<div class="my">
|
||||
<img src="./images/page2Ts.png" alt="" class="ts">
|
||||
<img src="./images/null.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<p class="p1"><span class=" text10"></span><b>名字</b></p>
|
||||
<p class="p2"><span class=" text11"></span><b>0</b></p>
|
||||
<p class="p3"><span class=" text12"></span><b>名字</b></p>
|
||||
<p class="p4"><span class=" text13"></span><b>0</b></p>
|
||||
<p class="p5"><span class=" text14"></span><b>0</b></p>
|
||||
<p class="p6"><span class=" text15"></span><b>0</b></p>
|
||||
<div class="t"></div>
|
||||
<div class="c">
|
||||
<!-- 奖励说明 -->
|
||||
<div class="rewardsText"></div>
|
||||
<!-- tab -->
|
||||
<div class="sTab">
|
||||
<div class="act text13" type="1"></div>
|
||||
<div class="text14" type="2"></div>
|
||||
<div class="text15" type="3"></div>
|
||||
<div class="text16" type="4"></div>
|
||||
</div>
|
||||
<div class="top1">
|
||||
<img src="./images/top11.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
</div>
|
||||
<div class="top2">
|
||||
<img src="./images/top22.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
<div class="top3">
|
||||
<img src="./images/top33.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="num">04</div>
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<div class="right">Behind:0</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="my">
|
||||
<div class="num">04</div>
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<div class="right">Behind:0</div>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/page2Rule.png" alt="" class="rule img2">
|
||||
<div class="b"></div>
|
||||
</div>
|
||||
|
||||
<!-- 页面3 -->
|
||||
<div class="page3">
|
||||
<div class="t"></div>
|
||||
<div class="c">
|
||||
<!-- 奖励说明 -->
|
||||
<div class="rewardsText"></div>
|
||||
<!-- tab -->
|
||||
<div class="sTab">
|
||||
<div class="">2025</div>
|
||||
</div>
|
||||
<div class="top1">
|
||||
<img src="./images/top11.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
</div>
|
||||
<div class="top2">
|
||||
<img src="./images/top22.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<img src="./images/SS.png" alt="" class="leve">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
<div class="top3">
|
||||
<img src="./images/top33.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="name">名字</div>
|
||||
<div class="id">ID:123123</div>
|
||||
<div class="score">Behind:0</div>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="num">04</div>
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<div class="right">Behind:0</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="my">
|
||||
<div class="num">04</div>
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
<div class="right">Behind:0</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="b"></div>
|
||||
</div>
|
||||
<!-- 免责声明 -->
|
||||
<div class="bootomText bootomTextPage1 text16"></div>
|
||||
<div class="activityText activityTextAct text17"></div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -127,5 +246,6 @@
|
||||
<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>
|
@@ -33,6 +33,9 @@ var isLock = true;
|
||||
var page = 1;
|
||||
var wealth;
|
||||
var limitWealth;
|
||||
var activityText;
|
||||
var quarter = 1;
|
||||
var rankType = 1;
|
||||
// 初始化函數
|
||||
$(function () {
|
||||
getInfoFromClient();
|
||||
@@ -58,15 +61,13 @@ $(function () {
|
||||
langReplace = window.lang.replace;
|
||||
localLang = window.lang;
|
||||
translateFun();
|
||||
getConfig();
|
||||
ssAgencyRank();
|
||||
}, 100)
|
||||
|
||||
})
|
||||
function translateFun() {
|
||||
var langReplace = window.lang.replace;
|
||||
var localLang = window.lang;
|
||||
$('.page1 .rule').attr('src', langReplace(localLang.demoModule.img1));
|
||||
$('.page2 .rule').attr('src', langReplace(localLang.demoModule.img2));
|
||||
$('.text1').text(langReplace(localLang.demoModule.text1));
|
||||
$('.text2').text(langReplace(localLang.demoModule.text2));
|
||||
$('.text3').text(langReplace(localLang.demoModule.text3));
|
||||
@@ -83,93 +84,28 @@ function translateFun() {
|
||||
$('.text14').text(langReplace(localLang.demoModule.text14));
|
||||
$('.text15').text(langReplace(localLang.demoModule.text15));
|
||||
$('.text16').text(langReplace(localLang.demoModule.text16));
|
||||
$('.img1').attr('src', langReplace(localLang.demoModule.img1));
|
||||
$('.img2').attr('src', langReplace(localLang.demoModule.img2));
|
||||
$('.text17').text(langReplace(localLang.demoModule.text17)); lo
|
||||
}
|
||||
// 配置接口
|
||||
function getConfig() {
|
||||
function ssAgencyRank() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/h5/ssGuild/ssAgencyRank',
|
||||
data: { uid: pubInfo.uid },
|
||||
data: {
|
||||
uid: pubInfo.uid,
|
||||
quarter: rankType == 2 ? quarter : null,
|
||||
rankType: rankType,
|
||||
},
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
// 倒计时
|
||||
countup(res.data.monthEndTime - res.timestamp);
|
||||
// 处理时间
|
||||
$('.header .actTime b').text(`${res.data.startDate}-${res.data.endDate}`);
|
||||
// 渲染排名
|
||||
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/null.png',
|
||||
guildName: langReplace(localLang.demoModule.text17),
|
||||
guildId: '0',
|
||||
markScore: null
|
||||
})
|
||||
listTo3.push(...arr)
|
||||
if (rankType == 1) {
|
||||
// 处理倒计时
|
||||
countup(res.data.monthEndTime - res.timestamp);
|
||||
}
|
||||
// 前三
|
||||
listTo3.forEach((res, i) => {
|
||||
$(`.page1 .cloud .no${i + 1} .tx`).attr('src', res.avatar);
|
||||
if (res.markScore == null) {
|
||||
$(`.page1 .cloud .no${i + 1} .grade`).hide();
|
||||
} else {
|
||||
$(`.page1 .cloud .no${i + 1} .grade`).attr('src', `./images/${res.markScore}.png`);
|
||||
}
|
||||
$(`.page1 .cloud .no${i + 1} .name`).text(res.guildName);
|
||||
$(`.page1 .cloud .no${i + 1} .id`).text(res.guildId == 0 ? '' : 'ID:' + res.guildId);
|
||||
})
|
||||
// 非前三
|
||||
var str = '';
|
||||
notListTo3.forEach(res => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.rank}</div>
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>${res.guildName}</p>
|
||||
<b>ID:${res.guildId}</b>
|
||||
</div>
|
||||
<img style="display:${res.ssLevel == 0 ? 'none' : 'block'}" src="./images/${res.markScore}.png" alt="" class="grade">
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.page1 ul').append(str);
|
||||
// 判断是否是主播
|
||||
if (res.data.selfRank) {
|
||||
// 处理自己
|
||||
var me = res.data.selfRank;
|
||||
$('.page1 .my .num').text(me.rank == 0 ? '30+' : me.rank);
|
||||
$('.page1 .my .tx').attr('src', me.avatar);
|
||||
if (me.ssLevel == 0) {
|
||||
$('.page1 .my .grade').hide();
|
||||
} else {
|
||||
$('.page1 .my .grade').attr('src', `./images/${me.markScore}.png`);
|
||||
}
|
||||
$('.page1 .my .user p').text(me.guildName);
|
||||
$('.page1 .my .user b').text('ID:' + me.guildId);
|
||||
// 处理页面
|
||||
rankType == 1 ? monthlyFun(res) : rankType == 2 ? quarterFun(res) : yearFun(res)
|
||||
|
||||
var memberVo = res.data.memberVo;
|
||||
$('.page2 .my .tx').attr('src', memberVo.avatar);
|
||||
if (memberVo.ssLevel == 0) {
|
||||
$('.page2 .my .leve').hide();
|
||||
} else {
|
||||
$('.page2 .my .leve').attr('src', `./images/${memberVo.markScore}.png`);
|
||||
}
|
||||
$('.page2 .my .p1 b').text(memberVo.guildName);
|
||||
$('.page2 .my .p2 b').text(memberVo.guildId);
|
||||
$('.page2 .my .p3 b').text(memberVo.nick);
|
||||
$('.page2 .my .p4 b').text(memberVo.erbanNo);
|
||||
$('.page2 .my .p5 b').text(memberVo.diamondNum);
|
||||
$('.page2 .my .p6 b').text(memberVo.goldNum == 0 ? '-' : memberVo.goldNum);
|
||||
} else {
|
||||
$('.page1 .my').hide();
|
||||
$('.header .tab').hide();
|
||||
$('.page1 .cloud').css('margin', '-19.2rem auto -2.6rem');
|
||||
}
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
@@ -181,12 +117,225 @@ function getConfig() {
|
||||
}
|
||||
})
|
||||
}
|
||||
// 切换tab
|
||||
// 处理第1页面
|
||||
function monthlyFun(res) {
|
||||
// 处理前三
|
||||
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',
|
||||
guildName: localLang.demoModule.text19,
|
||||
ownerErbanNo: null
|
||||
})
|
||||
listTo3.push(...arr)
|
||||
}
|
||||
console.log(listTo3);
|
||||
|
||||
listTo3.forEach((res, i) => {
|
||||
$(`.page1 .page1_in .t .top${i + 1} .name`).text(res.guildName);
|
||||
$(`.page2 .c .top${i + 1} .tx`).attr('src', res.avatar);
|
||||
if (res.ownerErbanNo == null) {
|
||||
$(`.page1 .page1_in .t .top${i + 1} .id`).hide();
|
||||
$(`.page1 .page1_in .t .top${i + 1} .score`).hide();
|
||||
$(`.page1 .page1_in .t .top${i + 1} .leve`).hide();
|
||||
} else {
|
||||
$(`.page1 .page1_in .t .top${i + 1} .leve`).attr('src', `./images/${res.markScore}.png`);
|
||||
$(`.page1 .page1_in .t .top${i + 1} .score`).text(`${localLang.demoModule.text18}:` + unitProcessingAr(res.diffNum, 1));
|
||||
$(`.page1 .page1_in .t .top${i + 1} .id`).text('ID:' + res.ownerErbanNo);
|
||||
}
|
||||
})
|
||||
// 处理非前三
|
||||
var str = '';
|
||||
$('.page1 .page1_in .c ul li').remove();
|
||||
notListTo3.forEach(res => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.rank}</div>
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>${res.guildName}</p>
|
||||
<b>ID:${res.ownerErbanNo}</b>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img src="./images/${res.markScore}.png" alt="" class="leve">
|
||||
<span>${localLang.demoModule.text18}:${unitProcessingAr(res.diffNum, 1)}</span>
|
||||
</div>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.page1 .page1_in .c ul').append(str);
|
||||
// 处理自己
|
||||
if (res.data.selfRank) {
|
||||
var my = res.data.selfRank;
|
||||
$('.page1 .page1_in .my .num').text(my.rank == 0 ? '-' : my.rank);
|
||||
$('.page1 .page1_in .my .tx').attr('src', my.avatar);
|
||||
$('.page1 .page1_in .my .user p').text(my.guildName);
|
||||
$('.page1 .page1_in .my .user b').text('ID:' + my.ownerErbanNo);
|
||||
if (my.markScore == '-') {
|
||||
$('.page1 .page1_in .my .right .leve').hide();
|
||||
$('.page1 .page1_in .my .right span').css('margin-top', '0.45rem')
|
||||
} else {
|
||||
$('.page1 .page1_in .my .right .leve').attr('src', `./images/${my.markScore}.png`);
|
||||
}
|
||||
$('.page1 .page1_in .my .right span').text(`${localLang.demoModule.text18}:` + unitProcessingAr(my.ownerErbanNo, 1));
|
||||
} else {
|
||||
$('.page1 .page1_in .my').hide();
|
||||
}
|
||||
}
|
||||
// 处理第2页面
|
||||
function quarterFun(res) {
|
||||
// 处理前三
|
||||
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',
|
||||
guildName: localLang.demoModule.text19,
|
||||
ownerErbanNo: null
|
||||
})
|
||||
listTo3.push(...arr)
|
||||
}
|
||||
listTo3.forEach((res, i) => {
|
||||
$(`.page2 .c .top${i + 1} .name`).text(res.guildName);
|
||||
$(`.page2 .c .top${i + 1} .tx`).attr('src', res.avatar);
|
||||
if (res.ownerErbanNo == null) {
|
||||
$(`.page2 .c .top${i + 1} .id`).hide();
|
||||
$(`.page2 .c .top${i + 1} .score`).hide();
|
||||
$(`.page2 .c .top${i + 1} .leve`).hide();
|
||||
} else {
|
||||
$(`.page2 .c .top${i + 1} .leve`).attr('src', `./images/${res.markScore}.png`);
|
||||
$(`.page2 .c .top${i + 1} .score`).text(`${localLang.demoModule.text18}:` + unitProcessingAr(res.diffNum, 1));
|
||||
$(`.page2 .c .top${i + 1} .id`).text('ID:' + res.ownerErbanNo);
|
||||
}
|
||||
})
|
||||
// 处理非前三
|
||||
var str = '';
|
||||
$('.page2 .c ul li').remove();
|
||||
notListTo3.forEach(res => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.rank}</div>
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>${res.guildName}</p>
|
||||
<b>ID:${res.ownerErbanNo}</b>
|
||||
</div>
|
||||
<div class="right">${localLang.demoModule.text18}:${unitProcessingAr(res.diffNum, 1)}</div>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.page2 .c ul').append(str);
|
||||
// 处理自己
|
||||
if (res.data.selfRank) {
|
||||
var my = res.data.selfRank;
|
||||
$('.page2 .c .my .num').text(my.rank == 0 ? '-' : my.rank);
|
||||
$('.page2 .c .my .tx').attr('src', my.avatar);
|
||||
$('.page2 .c .my .user p').text(my.guildName);
|
||||
$('.page2 .c .my .user b').text('ID:' + my.ownerErbanNo);
|
||||
if (my.markScore == '-') {
|
||||
$('.page2 .c .my .right .leve').hide();
|
||||
$('.page2 .c .my .right span').css('margin-top', '0.45rem')
|
||||
} else {
|
||||
$('.page2 .c .my .right .leve').attr('src', `./images/${my.markScore}.png`);
|
||||
}
|
||||
$('.page2 .c .my .right span').text(`${localLang.demoModule.text18}:` + unitProcessingAr(my.ownerErbanNo, 1));
|
||||
} else {
|
||||
$('.page2 .c .my').hide();
|
||||
}
|
||||
};
|
||||
// 处理第3页面
|
||||
function yearFun(res) {
|
||||
// 处理前三
|
||||
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',
|
||||
guildName: localLang.demoModule.text19,
|
||||
ownerErbanNo: null
|
||||
})
|
||||
listTo3.push(...arr)
|
||||
}
|
||||
listTo3.forEach((res, i) => {
|
||||
$(`.page3 .c .top${i + 1} .name`).text(res.guildName);
|
||||
$(`.page3 .c .top${i + 1} .tx`).attr('src', res.avatar);
|
||||
if (res.ownerErbanNo == null) {
|
||||
$(`.page3 .c .top${i + 1} .id`).hide();
|
||||
$(`.page3 .c .top${i + 1} .score`).hide();
|
||||
$(`.page3 .c .top${i + 1} .leve`).hide();
|
||||
} else {
|
||||
$(`.page3 .c .top${i + 1} .leve`).attr('src', `./images/${res.markScore}.png`);
|
||||
$(`.page3 .c .top${i + 1} .score`).text(`${localLang.demoModule.text18}:` + unitProcessingAr(res.diffNum, 1));
|
||||
$(`.page3 .c .top${i + 1} .id`).text('ID:' + res.ownerErbanNo);
|
||||
}
|
||||
})
|
||||
// 处理非前三
|
||||
var str = '';
|
||||
$('.page3 .c ul li').remove();
|
||||
notListTo3.forEach(res => {
|
||||
str += `
|
||||
<li>
|
||||
<div class="num">${res.rank}</div>
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<div class="user">
|
||||
<p>${res.guildName}</p>
|
||||
<b>ID:${res.ownerErbanNo}</b>
|
||||
</div>
|
||||
<div class="right">${localLang.demoModule.text18}:${unitProcessingAr(res.diffNum, 1)}</div>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.page3 .c ul').append(str);
|
||||
// 处理自己
|
||||
if (res.data.selfRank) {
|
||||
var my = res.data.selfRank;
|
||||
$('.page3 .c .my .num').text(my.rank == 0 ? '-' : my.rank);
|
||||
$('.page3 .c .my .tx').attr('src', my.avatar);
|
||||
$('.page3 .c .my .user p').text(my.guildName);
|
||||
$('.page3 .c .my .user b').text('ID:' + my.ownerErbanNo);
|
||||
if (my.markScore == '-') {
|
||||
$('.page3 .c .my .right .leve').hide();
|
||||
$('.page3 .c .my .right span').css('margin-top', '0.45rem')
|
||||
} else {
|
||||
$('.page3 .c .my .right .leve').attr('src', `./images/${my.markScore}.png`);
|
||||
}
|
||||
$('.page3 .c .my .right span').text(`${localLang.demoModule.text18}:` + unitProcessingAr(my.ownerErbanNo, 1));
|
||||
} else {
|
||||
$('.page3 .c .my').hide();
|
||||
}
|
||||
};
|
||||
// tab切换
|
||||
$('.header .tab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$(this).addClass('act').siblings().removeClass('act')
|
||||
$('.page1,.page2').hide();
|
||||
rankType = $(this).attr('type')
|
||||
$(this).addClass('act').siblings().removeClass('act');
|
||||
$('.page1,.page2,.page3').hide();
|
||||
$(`.page${i}`).show();
|
||||
$('.activityText').addClass('activityTextAct');
|
||||
if (i == 1) {
|
||||
$('.page2_in').hide();
|
||||
$('.page1_in').show();
|
||||
}
|
||||
ssAgencyRank();
|
||||
})
|
||||
// 页面1tab切换
|
||||
$('.page1 .page1_in .t .sTab div,.page1 .page2_in .t .sTab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$('.page1_in,.page2_in').hide();
|
||||
$(`.page${i}_in`).show();
|
||||
if (i == 2) {
|
||||
$('.activityText').removeClass('activityTextAct');
|
||||
} else {
|
||||
$('.activityText').addClass('activityTextAct');
|
||||
}
|
||||
})
|
||||
// 页面2切换
|
||||
$('.page2 .c .sTab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
quarter = $(this).attr('type')
|
||||
$(this).addClass('act').siblings().removeClass('act');
|
||||
ssAgencyRank();
|
||||
})
|
||||
// 倒計時
|
||||
function countup(leftTime) {
|
||||
@@ -226,4 +375,8 @@ function getzf(num) {
|
||||
num = '0' + num;
|
||||
}
|
||||
return num;
|
||||
}
|
||||
}
|
||||
|
||||
$('.header .peak').click(function () {
|
||||
window.location.href = './peak.html';
|
||||
})
|
137
view/molistar/activity/ssGuild/js/peak.js
Normal file
@@ -0,0 +1,137 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
var langReplace;
|
||||
var localLang;
|
||||
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'
|
||||
})
|
||||
}
|
||||
var countupTime;//倒计时容器
|
||||
var isLock = true;
|
||||
var page = 1;
|
||||
var wealth;
|
||||
var limitWealth;
|
||||
var activityText;
|
||||
var topRankType = 1;
|
||||
// 初始化函數
|
||||
$(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(() => {
|
||||
window.history.back();
|
||||
})
|
||||
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
|
||||
langReplace = window.lang.replace;
|
||||
localLang = window.lang;
|
||||
translateFun();
|
||||
getConfig();
|
||||
}, 100)
|
||||
|
||||
})
|
||||
function translateFun() {
|
||||
var langReplace = window.lang.replace;
|
||||
var localLang = window.lang;
|
||||
$('.text17').html(langReplace(localLang.demoModule.text17));
|
||||
$('.text20').html(langReplace(localLang.demoModule.text20));
|
||||
$('.text21').html(langReplace(localLang.demoModule.text21));
|
||||
$('.text22').html(langReplace(localLang.demoModule.text22));
|
||||
$('.text23').html(langReplace(localLang.demoModule.text23));
|
||||
}
|
||||
// 配置接口
|
||||
function getConfig() {
|
||||
showLoading()
|
||||
networkRequest({
|
||||
type: 'get',
|
||||
url: urlPrefix + '/activity/h5/ssGuild/ssTopRank',
|
||||
data: { uid: pubInfo.uid, topRankType, },
|
||||
success(res) {
|
||||
if (res.code === 200) {
|
||||
// 处理月份
|
||||
var str = '';
|
||||
$('.c ul li').remove();
|
||||
res.data.forEach(res => {
|
||||
str += `
|
||||
<li class="month">
|
||||
<div class="box">
|
||||
<div class="title">${res.monthDateStr}</div>
|
||||
<img src="./images/ssTitle.png" alt="" class="leveIcon">
|
||||
<div class="guileBox">
|
||||
${ssrankListFun(res.ssRankList)}
|
||||
</div>
|
||||
<img src="./images/sTitle.png" alt="" class="leveIcon">
|
||||
<div class="guileBox">
|
||||
${ssrankListFun(res.srankList)}
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.c ul').append(str);
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
hideLoading(layerIndex)
|
||||
},
|
||||
error(err) {
|
||||
hideLoading(layerIndex)
|
||||
toastMsg(langReplace(localLang.demoModule.layerIndex3))
|
||||
}
|
||||
})
|
||||
}
|
||||
// ss等级
|
||||
function ssrankListFun(data) {
|
||||
var str = '';
|
||||
if (data.length == 0) {
|
||||
str = `<div class="sBoxNull"></div>`;
|
||||
} else {
|
||||
data.forEach(res => {
|
||||
str += `
|
||||
<div class="sBox">
|
||||
<img src="./images/peakTs.png" alt="" class="ts">
|
||||
<img src="${res.avatar}" alt="" class="tx">
|
||||
<p>${res.guildName}</p>
|
||||
<b>ID:${res.ownerErbanNo}</b>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
}
|
||||
return str;
|
||||
}
|
||||
$('.header .tab div').click(function () {
|
||||
var i = $(this).index() + 1;
|
||||
$(this).addClass('act').siblings().removeClass('act');
|
||||
topRankType = i;
|
||||
getConfig();
|
||||
})
|
@@ -2,27 +2,32 @@
|
||||
langAr = {
|
||||
// 模块
|
||||
demoModule: {
|
||||
layerIndex1: `جار التحميل...`,
|
||||
layerIndex1: `جارٍ التحميل...`,
|
||||
layerIndex2: `نجاح`,
|
||||
layerIndex3: `خطأ في الشبكة`,
|
||||
text1: `مسابقة نقابة SS`,
|
||||
text2: `وقت النشاط:`,
|
||||
text3: `يوم`,
|
||||
text4: `ساعة`,
|
||||
text5: `دقيقة`,
|
||||
text6: `ثانية`,
|
||||
text7: `ستتنافس كل نقابة على شرف النقابة من خلال إتمام مهام وتحديات محددة للحصول على قيمة قدرة معينة لاستضافة حدث خلال 30 يومًا لكسب المشاركات. سيتم عرض هذه الأوسمة في قائمة الترتيب وعلى الصفحة الرئيسية للمضيف.`,
|
||||
text8: `نقابة`,
|
||||
text9: `خاصتي`,
|
||||
text10: `لقب النقابة:`,
|
||||
text11: `معرف النقابة:`,
|
||||
text12: `لقب المضيف:`,
|
||||
text13: `معرف المضيف:`,
|
||||
text14: `تدفق الماس الخاص بي:`,
|
||||
text15: `ذهب المكافآت المتاح:`,
|
||||
text16: `هذا النشاط ليس له علاقة بالتفاح`,
|
||||
text17: `المكان متاح`,
|
||||
img1: `./images/page1Rule-ar.png`,
|
||||
img2: `./images/page2Rule-ar.png`,
|
||||
text1: `مسابقة وكالة SS`,
|
||||
text2: `أيام`,
|
||||
text3: `ساعات`,
|
||||
text4: `دقائق`,
|
||||
text5: `ثواني`,
|
||||
text6: `قمة SS`,
|
||||
text7: `شهري`,
|
||||
text8: `ربع سنوي`,
|
||||
text9: `سنوي`,
|
||||
text10: `يعرض التصنيف فقط أفضل 30`,
|
||||
text11: `التصنيف`,
|
||||
text12: `المكافآت`,
|
||||
text13: `الربيع`,
|
||||
text14: `الصيف`,
|
||||
text15: `الخريف`,
|
||||
text16: `الشتاء`,
|
||||
text17: `هذا النشاط لا علاقة له بـ Apple`,
|
||||
text18: `خلف`,
|
||||
text19: `شاغر`,
|
||||
text20: `سجل قمة الوكالة`,
|
||||
text21: `أكثر وكالة <br>ثباتًا`,
|
||||
text22: `أقوى وكالة <br>في التاريخ`,
|
||||
text23: `وكالة وصلت إلى SS أو S لثلاثة أشهر متتالية`,
|
||||
}
|
||||
|
||||
}
|
||||
|
@@ -3,25 +3,28 @@ langEn = {
|
||||
layerIndex1: `Loading...`,
|
||||
layerIndex2: `Success`,
|
||||
layerIndex3: `Network error`,
|
||||
text1: `SS Guild Conpetition`,
|
||||
text2: `Activity Time:`,
|
||||
text3: `Day`,
|
||||
text4: `Hour`,
|
||||
text5: `Min`,
|
||||
text6: `Sec`,
|
||||
text7: `Each guild will compete for guild honors by completing specific tasks and challenges to receive a specified ability value for hosting an event within 30 days to earn entries. These honors will be
|
||||
displayed in the ranking list and on the anchor's homepage.`,
|
||||
text8: `Guild`,
|
||||
text9: `Mine`,
|
||||
text10: `Guild Nick:`,
|
||||
text11: `Guild ID:`,
|
||||
text12: `Anchor Nick:`,
|
||||
text13: `Anchor ID:`,
|
||||
text14: `My Diamond Flow:`,
|
||||
text15: `Available Reward Gold:`,
|
||||
text16: `This activity has nothing to do with apple`,
|
||||
text17: `Vacant`,
|
||||
img1: `./images/page1Rule-en.png`,
|
||||
img2: `./images/page2Rule-en.png`,
|
||||
text1: `SS Agency Competition`,
|
||||
text2: `Days`,
|
||||
text3: `Hours`,
|
||||
text4: `Mins`,
|
||||
text5: `Secs`,
|
||||
text6: `SS peak`,
|
||||
text7: `Monthly`,
|
||||
text8: `Quarter`,
|
||||
text9: `Year`,
|
||||
text10: `Ranking only shows the Top 30`,
|
||||
text11: `Ranking`,
|
||||
text12: `Rewards`,
|
||||
text13: `Spring`,
|
||||
text14: `Summer`,
|
||||
text15: `Autumn`,
|
||||
text16: `Winter`,
|
||||
text17: `This activity has nothing to do with apple`,
|
||||
text18: `Behind`,
|
||||
text19: `Vacant`,
|
||||
text20: `Agency Peak Record`,
|
||||
text21: `Most Stable <br>Agency`,
|
||||
text22: `Historically <br>Strongest Agency`,
|
||||
text23: `Agency that have reached SS or S for three consecutive months`,
|
||||
}
|
||||
}
|
||||
|
33
view/molistar/activity/ssGuild/local/tr.js
Normal file
@@ -0,0 +1,33 @@
|
||||
// 中文
|
||||
langTr = {
|
||||
// 模塊
|
||||
demoModule: {
|
||||
layerIndex1: `Yükleniyor...`,
|
||||
layerIndex2: `Başarılı`,
|
||||
layerIndex3: `Ağ hatası`,
|
||||
text1: `SS Ajans Yarışması`,
|
||||
text2: `Gün`,
|
||||
text3: `Saat`,
|
||||
text4: `Dakika`,
|
||||
text5: `Saniye`,
|
||||
text6: `SS Zirvesi`,
|
||||
text7: `Aylık`,
|
||||
text8: `Çeyrek`,
|
||||
text9: `Yıl`,
|
||||
text10: `Sıralamada yalnızca ilk 30 gösterilir`,
|
||||
text11: `Sıralama`,
|
||||
text12: `Ödüller`,
|
||||
text13: `İlkbahar`,
|
||||
text14: `Yaz`,
|
||||
text15: `Sonbahar`,
|
||||
text16: `Kış`,
|
||||
text17: `Bu etkinliğin Apple ile ilgisi yoktur`,
|
||||
text18: `Geride`,
|
||||
text19: `Boş`,
|
||||
text20: `Ajans Zirve Kaydı`,
|
||||
text21: `En Kararlı <br>Ajans`,
|
||||
text22: `Tarihteki <br>En Güçlü Ajans`,
|
||||
text23: `Üst üste üç ay boyunca SS veya S seviyesine ulaşan ajanslar`,
|
||||
}
|
||||
|
||||
}
|
@@ -5,24 +5,29 @@ langZh = {
|
||||
layerIndex1: `加載中...`,
|
||||
layerIndex2: `成功`,
|
||||
layerIndex3: `網絡錯誤`,
|
||||
text1: `SS公会比赛`,
|
||||
text2: `活动时间:`,
|
||||
text3: `天`,
|
||||
text4: `小时`,
|
||||
text5: `分钟`,
|
||||
text6: `秒`,
|
||||
text7: `每个公会将通过完成特定任务和挑战来争夺公会荣誉,以获得在30天内举办活动的指定能力值,从而获得参赛资格。这些荣誉将显示在排名列表和主播的主页上。`,
|
||||
text8: `公会`,
|
||||
text9: `我的`,
|
||||
text10: `公会昵称:`,
|
||||
text11: `公会ID:`,
|
||||
text12: `主播昵称:`,
|
||||
text13: `主播ID:`,
|
||||
text14: `我的钻石流量:`,
|
||||
text15: `可用奖励金币:`,
|
||||
text16: `此活动与苹果无关`,
|
||||
text17: `虚位以待`,
|
||||
img1: `./images/page1Rule.png`,
|
||||
img2: `./images/page2Rule.png`,
|
||||
text1: `SS代理競賽`,
|
||||
text2: `天`,
|
||||
text3: `小時`,
|
||||
text4: `分鐘`,
|
||||
text5: `秒`,
|
||||
text6: `SS巔峰`,
|
||||
text7: `月度`,
|
||||
text8: `季度`,
|
||||
text9: `年度`,
|
||||
text10: `排行榜僅顯示前30名`,
|
||||
text11: `排行榜`,
|
||||
text12: `獎勵`,
|
||||
text13: `春季`,
|
||||
text14: `夏季`,
|
||||
text15: `秋季`,
|
||||
text16: `冬季`,
|
||||
text17: `此活動與Apple無關`,
|
||||
text18: `落後`,
|
||||
text19: `空缺`,
|
||||
text20: `代理巔峰記錄`,
|
||||
text21: `最穩定的<br>代理`,
|
||||
text22: `歷史上最強的<br>代理`,
|
||||
text23: `連續三個月達到SS或S的代理`,
|
||||
}
|
||||
|
||||
}
|
68
view/molistar/activity/ssGuild/peak.html
Normal file
@@ -0,0 +1,68 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title class="text20"></title>
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/peak.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- 頂部返回 -->
|
||||
<div class="back">
|
||||
<img src="./images/travel/back.png" alt="">
|
||||
</div>
|
||||
<!-- 头部 -->
|
||||
<div class="header">
|
||||
<div class="tab">
|
||||
<div class="act text21"></div>
|
||||
<div class="text22"></div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 文案 -->
|
||||
<div class="text text23"></div>
|
||||
<div class="t"></div>
|
||||
<div class="c">
|
||||
<ul>
|
||||
<!-- <li class="null"></li> -->
|
||||
<!-- <li class="month">
|
||||
<div class="box">
|
||||
<div class="title">January</div>
|
||||
<img src="./images/ssTitle.png" alt="" class="leveIcon">
|
||||
<div class="guileBox">
|
||||
<div class="sBox">
|
||||
<img src="./images/peakTs.png" alt="" class="ts">
|
||||
<img src="./images/logo.png" alt="" class="tx">
|
||||
<p>Name</p>
|
||||
<b>ID:0</b>
|
||||
</div>
|
||||
</div>
|
||||
<img src="./images/sTitle.png" alt="" class="leveIcon">
|
||||
<div class="guileBox">
|
||||
<div class="sBoxNull"></div>
|
||||
</div>
|
||||
</div>
|
||||
</li> -->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="b"></div>
|
||||
<!-- 免责声明 -->
|
||||
<div class="activityText activityTextAct text17"></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="../../common/js/svga.min.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/peak.js"></script>
|
||||
<script src="../../common/local/langHandler.js"></script>
|
@@ -34,10 +34,10 @@ function initLocalLang() {
|
||||
window.lang.code = 'id'
|
||||
window.lang.defaults = false
|
||||
} else if (lang === 'tr' || window.location.href.match('=tr')) {
|
||||
if (window.location.href.match('dailyConsumption') || window.location.href.match('2024-cpActive') || window.location.href.match('superLucky') || window.location.href.match('newRank') || window.location.href.match('roomLevel') || window.location.href.match('rechargeNew') || window.location.href.match('2024-newYear') || window.location.href.match('guild-ar') || window.location.href.match('2024-invitationFission') || window.location.href.match('inform') || window.location.href.match('superId') || window.location.href.match('newWeekStar') || window.location.href.match('home') || window.location.href.match('pay')) {
|
||||
if (window.location.href.match('ssGuild') || window.location.href.match('dailyConsumption') || window.location.href.match('2024-cpActive') || window.location.href.match('superLucky') || window.location.href.match('newRank') || window.location.href.match('roomLevel') || window.location.href.match('rechargeNew') || window.location.href.match('2024-newYear') || window.location.href.match('guild-ar') || window.location.href.match('2024-invitationFission') || window.location.href.match('inform') || window.location.href.match('superId') || window.location.href.match('newWeekStar') || window.location.href.match('home') || window.location.href.match('pay')) {
|
||||
window.location.href.match('superLucky') ||
|
||||
// 土耳其
|
||||
console.log("langHandler" + '土耳其')
|
||||
// 土耳其
|
||||
console.log("langHandler" + '土耳其')
|
||||
window.lang = langTr
|
||||
window.lang.code = 'tr'
|
||||
window.lang.defaults = false
|
||||
|