yinmeng/yinmeng-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: yinmeng:2023-halloween
Branches Tags
yinmeng:master yinmeng:childrenDay yinmeng:cityLove yinmeng:development yinmeng:turn yinmeng:billiard yinmeng:2024-aprilFoolsDay yinmeng:identity yinmeng:2024-whiteLove yinmeng:goddessesDay yinmeng:luckGiftStyle yinmeng:2024-lover yinmeng:2024-yearBenefits yinmeng:giftWallRule yinmeng:2023-year yinmeng:2023-christmas yinmeng:spacTimeLuck yinmeng:rank yinmeng:report yinmeng:anchorBattle yinmeng:2023-ruffian yinmeng:level yinmeng:2023-halloween yinmeng:midAutumnFestival yinmeng:luckGiftText yinmeng:gold yinmeng:2023-qx yinmeng:switch yinmeng:privilegeCardRule yinmeng:myBenefits yinmeng:recharge
...
pull from: yinmeng:anchorBattle
Branches Tags
yinmeng:master yinmeng:childrenDay yinmeng:cityLove yinmeng:development yinmeng:turn yinmeng:billiard yinmeng:2024-aprilFoolsDay yinmeng:identity yinmeng:2024-whiteLove yinmeng:goddessesDay yinmeng:luckGiftStyle yinmeng:2024-lover yinmeng:2024-yearBenefits yinmeng:giftWallRule yinmeng:2023-year yinmeng:2023-christmas yinmeng:spacTimeLuck yinmeng:rank yinmeng:report yinmeng:anchorBattle yinmeng:2023-ruffian yinmeng:level yinmeng:2023-halloween yinmeng:midAutumnFestival yinmeng:luckGiftText yinmeng:gold yinmeng:2023-qx yinmeng:switch yinmeng:privilegeCardRule yinmeng:myBenefits yinmeng:recharge

17 Commits
2023-hallo ... anchorBatt

Author SHA1 Message Date
Dragon
fe010cd895 修改活动结束时间异常问题以及跳转房间问题 2023-11-15 14:31:44 +08:00
Dragon
cfb313281a 修复前三点击榜单跳转房间失败问题 2023-11-15 10:01:11 +08:00
Dragon
a12e981819 修复活动结束时间异常问题 2023-11-15 09:56:42 +08:00
Dragon
b236f214a5 新增跳转房间 2023-11-14 19:03:47 +08:00
Dragon
d0fd6d585c 完成房间pk榜单 2023-11-14 18:20:03 +08:00
Dragon
2e8e627fad 房间pk暂存 2023-11-14 16:24:19 +08:00
Dragon
b3b3b86926 修复切换异常问题 2023-11-07 10:28:22 +08:00
Dragon
3e4779fac1 修改文案 2023-11-07 10:22:48 +08:00
Dragon
37e605586d 替换规则 2023-11-06 15:49:11 +08:00
Dragon
a158346bc8 调淡加载层 2023-11-06 15:28:41 +08:00
Dragon
f6503b1abf 修复榜单数据异常 2023-11-06 15:28:41 +08:00
Dragon
fc14cc913e 压缩图片 2023-11-06 15:28:41 +08:00
Dragon
883613b6c5 完成双十一活动 2023-11-06 15:28:39 +08:00
Dragon
2f1580d3ad 修改ios版本判断条件 2023-11-06 15:25:28 +08:00
Dragon
b9873129a0 解除注释代码 2023-11-06 15:17:11 +08:00
Dragon
3be5b8be3f 魅力等级新增版本区分 2023-11-06 15:16:02 +08:00
Dragon
cbaf037639 替换ui 2023-10-27 16:26:12 +08:00
71 changed files with 3053 additions and 79 deletions
Expand all files Collapse all files

545
view/yinmeng/activity/2023-anchorBattle/css/index.css Normal file
View File

@@ -0,0 +1,545 @@
.layui-m-layershade {
background-color: rgba(0, 0, 0, 0.3) !important;
}
body {
width: 10rem;
height: 49.29333rem;
background: url(../images/bg.png) no-repeat;
background-size: 100% 100%;
overflow-y: scroll;
position: relative;
}
.back {
position: fixed;
top: 0.93333rem;
left: 0.45333rem;
z-index: 99;
width: 0.82667rem;
height: 0.82667rem;
}
.back img {
width: 100%;
height: 100%;
}
.back p {
color: #fff;
font-size: 0.42667rem;
position: absolute;
width: 9rem;
left: 0;
top: 0;
height: 100%;
text-align: center;
line-height: 0.82667rem;
}
.rule_icon {
width: 1.74667rem;
height: 1.86667rem;
position: absolute;
top: 9.41333rem;
right: 0rem;
}
.time {
width: 7.89333rem;
height: 1.21333rem;
background: url(../images/time.png) no-repeat;
background-size: 100% 100%;
position: absolute;
top: 11.18667rem;
left: 50%;
transform: translateX(-50%);
}
.time span {
color: #320959;
font-size: 0.32rem;
font-weight: bold;
position: absolute;
height: 0.4rem;
line-height: 0.35rem;
width: 0.55rem;
top: 0.2rem;
text-align: center;
}
.time .sp1 {
left: 3.37rem;
}
.time .sp2 {
left: 4.3rem;
}
.time .sp3 {
left: 5.22rem;
}
.time .sp4 {
left: 6.13rem;
}
.title {
width: 4.49333rem;
height: 1.02667rem;
position: relative;
top: 12.1rem;
left: 50%;
transform: translateX(-50%);
}
.timeOut {
width: 7.89333rem;
height: 1.21333rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 11.18667rem;
display: none;
}
.tab {
width: 8.70667rem;
position: absolute;
top: 13.22667rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
}
.tab div {
width: 2.86667rem;
height: 1.16rem;
}
.tab .tab1 {
background: url(../images/tab1.png) no-repeat;
background-size: 100% 100%;
}
.tab .tab2 {
background: url(../images/tab2.png) no-repeat;
background-size: 100% 100%;
}
.tab .tab3 {
background: url(../images/tab3.png) no-repeat;
background-size: 100% 100%;
}
.tab .act1 {
background: url(../images/tabAct1.png) no-repeat;
background-size: 100% 100%;
}
.tab .act2 {
background: url(../images/tabAct2.png) no-repeat;
background-size: 100% 100%;
}
.tab .act3 {
background: url(../images/tabAct3.png) no-repeat;
background-size: 100% 100%;
}
.timeOutTab {
width: 2.86667rem;
height: 1.16rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 13.22667rem;
display: none;
}
.text {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.33333rem;
position: absolute;
top: 14.8rem;
left: 0;
}
.top3 {
width: 8.85333rem;
height: 2.78667rem;
background: url(../images/top3Box.png) no-repeat;
background-size: 100% 100%;
position: relative;
margin: 17.6rem auto 0.05333rem;
}
.top3 .no1 {
width: 3.14667rem;
height: 3.54667rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -3.41333rem;
}
.top3 .no1 .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.top3 .no1 .tx {
width: 2.17333rem;
height: 2.17333rem;
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
.top3 .no1 p {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 500;
position: absolute;
left: 0;
top: 4.26667rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.top3 .no1 span {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 4.93333rem;
}
.top3 .no1 b {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 5.4rem;
}
.top3 .no1 b i {
font-style: normal;
}
.top3 .no2 {
width: 2.8rem;
height: 3.14667rem;
position: absolute;
left: 0;
top: -2.4rem;
}
.top3 .no2 .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.top3 .no2 .tx {
width: 1.93333rem;
height: 1.93333rem;
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
.top3 .no2 p {
width: 90%;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 500;
position: absolute;
left: 0.13333rem;
top: 3.73333rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.top3 .no2 span {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 4.26667rem;
}
.top3 .no2 b {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 4.66667rem;
}
.top3 .no2 b i {
font-style: normal;
}
.top3 .no3 {
width: 2.8rem;
height: 3.14667rem;
position: absolute;
right: 0;
top: -2.4rem;
}
.top3 .no3 .ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.top3 .no3 .tx {
width: 1.93333rem;
height: 1.93333rem;
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
.top3 .no3 p {
width: 90%;
text-align: center;
color: #fff;
font-size: 0.42667rem;
font-weight: 500;
position: absolute;
left: 0.26667rem;
top: 3.73333rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.top3 .no3 span {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 4.26667rem;
}
.top3 .no3 b {
width: 100%;
text-align: center;
color: #fff;
font-size: 0.26667rem;
text-align: center;
position: absolute;
left: 0;
top: 4.66667rem;
}
.top3 .no3 b i {
font-style: normal;
}
.list {
width: 8.85333rem;
height: 25.8rem;
margin: 0 auto;
}
.list li {
width: 100%;
height: 2.08rem;
margin-bottom: 0.08rem;
background: url(../images/liBg.png) no-repeat;
background-size: 100% 100%;
box-sizing: border-box;
padding: 0 0.2rem 0 0.6rem;
}
.list li .num {
width: 0.53333rem;
height: 100%;
line-height: 2.08rem;
color: #fff;
font-size: 0.46667rem;
font-weight: 500;
float: left;
margin-right: 0.30667rem;
}
.list li .tx {
width: 1.17333rem;
height: 1.17333rem;
border-radius: 50%;
background: url(../images/liTx.png) no-repeat;
background-size: 100% 100%;
display: block;
float: left;
margin-top: 0.44rem;
margin-right: 0.34667rem;
}
.list li .box {
width: 2.8rem;
float: left;
color: #fff;
font-size: 0.34667rem;
font-weight: 500;
}
.list li .box p {
width: 100%;
margin-top: 0.6rem;
margin-bottom: 0.14667rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.list li .score {
float: right;
height: 100%;
line-height: 2.08rem;
color: #fff;
font-size: 0.34667rem;
}
.txt {
width: 100%;
text-align: center;
position: absolute;
left: 0;
color: #FFFFFF;
font-size: 0.28rem;
font-weight: 500;
top: 48.68rem;
}
.rule {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 99;
display: none;
}
.rule .rule_in {
width: 8.68rem;
height: 13.88rem;
background: url(../images/ruleBg.png) no-repeat;
background-size: 100% 100%;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.rule .rule_in .tabs {
width: 7.04rem;
height: 1.86667rem;
display: flex;
justify-content: space-between;
position: absolute;
top: 0.54667rem;
left: 50%;
transform: translateX(-50%);
}
.rule .rule_in .tabs div {
width: 3.33333rem;
height: 1.86667rem;
}
.rule .rule_in .tabs .tab1 {
background: url(../images/ruletab1.png) no-repeat;
background-size: 100% 100%;
}
.rule .rule_in .tabs .tab2 {
background: url(../images/ruletab2.png) no-repeat;
background-size: 100% 100%;
}
.rule .rule_in .tabs .ruletabActs1 {
background: url(../images/ruletabAct1.png) no-repeat;
background-size: 100% 100%;
}
.rule .rule_in .tabs .ruletabActs2 {
background: url(../images/ruletabAct2.png) no-repeat;
background-size: 100% 100%;
}
.rule .rule_in .box1,
.rule .rule_in .box2 {
width: 8rem;
height: 10.68rem;
overflow-y: scroll;
position: absolute;
top: 2.38667rem;
left: 50%;
transform: translateX(-50%);
}
.rule .rule_in .box1::-webkit-scrollbar,
.rule .rule_in .box2::-webkit-scrollbar {
width: 0;
display: none;
}
.rule .rule_in .box1 img,
.rule .rule_in .box2 img {
display: block;
width: 100%;
height: 23.98667rem;
}
.rule .rule_in .box2 {
display: none;
}
.rule .rule_in .box2 img {
height: 10.68rem;
}

547
view/yinmeng/activity/2023-anchorBattle/css/index.scss Normal file
View File

@@ -0,0 +1,547 @@
@function px2rem($px) {
@return $px / 75+rem;
}
.layui-m-layershade {
background-color: rgba(0, 0, 0, .3) !important;
}
body {
width: px2rem(750);
height: px2rem(3697);
background: url(../images/bg.png) no-repeat;
background-size: 100% 100%;
overflow-y: scroll;
position: relative;
}
.back {
position: fixed;
top: px2rem(70);
left: px2rem(34);
z-index: 99;
width: px2rem(62);
height: px2rem(62);
img {
width: 100%;
height: 100%;
}
p {
color: #fff;
font-size: px2rem(32);
position: absolute;
width: 9rem;
left: 0;
top: 0;
height: 100%;
text-align: center;
line-height: px2rem(62);
}
}
.rule_icon {
width: px2rem(131);
height: px2rem(140);
position: absolute;
top: px2rem(706);
right: px2rem(0);
}
.time {
width: px2rem(592);
height: px2rem(91);
background: url(../images/time.png) no-repeat;
background-size: 100% 100%;
position: absolute;
top: px2rem(839);
left: 50%;
transform: translateX(-50%);
span {
color: #320959;
font-size: px2rem(24);
font-weight: bold;
position: absolute;
height: 0.4rem;
line-height: 0.35rem;
width: 0.55rem;
top: 0.2rem;
text-align: center;
}
.sp1 {
left: 3.37rem;
}
.sp2 {
left: 4.3rem;
}
.sp3 {
left: 5.22rem;
}
.sp4 {
left: 6.13rem;
}
}
.title {
width: px2rem(337);
height: px2rem(77);
position: relative;
top: 12.1rem;
left: 50%;
transform: translateX(-50%);
}
.timeOut {
width: px2rem(592);
height: px2rem(91);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(839);
display: none;
}
.tab {
width: px2rem(653);
position: absolute;
top: px2rem(992);
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
div {
width: px2rem(215);
height: px2rem(87);
}
.tab1 {
background: url(../images/tab1.png) no-repeat;
background-size: 100% 100%;
}
.tab2 {
background: url(../images/tab2.png) no-repeat;
background-size: 100% 100%;
}
.tab3 {
background: url(../images/tab3.png) no-repeat;
background-size: 100% 100%;
}
.act1 {
background: url(../images/tabAct1.png) no-repeat;
background-size: 100% 100%;
}
.act2 {
background: url(../images/tabAct2.png) no-repeat;
background-size: 100% 100%;
}
.act3 {
background: url(../images/tabAct3.png) no-repeat;
background-size: 100% 100%;
}
}
.timeOutTab {
width: px2rem(215);
height: px2rem(87);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(992);
display: none;
}
.text {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(25);
position: absolute;
top: px2rem(1110);
left: 0;
}
.top3 {
width: px2rem(664);
height: px2rem(209);
background: url(../images/top3Box.png) no-repeat;
background-size: 100% 100%;
position: relative;
margin: 17.6rem auto px2rem(4);
.no1 {
width: px2rem(236);
height: px2rem(266);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(-256);
.ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(163);
height: px2rem(163);
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
p {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 500;
position: absolute;
left: 0;
top: px2rem(320);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(370);
}
b {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(405);
i {
font-style: normal;
}
}
}
.no2 {
width: px2rem(210);
height: px2rem(236);
position: absolute;
left: 0;
top: -2.4rem;
.ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(145);
height: px2rem(145);
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
p {
width: 90%;
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 500;
position: absolute;
left: px2rem(10);
top: px2rem(280);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(320);
}
b {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(350);
i {
font-style: normal;
}
}
}
.no3 {
width: px2rem(210);
height: px2rem(236);
position: absolute;
right: 0;
top: -2.4rem;
.ts {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(145);
height: px2rem(145);
border-radius: 50%;
position: absolute;
top: 0.73rem;
left: 50%;
transform: translateX(-50%);
}
p {
width: 90%;
text-align: center;
color: #fff;
font-size: px2rem(32);
font-weight: 500;
position: absolute;
left: px2rem(20);
top: px2rem(280);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(320);
}
b {
width: 100%;
text-align: center;
color: #fff;
font-size: px2rem(20);
text-align: center;
position: absolute;
left: 0;
top: px2rem(350);
i {
font-style: normal;
}
}
}
}
.list {
width: px2rem(664);
height: 25.8rem;
margin: 0 auto;
li {
width: 100%;
height: px2rem(156);
margin-bottom: px2rem(6);
background: url(../images/liBg.png) no-repeat;
background-size: 100% 100%;
box-sizing: border-box;
padding: 0 px2rem(15) 0 px2rem(45);
.num {
width: px2rem(40);
height: 100%;
line-height: px2rem(156);
color: #fff;
font-size: px2rem(35);
font-weight: 500;
float: left;
margin-right: px2rem(23);
}
.tx {
width: px2rem(88);
height: px2rem(88);
border-radius: 50%;
background: url(../images/liTx.png) no-repeat;
background-size: 100% 100%;
display: block;
float: left;
margin-top: px2rem(33);
margin-right: px2rem(26);
}
.box {
width: px2rem(210);
float: left;
color: #fff;
font-size: px2rem(26);
font-weight: 500;
p {
width: 100%;
margin-top: px2rem(45);
margin-bottom: px2rem(11);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.score {
float: right;
height: 100%;
line-height: px2rem(156);
color: #fff;
font-size: px2rem(26);
}
}
}
.txt {
width: 100%;
text-align: center;
position: absolute;
left: 0;
color: #FFFFFF;
font-size: px2rem(21);
font-weight: 500;
top: px2rem(3651);
}
.rule {
position: fixed;
left: 0;
top: 0;
bottom: 0;
right: 0;
background: rgba(0, 0, 0, .5);
z-index: 99;
display: none;
.rule_in {
width: px2rem(651);
height: px2rem(1041);
background: url(../images/ruleBg.png) no-repeat;
background-size: 100% 100%;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
.tabs {
width: px2rem(528);
height: px2rem(140);
display: flex;
justify-content: space-between;
position: absolute;
top: px2rem(41);
left: 50%;
transform: translateX(-50%);
div {
width: px2rem(250);
height: px2rem(140);
}
.tab1 {
background: url(../images/ruletab1.png) no-repeat;
background-size: 100% 100%;
}
.tab2 {
background: url(../images/ruletab2.png) no-repeat;
background-size: 100% 100%;
}
.ruletabActs1 {
background: url(../images/ruletabAct1.png) no-repeat;
background-size: 100% 100%;
}
.ruletabActs2 {
background: url(../images/ruletabAct2.png) no-repeat;
background-size: 100% 100%;
}
}
.box1,
.box2 {
width: px2rem(600);
height: px2rem(801);
overflow-y: scroll;
position: absolute;
top: px2rem(179);
left: 50%;
transform: translateX(-50%);
&::-webkit-scrollbar {
width: 0;
display: none;
}
img {
display: block;
width: 100%;
height: px2rem(1799);
}
}
.box2 {
display: none;
img {
height: px2rem(801);
}
}
}
}

BIN
view/yinmeng/activity/2023-anchorBattle/images/bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 MiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/liBg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/liTx.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/no1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 157 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/no2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 136 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/no3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 134 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruleBg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 91 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruleBgIn.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruleBgIn2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 562 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/rule_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 80 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruletab1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruletab2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruletabAct1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 77 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/ruletabAct2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 76 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tab1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tab2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tab3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 69 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tabAct1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 85 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tabAct2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/tabAct3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 75 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/time.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 148 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/timeOut.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 71 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/timeOutTab.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/title.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 143 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/top3Box.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 132 KiB

BIN
view/yinmeng/activity/2023-anchorBattle/images/travel/back.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

102
view/yinmeng/activity/2023-anchorBattle/index.html Normal file
View File

@@ -0,0 +1,102 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>榜首争夺战</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<!-- 顶部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
</div>
<!-- 活动规则icon -->
<img src="./images/rule_icon.png" alt="" class="rule_icon">
<!-- 倒计时 -->
<div class="time">
<span class="sp1">00</span>
<span class="sp2">00</span>
<span class="sp3">00</span>
<span class="sp4">00</span>
</div>
<!-- 倒计时结束时间标题 -->
<img src="./images/timeOut.png" alt="" class="timeOut">
<!-- 标题 -->
<img src="./images/title.png" alt="" class="title">
<!-- 切换 -->
<div class="tab">
<div class="tab1"></div>
<div class="tab2 act2"></div>
<div class="tab3"></div>
</div>
<!-- 时间结束展示tab -->
<img src="./images/timeOutTab.png" alt="" class="timeOutTab">
<p class="text">­1钻=1闪耀值，闪耀榜前三获得本次活动奖励</p>
<!-- 前三 -->
<div class="top3">
<div class="no no1">
<img src="./images/no1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<p></p>
<span></span>
<b>闪耀值:<i>0</i></b>
</div>
<div class="no no2">
<img src="./images/no2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<p></p>
<span></span>
<b>闪耀值:<i>0</i></b>
</div>
<div class="no no3">
<img src="./images/no3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<p></p>
<span></span>
<b>闪耀值:<i>0</i></b>
</div>
</div>
<!-- 非前三 -->
<ul class="list">
<li>
<div class="num">44</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="box">
<p>房间名称</p>
<span>ID: 1234</span>
</div>
<div class="score">闪耀值: 123456</div>
</li>
</ul>
<!-- 免责声明 -->
<p class="txt">本活动与Apple inc.无关</p>
<!-- 规则弹窗 -->
<div class="rule">
<div class="rule_in">
<div class="tabs">
<div class="tab1 ruletabActs1"></div>
<div class="tab2"></div>
</div>
<div class="box1">
<img src="./images/ruleBgIn.png" alt="">
</div>
<div class="box2">
<img src="./images/ruleBgIn2.png" alt="">
</div>
</div>
</div>
</body>
</html>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<!-- <script src="./js/wow.js"></script> -->
<script src="./js/index.js"></script>

239
view/yinmeng/activity/2023-anchorBattle/js/index.js Normal file
View File

@@ -0,0 +1,239 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封装layer消息提醒框
let layerIndex
const showLoading = (content = '加载中...') => {
layer.open({
type: 2,
shadeClose: false,
content,
success (e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = '操作完成', time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var leftTime;//倒计时暂存
var timeOut2;//倒计时暂存
var rankType = 1;//1日榜2总榜
var date;//日期
var dateArr = [];//存放昨日和今日时间
// 初始化函数
$(function () {
getInfoFromClient()
setTimeout(function () {
// 页面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 顶部返回事件
$('.back').click(() => {
if (browser.android) {
window.androidJsObj.closeWebView()
} else {
window.webkit.messageHandlers.closeWebView.postMessage(null)
}
})
getRank(rankType, date);
}, 100)
})
// 获取榜单接口
function getRank (rankType, date) {
$('.list li').remove();
showLoading()
networkRequest({
type: 'get',
url: urlPrefix + '/act/2023RoomPk/rank/getRank',
data: { rankType, date },
success (res) {
if (res.code === 200) {
// 处理倒计时
if (rankType == 1) {
const curTime = res.timestamp
var endTime = null;
if (browser.ios) {
endTime = (new Date(`${res.data.dateList[res.data.dateList.length - 1]} 11:59:59`.replace(/-/g, "/")).getTime())
} else {
endTime = (new Date(`${res.data.dateList[res.data.dateList.length - 1]} 11:59:59`).getTime())
}
leftTime = endTime - res.timestamp;
const hadEnd = (endTime - curTime) <= 0
if (hadEnd) {
rankType = 2;
date = null;
getRank(rankType, date)
return
}
}
countup();
dateArr[0] = dateFormat(res.timestamp - 86400000, 'yyyy-MM-dd');
dateArr[1] = dateFormat(res.timestamp, 'yyyy-MM-dd');
// 处理前三
var top3 = res.data.rankList.slice(0, 3);
var notTop3 = res.data.rankList.slice(3);
if (top3.length < 3) {
let arr = new Array(3 - top3.length).fill({
avatar: './images/logo.png',
nick: '虚位以待',
erbanNo: 'ID:虚位以待',
score: " 0"
})
top3.push(...arr)
}
top3.forEach((res, i) => {
$(`.top3 .no${i + 1} .ts`).attr('uid', res.uid);
$(`.top3 .no${i + 1} .tx`).attr('src', res.avatar);
$(`.top3 .no${i + 1} p`).text(res.nick);
$(`.top3 .no${i + 1} span`).text(res.erbanNo);
$(`.top3 .no${i + 1} b i`).text(unitProcessing(res.score, 10000, 1, 'w'));
})
// 非前三
var str = '';
notTop3.forEach((res, i) => {
str += `
<li>
<div class="num">${res.ranking}</div>
<img src="${res.avatar}" uid=${res.uid} alt="" class="tx">
<div class="box">
<p>${res.nick}</p>
<span>ID: ${res.erbanNo}</span>
</div>
<div class="score">闪耀值: ${unitProcessing(res.score, 10000, 1, 'w')}</div>
</li>
`
})
$('.list').append(str);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('网络错误，请退出重进')
}
})
}
// 榜单切换
$('.tab div').click(function () {
var i = $(this).index() + 1;
rankType = i == 1 || i == 2 ? 1 : 2;
$('.tab div').removeClass('act1').removeClass('act3').removeClass('act2');
$(this).addClass(`act${i}`);
if (i == 1 || i == 2) {
date = dateArr[i - 1];
} else {
date = null;
}
getRank(rankType, date);
})
// 规则tab切换
$('.rule .rule_in .tabs div').click(function () {
var i = $(this).index() + 1;
$('.rule .rule_in .tabs div').removeClass('ruletabActs1').removeClass('ruletabActs2');
$('.rule .rule_in .box1, .rule .rule_in .box2').hide();
$(this).addClass(`ruletabActs${i}`);
if (i == 1) {
$('.rule .rule_in .box1').show();
} else {
$('.rule .rule_in .box2').show();
}
return false
})
// 打开规则
$('.rule_icon').click(function () {
$('.rule').show();
bodyScroolFun(true);
})
// 关闭规则
$('.rule').click(function () {
$(this).hide();
bodyScroolFun(false);
})
// 倒计时
function countup () {
clearTimeout(timeOut2)
//获取当前时间
// var now = nowTime;
var d = 0;
var h = 0;
var m = 0;
var s = 0;
//定义变量 d,h,m,s保存倒计时的时间
var d, h, m, s;
//递归每秒调⽤countTime⽅法，显⽰动态时间效果
if (leftTime >= 0 && leftTime < 1000) {
rankType = 2;
date = null;
getRank(rankType, date);
} else if (leftTime > 1000) {
d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
s = getzf(Math.floor(leftTime / 1000 % 60));
//将倒计时赋值到div中
$('.time .sp1').text(d);
$('.time .sp2').text(h);
$('.time .sp3').text(m);
$('.time .sp4').text(s);
} else {
//todo 展示活动已结束
$('.timeOutTab').show();
$('.timeOut').show();
$('.tab').hide();
$('.time').hide();
}
if (leftTime > 0){
leftTime = leftTime - 1000;
}
timeOut2 = setTimeout(countup, 1000);
}
//补0操作
function getzf (num) {
if (parseInt(num) < 10) {
num = '0' + num;
}
return num;
}
// 点击前三按钮
$('.top3 .no .ts').on('click', function () {
var uid = $(this).attr('uid');
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(uid);
}
}
})
// 点击非前三按钮
$('.list').on('click', 'li .tx', function () {
var uid = $(this).attr('uid');
console.log(uid);
if (browser.ios) {
window.webkit.messageHandlers.openRoom.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openRoom(uid);
}
}
})

46
view/yinmeng/activity/2023-anchorBattle/js/wow.js Normal file
View File

@@ -0,0 +1,46 @@
var baba = document.querySelector('body');
baba.addEventListener('click', function (e) {
// $('body,html').css({ "width": "100%", "position": "relative", "overflow": "hidden" });
tianJia(e);
})
var erZi = [];
function tianJia (e) {
var sunZi = document.createElement('div');
sunZi.className = 'rabbit';
// sunZi.innerHTML = '<i class="iconfont icon-tuzi"></i>';
sunZi.innerHTML = '<img src="./images/love.png" alt="">';
baba.appendChild(sunZi);
erZi.push({
el: sunZi,
top: e.pageY - 30,
left: e.pageX - 20,
opacity: 1,
scale: 1,
color: `rgb(${255 * Math.random()},${255 * Math.random()},${255 * Math.random()})`
});
move();
};
function move () {
for (var i = 0; i < erZi.length; i++) {
if (erZi[i].opacity <= 0) {
baba.removeChild(erZi[i].el);
erZi.splice(i, 1);
return;
}
erZi[i].top--;
erZi[i].opacity = erZi[i].opacity - 0.04;
// erZi[i].scale = erZi[i].scale + 0.0001;
erZi[i].el.style.cssText = `
top: ${erZi[i].top}px;
left: ${erZi[i].left}px;
color: ${erZi[i].color};
opacity: ${erZi[i].opacity};
transform: scale(${erZi[i].scale});
position: absolute;
`
}
window.requestAnimationFrame(move);
// $('body,html').css({ "width": "100%", "position": "relative", "overflow": "auto" });
}

8
view/yinmeng/activity/2023-halloween/css/index.css
View File

@@ -102,7 +102,7 @@ body::-webkit-scrollbar {
.giftBox {
width: 9.2rem;
height: 5.96rem;
height: 6.49333rem;
background: url(../images/giftBox.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 0.06667rem;
@@ -111,9 +111,9 @@ body::-webkit-scrollbar {
}
.giftBox .swiper {
width: 6.56rem;
height: 4rem;
margin: 1.48rem auto 0;
width: 8.02667rem;
height: 4.85333rem;
margin: 1.45333rem auto 0;
}
.page1 {

8
view/yinmeng/activity/2023-halloween/css/index.scss
View File

@@ -110,7 +110,7 @@ body {
.giftBox {
width: px2rem(690);
height: px2rem(447);
height: px2rem(487);
background: url(../images/giftBox.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto px2rem(5);
@@ -118,9 +118,9 @@ body {
overflow: hidden;
.swiper {
width: px2rem(492);
height: px2rem(300);
margin: px2rem(111) auto 0;
width: px2rem(602);
height: px2rem(364);
margin: px2rem(109) auto 0;
}
}

BIN
view/yinmeng/activity/2023-halloween/images/gift1.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 99 KiB

BIN
view/yinmeng/activity/2023-halloween/images/gift2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 76 KiB

BIN
view/yinmeng/activity/2023-halloween/images/giftBox.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 97 KiB

553
view/yinmeng/activity/2023-ruffian/css/index.css Normal file
View File

@@ -0,0 +1,553 @@
html,
body {
width: 100%;
background: linear-gradient(0deg, #EBC8FA 0%, #FCB0EB 99%);
}
.rabbit {
z-index: 999;
}
.back {
position: fixed;
top: 0.93333rem;
left: 0.45333rem;
z-index: 99;
width: 0.82667rem;
height: 0.82667rem;
}
.back img {
width: 100%;
height: 100%;
}
.back p {
color: #fff;
font-size: 0.42667rem;
position: absolute;
width: 9rem;
left: 0;
top: 0;
height: 100%;
text-align: center;
line-height: 0.82667rem;
}
.header {
width: 10rem;
height: 10.6rem;
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 0;
position: relative;
z-index: 2;
}
.header .giftBox {
width: 8.82667rem;
height: 3.2rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 5.97333rem;
}
.header .tab {
width: 6.4rem;
height: 1.10667rem;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 9.52rem;
display: flex;
justify-content: space-between;
}
.header .tab div {
width: 2.82667rem;
height: 1.10667rem;
line-height: 1.10667rem;
color: #F1E8F6;
font-size: 0.37333rem;
text-align: center;
background: url(../images/tab.png) no-repeat;
background-size: 100%, 100%;
}
.header .tab .active {
background: url(../images/tab_active.png) no-repeat;
background-size: 100%, 100%;
}
.header .rule_iaon {
width: 1.6rem;
height: 0.74667rem;
line-height: 0.62667rem;
text-align: center;
text-indent: 15px;
color: #fff;
font-size: 0.24rem;
position: absolute;
right: 0rem;
top: 5.33333rem;
background: url(../images/rule_icon.png) no-repeat;
background-size: 100% 100%;
}
.page1 .activity1 {
width: 10rem;
height: 11.89333rem;
background: url(../images/activity1Bg.png) no-repeat;
background-size: 100% 100%;
margin: -0.57333rem auto 0.12rem;
position: relative;
}
.page1 .activity1 div {
position: absolute;
right: 1rem;
width: 2rem;
height: 0.81333rem;
line-height: 0.64rem;
text-align: center;
font-size: 0.28rem;
color: #E7FEFF;
background: url(../images/lqOut.png) no-repeat;
background-size: 100% 100%;
}
.page1 .activity1 .but1 {
top: 3.01333rem;
}
.page1 .activity1 .but2 {
top: 5.36rem;
}
.page1 .activity1 .but3 {
top: 7.72rem;
}
.page1 .activity1 .but4 {
top: 10.06667rem;
}
.page1 .activity1 .out {
background: url(../images/lq.png) no-repeat;
background-size: 100% 100%;
}
.page1 .activity2 {
width: 10rem;
height: 17.8rem;
margin: 0 auto 0;
display: block;
}
.page2 {
display: none;
}
.page2 .listTab {
width: 9.2rem;
height: 1.22667rem;
margin: 0.4rem auto 0;
display: flex;
justify-content: space-between;
}
.page2 .listTab div {
width: 4.6rem;
height: 100%;
text-align: center;
color: #F1E8F6;
font-size: 0.32rem;
line-height: 1.41333rem;
background: url(../images/listTab.png) no-repeat;
background-size: 100% 100%;
}
.page2 .listTab .active {
font-size: 0.4rem;
line-height: 1.22667rem;
background: url(../images/listTabActive.png) no-repeat;
background-size: 100% 100%;
}
.page2 .listBg {
width: 9.2rem;
min-height: 17rem;
margin: 0 auto 0.5rem;
background: linear-gradient(0deg, #B483D7 0%, #AD61FA 48%, #CB80FB 100%);
border-radius: 0 0 0.26667rem 0.26667rem;
overflow: hidden;
}
.page2 .listBg .dayTab {
width: 7.53333rem;
height: 0.88rem;
display: flex;
justify-content: space-between;
margin: 0.58667rem auto 0.36rem;
}
.page2 .listBg .dayTab div {
width: 2.22667rem;
height: 0.88rem;
line-height: 0.90667rem;
text-align: center;
color: #F1E8F6;
font-size: 0.29333rem;
background: url(../images/dayTab.png) no-repeat;
background-size: 100% 100%;
}
.page2 .listBg .dayTab .active {
background: url(../images/dayTab_active.png) no-repeat;
background-size: 100% 100%;
}
.page2 .listBg .topBox {
width: 8.85333rem;
height: 7.57333rem;
background: url(../images/topBox.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 0;
position: relative;
}
.page2 .listBg .topBox .no1 {
width: 2.4rem;
height: 2.32rem;
position: absolute;
top: 0.96rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no1 .ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.page2 .listBg .topBox .no1 .tx {
width: 1.78667rem;
height: 1.78667rem;
border-radius: 50%;
position: absolute;
top: 0.33333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no1 .num {
width: 1.77333rem;
height: 0.74667rem;
position: absolute;
top: -0.77333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no1 p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.36rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.page2 .listBg .topBox .no1 span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.73333rem;
}
.page2 .listBg .topBox .no2 {
width: 2.4rem;
height: 2.32rem;
position: absolute;
top: 2.42667rem;
left: 0.6rem;
}
.page2 .listBg .topBox .no2 .ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.page2 .listBg .topBox .no2 .tx {
width: 1.78667rem;
height: 1.78667rem;
border-radius: 50%;
position: absolute;
top: 0.33333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no2 .num {
width: 1.77333rem;
height: 0.74667rem;
position: absolute;
top: -0.77333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no2 p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.36rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.page2 .listBg .topBox .no2 span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.73333rem;
}
.page2 .listBg .topBox .no3 {
width: 2.4rem;
height: 2.32rem;
position: absolute;
top: 2.42667rem;
right: 0.6rem;
}
.page2 .listBg .topBox .no3 .ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.page2 .listBg .topBox .no3 .tx {
width: 1.78667rem;
height: 1.78667rem;
border-radius: 50%;
position: absolute;
top: 0.33333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no3 .num {
width: 1.77333rem;
height: 0.74667rem;
position: absolute;
top: -0.77333rem;
left: 50%;
transform: translateX(-50%);
}
.page2 .listBg .topBox .no3 p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.36rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.page2 .listBg .topBox .no3 span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: 0.28rem;
position: absolute;
left: 0;
bottom: -0.73333rem;
}
.page2 .listBg .list {
width: 8.13333rem;
margin: 0 auto;
}
.page2 .listBg .list li {
width: 100%;
height: 1.6rem;
line-height: 1.6rem;
border-radius: 0.26667rem;
background: #9B50DB;
margin-bottom: 0.13333rem;
}
.page2 .listBg .list li .num {
width: 0.6rem;
text-align: center;
color: #fff;
font-weight: 400;
height: 100%;
margin: 0 0.26667rem 0 0.33333rem;
float: left;
font-size: 0.49333rem;
}
.page2 .listBg .list li .tx {
width: 1.25333rem;
height: 1.25333rem;
border-radius: 50%;
margin-right: 0.32rem;
margin-top: 0.21333rem;
float: left;
}
.page2 .listBg .list li .nick {
float: left;
width: 2.1rem;
height: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #FFFFFF;
font-size: 0.38667rem;
font-weight: 400;
}
.page2 .listBg .list li .score {
float: right;
margin-right: 0.36rem;
font-size: 0.34667rem;
font-weight: 400;
color: #fff;
}
.page2 .myList {
position: fixed;
width: 100%;
bottom: 0;
left: 0;
height: 1.98667rem;
line-height: 1.98667rem;
background: #734DC1;
z-index: 3;
}
.page2 .myList .num {
width: 1.6rem;
text-align: center;
color: #fff;
font-weight: 400;
height: 100%;
margin: 0 0.26667rem 0 0.33333rem;
float: left;
font-size: 0.49333rem;
}
.page2 .myList .tx {
width: 1.25333rem;
height: 1.25333rem;
border-radius: 50%;
margin-right: 0.32rem;
margin-top: 0.33333rem;
float: left;
}
.page2 .myList .nick {
float: left;
width: 2.1rem;
height: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #FFFFFF;
font-size: 0.38667rem;
font-weight: 400;
}
.page2 .myList .score {
float: right;
margin-right: 0.36rem;
font-size: 0.34667rem;
font-weight: 400;
color: #fff;
}
.apple {
width: 100%;
height: 1.97333rem;
line-height: 1.97333rem;
text-align: center;
color: #FFFFFF;
font-size: 0.34667rem;
}
.rule {
display: none;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 99;
}
.rule .rule_iaon {
width: 9.68rem;
height: 14.46667rem;
background: url(../images/ruleBg.png) no-repeat;
background-size: 100% 100%;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
overflow-y: scroll;
}
.rule .rule_iaon .box {
position: absolute;
width: 8.61333rem;
left: 50%;
transform: translateX(-50%);
top: 1.6rem;
height: 12rem;
overflow-y: scroll;
}
.rule .rule_iaon .box img {
width: 100%;
height: 47.41333rem;
display: block;
}
.layui-m-layershade {
background-color: rgba(0, 0, 0, 0.3) !important;
}

562
view/yinmeng/activity/2023-ruffian/css/index.scss Normal file
View File

@@ -0,0 +1,562 @@
@function px2rem($px) {
@return $px / 75+rem;
}
html,
body {
width: 100%;
background: linear-gradient(0deg, #EBC8FA 0%, #FCB0EB 99%);
}
.rabbit {
z-index: 999;
}
.back {
position: fixed;
top: px2rem(70);
left: px2rem(34);
z-index: 99;
width: px2rem(62);
height: px2rem(62);
img {
width: 100%;
height: 100%;
}
p {
color: #fff;
font-size: px2rem(32);
position: absolute;
width: 9rem;
left: 0;
top: 0;
height: 100%;
text-align: center;
line-height: px2rem(62);
}
}
.header {
width: px2rem(750);
height: px2rem(795);
background: url(../images/header.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 0;
position: relative;
z-index: 2;
.giftBox {
width: px2rem(662);
height: px2rem(240);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(448);
}
.tab {
width: px2rem(480);
height: px2rem(83);
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(714);
display: flex;
justify-content: space-between;
div {
width: px2rem(212);
height: px2rem(83);
line-height: px2rem(83);
color: #F1E8F6;
font-size: px2rem(28);
text-align: center;
background: url(../images/tab.png) no-repeat;
background-size: 100%, 100%;
}
.active {
background: url(../images/tab_active.png) no-repeat;
background-size: 100%, 100%;
}
}
.rule_iaon {
width: px2rem(120);
height: px2rem(56);
line-height: px2rem(47);
text-align: center;
text-indent: 15px;
color: #fff;
font-size: px2rem(18);
position: absolute;
right: px2rem(0);
top: px2rem(400);
background: url(../images/rule_icon.png) no-repeat;
background-size: 100% 100%;
}
}
.page1 {
// display: none;
.activity1 {
width: px2rem(750);
height: px2rem(892);
background: url(../images/activity1Bg.png) no-repeat;
background-size: 100% 100%;
margin: px2rem(-43) auto px2rem(9);
position: relative;
div {
position: absolute;
right: px2rem(75);
width: px2rem(150);
height: px2rem(61);
line-height: px2rem(48);
text-align: center;
font-size: px2rem(21);
color: #E7FEFF;
background: url(../images/lqOut.png) no-repeat;
background-size: 100% 100%;
}
.but1 {
top: px2rem(226);
}
.but2 {
top: px2rem(402);
}
.but3 {
top: px2rem(579);
}
.but4 {
top: px2rem(755);
}
.out {
background: url(../images/lq.png) no-repeat;
background-size: 100% 100%;
}
}
.activity2 {
width: px2rem(750);
height: px2rem(1335);
margin: 0 auto 0;
display: block;
}
}
.page2 {
display: none;
.listTab {
width: px2rem(690);
height: px2rem(92);
margin: px2rem(30) auto 0;
display: flex;
justify-content: space-between;
div {
width: px2rem(345);
height: 100%;
text-align: center;
color: #F1E8F6;
font-size: px2rem(24);
line-height: px2rem(106);
background: url(../images/listTab.png) no-repeat;
background-size: 100% 100%;
}
.active {
font-size: px2rem(30);
line-height: px2rem(92);
background: url(../images/listTabActive.png) no-repeat;
background-size: 100% 100%;
}
}
.listBg {
width: px2rem(690);
min-height: 17rem;
margin: 0 auto 0.5rem;
background: linear-gradient(0deg, #B483D7 0%, #AD61FA 48%, #CB80FB 100%);
border-radius: 0 0 px2rem(20) px2rem(20);
overflow: hidden;
.dayTab {
width: px2rem(565);
height: px2rem(66);
display: flex;
justify-content: space-between;
margin: px2rem(44) auto px2rem(27);
div {
width: px2rem(167);
height: px2rem(66);
line-height: px2rem(68);
text-align: center;
color: #F1E8F6;
font-size: px2rem(22);
background: url(../images/dayTab.png) no-repeat;
background-size: 100% 100%;
}
.active {
background: url(../images/dayTab_active.png) no-repeat;
background-size: 100% 100%;
}
}
.topBox {
width: px2rem(664);
height: px2rem(568);
background: url(../images/topBox.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 0;
position: relative;
.no1 {
width: px2rem(180);
height: px2rem(174);
position: absolute;
top: px2rem(72);
left: 50%;
transform: translateX(-50%);
.ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(134);
height: px2rem(134);
border-radius: 50%;
position: absolute;
top: px2rem(25);
left: 50%;
transform: translateX(-50%);
}
.num {
width: px2rem(133);
height: px2rem(56);
position: absolute;
top: px2rem(-58);
left: 50%;
transform: translateX(-50%);
}
p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-27);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-55);
}
}
.no2 {
width: px2rem(180);
height: px2rem(174);
position: absolute;
top: px2rem(182);
left: px2rem(45);
.ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(134);
height: px2rem(134);
border-radius: 50%;
position: absolute;
top: px2rem(25);
left: 50%;
transform: translateX(-50%);
}
.num {
width: px2rem(133);
height: px2rem(56);
position: absolute;
top: px2rem(-58);
left: 50%;
transform: translateX(-50%);
}
p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-27);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-55);
}
}
.no3 {
width: px2rem(180);
height: px2rem(174);
position: absolute;
top: px2rem(182);
right: px2rem(45);
.ts {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
}
.tx {
width: px2rem(134);
height: px2rem(134);
border-radius: 50%;
position: absolute;
top: px2rem(25);
left: 50%;
transform: translateX(-50%);
}
.num {
width: px2rem(133);
height: px2rem(56);
position: absolute;
top: px2rem(-58);
left: 50%;
transform: translateX(-50%);
}
p {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-27);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
span {
width: 100%;
text-align: center;
color: #FFFFFF;
font-size: px2rem(21);
position: absolute;
left: 0;
bottom: px2rem(-55);
}
}
}
.list {
width: px2rem(610);
margin: 0 auto;
li {
width: 100%;
height: px2rem(120);
line-height: px2rem(120);
border-radius: px2rem(20);
background: #9B50DB;
margin-bottom: px2rem(10);
.num {
width: px2rem(45);
text-align: center;
color: #fff;
font-weight: 400;
height: 100%;
margin: 0 px2rem(20) 0 px2rem(25);
float: left;
font-size: px2rem(37);
}
.tx {
width: px2rem(94);
height: px2rem(94);
border-radius: 50%;
margin-right: px2rem(24);
margin-top: px2rem(16);
float: left;
}
.nick {
float: left;
width: 2.1rem;
height: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #FFFFFF;
font-size: px2rem(29);
font-weight: 400;
}
.score {
float: right;
margin-right: px2rem(27);
font-size: px2rem(26);
font-weight: 400;
color: #fff;
}
}
}
}
.myList {
position: fixed;
width: 100%;
bottom: 0;
left: 0;
height: px2rem(149);
line-height: px2rem(149);
background: #734DC1;
z-index: 3;
.num {
width: 1.6rem;
text-align: center;
color: #fff;
font-weight: 400;
height: 100%;
margin: 0 px2rem(20) 0 px2rem(25);
float: left;
font-size: px2rem(37);
}
.tx {
width: px2rem(94);
height: px2rem(94);
border-radius: 50%;
margin-right: px2rem(24);
margin-top: px2rem(25);
float: left;
}
.nick {
float: left;
width: 2.1rem;
height: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #FFFFFF;
font-size: px2rem(29);
font-weight: 400;
}
.score {
float: right;
margin-right: px2rem(27);
font-size: px2rem(26);
font-weight: 400;
color: #fff;
}
}
}
.apple {
width: 100%;
height: px2rem(148);
line-height: px2rem(148);
text-align: center;
color: #FFFFFF;
font-size: px2rem(26);
}
.rule {
display: none;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .6);
z-index: 99;
.rule_iaon {
width: px2rem(726);
height: px2rem(1085);
background: url(../images/ruleBg.png) no-repeat;
background-size: 100% 100%;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
overflow-y: scroll;
.box {
position: absolute;
width: px2rem(646);
left: 50%;
transform: translateX(-50%);
top: 1.6rem;
height: 12rem;
overflow-y: scroll;
img {
width: 100%;
height: px2rem(3556);
display: block;
}
}
}
}
.layui-m-layershade{
background-color: rgba(0,0,0,.3) !important;
}

BIN
view/yinmeng/activity/2023-ruffian/images/activity1Bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 307 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/activity2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 407 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/dayTab.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.2 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/dayTab_active.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/giftBox.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 100 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/header.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 356 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/listTab.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/listTabActive.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 21 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/love.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/lq.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/lqOut.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/no1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 33 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/no2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/no3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 29 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/num1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.8 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/num2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.8 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/num3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.9 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/ruleBg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/rule_icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/rule_in.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 425 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/tab.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/tab_active.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/topBox.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 150 KiB

BIN
view/yinmeng/activity/2023-ruffian/images/travel/back.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

118
view/yinmeng/activity/2023-ruffian/index.html Normal file
View File

@@ -0,0 +1,118 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>单身就狂欢，恋爱就勇敢</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<!-- 顶部返回 -->
<div class="back">
<img src="./images/travel/back.png" alt="">
</div>
<!-- header -->
<div class="header">
<!-- 奖励展示 -->
<img src="./images/giftBox.png" alt="" class="giftBox">
<!-- tab -->
<div class="tab">
<div class="active">活动攻略</div>
<div>榜单</div>
</div>
<!-- 规则Icon -->
<div class="rule_iaon">活动规则></div>
</div>
<!-- 页面一 -->
<div class="page1">
<!-- 活动1 -->
<div class="activity1">
<div class="but1">今日未领取</div>
<div class="but2">今日未领取</div>
<div class="but3">今日未领取</div>
<div class="but4">今日未领取</div>
</div>
<!-- 活动2 -->
<img src="./images/activity2.png" alt="" class="activity2">
</div>
<!-- 页面二 -->
<div class="page2">
<!-- 榜单切换 -->
<div class="listTab">
<div class="active">勇气榜</div>
<div>狂欢榜</div>
</div>
<!-- 榜单盒子 -->
<div class="listBg">
<!-- 日榜切换 -->
<div class="dayTab">
<div>昨日榜单</div>
<div>今日榜单</div>
<div class="active">总榜</div>
</div>
<!-- 前三 -->
<div class="topBox">
<div class="no1">
<img src="./images/no1.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<img src="./images/num1.png" alt="" class="num">
<p>虚位以待</p>
<span>勇气值:0</span>
</div>
<div class="no2">
<img src="./images/no2.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<img src="./images/num2.png" alt="" class="num">
<p>虚位以待</p>
<span>勇气值:0</span>
</div>
<div class="no3">
<img src="./images/no3.png" alt="" class="ts">
<img src="./images/logo.png" alt="" class="tx">
<img src="./images/num3.png" alt="" class="num">
<p>虚位以待</p>
<span>勇气值:0</span>
</div>
</div>
<!-- 非前三 -->
<ul class="list">
<li>
<div class="num">04</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用户昵称</div>
<div class="score">勇气值:8888.8w</div>
</li>
</ul>
</div>
<!-- 自己榜单 -->
<div class="myList">
<div class="num">未上榜</div>
<img src="./images/logo.png" alt="" class="tx">
<div class="nick">用户昵称</div>
<div class="score">勇气值:8888.8w</div>
</div>
</div>
<!-- 本活动与Apple inc.无关； -->
<div class="apple">本活动与Apple inc.无关；</div>
<!-- 规则弹窗 -->
<div class="rule">
<div class="rule_iaon">
<div class="box">
<img src="./images/rule_in.png" alt="">
</div>
</div>
</div>
</body>
</html>
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/layer.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="./js/wow.js"></script>
<script src="./js/index.js"></script>

192
view/yinmeng/activity/2023-ruffian/js/index.js Normal file
View File

@@ -0,0 +1,192 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
new VConsole();
}
// 封装layer消息提醒框
let layerIndex
const showLoading = (content = '加载中...') => {
layer.open({
type: 2,
shadeClose: false,
content,
success (e) {
layerIndex = $(e).attr('index')
}
})
}
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = '操作完成', time = 2) => {
layer.open({
content,
time,
skin: 'msg'
})
}
var rankType = 2;//默认送礼总榜
var type = 1;//默认送礼总榜
var time = null;//当前日期
var dayTime = null;//存储日期;
// 初始化函数
$(function () {
getInfoFromClient()
setTimeout(function () {
// 页面全屏
if (browser.app) {
if (browser.android) {
window.androidJsObj.initShowNav(false)
} else {
window.webkit.messageHandlers.initShowNav.postMessage(0)
}
};
// 顶部返回事件
$('.back').click(() => {
if (browser.android) {
window.androidJsObj.closeWebView()
} else {
window.webkit.messageHandlers.closeWebView.postMessage(null)
}
})
getConfig();
}, 100)
})
// 获取配置接口
function getConfig () {
showLoading()
networkRequest({
type: 'GEt',
url: urlPrefix + '/act/2023DoubleEleven/task/getConfig',
success (res) {
if (res.code === 200) {
// 处理任务状态
res.data.dailyTaskList.forEach((res, i) => {
if (res.status == 1) {
$(`.page1 .activity1 .but${i + 1}`).addClass('out');
$(`.page1 .activity1 .but${i + 1}`).text('今日已领取');
}
});
// 设置日期
time = res.timestamp;
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('网络错误，请退出重进')
}
})
}
// tab切换
$('.header .tab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('active').siblings().removeClass('active');
$('.page1').hide();
$('.page2').hide();
$(`.page${i}`).show();
if (i == 2) {
$('.page2 .listBg .dayTab div').removeClass('active');
$('.page2 .listBg .dayTab div').eq(2).addClass('active');
getRank(rankType, type);
}
})
// 获取榜单接口
function getRank (rankType, type, date) {
$('.page2 .listBg .list li').remove();
showLoading()
networkRequest({
type: 'GEt',
url: urlPrefix + '/act/2023DoubleEleven/rank/getRank',
data: { rankType, date },
success (res) {
if (res.code === 200) {
// 处理前三
var top3 = res.data.rankList.slice(0, 3);
var notTop3 = res.data.rankList.slice(3);
if (top3.length < 3) {
let arr = new Array(3 - top3.length).fill({
avatar: './images/logo.png',
nick: '虚位以待',
score: "0"
})
top3.push(...arr)
}
top3.forEach((res, i) => {
$(`.page2 .listBg .topBox .no${i + 1} .tx`).attr('src', res.avatar);
$(`.page2 .listBg .topBox .no${i + 1} p`).text(res.nick);
$(`.page2 .listBg .topBox .no${i + 1} span`).text(`${type == 1 ? "勇气值:" : "狂欢值:"}${unitProcessing(res.score, 10000, 1, 'w')}`);
})
// 非前三
var str = '';
notTop3.forEach((res, i) => {
str += `
<li>
<div class="num">${res.ranking}</div>
<img src="${res.avatar}" alt="" class="tx">
<div class="nick">${res.nick}</div>
<div class="score">${type == 1 ? "勇气值:" : "狂欢值:"}${unitProcessing(res.score, 10000, 1, 'w')}</div>
</li>
`
})
$('.page2 .listBg .list').append(str);
// 处理自己榜单
$('.page2 .myList .num').text(res.data.meRank.ranking == 0 ? '未上榜' : res.data.meRank.ranking);
$('.page2 .myList .tx').attr('src', res.data.meRank.avatar);
$('.page2 .myList .nick').text(res.data.meRank.nick);
$('.page2 .myList .score').text(`${type == 1 ? "勇气值:" : "狂欢值:"}${unitProcessing(res.data.meRank.score, 10000, 1, 'w')}`);
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error (err) {
hideLoading(layerIndex)
toastMsg('网络错误，请退出重进')
}
})
}
// 送礼榜和收礼榜切换
$('.page2 .listTab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('active').siblings().removeClass('active');
$('.page2 .listBg .dayTab div').removeClass('active');
$('.page2 .listBg .dayTab div').eq(2).addClass('active');
type = i;
dayTime = null;
if (i == 1) {
rankType = 2;
} else {
rankType = 4;
}
getRank(rankType, type, dayTime);
})
// 日榜和总榜切换
$('.page2 .listBg .dayTab div').click(function () {
var i = $(this).index() + 1;
$(this).addClass('active').siblings().removeClass('active');
if (i == 3) {
dayTime = null;
rankType = type == 1 ? 2 : 4;
} else if (i == 1) {
rankType = type == 1 ? 1 : 3;
dayTime = dateFormat(time - 86400000, 'yyyy-MM-dd')
} else if (i == 2) {
rankType = type == 1 ? 1 : 3;
dayTime = dateFormat(time, 'yyyy-MM-dd')
}
getRank(rankType, type, dayTime);
})
// 打开规则
$('.header .rule_iaon').click(function () {
$('.rule').show();
bodyScroolFun(true);
})
// 关闭规则
$('.rule').click(function () {
$('.rule').hide();
bodyScroolFun(false);
})

46
view/yinmeng/activity/2023-ruffian/js/wow.js Normal file
View File

@@ -0,0 +1,46 @@
var baba = document.querySelector('body');
baba.addEventListener('click', function (e) {
// $('body,html').css({ "width": "100%", "position": "relative", "overflow": "hidden" });
tianJia(e);
})
var erZi = [];
function tianJia (e) {
var sunZi = document.createElement('div');
sunZi.className = 'rabbit';
// sunZi.innerHTML = '<i class="iconfont icon-tuzi"></i>';
sunZi.innerHTML = '<img src="./images/love.png" alt="">';
baba.appendChild(sunZi);
erZi.push({
el: sunZi,
top: e.pageY - 30,
left: e.pageX - 20,
opacity: 1,
scale: 1,
color: `rgb(${255 * Math.random()},${255 * Math.random()},${255 * Math.random()})`
});
move();
};
function move () {
for (var i = 0; i < erZi.length; i++) {
if (erZi[i].opacity <= 0) {
baba.removeChild(erZi[i].el);
erZi.splice(i, 1);
return;
}
erZi[i].top--;
erZi[i].opacity = erZi[i].opacity - 0.04;
// erZi[i].scale = erZi[i].scale + 0.0001;
erZi[i].el.style.cssText = `
top: ${erZi[i].top}px;
left: ${erZi[i].left}px;
color: ${erZi[i].color};
opacity: ${erZi[i].opacity};
transform: scale(${erZi[i].scale});
position: absolute;
`
}
window.requestAnimationFrame(move);
// $('body,html').css({ "width": "100%", "position": "relative", "overflow": "auto" });
}

BIN
view/yinmeng/modules/level/images/charm2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 266 KiB

BIN
view/yinmeng/modules/level/images/wealth2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 539 KiB

145
view/yinmeng/modules/level/index.html
View File

@@ -2,95 +2,98 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>等级说明</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="../../common/css/swiper.min.css">
<link rel="stylesheet" href="css/index.css?v=1.1">
<script src="../../common/js/flexible.js"></script>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>等级说明</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="../../common/css/swiper.min.css">
<link rel="stylesheet" href="css/index.css?v=1.1">
<script src="../../common/js/flexible.js"></script>
</head>
<body>
<div class="level-head">
<div class="level active">
<div class="user-box">财富等级</div>
<span></span>
</div>
<div class="level">
<div class="charm-box">魅力等级</div>
<span></span>
</div>
</div>
<!--用户等级start-->
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="user-content">
<div class="user-head">
<img class="user-avatar" src="./images/people.png" alt="">
</div>
<p class="treasure">
</p>
<p class="progress-bar">
<span class="treasure-now">财富值：0</span>
<span class="progress-bar-now"></span>
</p>
<p class="grade">
<span class="treasure-upgrade">升级所需财富值：<span class="num">0</span></span>
<span class="grade-now">LV.0</span>
<span class="grade-next">LV.1</span>
</p>
<div class="level-head">
<div class="level active">
<div class="user-box">财富等级</div>
<span></span>
</div>
<div class="level">
<div class="charm-box">魅力等级</div>
<span></span>
</div>
</div>
<!--用户等级start-->
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="user-content">
<div class="user-head">
<img class="user-avatar" src="./images/people.png" alt="">
</div>
<p class="treasure">
</p>
<p class="progress-bar">
<span class="treasure-now">财富值：0</span>
<span class="progress-bar-now"></span>
</p>
<p class="grade">
<span class="treasure-upgrade">升级所需财富值：<span class="num">0</span></span>
<span class="grade-now">LV.0</span>
<span class="grade-next">LV.1</span>
</p>
</div>
<!-- <div class="explain">
<!-- <div class="explain">
<p class="explain-tit">等级说明</p>
<p class="explain-title">用户等级是您的成长属性，每消费1个钻石购买礼物可以累计1个经验值，随着您的等级上升，您的等级标志会有相应的颜色变化。</p>
</div>
<img class="explain-img" src="./images/user.png" alt=""> -->
<!-- <img class="explain-img" src="./images/explain.png" alt="">
<!-- <img class="explain-img" src="./images/explain.png" alt="">
<img src="./images/user.png" alt="">
<img class="effects-img" src="./images/effects1.png" alt=""> -->
<img src="./images/wealth.png" alt="">
</div>
<div class="swiper-slide">
<div class="user-charm">
<div class="user-head">
<img class="user-avatar" src="./images/people.png" alt="">
</div>
<p class="treasure">
</p>
<p class="progress-bar">
<span class="treasure-now">魅力值：0</span>
<span class="progress-bar-now"></span>
</p>
<p class="grade">
<span class="treasure-upgrade">升级所需魅力值：<span class="num">0</span></span>
<span class="grade-now">LV.0</span>
<span class="grade-next">LV.1</span>
</p>
</div>
<!-- <div class="explain">
<img class="wealth" src="./images/wealth.png" alt="">
</div>
<div class="swiper-slide">
<div class="user-charm">
<div class="user-head">
<img class="user-avatar" src="./images/people.png" alt="">
</div>
<p class="treasure">
</p>
<p class="progress-bar">
<span class="treasure-now">魅力值：0</span>
<span class="progress-bar-now"></span>
</p>
<p class="grade">
<span class="treasure-upgrade">升级所需魅力值：<span class="num">0</span></span>
<span class="grade-now">LV.0</span>
<span class="grade-next">LV.1</span>
</p>
</div>
<!-- <div class="explain">
<p class="explain-tit">等级说明</p>
<p class="explain-title">魅力等级是您在音萌个人魅力的成长属性，每收到1个钻石的礼物，积累一点魅力值，随着您的等级上升，您的等级标致会有相应的颜色变化。</p>
</div> -->
<img class="explain-img" src="./images/charm.png" alt="">
</div>
<img class="explain-img charm" src="./images/charm.png" alt="">
</div>
</div>
</div>
</div>
<!--用户等级end-->
<!--魅力等级start-->
<!--用户等级end-->
<!--魅力等级start-->
<!--魅力等级end-->
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="../../common/js/swiper.min.js"></script>
<script src="js/index.js?v=1.1"></script>
<script src="../../common/js/vconsole.min.js"></script>
<!--魅力等级end-->
<script src="../../common/js/flexible.js"></script>
<script src="../../common/js/jquery-3.2.1.min.js"></script>
<script src="../../common/js/route-constant.js"></script>
<script src="../../common/js/swiper.min.js"></script>
<script src="../../common/js/vconsole.min.js"></script>
<script src="../../common/js/common2.js"></script>
<script src="js/index.js"></script>
<script src="./js/level.js"></script>
</body>
</html>

21
view/yinmeng/modules/level/js/level.js Normal file
View File

@@ -0,0 +1,21 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
var url = getQueryString()
// 初始化函数
$(function () {
getInfoFromClient();
setTimeout(function () {
if (browser.ios) {
if (url.appVersionCode >= 150) {
$('.wealth').attr('src', './images/wealth2.png')
$('.charm').attr('src', './images/charm2.png')
}
} else {
if (JSON.parse(pubInfo.deviceInfo).appVersionCode >= 150) {
$('.wealth').attr('src', './images/wealth2.png')
$('.charm').attr('src', './images/charm2.png')
}
}
}, 200)
})