Compare commits

..

30 Commits

Author SHA1 Message Date
qf
e4faf289a9 星级厨房:切换图片域名 2022-12-30 17:59:13 +08:00
qf
f1871efd20 星级厨房:图片动效资源改为cdn获取 2022-12-29 11:52:54 +08:00
qf
3f18ee1b3b 星级厨房:增加轮次,游戏记录优化,替换规则图片 2022-12-28 15:09:16 +08:00
qf
dc18fe1855 房间榜单:长头像变形修复 2022-12-28 15:09:16 +08:00
qf
99bef1bc05 新年活动:替换礼物价值切图 2022-12-28 10:18:12 +08:00
qf
2911cfbc69 钻石记录:增加新年烟花抽奖支出记录 2022-12-27 17:35:02 +08:00
qf
495eca12ca 新年活动:增加谷歌包跳转充值 2022-12-27 15:02:47 +08:00
qf
bed6c791d8 新年活动:修改安卓跳转充值方法 2022-12-27 14:44:30 +08:00
qf
e87f43e915 新年活动:点燃烟花按钮增加防抖,去充值跳转方法修改 2022-12-27 14:35:01 +08:00
qf
3c98cda3fb 新年活动:余额不足状态码修改 2022-12-27 14:10:27 +08:00
qf
2a5dbc8bb5 新年活动:投入最多改为99 2022-12-26 14:51:03 +08:00
qf
269c4830c6 新年活动:个人排名问题修复 2022-12-26 11:31:05 +08:00
qf
53ee72b18c 新年活动:余额不足状态码问题修复,替换规则图片 2022-12-26 11:12:47 +08:00
qf
66d1cff449 新年活动:关闭余额不足弹窗蒙层,我的奖励分页处理,开奖接口等待动效结束执行,替换图片 2022-12-24 19:20:15 +08:00
qf
cff7e3fd60 新增2022新年活动 2022-12-23 14:05:04 +08:00
qf
d046757f97 星级厨房:开奖页no1对齐 2022-12-16 19:14:59 +08:00
qf
7b87ef9636 星級廚房:規則說明按照切图修改 2022-12-16 18:42:46 +08:00
qf
c6ef22dd31 星级厨房:修改规则,修改中奖页样式 2022-12-16 18:33:32 +08:00
Dragon
b4b77f43d3 新增网络延迟,优化下注以及优化中奖ui展示 2022-12-15 16:00:23 +08:00
qf
5c530716a5 星级厨房:榜单改为只展示前20位 2022-12-15 15:23:17 +08:00
qf
6dfb3df3ed 星际厨房:删除‘今日奖励’字段 2022-12-15 15:23:17 +08:00
qf
564c4c80a3 星级厨房:榜单增加跳转主页,我的钻石展示十位数宽 2022-12-15 15:23:16 +08:00
qf
b489c22d8c 星级厨房:+按钮修改为跳转充值页 2022-12-15 15:23:16 +08:00
qf
d2f0970bda 星级厨房:点击跳转用户主页无效修改 2022-12-15 15:23:16 +08:00
qf
2db5fd90c7 星级厨房:修改开奖页面 2022-12-15 15:23:16 +08:00
qf
bc9bc487c1 星级厨房:发送抽奖接口数据类型修改 2022-12-15 15:23:16 +08:00
qf
7ef958b09c 星级厨房:修改用户抽奖接口参数格式,新增50轮中奖结果页,优化游戏记录 2022-12-15 15:23:16 +08:00
Dragon
636bb2519f 糖果树:新增网络延时 2022-12-08 17:13:55 +08:00
Dragon
62f23e6b26 延迟请求秒数 2022-12-08 11:51:52 +08:00
qf
52351df8d5 星级厨房:更改厨房档位 2022-12-03 20:10:35 +08:00
96 changed files with 4441 additions and 490 deletions

View File

@@ -0,0 +1,813 @@
@font-face {
font-family: "pingfang-bold";
src: url("../../../common/fonts/PingFang Bold.ttf");
src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
}
@font-face {
font-family: "din-medium";
src: url("../../../common/fonts/DINCond-Medium.ttf");
src: url("../../../common/fonts/DINCond-Medium.ttf") format("woff"), url("../../../common/fonts/DINCond-Medium.ttf") format("truetype"), url("../../../common/fonts/DINCond-Medium.ttf") format("svg");
}
html,
body {
background: linear-gradient(180deg, #FB88A9 0%, #FFBECE 61%);
}
.no-in-app {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 99999;
background-color: white;
}
.wrap {
width: 100%;
height: 100%;
position: relative;
}
.wrap .banner {
width: 100%;
}
.wrap .rule {
width: 1.44rem;
height: 0.6933333333rem;
position: absolute;
top: 3.6933333333rem;
right: 0;
}
.wrap .record {
width: 1.44rem;
height: 0.6933333333rem;
position: absolute;
top: 4.56rem;
right: 0;
}
.wrap .gift-box-wrap {
width: 9.2rem;
height: 17.0133333333rem;
background: url(../images/giftBox.png) no-repeat;
background-size: 100% 100%;
margin: -0.3rem auto 0.5333333333rem;
overflow: hidden;
}
.wrap .gift-box-wrap .tips {
font-size: 0.2933333333rem;
color: #3D001F;
margin-top: 1.5733333333rem;
text-align: center;
}
.wrap .gift-box-wrap .wishTab {
width: 8rem;
height: 1.1733333333rem;
background: #FFFFFF;
border-radius: 0.5866666667rem;
margin: 0.4533333333rem auto 0;
display: flex;
align-items: center;
}
.wrap .gift-box-wrap .wishTab .item {
flex: 1;
height: 1.1733333333rem;
line-height: 1.1733333333rem;
text-align: center;
font-size: 0.4rem;
color: #BB4A56;
font-weight: bold;
}
.wrap .gift-box-wrap .wishTab .item1_act {
width: 4rem;
height: 1.1733333333rem;
background: url(../images/tab_wish1.png) no-repeat;
background-size: 100% 100%;
}
.wrap .gift-box-wrap .wishTab .item2_act {
width: 4rem;
height: 1.1733333333rem;
background: url(../images/tab_wish2.png) no-repeat;
background-size: 100% 100%;
}
.wrap .gift-box-wrap .gift-box {
width: 8.2666666667rem;
height: 5.3333333333rem;
margin: 0.3333333333rem auto 0;
position: relative;
}
.wrap .gift-box-wrap .gift-box img {
width: 100%;
height: 100%;
}
.wrap .gift-box-wrap .gift-box .svga1 {
display: none;
width: 8.2666666667rem;
height: 5.3333333333rem;
position: absolute;
top: 0;
left: 0;
}
.wrap .gift-box-wrap .gift-box .svga2 {
display: none;
width: 8.2666666667rem;
height: 5.3333333333rem;
position: absolute;
top: 0;
left: 0;
}
.wrap .gift-box-wrap .but {
width: 2.4533333333rem;
height: 0.5866666667rem;
border-radius: 0.2933333333rem;
background: #FFE1F2;
margin: 0.24rem auto 0;
position: relative;
}
.wrap .gift-box-wrap .but input {
border: 0;
width: 1rem;
height: 0.5866666667rem;
background: #FFE1F2;
color: #FF5662;
font-size: 0.32rem;
outline: none;
text-align: center;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.wrap .gift-box-wrap .but img {
width: 0.6rem;
height: 0.6rem;
}
.wrap .gift-box-wrap .but .add {
position: absolute;
right: 0;
top: 0;
}
.wrap .gift-box-wrap .but .cut {
position: absolute;
left: 0;
top: 0;
}
.wrap .gift-box-wrap .wish {
width: 4.9333333333rem;
height: 1.2533333333rem;
margin: 0.2666666667rem auto 0;
}
.wrap .gift-box-wrap .award {
width: 8.32rem;
height: 4rem;
margin: 0.48rem auto 0;
}
.wrap .rank-wrap {
width: 9.2rem;
height: 22.7066666667rem;
background: url(../images/rankBg.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto 1.5333333333rem;
position: relative;
}
.wrap .rank-wrap .rankTab {
width: 7.3866666667rem;
height: 1.1733333333rem;
background: #FFFFFF;
border-radius: 0.5866666667rem;
position: absolute;
top: 0.5866666667rem;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
}
.wrap .rank-wrap .rankTab .tab {
flex: 1;
height: 1.1733333333rem;
line-height: 1.1733333333rem;
text-align: center;
font-size: 0.4rem;
color: #BB4A56;
font-weight: bold;
}
.wrap .rank-wrap .rankTab .tab1_act {
width: 4rem;
height: 1.1733333333rem;
background: url(../images/wish1Rank.png) no-repeat;
background-size: 100% 100%;
}
.wrap .rank-wrap .rankTab .tab2_act {
width: 4rem;
height: 1.1733333333rem;
background: url(../images/wish2Rank.png) no-repeat;
background-size: 100% 100%;
}
.wrap .rank-wrap .reward {
width: 0.84rem;
height: 1.2266666667rem;
position: absolute;
top: 2.1066666667rem;
right: 0.24rem;
}
.wrap .rank-wrap .dateTab {
width: 3.9333333333rem;
height: 0.8rem;
position: absolute;
top: 2.3066666667rem;
left: 50%;
transform: translateX(-50%);
display: flex;
}
.wrap .rank-wrap .dateTab .day,
.wrap .rank-wrap .dateTab .total {
width: 1.9333333333rem;
height: 0.8rem;
}
.wrap .rank-wrap .list .no1 {
width: 2.5333333333rem;
height: 4.5333333333rem;
position: relative;
top: 3.76rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list .no1 .tx {
width: 2.2rem;
height: 2.2rem;
border-radius: 50%;
position: absolute;
top: 0;
left: 0.2rem;
}
.wrap .rank-wrap .list .no1 .txBox {
width: 2.5333333333rem;
height: 2.7866666667rem;
position: absolute;
top: 0;
left: 0;
}
.wrap .rank-wrap .list .no1 .nick {
width: 100%;
height: 1.12rem;
background: url(../images/nick1.png) no-repeat;
background-size: 100%;
position: absolute;
bottom: 0.4266666667rem;
left: 50%;
transform: translateX(-50%);
font-size: 0.32rem;
color: #FFFFFF;
text-align: center;
line-height: 1.12rem;
}
.wrap .rank-wrap .list .no1 .score {
width: 100%;
font-size: 0.2666666667rem;
color: #AD4868;
text-align: center;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list .no2,
.wrap .rank-wrap .list .no3 {
width: 2.5333333333rem;
height: 4.0533333333rem;
position: relative;
top: 0.1rem;
left: 0.55rem;
}
.wrap .rank-wrap .list .no2 .tx,
.wrap .rank-wrap .list .no3 .tx {
width: 1.76rem;
height: 1.76rem;
border-radius: 50%;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list .no2 .txBox,
.wrap .rank-wrap .list .no3 .txBox {
width: 2.0933333333rem;
height: 2.28rem;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list .no2 .nick,
.wrap .rank-wrap .list .no3 .nick {
width: 100%;
height: 1.12rem;
background: url(../images/nick2.png) no-repeat;
background-size: 100%;
position: absolute;
bottom: 0.4266666667rem;
left: 50%;
transform: translateX(-50%);
font-size: 0.32rem;
color: #FFFFFF;
text-align: center;
line-height: 1.12rem;
}
.wrap .rank-wrap .list .no2 .score,
.wrap .rank-wrap .list .no3 .score {
width: 100%;
font-size: 0.2666666667rem;
color: #AD4868;
text-align: center;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list .no3 {
left: 6.13rem;
top: -4rem;
}
.wrap .rank-wrap .list .no3 .nick {
background: url(../images/nick3.png) no-repeat;
background-size: 100%;
}
.wrap .rank-wrap .list ul {
width: 8.56rem;
position: absolute;
top: 9.1rem;
bottom: 1.0666666667rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .rank-wrap .list ul li {
width: 100%;
height: 1.6rem;
line-height: 1.6rem;
background-color: #FFF7F9;
border-radius: 0.16rem;
margin-bottom: 0.2rem;
color: #AD4868;
font-size: 0.3466666667rem;
font-weight: 600;
text-align: center;
}
.wrap .rank-wrap .list ul li .num {
float: left;
margin-left: 0.2666666667rem;
width: 0.5333333333rem;
font-size: 0.48rem;
color: #AD4868;
font-weight: 600;
text-align: center;
}
.wrap .rank-wrap .list ul li .tx {
float: left;
margin-left: 0.3333333333rem;
margin-top: 0.24rem;
width: 1.0933333333rem;
height: 1.0933333333rem;
border-radius: 50%;
border: 1px solid #ff7abc;
}
.wrap .rank-wrap .list ul li .nick {
float: left;
margin-left: 0.24rem;
font-size: 0.3466666667rem;
color: #AD4868;
}
.wrap .rank-wrap .list ul li .score {
float: right;
margin-right: 0.3333333333rem;
font-size: 0.2666666667rem;
color: #AD4868;
}
.wrap .rank-wrap .myRank {
width: 9.2rem;
height: 1.84rem;
line-height: 1.84rem;
background: url(../images/my.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 0;
bottom: -0.85rem;
}
.wrap .rank-wrap .myRank .num {
float: left;
width: 1rem;
margin-left: 0.2666666667rem;
font-size: 0.2933333333rem;
color: #AD4868;
text-align: center;
}
.wrap .rank-wrap .myRank .tx {
float: left;
margin-left: 0.3333333333rem;
margin-top: 0.24rem;
width: 1.0933333333rem;
height: 1.0933333333rem;
border-radius: 50%;
border: 1px solid #ff7abc;
}
.wrap .rank-wrap .myRank .nick {
float: left;
margin-left: 0.24rem;
font-size: 0.3466666667rem;
color: #AD4868;
}
.wrap .rank-wrap .myRank .score {
float: right;
margin-right: 0.3333333333rem;
font-size: 0.2666666667rem;
color: #AD4868;
}
.gx {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.gx .gx_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 10.52rem;
background: url(../images/gx.png) no-repeat;
background-size: 100% 100%;
}
.gx .gx_in .close {
position: absolute;
top: 1rem;
right: 0;
width: 0.8rem;
height: 0.8rem;
}
.gx .gx_in .box {
width: 96%;
height: 3.5rem;
position: absolute;
top: 3.5rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-evenly;
}
.gx .gx_in .box li {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.gx .gx_in .box li .bg {
width: 2.2133333333rem;
height: 2.2133333333rem;
background: url(../images/gxBox.png) no-repeat;
background-size: 100% 100%;
margin-bottom: 0.2rem;
position: relative;
}
.gx .gx_in .box li .bg img {
width: 1.6666666667rem;
height: 1.6666666667rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.gx .gx_in .box li span, .gx .gx_in .box li p {
color: #7E0033;
font-size: 0.2933333333rem;
margin-bottom: 0.2rem;
}
.gx .gx_in .sure {
width: 3.36rem;
height: 1.28rem;
position: absolute;
bottom: 2.2666666667rem;
left: 50%;
transform: translateX(-50%);
}
.gx .gx_in .tips {
width: 100%;
color: #7E0033;
font-size: 0.2933333333rem;
text-align: center;
position: absolute;
left: 0;
bottom: 1.2rem;
}
.gxs {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.gxs .gxs_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 10.52rem;
background: url(../images/gx.png) no-repeat;
background-size: 100% 100%;
}
.gxs .gxs_in .close {
position: absolute;
top: 1rem;
right: 0;
width: 0.8rem;
height: 0.8rem;
}
.gxs .gxs_in .box {
width: 96%;
height: 3.5rem;
position: absolute;
top: 3.5rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-evenly;
}
.gxs .gxs_in .box li {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.gxs .gxs_in .box li .bg {
width: 1.6rem;
height: 1.6rem;
background: url(../images/gxBox.png) no-repeat;
background-size: 100% 100%;
margin-bottom: 0.2rem;
position: relative;
}
.gxs .gxs_in .box li .bg img {
width: 1.2rem;
height: 1.2rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.gxs .gxs_in .box li span, .gxs .gxs_in .box li p {
color: #7E0033;
font-size: 0.2933333333rem;
margin-bottom: 0.2rem;
}
.gxs .gxs_in .sure {
width: 3.36rem;
height: 1.28rem;
position: absolute;
bottom: 2.2666666667rem;
left: 50%;
transform: translateX(-50%);
}
.gxs .gxs_in .tips {
width: 100%;
color: #7E0033;
font-size: 0.2933333333rem;
text-align: center;
position: absolute;
left: 0;
bottom: 1.2rem;
}
.recordBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.recordBox .record_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 9.3066666667rem;
background: url(../images/record.png) no-repeat;
background-size: 100% 100%;
}
.recordBox .record_in .close {
position: absolute;
top: -0.2rem;
right: 0;
width: 0.8rem;
height: 0.8rem;
}
.recordBox .record_in p {
width: 60%;
height: 1.2rem;
position: absolute;
top: 1.8133333333rem;
left: 46%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
align-items: center;
}
.recordBox .record_in p span {
color: #3D001F;
font-size: 0.3733333333rem;
}
.recordBox .record_in ul {
width: 100%;
height: 5.2rem;
position: absolute;
top: 3rem;
left: 50%;
transform: translateX(-50%);
overflow: scroll;
}
.recordBox .record_in ul::-webkit-scrollbar {
display: none;
width: 0;
}
.recordBox .record_in ul li {
width: 100%;
display: flex;
justify-content: space-around;
}
.recordBox .record_in ul li b {
color: #7E0033;
font-size: 0.3466666667rem;
margin-bottom: 0.2666666667rem;
}
.recordBox .record_in .tips {
width: 100%;
text-align: center;
color: #590F35;
font-size: 0.2933333333rem;
position: absolute;
bottom: 0.6rem;
left: 50%;
transform: translateX(-50%);
display: none;
}
.ruleBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.ruleBox .rule_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 9.68rem;
background: url(../images/rule.png) no-repeat;
background-size: 100% 100%;
}
.ruleBox .rule_in .close {
position: absolute;
top: -0.2rem;
right: 0;
width: 0.8rem;
height: 0.8rem;
}
.rewardBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.rewardBox .reward_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 13.5333333333rem;
background: url(../images/rewardBg.png) no-repeat;
background-size: 100% 100%;
}
.rewardBox .reward_in .close {
position: absolute;
top: -0.9rem;
right: 0;
width: 0.8rem;
height: 0.8rem;
}
.rewardBox .reward_in .rewardTab {
width: 6.5066666667rem;
height: 1.0133333333rem;
border-radius: 0.5066666667rem;
background-color: #fff;
position: absolute;
top: 0.6rem;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
}
.rewardBox .reward_in .rewardTab .tab {
flex: 1;
height: 1.0133333333rem;
line-height: 1.0133333333rem;
text-align: center;
font-size: 0.3733333333rem;
color: #CA5987;
font-weight: bold;
}
.rewardBox .reward_in .rewardTab .tab1_act {
width: 3.2533333333rem;
height: 1.0133333333rem;
background: url(../images/wishBox1.png) no-repeat;
background-size: 100% 100%;
}
.rewardBox .reward_in .rewardTab .tab2_act {
width: 3.2533333333rem;
height: 1.0133333333rem;
background: url(../images/wishBox2.png) no-repeat;
background-size: 100% 100%;
}
.rewardBox .reward_in .box {
width: 7.3466666667rem;
height: 10.5733333333rem;
position: absolute;
top: 1.8666666667rem;
left: 50%;
transform: translateX(-50%);
}
.rewardBox .reward_in .box img {
width: 100%;
height: 100%;
}
.tishiBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
}
.tishiBox .tishi_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8.0266666667rem;
height: 5.6666666667rem;
background: url(../images/tipsBg.png) no-repeat;
background-size: 100% 100%;
}
.tishiBox .tishi_in .title {
width: 100%;
text-align: center;
color: #7E0033;
font-size: 0.3466666667rem;
position: absolute;
top: 2.3733333333rem;
left: 50%;
transform: translateX(-50%);
}
.tishiBox .tishi_in .recharge {
width: 3.3866666667rem;
height: 1.28rem;
position: absolute;
bottom: 1.04rem;
left: 50%;
transform: translateX(-50%);
}
.tishiBox .tishi_in .close {
position: absolute;
top: 0.2666666667rem;
right: 0.2666666667rem;
width: 0.8rem;
height: 0.8rem;
}
/*# sourceMappingURL=index.css.map */

View File

@@ -0,0 +1,922 @@
@function px2rem($px, $rem: 75) {
@return $px / $rem+rem;
}
@font-face {
font-family: 'pingfang-bold';
src: url('../../../common/fonts/PingFang\ Bold.ttf');
src: url('../../../common/fonts/PingFang\ Bold.ttf') format('woff'),
url('../../../common/fonts/PingFang\ Bold.ttf') format('truetype'),
url('../../../common/fonts/PingFang\ Bold.ttf') format('svg');
}
@font-face {
font-family: 'din-medium';
src: url('../../../common/fonts/DINCond-Medium.ttf');
src: url('../../../common/fonts/DINCond-Medium.ttf') format('woff'),
url('../../../common/fonts/DINCond-Medium.ttf') format('truetype'),
url('../../../common/fonts/DINCond-Medium.ttf') format('svg');
}
html,
body {
// background: #FFBECE;
background: linear-gradient(180deg, #FB88A9 0%, #FFBECE 61%);
}
.no-in-app {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: 99999;
background-color: white;
}
.wrap {
width: 100%;
height: 100%;
// background: linear-gradient(180deg, #FB88A9 0%, #FFBECE 61%);
position: relative;
.banner {
width: 100%;
}
.rule {
width: px2rem(108, );
height: px2rem(52, );
position: absolute;
top: px2rem(277, );
right: 0;
}
.record {
width: px2rem(108, );
height: px2rem(52, );
position: absolute;
top: px2rem(342, );
right: 0;
}
.gift-box-wrap {
width: px2rem(690, );
height: px2rem(1276, );
background: url(../images/giftBox.png) no-repeat;
background-size: 100% 100%;
margin: -0.3rem auto px2rem(40, );
overflow: hidden;
.tips {
font-size: px2rem(22, );
color: #3D001F;
margin-top: px2rem(118, );
text-align: center;
}
.wishTab {
width: px2rem(600, );
height: px2rem(88, );
background: #FFFFFF;
border-radius: px2rem(44, );
margin: px2rem(34, ) auto 0;
display: flex;
// justify-content: space-around;
align-items: center;
.item {
flex: 1;
height: px2rem(88, );
line-height: px2rem(88, );
text-align: center;
font-size: px2rem(30, );
color: #BB4A56;
font-weight: bold;
}
.item1_act {
width: px2rem(300, );
height: px2rem(88, );
background: url(../images/tab_wish1.png) no-repeat;
background-size: 100% 100%;
}
.item2_act {
width: px2rem(300, );
height: px2rem(88, );
background: url(../images/tab_wish2.png) no-repeat;
background-size: 100% 100%;
}
}
.gift-box {
width: px2rem(620, );
height: px2rem(400, );
margin: px2rem(25, ) auto 0;
position: relative;
img {
width: 100%;
height: 100%;
}
.svga1 {
display: none;
width: px2rem(620, );
height: px2rem(400, );
position: absolute;
top: 0;
left: 0;
}
.svga2 {
display: none;
width: px2rem(620, );
height: px2rem(400, );
position: absolute;
top: 0;
left: 0;
}
}
.but {
width: px2rem(184, );
height: px2rem(44, );
border-radius: px2rem(22, );
background: #FFE1F2;
margin: px2rem(18, ) auto 0;
position: relative;
input {
border: 0;
width: 1rem;
height: px2rem(44, );
background: #FFE1F2;
color: #FF5662;
font-size: px2rem(24, );
outline: none; //隐藏边框
text-align: center;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
img {
width: px2rem(45, );
height: px2rem(45, );
}
.add {
position: absolute;
right: 0;
top: 0;
}
.cut {
position: absolute;
left: 0;
top: 0;
}
}
.wish {
width: px2rem(370, );
height: px2rem(94, );
margin: px2rem(20, ) auto 0;
}
.award {
width: px2rem(624, );
height: px2rem(300, );
margin: px2rem(36, ) auto 0;
}
}
.rank-wrap {
width: px2rem(690, );
height: px2rem(1703, );
background: url(../images/rankBg.png) no-repeat;
background-size: 100% 100%;
margin: 0 auto px2rem(115, );
position: relative;
.rankTab {
width: px2rem(554, );
height: px2rem(88, );
background: #FFFFFF;
border-radius: px2rem(44, );
position: absolute;
top: px2rem(44, );
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
.tab {
flex: 1;
height: px2rem(88, );
line-height: px2rem(88, );
text-align: center;
font-size: px2rem(30, );
color: #BB4A56;
font-weight: bold;
}
.tab1_act {
width: px2rem(300, );
height: px2rem(88, );
background: url(../images/wish1Rank.png) no-repeat;
background-size: 100% 100%;
}
.tab2_act {
width: px2rem(300, );
height: px2rem(88, );
background: url(../images/wish2Rank.png) no-repeat;
background-size: 100% 100%;
}
}
.reward {
width: px2rem(63, );
height: px2rem(92, );
position: absolute;
top: px2rem(158, );
right: px2rem(18, );
}
.dateTab {
width: px2rem(295, );
height: px2rem(60, );
position: absolute;
top: px2rem(173, );
left: 50%;
transform: translateX(-50%);
display: flex;
.day,
.total {
width: px2rem(145, );
height: px2rem(60, );
}
}
.list {
.no1 {
width: px2rem(190, );
height: px2rem(340, );
position: relative;
top: px2rem(282, );
left: 50%;
transform: translateX(-50%);
.tx {
width: px2rem(165, );
height: px2rem(165, );
border-radius: 50%;
position: absolute;
top: 0;
left: 0.2rem;
}
.txBox {
width: px2rem(190, );
height: px2rem(209, );
position: absolute;
top: 0;
left: 0;
}
.nick {
width: 100%;
height: px2rem(84, );
background: url(../images/nick1.png) no-repeat;
background-size: 100%;
position: absolute;
bottom: px2rem(32, );
left: 50%;
transform: translateX(-50%);
font-size: px2rem(24, );
color: #FFFFFF;
text-align: center;
line-height: px2rem(84, );
}
.score {
width: 100%;
font-size: px2rem(20, );
color: #AD4868;
text-align: center;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
}
.no2,
.no3 {
width: px2rem(190, );
height: px2rem(304, );
position: relative;
top: 0.1rem;
left: 0.55rem;
.tx {
width: px2rem(132, );
height: px2rem(132, );
border-radius: 50%;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.txBox {
width: px2rem(157, );
height: px2rem(171, );
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
height: px2rem(84, );
background: url(../images/nick2.png) no-repeat;
background-size: 100%;
position: absolute;
bottom: px2rem(32, );
left: 50%;
transform: translateX(-50%);
font-size: px2rem(24, );
color: #FFFFFF;
text-align: center;
line-height: px2rem(84, );
}
.score {
width: 100%;
font-size: px2rem(20, );
color: #AD4868;
text-align: center;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
}
}
.no3 {
left: 6.13rem;
top: -4rem;
.nick {
background: url(../images/nick3.png) no-repeat;
background-size: 100%;
}
}
ul {
width: px2rem(642, );
// height: px2rem(930, );
// background-color: purple;
position: absolute;
top: 9.1rem;
bottom: px2rem(80, );
left: 50%;
transform: translateX(-50%);
li {
width: 100%;
height: px2rem(120, );
line-height: px2rem(120, );
background-color: #FFF7F9;
border-radius: px2rem(12, );
margin-bottom: px2rem(15, );
color: #AD4868;
font-size: px2rem(26, );
font-weight: 600;
text-align: center;
.num {
float: left;
margin-left: px2rem(20, );
width: px2rem(40, );
font-size: px2rem(36, );
color: #AD4868;
font-weight: 600;
text-align: center;
}
.tx {
float: left;
margin-left: px2rem(25, );
margin-top: px2rem(18, );
width: px2rem(82, );
height: px2rem(82, );
border-radius: 50%;
border: 1px solid #ff7abc;
}
.nick {
float: left;
margin-left: px2rem(18, );
font-size: px2rem(26, );
color: #AD4868;
}
.score {
float: right;
margin-right: px2rem(25, );
font-size: px2rem(20, );
color: #AD4868;
}
}
}
}
.myRank {
width: px2rem(690, );
height: px2rem(138, );
line-height: px2rem(138, );
background: url(../images/my.png) no-repeat;
background-size: 100% 100%;
position: absolute;
left: 0;
bottom: -0.85rem;
.num {
float: left;
width: 1rem;
margin-left: px2rem(20, );
font-size: px2rem(22, );
color: #AD4868;
text-align: center;
}
.tx {
float: left;
margin-left: px2rem(25, );
margin-top: px2rem(18, );
width: px2rem(82, );
height: px2rem(82, );
border-radius: 50%;
border: 1px solid #ff7abc;
}
.nick {
float: left;
margin-left: px2rem(18, );
font-size: px2rem(26, );
color: #AD4868;
}
.score {
float: right;
margin-right: px2rem(25, );
font-size: px2rem(20, );
color: #AD4868;
}
}
}
}
.gx {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.gx_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(789, );
background: url(../images/gx.png) no-repeat;
background-size: 100% 100%;
.close {
position: absolute;
top: 1rem;
right: 0;
width: px2rem(60, );
height: px2rem(60, );
}
.box {
width: 96%;
height: 3.5rem;
position: absolute;
top: 3.5rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-evenly;
li {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
.bg {
width: px2rem(166, );
height: px2rem(166, );
// width: 1.6rem;
// height: 1.6rem;
background: url(../images/gxBox.png) no-repeat;
background-size: 100% 100%;
margin-bottom: 0.2rem;
position: relative;
img {
width: px2rem(125, );
height: px2rem(125, );
// width: 1.2rem;
// height: 1.2rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
}
span,p {
color: #7E0033;
font-size: px2rem(22, );
margin-bottom: 0.2rem;
}
}
}
.sure {
width: px2rem(252, );
height: px2rem(96, );
position: absolute;
bottom: px2rem(170, );
left: 50%;
transform: translateX(-50%);
}
.tips {
width: 100%;
color: #7E0033;
font-size: px2rem(22, );
text-align: center;
position: absolute;
left: 0;
bottom: px2rem(90, );
}
}
}
.gxs {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.gxs_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(789, );
background: url(../images/gx.png) no-repeat;
background-size: 100% 100%;
.close {
position: absolute;
top: 1rem;
right: 0;
width: px2rem(60, );
height: px2rem(60, );
}
.box {
width: 96%;
height: 3.5rem;
position: absolute;
top: 3.5rem;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: space-evenly;
li {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
.bg {
width: 1.6rem;
height: 1.6rem;
background: url(../images/gxBox.png) no-repeat;
background-size: 100% 100%;
margin-bottom: 0.2rem;
position: relative;
img {
width: 1.2rem;
height: 1.2rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
}
span,p {
color: #7E0033;
font-size: px2rem(22, );
margin-bottom: 0.2rem;
}
}
}
.sure {
width: px2rem(252, );
height: px2rem(96, );
position: absolute;
bottom: px2rem(170, );
left: 50%;
transform: translateX(-50%);
}
.tips {
width: 100%;
color: #7E0033;
font-size: px2rem(22, );
text-align: center;
position: absolute;
left: 0;
bottom: px2rem(90, );
}
}
}
.recordBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.record_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(698, );
background: url(../images/record.png) no-repeat;
background-size: 100% 100%;
.close {
position: absolute;
top: -0.2rem;
right: 0;
width: px2rem(60, );
height: px2rem(60, );
}
p {
// width: px2rem(540, );
width: 60%;
height: px2rem(90, );
position: absolute;
top: px2rem(136, );
left: 46%;
transform: translateX(-50%);
display: flex;
justify-content: space-between;
align-items: center;
span {
color: #3D001F;
font-size: px2rem(28, );
}
}
ul {
// width: px2rem(540, );
width: 100%;
height: 5.2rem;
position: absolute;
top: 3rem;
left: 50%;
transform: translateX(-50%);
overflow: scroll;
&::-webkit-scrollbar {
display: none;
width: 0;
}
li {
width: 100%;
display: flex;
justify-content: space-around;
b {
color: #7E0033;
font-size: px2rem(26, );
margin-bottom: px2rem(20, );
}
}
}
.tips {
width: 100%;
text-align: center;
color: #590F35;
font-size: px2rem(22, );
position: absolute;
bottom: 0.6rem;
left: 50%;
transform: translateX(-50%);
display: none;
}
}
}
.ruleBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.rule_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(726, );
background: url(../images/rule.png) no-repeat;
background-size: 100% 100%;
.close {
position: absolute;
top: -0.2rem;
right: 0;
width: px2rem(60, );
height: px2rem(60, );
}
}
}
.rewardBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.reward_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(1015, );
background: url(../images/rewardBg.png) no-repeat;
background-size: 100% 100%;
.close {
position: absolute;
top: -0.9rem;
right: 0;
width: px2rem(60, );
height: px2rem(60, );
}
.rewardTab {
width: px2rem(488, );
height: px2rem(76, );
border-radius: px2rem(38, );
background-color: #fff;
position: absolute;
top: px2rem(45, );
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
.tab {
flex: 1;
height: px2rem(76, );
line-height: px2rem(76, );
text-align: center;
font-size: px2rem(28, );
color: #CA5987;
font-weight: bold;
}
.tab1_act {
width: px2rem(244, );
height: px2rem(76, );
background: url(../images/wishBox1.png) no-repeat;
background-size: 100% 100%;
}
.tab2_act {
width: px2rem(244, );
height: px2rem(76, );
background: url(../images/wishBox2.png) no-repeat;
background-size: 100% 100%;
}
}
.box {
width: px2rem(551, );
height: px2rem(793, );
position: absolute;
top: px2rem(140, );
left: 50%;
transform: translateX(-50%);
img {
width: 100%;
height: 100%;
}
}
}
}
.tishiBox {
position: fixed;
right: 0;
bottom: 0;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999;
display: none;
.tishi_in {
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: px2rem(602, );
height: px2rem(425, );
background: url(../images/tipsBg.png) no-repeat;
background-size: 100% 100%;
.title {
width: 100%;
text-align: center;
color: #7E0033;
font-size: px2rem(26, );
position: absolute;
top: px2rem(178, );
left: 50%;
transform: translateX(-50%);
}
.recharge {
width: px2rem(254, );
height: px2rem(96, );
position: absolute;
bottom: px2rem(78, );
left: 50%;
transform: translateX(-50%);
}
.close {
position: absolute;
top: px2rem(20, );
right: px2rem(20, );
width: px2rem(60, );
height: px2rem(60, );
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1004 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 165 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 188 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 267 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 278 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 107 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 236 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 441 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 212 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 118 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 126 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 270 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 271 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 117 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

View File

@@ -0,0 +1,194 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>燃放烟花 许愿新年</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="wrap no-in-app">
<!-- 主视觉 -->
<div class="banner"><img src="./images/main.png" alt=""></div>
<div class="rule"><img src="./images/btn_rule.png" alt=""></div>
<div class="record"><img src="./images/btn_record.png" alt=""></div>
<!-- 烟花礼盒 -->
<div class="gift-box-wrap">
<div class="tips">點燃許願/心願煙花,即可獲得活動限定禮物</div>
<div class="wishTab">
<div class="item item1_act"></div>
<div class="item">心願煙花</div>
</div>
<div class="gift-box">
<img src="./images/giftBg.png" alt="">
<div class="svga1"></div>
<div class="svga2"></div>
</div>
<div class="but">
<input type="number" value="1" maxlength="999"
onkeyup="value=(value.replace(/\D/g,'')==''?'':parseInt(value))">
<img src="./images/btn_add.png" class="add" alt="">
<img src="./images/btn_cut.png" class="cut" alt="">
</div>
<!-- 许愿按钮 -->
<div class="wish">
<img src="./images/wish1Btn.png" alt="">
</div>
<!-- 礼盒奖励 -->
<div class="award">
<img src="./images/gift1.png" alt="">
</div>
</div>
<!-- 榜单 -->
<div class="rank-wrap">
<div class="rankTab">
<div class="tab tab1_act"></div>
<div class="tab">心願榜</div>
</div>
<!-- 奖励 -->
<img src="./images/btn_reward.png" class="reward" alt="">
<!-- 日榜总榜 -->
<div class="dateTab">
<img class="day" src="./images/tab_day_act.png" alt="">
<img class="total" src="./images/tab_total.png" alt="">
</div>
<!-- 榜单列表 -->
<div class="list">
<div class="no no1">
<img src="./images/logo.png" class="tx" alt="">
<img src="./images/no1.png" class="txBox" alt="">
<div class="nick">虛位以待</div>
<div class="score">許願值:<b></b></div>
</div>
<div class="no no2">
<img src="./images/logo.png" class="tx" alt="">
<img src="./images/no2.png" class="txBox" alt="">
<div class="nick">虛位以待</div>
<div class="score">許願值:<b></b></div>
</div>
<div class="no no3">
<img src="./images/logo.png" class="tx" alt="">
<img src="./images/no3.png" class="txBox" alt="">
<div class="nick">虛位以待</div>
<div class="score">許願值:<b></b></div>
</div>
<ul>
<li>
<div class="num">4</div>
<img src="./images/logo.png" class="tx" alt="">
<div class="nick">用戶暱稱暱稱...</div>
<div class="score">許願值:<b></b></div>
</li>
<li>等你來上榜~</li>
</ul>
</div>
<div class="myRank">
<div class="num">未上榜</div>
<img src="./images/logo.png" class="tx" alt="">
<div class="nick">用戶暱稱暱稱...</div>
<div class="score">許願值:<b>0</b></div>
</div>
</div>
</div>
<!-- 恭喜获得弹窗1,2 -->
<div class="gx">
<div class="gx_in">
<img src="./images/close.png" class="close" alt="">
<ul class="box">
<!-- <li>
<div class="bg">
<img src="./images/logo.png" alt="">
</div>
<span>星星煙花</span>
<p>*10</p>
</li> -->
</ul>
<img src="./images/btn_sure.png" class="sure" alt="">
<div class="tips">禮物將自動發送到背包中,快去送給小夥伴吧~</div>
</div>
</div>
<!-- 恭喜获得弹窗3,4 -->
<div class="gxs">
<div class="gxs_in">
<img src="./images/close.png" class="close" alt="">
<ul class="box">
<!-- <li>
<div class="bg">
<img src="./images/logo.png" alt="">
</div>
<span>星星煙花</span>
<p>*10</p>
</li> -->
</ul>
<img src="./images/btn_sure.png" class="sure" alt="">
<div class="tips">禮物將自動發送到背包中,快去送給小夥伴吧~</div>
</div>
</div>
<!-- 我的獎勵弹窗 -->
<div class="recordBox">
<div class="record_in">
<img src="./images/close.png" class="close" alt="">
<p>
<span>獎勵</span>
<span>時間</span>
</p>
<ul class="box">
<!-- <li>
<b>星星煙花*<i>1</i></b>
<b>2022.08.31 <e>23:23:23</e></b>
</li>
<li>
<b>仙女棒*<i>99</i></b>
<b>2022.08.31 <e>23:23:23</e></b>
</li> -->
</ul>
<div class="tips">暫無更多獎勵記錄~</div>
</div>
</div>
<!-- 规则弹窗 -->
<div class="ruleBox">
<div class="rule_in">
<img src="./images/close.png" class="close" alt="">
</div>
</div>
<!-- 榜單獎勵 -->
<div class="rewardBox">
<div class="reward_in">
<img src="./images/close.png" class="close" alt="">
<div class="rewardTab">
<div class="tab tab1_act"></div>
<div class="tab">心願榜</div>
</div>
<div class="box">
<img src="./images/reward1.png" alt="">
</div>
</div>
</div>
<!-- 温馨提示 -->
<div class="tishiBox">
<div class="tishi_in">
<div class="title">鉆石不足,請充值後再來點燃煙花吧~</div>
<img src="./images/btn_charge.png" class="recharge" alt="">
<img src="./images/close.png" class="close" alt="">
</div>
</div>
<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/svga.min.js"></script>
<script src="./js/index.js?v=1.3"></script>
</body>
</html>

View File

@@ -0,0 +1,569 @@
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',
offset: 'b'
})
}
if (!browser.app) {//false
toastMsg('請在app內打開');
} else {
$('.wrap').removeClass('no-in-app')
}
var fireworks = 1 //1==许愿烟花 2==心愿烟花
var nowTime = new Date().getTime()
var endTime
var fireworksPrice1 = ''
var fireworksPrice2 = ''
var canWish = true //防止动效拉取中重复点击许愿按钮
$(function () {
getInfoFromClient()
setTimeout(function () {
getInit()
getRank(1)
}, 100)
})
// 播放svg
function svgaFun(num) {
player1 = new SVGA.Player('.svga1');
parser1 = new SVGA.Parser('.svga1');
parser1.load('./images/giftBg.svga', function (videoItem) {
player1.loops = 1;
player1.clearsAfterStop = false;
player1.setVideoItem(videoItem);
player1.startAnimation();
player1.setContentMode('AspectFill')
player1.onFinished(() => {
openFireworks(1, num)
$('.svga1').hide()
})
})
}
function svgaFun2(num) {
player1 = new SVGA.Player('.svga2');
parser1 = new SVGA.Parser('.svga2');
parser1.load('./images/giftBg2.svga', function (videoItem) {
player1.loops = 1;
player1.clearsAfterStop = false;
player1.setVideoItem(videoItem);
player1.startAnimation();
player1.setContentMode('AspectFill')
player1.onFinished(() => {
openFireworks(2, num)
$('.svga2').hide()
})
})
}
// 获取初始化配置
function getInit() {
showLoading()
networkRequest({
type: 'GET',
url: urlPrefix + '/act/newYearFirework/getConfig',
success(res) {
if (res.code === 200) {
endTime = res.data.endTime;
fireworksPrice1 = res.data.fireworks[1].price;
fireworksPrice2 = res.data.fireworks[2].price;
if (nowTime >= res.data.endTime) {
$('.gift-box-wrap .wish').css('filter', 'grayscale(0.8)')
}
hideLoading(layerIndex)
} else {
toastMsg(res.message)
hideLoading(layerIndex)
}
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 获奖记录接口
var page
var totalList = 0
function getConvertRecord(page) {
scrollBool = false;
showLoading()
networkRequest({
type: 'GET',
url: urlPrefix + '/act/newYearFirework/listRewardRecord',
data: { page, size: 10 },
success(res) {
if (res.code === 200) {
if (res.data.records.length > 0) {
// page++;
var str = ``;
res.data.records.forEach((res, i) => {
str += `
<li>
<b>${res.giftName}*<i>${res.totalNum}</i></b>
<b>${dateFormat(res.lastTimestamp, "yyyy.MM.dd")} <e>${dateFormat(res.lastTimestamp, "hh:mm:ss")}</e></b>
</li>
`
totalList++
});
console.log('totalList', totalList);
$('.recordBox .record_in .box').append(str);
scrollBool = true;
} else {
scrollBool = false;
$('.recordBox .record_in .tips').show();
}
$('.recordBox').show();
hideLoading(layerIndex)
} else {
scrollBool = true;
bodyScroolFun(false)
hideLoading(layerIndex)
toastMsg(res.message)
}
},
error(err) {
scrollBool = true;
bodyScroolFun(false)
hideLoading(layerIndex)
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 烟花开奖接口
function openFireworks(type, num) {
showLoading()
networkRequest({
type: 'POST',
url: urlPrefix + '/act/newYearFirework/draw',
data: { type, num },
success(res) {
if (res.code === 200) {
var list = ''
res.data.forEach(item => {
list += `
<li>
<div class="bg">
<img src="${item.giftUrl}" alt="">
</div>
<span>${item.giftName}</span>
<p>*${item.num}</p>
</li>
`
})
if (res.data.length <= 2) {
$('.gx .gx_in ul').append(list)
$('.gx').show()
} else {
$('.gxs .gxs_in ul').append(list)
$('.gxs').show()
}
canWish = true
hideLoading(layerIndex)
} else if (res.code == 31005) {
$('.tishiBox').show()
canWish = true
hideLoading(layerIndex)
} else {
toastMsg(res.message)
canWish = true
hideLoading(layerIndex)
}
},
error(err) {
canWish = true
hideLoading(layerIndex)
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 榜单接口
// type(1=许愿榜日榜、2=许愿榜总榜、3=心愿榜日榜、4=心愿榜周榜)
function getRank(type) {
$('.rank-wrap .list ul li').remove();
showLoading()
networkRequest({
type: 'GET',
url: urlPrefix + '/act/newYearFirework/getRank',
data: { type },
success(res) {
if (res.code === 200) {
let value = type == 1 ? '許願值' : type == 2 ? '許願值' : '心願值'
// 前三
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: ""
})
top3.push(...arr)
}
top3.forEach((res, index) => {
$(`.rank-wrap .list .no${index + 1} .tx`).attr('src', res.avatar);
$(`.rank-wrap .list .no${index + 1} .tx`).attr('uid', res.uid);
$(`.rank-wrap .list .no${index + 1} .nick`).html(res.nick.length > 5 ? res.nick.slice(0, 5) + '...' : res.nick);
$(`.rank-wrap .list .no${index + 1} .score`).html(`${value + ':'}${res.score > 10000 ? (Math.floor(res.score / 1000) / 10).toFixed(1) + 'w' : res.score}`);
});
// 非前三
let str = ``;
notTop3.forEach((res, i) => {
str += `
<li uid="${res.uid}">
<div class="num">${res.ranking}</div>
<img src="${res.avatar}" class="tx" alt="">
<div class="nick">${res.nick.length > 5 ? res.nick.slice(0, 5) + '...' : res.nick}</div>
<div class="score">${value}:<b>${unitProcessing(res.score, 10000, 1, 'w')}</b></div>
</li>
`
})
$('.rank-wrap .list ul').append(str);
if (notTop3.length < 7) {
$('.rank-wrap .list ul li').eq(notTop3.length - 1).after(`<li>等你來上榜~</li>`)
}
if (notTop3.length == 0) {
$('.rank-wrap .list ul').append(`<li>等你來上榜~</li>`)
}
// 自己排名
$('.rank-wrap .myRank .num').html(res.data.meRank.ranking == 0 ? '未上榜' : res.data.meRank.ranking);
$('.rank-wrap .myRank .tx').attr('src', res.data.meRank.avatar);
$('.rank-wrap .myRank .nick').text(res.data.meRank.nick.length > 5 ? res.data.meRank.nick.slice(0, 5) + '...' : res.data.meRank.nick)
$('.rank-wrap .myRank .score').html(`${value + ':'}${res.data.meRank.score > 10000 ? (Math.floor(res.data.meRank.score / 1000) / 10).toFixed(1) + 'w' : res.data.meRank.score}`);
hideLoading(layerIndex)
} else {
toastMsg(res.message)
hideLoading(layerIndex)
}
},
error(err) {
hideLoading(layerIndex)
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 埋点接口
// eventpay_click=点击去充值、pages_click=看别人主页)
function sendLog(event) {
networkRequest({
type: 'POST',
url: urlPrefix + '/act/newYearFirework/log',
data: { event: event },
success(res) {
if (res.code === 200) {
console.log(res);
}
},
error(err) {
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 点击跳转个人主页
$('.rank-wrap .list .no').click(function () {
let uid = $(this).find('.tx').attr('uid')
if (uid) {
openPerson(uid)
}
})
$('.rank-wrap .list ul').on('click', 'li', function () {
let uid = $(this).attr('uid')
if (uid) {
openPerson(uid)
}
})
// 投入+
$('.gift-box-wrap .but .add').click(function () {
let val = $('.gift-box-wrap .but input').val();
if (val >= 99) {
toastMsg('最多可輸入99')
$('.gift-box-wrap .but input').val(parseInt(99))
} else {
$('.gift-box-wrap .but input').val(parseInt(val) + 1)
}
})
// 投入-
$('.gift-box-wrap .but .cut').click(function () {
let val = $('.gift-box-wrap .but input').val();
if (val <= 1) {
toastMsg('至少投入1')
$('.gift-box-wrap .but input').val(parseInt(1))
} else {
$('.gift-box-wrap .but input').val(parseInt(val) - 1)
}
})
// 監聽輸入框
$('.gift-box-wrap .but').on('input', 'input', function () {
if ($(this).val() >= 99) {
toastMsg('最多可輸入99')
$('.gift-box-wrap .but input').val(parseInt(99))
} else if ($(this).val() <= 1) {
toastMsg('至少投入1')
$('.gift-box-wrap .but input').val(parseInt(1))
}
})
// 许愿按钮
$('.gift-box-wrap .wish').click(function () {
if (nowTime >= endTime) {
toastMsg('活动已结束~')
} else {
let num = $('.gift-box-wrap .but input').val()
if (num == 0) {
toastMsg('至少投入1')
return
}
if(canWish){
if (fireworks == 1) {
$('.svga1').show()
svgaFun(num)
canWish = false
// setTimeout(() => {
// openFireworks(1, num)
// }, 1000);
} else {
$('.svga2').show()
svgaFun2(num)
canWish = false
// setTimeout(() => {
// openFireworks(2, num)
// }, 1000);
}
}else {
toastMsg('煙花點燃中,請稍後~')
}
}
})
// 礼盒切换
$('.gift-box-wrap .wishTab .item').click(function () {
let index = $(this).index();
if (index == 0) {
$(this).addClass('item1_act').siblings().removeClass('item2_act')
$(this).html('').siblings().html('心願煙花')
$('.gift-box-wrap .wish img').attr('src', './images/wish1Btn.png')
$('.gift-box-wrap .gift-box img').attr('src', './images/giftBg.png')
$('.gift-box-wrap .award img').attr('src', './images/gift1.png')
fireworks = 1;
} else {
$(this).addClass('item2_act').siblings().removeClass('item1_act')
$(this).html('').siblings().html('許願煙花')
$('.gift-box-wrap .wish img').attr('src', './images/wish2Btn.png')
$('.gift-box-wrap .gift-box img').attr('src', './images/giftBg2.png')
$('.gift-box-wrap .award img').attr('src', './images/gift2.png')
fireworks = 2;
}
})
// 榜单切换
var thisRank = 'rank1'
$('.rank-wrap .rankTab .tab').click(function () {
let index = $(this).index();
if (index == 0) {
$(this).addClass('tab1_act').siblings().removeClass('tab2_act')
$(this).html('').siblings().html('心願榜')
$('.rank-wrap .dateTab img').eq(0).attr('src', './images/tab_day_act.png')
$('.rank-wrap .dateTab img').eq(1).attr('src', './images/tab_total.png')
getRank(1)
thisRank = 'rank1'
} else {
$(this).addClass('tab2_act').siblings().removeClass('tab1_act')
$(this).html('').siblings().html('許願榜')
$('.rank-wrap .dateTab img').eq(0).attr('src', './images/tab_day_act.png')
$('.rank-wrap .dateTab img').eq(1).attr('src', './images/tab_total.png')
getRank(3)
thisRank = 'rank2'
}
})
// 日榜总榜切换
$('.rank-wrap .dateTab img').click(function () {
let index = $(this).index();
if (index == 0) {
$(this).attr('src', './images/tab_day_act.png')
$(this).siblings().attr('src', './images/tab_total.png')
if (thisRank == 'rank1') {
getRank(1)
} else {
getRank(3)
}
} else {
$(this).attr('src', './images/tab_total_act.png')
$(this).siblings().attr('src', './images/tab_day.png')
if (thisRank == 'rank1') {
getRank(2)
} else {
getRank(4)
}
}
})
// 榜单彈窗切换
$('.rewardBox .rewardTab .tab').click(function () {
let index = $(this).index();
if (index == 0) {
$(this).addClass('tab1_act').siblings().removeClass('tab2_act')
$(this).html('').siblings().html('心願榜')
$('.rewardBox .reward_in .box img').attr('src','./images/reward1.png')
} else {
$(this).addClass('tab2_act').siblings().removeClass('tab1_act')
$(this).html('').siblings().html('許願榜')
$('.rewardBox .reward_in .box img').attr('src','./images/reward2.png')
}
})
// 规则弹窗
$('.rule').click(function () {
bodyScroolFun(true)
$('.ruleBox').show();
})
$('.ruleBox .close').click(function () {
bodyScroolFun(false)
$('.ruleBox').hide();
})
// 关闭恭喜获得弹窗
$('.gx .gx_in .sure,.close').click(function () {
$('.gx .gx_in ul li').remove()
$('.gx').hide()
})
$('.gxs .gxs_in .sure,.close').click(function () {
$('.gxs .gxs_in ul li').remove()
$('.gxs').hide()
})
// 我的獎勵
$('.record').click(function () {
bodyScroolFun(true)
page = 0;
page++
totalList = 0
$('.recordBox .record_in .box li').remove();
$('.recordBox .record_in .tips').hide();
getConvertRecord(page);
})
$('.recordBox .close').click(function () {
bodyScroolFun(false)
$('.recordBox').hide();
})
var scrollBool = true;
// 获奖记录监听滚动
$('.recordBox .record_in .box').scroll(function () {
let scrollTop = $(this).scrollTop()
let scrollHeight = $('.recordBox .record_in .box')[0].scrollHeight
let ulHeight = $(this).innerHeight()
if (scrollTop + ulHeight + 100 >= scrollHeight) {
if (scrollBool) {
page++;
getConvertRecord(page);
}
}
})
// 榜單獎勵
$('.rank-wrap .reward').click(function () {
bodyScroolFun(true)
$('.rewardBox').show();
})
$('.rewardBox .close').click(function () {
bodyScroolFun(false)
$('.rewardBox').hide();
})
// 溫馨提示
$('.tishiBox .close').click(function () {
bodyScroolFun(false)
$('.tishiBox').hide();
})
// 去充值(pay_click=点击去充值埋点)
$('.tishiBox').on('click', '.recharge', function () {
if (browser.app) {
if (browser.android) {
let channel = pubInfo.deviceInfo.channel;
console.log(pubInfo.deviceInfo);
if (channel == "google") {
sendLog('pay_click')
window.androidJsObj.openChargePage(0);
} else {
sendLog('pay_click')
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
} else if (browser.ios) {
sendLog('pay_click')
window.webkit.messageHandlers.openChargePage.postMessage(null)
}
} else {
toastMsg('請在app內打開')
}
})
//跳转个人主页 pages_click=看别人主页埋点)
function openPerson(uid) {
if (browser.app) {
if (browser.ios) {
sendLog('pages_click')
window.webkit.messageHandlers.openPersonPage.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
sendLog('pages_click')
window.androidJsObj.openPersonPage(uid);
}
}
} else {
toastMsg('請在app內打開')
}
}
// 控制body是否可以滑动
function bodyScroolFun(bool) {
if (bool) {
$('body').css('overflow', 'hidden');
} else {
$('body').css('overflow', 'auto');
}
}

View File

@@ -52,7 +52,7 @@ body {
color: white;
display: flex;
align-items: center;
background: url("../images/previous-result-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-previous-result-bg.png") no-repeat 0 0/100% 100%;
z-index: 9;
}
.wrap .previous-result span {
@@ -67,11 +67,19 @@ body {
width: 0.5333333333rem;
height: 0.5333333333rem;
margin-left: 0.1066666667rem;
background: url("../images/little-bubble.png") 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-little-bubble.png") 0 0/100% 100%;
}
.wrap .previous-result .result-list p img {
width: 100%;
}
.wrap .previous-result .more-result {
width: 0.56rem;
height: 0.5866666667rem;
margin-left: 0.2rem;
}
.wrap .previous-result .more-result img {
width: 100%;
}
.wrap .mall {
position: absolute;
top: 2.4533333333rem;
@@ -89,7 +97,14 @@ body {
z-index: 9;
width: 100%;
height: 14.0533333333rem;
background: url("../images/game-area.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-game-area.png") no-repeat 0 0/100% 100%;
}
.wrap .game-area .roundId {
font-size: 0.2666666667rem;
color: #701800;
position: absolute;
top: 0.16rem;
left: 0.4666666667rem;
}
.wrap .game-area .select-time {
display: none;
@@ -104,7 +119,7 @@ body {
width: 4.2933333333rem;
height: 0.96rem;
line-height: 0.8266666667rem;
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
text-align: center;
font-size: 0.32rem;
font-weight: bold;
@@ -115,7 +130,7 @@ body {
width: 4.9066666667rem;
height: 0.9066666667rem;
line-height: 0.9066666667rem;
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
font-size: 0.2933333333rem;
color: #F0C799;
}
@@ -131,7 +146,7 @@ body {
height: 1.9733333333rem;
margin-top: 1.7333333333rem;
margin-right: 0.4266666667rem;
background: url("../images/bubble-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-bubble-bg.png") no-repeat 0 0/100% 100%;
}
.wrap .game-area .select-time ul li:nth-child(-n+4) {
margin-top: 1.0666666667rem;
@@ -149,7 +164,7 @@ body {
height: 0.3733333333rem;
line-height: 0.3733333333rem;
text-align: center;
background: url("../images/multiple-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-multiple-bg.png") no-repeat 0 0/100% 100%;
font-size: 0.2666666667rem;
font-weight: bold;
color: white;
@@ -164,7 +179,7 @@ body {
box-sizing: border-box;
width: 1.8133333333rem;
height: 0.7733333333rem;
background: url("../images/name-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-name-bg.png") no-repeat 0 0/100% 100%;
text-align: center;
font-size: 0.2666666667rem;
font-weight: bold;
@@ -173,7 +188,7 @@ body {
.wrap .game-area .select-time ul li .name.general {
height: 0.6133333333rem;
line-height: 0.4rem;
background: url("../images/name-general-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-name-general-bg.png") no-repeat 0 0/100% 100%;
}
.wrap .game-area .select-time ul li .name .gift-price {
font-size: 0.24rem;
@@ -186,7 +201,7 @@ body {
position: absolute;
top: -0.96rem;
left: -0.3733333333rem;
background: url("../images/qipao-2s.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-qipao-2s.png") no-repeat 0 0/100% 100%;
transform: rotate(343deg);
text-indent: 0.2133333333rem;
}
@@ -218,20 +233,20 @@ body {
width: 9.4666666667rem;
height: 1.68rem;
margin: 1.8666666667rem auto 0;
background: url("../images/btn-wrap-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-btn-wrap-bg.png") no-repeat 0 0/100% 100%;
}
.wrap .game-area .select-time .btn-wrap div {
display: flex;
justify-content: center;
width: 2.5333333333rem;
height: 1.0666666667rem;
background: url("../images/fragment-btn.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-fragment-btn.png") no-repeat 0 0/100% 100%;
line-height: 1.0666666667rem;
font-size: 0.4rem;
color: #975B25;
}
.wrap .game-area .select-time .btn-wrap div.active {
background-image: url("../images/fragment-btn-active.png");
background-image: url("https://img.pekolive.com/cf-fragment-btn-active.png");
color: #B33E17;
}
.wrap .game-area .select-time .btn-wrap div:first-child {
@@ -271,7 +286,7 @@ body {
width: 4.2933333333rem;
height: 0.96rem;
line-height: 0.8266666667rem;
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
text-align: center;
color: #B82F1A;
font-size: 0.32rem;
@@ -282,16 +297,19 @@ body {
width: 4.9066666667rem;
height: 0.9066666667rem;
line-height: 0.9066666667rem;
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
text-align: center;
font-size: 0.2933333333rem;
color: #FFF0C799;
color: rgba(255, 240, 199, 0.6);
font-weight: bold;
}
.wrap .game-area .draw-time {
display: none;
width: 10rem;
height: 8rem;
width: 2.8rem;
height: 2.84rem;
margin: 1.2rem auto 0.2rem;
background: url("https://img.pekolive.com/cf-drawBg.png");
background-size: 100% 100%;
}
.wrap .game-area .draw-time .count-down,
.wrap .game-area .draw-time .current-tip {
@@ -303,7 +321,7 @@ body {
width: 4.2933333333rem;
height: 0.96rem;
line-height: 0.8266666667rem;
background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
text-align: center;
font-size: 0.32rem;
color: #B82F1A;
@@ -314,7 +332,7 @@ body {
width: 4.9066666667rem;
height: 0.9066666667rem;
line-height: 0.9066666667rem;
background: url("../images/tip.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
font-size: 0.2933333333rem;
color: #F0C799;
}
@@ -322,8 +340,9 @@ body {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 3.2rem;
bottom: 3.1rem;
width: 100%;
height: 4rem;
}
.wrap .game-area .draw-time .top-three .top-three-title {
display: flex;
@@ -340,52 +359,264 @@ body {
border: 0.0133333333rem solid white;
}
.wrap .game-area .draw-time .top-three .top-three-list {
display: flex;
justify-content: space-between;
width: 4.5333333333rem;
margin: auto;
position: relative;
}
.wrap .game-area .draw-time .top-three .top-three-list p {
width: 0.9866666667rem;
height: 0.9866666667rem;
.wrap .game-area .draw-time .top-three .top-three-list .no1 {
width: 2.5066666667rem;
height: 2.24rem;
background: linear-gradient(0deg, #FFD871 0%, #FFA352 81%);
border-radius: 0.24rem;
position: relative;
top: 1.3rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list p img {
width: 100%;
height: 100%;
.wrap .game-area .draw-time .top-three .top-three-list .no1 .tx {
width: 1.7333333333rem;
height: 1.7333333333rem;
border-radius: 50%;
border: 0.0266666667rem solid #FEEF60;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no1 .txBox {
width: 1.7466666667rem;
height: 2.2666666667rem;
position: absolute;
top: -1.41rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no1 .nick {
width: 100%;
font-size: 0.2933333333rem;
color: #fff;
text-align: center;
position: absolute;
top: 1.1733333333rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no1 .num {
width: 100%;
height: 0.4rem;
position: absolute;
bottom: 0.15rem;
line-height: 0.35rem;
text-align: center;
}
.wrap .game-area .draw-time .top-three .top-three-list .no1 .num .diamond {
width: 0.3333333333rem;
height: 0.3333333333rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no1 .num span {
font-size: 0.2933333333rem;
color: #fff;
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 {
width: 2.16rem;
height: 1.8933333333rem;
background: linear-gradient(0deg, #7DD5FF 0%, #5A8FFF 100%);
border-radius: 0.24rem;
position: relative;
top: -0.55rem;
left: 1.15rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .tx {
width: 1.7333333333rem;
height: 1.7333333333rem;
border-radius: 50%;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .txBox {
width: 1.7466666667rem;
height: 2.2666666667rem;
position: absolute;
top: -1.4rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .nick {
width: 100%;
font-size: 0.2933333333rem;
color: #fff;
text-align: center;
position: absolute;
top: 1.0133333333rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .num {
width: 100%;
height: 0.3333333333rem;
position: absolute;
bottom: 0.14rem;
text-align: center;
line-height: 0.3333333333rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .num .diamond {
width: 0.3333333333rem;
height: 0.3333333333rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no2 .num span {
font-size: 0.2933333333rem;
color: #fff;
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 {
width: 2.16rem;
height: 1.8933333333rem;
background: linear-gradient(0deg, #FFAE88 0%, #FC6CCF 81%);
border-radius: 0.24rem;
position: relative;
position: relative;
top: -2.45rem;
left: 6.7rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .tx {
width: 1.7333333333rem;
height: 1.7333333333rem;
border-radius: 50%;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .txBox {
width: 1.7466666667rem;
height: 2.2666666667rem;
position: absolute;
top: -1.44rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .nick {
width: 100%;
font-size: 0.2933333333rem;
color: #fff;
text-align: center;
position: absolute;
top: 1.0133333333rem;
left: 50%;
transform: translateX(-50%);
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .num {
width: 100%;
height: 0.3333333333rem;
position: absolute;
bottom: 0.14rem;
text-align: center;
line-height: 0.3333333333rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .num .diamond {
width: 0.3333333333rem;
height: 0.3333333333rem;
}
.wrap .game-area .draw-time .top-three .top-three-list .no3 .num span {
font-size: 0.2933333333rem;
color: #fff;
}
.wrap .game-area .draw-time .draw-pic {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 1.92rem;
top: 1.65rem;
z-index: 1;
width: 3.7333333333rem;
height: 3.7333333333rem;
width: 1.3333333333rem;
}
.wrap .game-area .draw-time .draw-pic img {
width: 100%;
height: 100%;
}
.wrap .game-area .draw-time .award-info {
width: 8rem;
box-sizing: border-box;
position: absolute;
top: 8rem;
width: 100%;
font-family: "pingfang-bold";
text-align: center;
font-size: 0.32rem;
font-weight: bold;
left: 50%;
transform: translateX(-50%);
top: 6.5rem;
display: flex;
}
.wrap .game-area .draw-time .award-info .desc {
color: #FEEF60;
margin-bottom: 0.16rem;
color: #fff;
font-size: 0.3733333333rem;
font-weight: 600;
}
.wrap .game-area .draw-time .award-info .diamond {
width: 0.35rem;
height: 0.35rem;
margin-left: 0.5rem;
margin-right: 0.1rem;
}
.wrap .game-area .draw-time .award-info .award-wrap {
color: white;
}
.wrap .game-area .draw-time .award-info .award-wrap .award-total {
color: #FEEF60;
font-weight: 600;
font-size: 0.3733333333rem;
}
.wrap .game-area .draw-time .put-wrap {
width: 8rem;
height: 2.44rem;
box-sizing: border-box;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.8rem;
display: flex;
}
.wrap .game-area .draw-time .put-wrap .put {
font-size: 0.3733333333rem;
color: #FFFFFF;
font-weight: 600;
margin-right: 0.4rem;
margin-top: 0.3rem;
}
.wrap .game-area .draw-time .put-wrap .list {
width: 6.72rem;
height: 2.7733333333rem;
display: flex;
flex-wrap: wrap;
}
.wrap .game-area .draw-time .put-wrap .list .item {
width: 0.9866666667rem;
height: 1.2rem;
margin-right: 0.92rem;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.wrap .game-area .draw-time .put-wrap .list .item:nth-child(4n) {
margin-right: 0;
}
.wrap .game-area .draw-time .put-wrap .list .item p {
width: 0.8266666667rem;
height: 0.8266666667rem;
background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
background-size: 100% 100%;
}
.wrap .game-area .draw-time .put-wrap .list .item p .gift {
width: 75%;
margin-top: 0.1rem;
margin-left: 0.1rem;
}
.wrap .game-area .draw-time .put-wrap .list .item div {
width: 100%;
height: 0.3333333333rem;
display: flex;
align-items: center;
justify-content: center;
}
.wrap .game-area .draw-time .put-wrap .list .item div .diamond {
width: 0.33rem;
height: 0.33rem;
}
.wrap .game-area .draw-time .put-wrap .list .item div .in {
font-size: 0.2666666667rem;
color: #FFFFFF;
font-weight: 600;
white-space: nowrap;
}
.wrap .info-bottom {
position: fixed;
@@ -394,16 +625,16 @@ body {
z-index: 99;
width: 100%;
height: 1.7333333333rem;
background: url("../images/index-bottom.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-index-bottom.png") no-repeat 0 0/100% 100%;
display: flex;
align-items: center;
}
.wrap .info-bottom .f-wrap {
.wrap .info-bottom .info-wrap {
margin-top: 0.1866666667rem;
}
.wrap .info-bottom .f-wrap .fragment,
.wrap .info-bottom .f-wrap .award {
width: 3.3333333333rem;
.wrap .info-bottom .info-wrap .diamond-num,
.wrap .info-bottom .info-wrap .fragment-num {
width: 4rem;
height: 0.56rem;
background-color: #BD7F38;
border-radius: 0.2666666667rem;
@@ -413,6 +644,7 @@ body {
color: white;
text-indent: 0.1333333333rem;
margin-bottom: 0.1333333333rem;
white-space: nowrap;
}
.wrap .info-bottom .avatar {
width: 1.3333333333rem;
@@ -453,7 +685,7 @@ body {
transform: translate(-50%, -50%);
width: 7.68rem;
height: 8.88rem;
background: url("../images/rule-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-rule-bg.png") no-repeat 0 0/100% 100%;
font-size: 0.3466666667rem;
color: #B58147;
font-weight: 600;
@@ -470,12 +702,13 @@ body {
}
.wrap .shade-mask .shade-content main div {
line-height: 1.2;
margin-top: 0.2rem;
}
.wrap .shade-mask .shade-content main div .title {
width: 3.36rem;
height: 0.6133333333rem;
line-height: 0.6133333333rem;
background: url("../images/title-bg.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-title-bg.png") no-repeat 0 0/100% 100%;
margin: 0 auto 0.2933333333rem;
text-align: center;
}
@@ -489,7 +722,7 @@ body {
height: 3.9866666667rem;
}
.wrap .shade-mask .shade-content main div .jietu.t3 {
height: 4.0133333333rem;
height: 4.2rem;
}
.wrap .shade-mask-rank {
display: none;
@@ -569,7 +802,7 @@ body {
z-index: 99;
width: 100%;
height: 100%;
background: url("../images/first.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-first.png") no-repeat 0 0/100% 100%;
}
.wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar img {
position: relative;
@@ -763,7 +996,7 @@ body {
z-index: 99;
width: 100%;
height: 1.7333333333rem;
background: url("../images/mall/bottom.png") no-repeat 0 0/100% 100%;
background: url("https://img.pekolive.com/cf-bottom.png") no-repeat 0 0/100% 100%;
display: flex;
align-items: center;
}

View File

@@ -1,6 +1,9 @@
@function px2rem($px, $rem:75) {
@function px2rem($px, $rem: 75) {
@return $px / $rem+rem;
}
@function prefixurl() {
@return 'https://img.pekolive.com/'
}
@font-face {
font-family: 'pingfang-bold';
@@ -71,7 +74,7 @@ body {
color: white;
display: flex;
align-items: center;
background: url('../images/previous-result-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-previous-result-bg.png') no-repeat 0 0/100% 100%;
z-index: 9;
span {
@@ -92,15 +95,29 @@ body {
width: px2rem(40);
height: px2rem(40);
margin-left: px2rem(8);
background: url('../images/little-bubble.png') 0 0/100% 100%;
background: url(prefixurl()+'cf-little-bubble.png') 0 0/100% 100%;
// &:last-child{
// background: url('../images/last-little-bubble.png') 0 0/100% 100%,url('../images/little-bubble.png') 0 0/100% 100%;
// &:nth-child(11){
// width: px2rem(40, );
// height: px2rem(42, );
// margin-left: 0.25rem;
// background: url('../images/btn_result.png') 0 0/100% 100%;
// }
img {
width: 100%;
}
}
}
.more-result {
width: px2rem(42);
height: px2rem(44);
margin-left: 0.2rem;
img {
width: 100%;
}
}
}
@@ -124,7 +141,15 @@ body {
z-index: 9;
width: 100%;
height: px2rem(1054);
background: url('../images/game-area.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-game-area.png') no-repeat 0 0/100% 100%;
.roundId {
font-size: px2rem(20, );
color: #701800;
position: absolute;
top: px2rem(12, );
left: px2rem(35, );
}
// 等待倒计时30s
.select-time {
@@ -140,7 +165,7 @@ body {
width: px2rem(322);
height: px2rem(72);
line-height: px2rem(62);
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
text-align: center;
font-size: px2rem(24);
font-weight: bold;
@@ -152,7 +177,7 @@ body {
width: px2rem(368);
height: px2rem(68);
line-height: px2rem(68);
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
font-size: px2rem(22);
color: #F0C799;
}
@@ -171,7 +196,7 @@ body {
height: px2rem(148);
margin-top: px2rem(130);
margin-right: px2rem(32);
background: url('../images/bubble-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-bubble-bg.png') no-repeat 0 0/100% 100%;
&:nth-child(-n+4) {
margin-top: px2rem(80);
@@ -191,7 +216,7 @@ body {
height: px2rem(28);
line-height: px2rem(28);
text-align: center;
background: url('../images/multiple-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-multiple-bg.png') no-repeat 0 0/100% 100%;
font-size: px2rem(20);
font-weight: bold;
color: white;
@@ -207,7 +232,7 @@ body {
box-sizing: border-box;
width: px2rem(136);
height: px2rem(58);
background: url('../images/name-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-name-bg.png') no-repeat 0 0/100% 100%;
text-align: center;
font-size: px2rem(20);
font-weight: bold;
@@ -216,7 +241,7 @@ body {
&.general {
height: px2rem(46);
line-height: px2rem(30);
background: url('../images/name-general-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-name-general-bg.png') no-repeat 0 0/100% 100%;
}
.gift-price {
@@ -234,7 +259,7 @@ body {
position: absolute;
top: px2rem(-72);
left: px2rem(-28);
background: url('../images/qipao-2s.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-qipao-2s.png') no-repeat 0 0/100% 100%;
transform: rotate(343deg);
text-indent: px2rem(16);
@@ -282,20 +307,20 @@ body {
width: px2rem(710);
height: px2rem(126);
margin: px2rem(140) auto 0;
background: url('../images/btn-wrap-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-btn-wrap-bg.png') no-repeat 0 0/100% 100%;
div {
display: flex;
justify-content: center;
width: px2rem(190);
height: px2rem(80);
background: url('../images/fragment-btn.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-fragment-btn.png') no-repeat 0 0/100% 100%;
line-height: px2rem(80);
font-size: px2rem(30);
color: #975B25;
&.active {
background-image: url('../images/fragment-btn-active.png');
background-image: url(prefixurl()+'cf-fragment-btn-active.png');
color: #B33E17;
}
@@ -346,7 +371,7 @@ body {
width: px2rem(322);
height: px2rem(72);
line-height: px2rem(62);
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
text-align: center;
color: #B82F1A;
font-size: px2rem(24);
@@ -358,7 +383,7 @@ body {
width: px2rem(368);
height: px2rem(68);
line-height: px2rem(68);
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
text-align: center;
font-size: px2rem(22);
color: #FFF0C799;
@@ -370,11 +395,14 @@ body {
// 开奖时间
.draw-time {
display: none;
width: px2rem(750);
height: px2rem(600);
// width: px2rem(750);
// height: px2rem(600);
width: px2rem(210, );
height: px2rem(213, );
margin: 1.2rem auto 0.2rem;
background: url(prefixurl()+'cf-drawBg.png');
background-size: 100% 100%;
// margin: auto;
// margin-top: px2rem(80);
.count-down,
.current-tip {
font-family: 'pingfang-bold';
@@ -385,7 +413,7 @@ body {
width: px2rem(322);
height: px2rem(72);
line-height: px2rem(62);
background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
text-align: center;
font-size: px2rem(24);
color: #B82F1A;
@@ -397,7 +425,7 @@ body {
width: px2rem(368);
height: px2rem(68);
line-height: px2rem(68);
background: url('../images/tip.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
font-size: px2rem(22);
color: #F0C799;
}
@@ -406,8 +434,9 @@ body {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: px2rem(240);
bottom: 3.1rem;
width: 100%;
height: 4rem;
.top-three-title {
display: flex;
@@ -426,20 +455,194 @@ body {
}
.top-three-list {
display: flex;
justify-content: space-between;
width: px2rem(340);
margin: auto;
// display: flex;
// justify-content: space-between;
// width: px2rem(340);
// margin: auto;
position: relative;
p {
width: px2rem(74);
height: px2rem(74);
.no1 {
width: px2rem(188);
height: px2rem(168);
background: linear-gradient(0deg, #FFD871 0%, #FFA352 81%);
border-radius: px2rem(18, );
position: relative;
top: 1.3rem;
left: 50%;
transform: translateX(-50%);
img {
width: 100%;
height: 100%;
.tx {
width: px2rem(130, );
height: px2rem(130, );
border-radius: 50%;
border: px2rem(2) solid #FEEF60;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.txBox {
width: px2rem(131, );
height: px2rem(170, );
position: absolute;
top: -1.41rem;
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
font-size: px2rem(22, );
color: #fff;
text-align: center;
position: absolute;
top: px2rem(88, );
left: 50%;
transform: translateX(-50%);
}
.num {
width: 100%;
height: 0.4rem;
position: absolute;
bottom: 0.15rem;
// display: flex;
// align-items: center;
// justify-content: center;
line-height: 0.35rem;
text-align: center;
.diamond {
width: px2rem(25, );
height: px2rem(25, );
}
span {
font-size: px2rem(22, );
color: #fff;
}
}
}
.no2 {
width: px2rem(162, );
height: px2rem(142, );
background: linear-gradient(0deg, #7DD5FF 0%, #5A8FFF 100%);
border-radius: px2rem(18, );
position: relative;
top: -0.55rem;
left: 1.15rem;
.tx {
width: px2rem(130, );
height: px2rem(130, );
border-radius: 50%;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.txBox {
width: px2rem(131, );
height: px2rem(170, );
position: absolute;
top: -1.4rem;
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
font-size: px2rem(22, );
color: #fff;
text-align: center;
position: absolute;
top: px2rem(76, );
left: 50%;
transform: translateX(-50%);
}
.num {
width: 100%;
height: px2rem(25, );
position: absolute;
bottom: 0.14rem;
text-align: center;
line-height: px2rem(25, );
.diamond {
width: px2rem(25, );
height: px2rem(25, );
}
span {
font-size: px2rem(22, );
color: #fff;
}
}
}
.no3 {
width: px2rem(162, );
height: px2rem(142, );
background: linear-gradient(0deg, #FFAE88 0%, #FC6CCF 81%);
border-radius: px2rem(18, );
position: relative;
position: relative;
top: -2.45rem;
left: 6.7rem;
.tx {
width: px2rem(130, );
height: px2rem(130, );
border-radius: 50%;
position: absolute;
top: -0.9rem;
left: 50%;
transform: translateX(-50%);
}
.txBox {
width: px2rem(131, );
height: px2rem(170, );
position: absolute;
top: -1.44rem;
left: 50%;
transform: translateX(-50%);
}
.nick {
width: 100%;
font-size: px2rem(22, );
color: #fff;
text-align: center;
position: absolute;
top: px2rem(76, );
left: 50%;
transform: translateX(-50%);
}
.num {
width: 100%;
height: px2rem(25, );
position: absolute;
bottom: 0.14rem;
text-align: center;
line-height: px2rem(25, );
.diamond {
width: px2rem(25, );
height: px2rem(25, );
}
span {
font-size: px2rem(22, );
color: #fff;
}
}
}
}
@@ -449,39 +652,126 @@ body {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: px2rem(144);
top: 1.65rem;
z-index: 1;
width: px2rem(280);
height: px2rem(280);
width: px2rem(100);
// height: px2rem(91);
img {
width: 100%;
height: 100%;
// height: 100%;
// margin: -0.3rem 0 0 1.18rem;
}
}
.award-info {
width: px2rem(600, );
// height: px2rem(183, );
box-sizing: border-box;
position: absolute;
top: px2rem(600);
width: 100%;
font-family: 'pingfang-bold';
text-align: center;
font-size: px2rem(24);
font-weight: bold;
left: 50%;
transform: translateX(-50%);
top: 6.5rem;
display: flex;
.desc {
color: #FEEF60;
margin-bottom: px2rem(12);
color: #fff;
font-size: px2rem(28, );
font-weight: 600;
}
.diamond {
width: 0.35rem;
height: 0.35rem;
margin-left: 0.5rem;
margin-right: 0.1rem;
}
.award-wrap {
color: white;
color: #FEEF60;
font-weight: 600;
font-size: px2rem(28, );
// .award-total {
// color: #FEEF60;
// }
}
}
.award-total {
color: #FEEF60;
.put-wrap {
width: px2rem(600, );
height: px2rem(183, );
// line-height: px2rem(183, );
box-sizing: border-box;
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 3.8rem;
display: flex;
.put {
font-size: px2rem(28, );
color: #FFFFFF;
font-weight: 600;
margin-right: 0.4rem;
margin-top: 0.3rem;
}
.list {
width: px2rem(504, );
height: px2rem(208, );
display: flex;
flex-wrap: wrap;
.item {
width: px2rem(74, );
height: px2rem(90, );
margin-right: 0.92rem;
// position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
&:nth-child(4n) {
margin-right: 0;
}
p {
width: px2rem(62, );
height: px2rem(62, );
background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
background-size: 100% 100%;
.gift {
width: 75%;
margin-top: 0.1rem;
margin-left: 0.1rem;
}
}
div {
width: 100%;
height: px2rem(25, );
display: flex;
align-items: center;
justify-content: center;
.diamond {
width: 0.33rem;
height: 0.33rem;
}
.in {
font-size: px2rem(20, );
color: #FFFFFF;
font-weight: 600;
white-space: nowrap;
}
}
}
}
}
}
}
@@ -493,17 +783,18 @@ body {
z-index: 99;
width: 100%;
height: px2rem(130);
background: url('../images/index-bottom.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-index-bottom.png') no-repeat 0 0/100% 100%;
display: flex;
// justify-content: space-evenly;
align-items: center;
.f-wrap {
.info-wrap {
margin-top: px2rem(14);
.fragment,
.award {
width: px2rem(250);
.diamond-num,
.fragment-num {
// width: px2rem(250);
width: 4rem;
height: px2rem(42);
background-color: #BD7F38;
border-radius: px2rem(20);
@@ -513,6 +804,7 @@ body {
color: white;
text-indent: px2rem(10);
margin-bottom: px2rem(10);
white-space: nowrap;
}
}
@@ -561,7 +853,7 @@ body {
transform: translate(-50%, -50%);
width: px2rem(576);
height: px2rem(666);
background: url('../images/rule-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-rule-bg.png') no-repeat 0 0/100% 100%;
// padding: px2rem(56) px2rem(54) px2rem(42) px2rem(40);
// box-sizing: border-box;
font-size: px2rem(26);
@@ -580,12 +872,13 @@ body {
div {
line-height: 1.2;
margin-top: 0.2rem;
.title {
width: px2rem(252);
height: px2rem(46);
line-height: px2rem(46);
background: url('../images/title-bg.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-title-bg.png') no-repeat 0 0/100% 100%;
margin: 0 auto px2rem(22);
text-align: center;
}
@@ -601,7 +894,8 @@ body {
}
&.t3 {
height: px2rem(301);
// height: px2rem(301);
height: 4.2rem;
}
}
}
@@ -696,7 +990,7 @@ body {
z-index: 99;
width: 100%;
height: 100%;
background: url('../images/first.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-first.png') no-repeat 0 0/100% 100%;
}
img {
@@ -927,7 +1221,7 @@ body {
z-index: 99;
width: 100%;
height: px2rem(130);
background: url('../images/mall/bottom.png') no-repeat 0 0/100% 100%;
background: url(prefixurl()+'cf-bottom.png') no-repeat 0 0/100% 100%;
display: flex;
align-items: center;

View File

@@ -46,8 +46,8 @@ body {
}
.record-list li {
width: 100%;
height: 5.6rem;
background: url(../images/record/record-bg.png) no-repeat;
height: 6.9733333333rem;
background: url("https://img.pekolive.com/cf-record-bg.png") no-repeat;
background-size: 100% 100%;
border-radius: 0.2666666667rem;
overflow: hidden;
@@ -66,18 +66,123 @@ body {
line-height: 0.5866666667rem;
background: #F46331;
display: flex;
justify-content: space-between;
box-sizing: border-box;
padding: 0 0.2666666667rem;
margin: 0.2rem auto 0;
}
.record-list li .goldBox span {
.record-list li .goldBox p {
color: #fff;
font-size: 0.3733333333rem;
width: 50%;
text-align: center;
display: none;
}
.record-list li .goldBox .gold {
font-size: 0.3466666667rem;
color: #FEEF60;
.record-list li .goldBox span {
color: #FFF773;
font-size: 0.2666666667rem;
}
.record-list li .result-wrap {
width: 84%;
height: 1.2133333333rem;
line-height: 1.2133333333rem;
box-sizing: border-box;
margin: 0.0666666667rem auto 0.3333333333rem;
display: flex;
justify-content: space-between;
}
.record-list li .result-wrap .result {
display: flex;
align-items: center;
}
.record-list li .result-wrap .result span {
font-size: 0.3733333333rem;
color: #FFFFFF;
padding-right: 0.1866666667rem;
font-weight: 600;
}
.record-list li .result-wrap .result .bg {
width: 1.2133333333rem;
height: 1.2133333333rem;
background: url("https://img.pekolive.com/cf-record_bubble_act.png") no-repeat;
background-size: 100% 100%;
text-align: center;
}
.record-list li .result-wrap .result .bg img {
width: 75%;
margin-top: 0.15rem;
}
.record-list li .result-wrap .award {
display: flex;
align-items: center;
}
.record-list li .result-wrap .award p,
.record-list li .result-wrap .award b {
font-size: 0.3733333333rem;
color: #FFFFFF;
font-weight: 600;
}
.record-list li .result-wrap .award .diamond {
width: 0.3733333333rem;
height: 0.3733333333rem;
}
.record-list li .put-wrap {
width: 84%;
height: 1.2133333333rem;
line-height: 1.2133333333rem;
box-sizing: border-box;
margin: 0 auto;
display: flex;
}
.record-list li .put-wrap .put {
font-size: 0.3733333333rem;
color: #FFFFFF;
font-weight: 600;
margin-right: 0.9rem;
}
.record-list li .put-wrap .list {
width: 6.72rem;
height: 2.7733333333rem;
display: flex;
flex-wrap: wrap;
}
.record-list li .put-wrap .list .item {
width: 0.9866666667rem;
height: 1.2rem;
margin-right: 0.92rem;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.record-list li .put-wrap .list .item:nth-child(4n) {
margin-right: 0;
}
.record-list li .put-wrap .list .item p {
width: 0.8266666667rem;
height: 0.8266666667rem;
background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
background-size: 100% 100%;
}
.record-list li .put-wrap .list .item p .gift {
width: 75%;
margin-top: 0.1rem;
margin-left: 0.1rem;
}
.record-list li .put-wrap .list .item div {
width: 100%;
height: 0.3333333333rem;
display: flex;
align-items: center;
justify-content: center;
}
.record-list li .put-wrap .list .item div .diamond {
width: 0.3333333333rem;
height: 0.2666666667rem;
}
.record-list li .put-wrap .list .item div .in {
font-size: 0.2666666667rem;
color: #FFFFFF;
font-weight: 600;
white-space: nowrap;
}
.record-list li .marine_organism {
width: 78%;
@@ -131,12 +236,5 @@ body {
font-weight: bold;
font-size: 0.32rem;
}
.record-list li p {
color: #fff;
width: 100%;
text-align: center;
margin-top: 0.9rem;
display: none;
}
/*# sourceMappingURL=record.css.map */

View File

@@ -1,6 +1,9 @@
@function px2rem($px, $rem:75) {
@function px2rem($px, $rem: 75) {
@return $px / $rem+rem;
}
@function prefixurl() {
@return 'https://img.pekolive.com/'
}
@font-face {
font-family: 'pingfang-bold';
@@ -60,9 +63,9 @@ body {
li {
width: 100%;
height: px2rem(420, );
height: px2rem(523, );
// background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
background: url(../images/record/record-bg.png) no-repeat;
background: url(prefixurl()+'cf-record-bg.png') no-repeat;
background-size: 100% 100%;
border-radius: px2rem(20, );
overflow: hidden;
@@ -83,19 +86,150 @@ body {
line-height: px2rem(44, );
background: #F46331;
display: flex;
justify-content: space-between;
// justify-content: space-between;
box-sizing: border-box;
padding: 0 px2rem(20, );
margin: 0.2rem auto 0;
span {
p {
color: #fff;
font-size: px2rem(28, );
width: 50%;
text-align: center;
display: none;
}
.gold {
font-size: px2rem(26, );
color: #FEEF60;
span {
color: #FFF773;
font-size: px2rem(20, );
}
// .gold {
// font-size: px2rem(26, );
// color: #FEEF60;
// }
}
.result-wrap {
width: 84%;
height: px2rem(91, );
line-height: px2rem(91, );
box-sizing: border-box;
margin: px2rem(5, ) auto px2rem(25, );
display: flex;
justify-content: space-between;
.result {
display: flex;
align-items: center;
span {
font-size: px2rem(28, );
color: #FFFFFF;
padding-right: px2rem(14, );
font-weight: 600;
}
.bg {
width: px2rem(91, );
height: px2rem(91, );
background: url(prefixurl()+'cf-record_bubble_act.png') no-repeat;
background-size: 100% 100%;
text-align: center;
img {
width: 75%;
margin-top: 0.15rem;
}
}
}
.award {
display: flex;
align-items: center;
p,
b {
font-size: px2rem(28, );
color: #FFFFFF;
font-weight: 600;
}
.diamond {
width: px2rem(28, );
height: px2rem(28, );
}
}
}
.put-wrap {
width: 84%;
height: px2rem(91, );
line-height: px2rem(91, );
box-sizing: border-box;
margin: 0 auto;
display: flex;
.put {
font-size: px2rem(28, );
color: #FFFFFF;
font-weight: 600;
margin-right: 0.9rem;
}
.list {
width: px2rem(504, );
height: px2rem(208, );
display: flex;
flex-wrap: wrap;
.item {
width: px2rem(74, );
height: px2rem(90, );
margin-right: 0.92rem;
// position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
&:nth-child(4n) {
margin-right: 0;
}
p {
width: px2rem(62, );
height: px2rem(62, );
background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
background-size: 100% 100%;
.gift {
width: 75%;
margin-top: 0.1rem;
margin-left: 0.1rem;
}
}
div {
width: 100%;
height: px2rem(25, );
display: flex;
align-items: center;
justify-content: center;
.diamond {
width: px2rem(25, );
height: px2rem(20, );
}
.in {
font-size: px2rem(20, );
color: #FFFFFF;
font-weight: 600;
white-space: nowrap;
}
}
}
}
}
@@ -161,12 +295,5 @@ body {
}
}
p {
color: #fff;
width: 100%;
text-align: center;
margin-top: 0.9rem;
display: none;
}
}
}

View File

@@ -0,0 +1,99 @@
@font-face {
font-family: "pingfang-bold";
src: url("../../../common/fonts/PingFang Bold.ttf");
src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
}
@font-face {
font-family: "pingfang-medium";
src: url("../../../common/fonts/PingFang-Medium.ttf");
src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg");
}
html,
body {
width: 100%;
background: #E6AD6A;
}
.header {
width: 10rem;
height: 4.2266666667rem;
background: url("https://img.pekolive.com/cf-result_main.png");
background-size: 100% 100%;
margin: 0 auto;
position: relative;
}
.header .title {
width: 6.1866666667rem;
height: 1.5333333333rem;
position: absolute;
top: 1.4rem;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.header span {
font-size: 0.5333333333rem;
font-weight: 600;
color: #B82F1A;
position: absolute;
top: 1.75rem;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
.main {
width: 10rem;
height: 15.6rem;
background: url("https://img.pekolive.com/cf-game-area.png");
background-size: 100% 100%;
margin: -1.85rem auto 0;
position: relative;
overflow: hidden;
}
.main li {
width: 9.4533333333rem;
height: 1.1466666667rem;
line-height: 1.1466666667rem;
background: url("https://img.pekolive.com/cf-result_list_bg.png");
background-size: 100% 100%;
box-sizing: border-box;
margin: 0 auto 0.24rem;
}
.main li:nth-child(1) {
margin-top: 1.5733333333rem;
}
.main li .session {
float: left;
width: 1.68rem;
height: 100%;
font-size: 0.4rem;
font-weight: 600;
color: #FFFFFF;
-webkit-text-stroke: 0.0133333333rem #FC8220;
margin-left: 0.4rem;
text-align: center;
}
.main li .list {
float: right;
height: 100%;
margin-right: 0.8rem;
display: flex;
align-items: center;
}
.main li .list p {
width: 0.8266666667rem;
height: 0.8266666667rem;
line-height: 1.1466666667rem;
margin-left: 0.4666666667rem;
background: url("https://img.pekolive.com/cf-record_bubble.png");
background-size: 100% 100%;
}
.main li .list p img {
width: 80%;
height: 80%;
margin-top: 0.1rem;
margin-left: 0.07rem;
}
/*# sourceMappingURL=result.css.map */

View File

@@ -0,0 +1,120 @@
@function px2rem($px, $rem: 75) {
@return $px / $rem+rem;
}
@function prefixurl() {
@return 'https://img.pekolive.com/'
}
@font-face {
font-family: 'pingfang-bold';
src: url('../../../common/fonts/PingFang\ Bold.ttf');
src: url('../../../common/fonts/PingFang\ Bold.ttf') format('woff'),
url('../../../common/fonts/PingFang\ Bold.ttf') format('truetype'),
url('../../../common/fonts/PingFang\ Bold.ttf') format('svg');
}
@font-face {
font-family: 'pingfang-medium';
src: url('../../../common/fonts/PingFang-Medium.ttf');
src: url('../../../common/fonts/PingFang-Medium.ttf') format('woff'),
url('../../../common/fonts/PingFang-Medium.ttf') format('truetype'),
url('../../../common/fonts/PingFang-Medium.ttf') format('svg');
}
html,
body {
width: 100%;
background: #E6AD6A;
}
.header {
width: px2rem(750, );
height: px2rem(317, );
background: url(prefixurl()+'cf-result_main.png');
background-size: 100% 100%;
margin: 0 auto;
position: relative;
.title {
width: px2rem(464, );
height: px2rem(115, );
position: absolute;
top: 1.4rem;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
span {
font-size: px2rem(40, );
font-weight: 600;
color: #B82F1A;
position: absolute;
top: 1.75rem;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}
}
.main {
width: px2rem(750, );
height: px2rem(1170, );
background: url(prefixurl()+'cf-game-area.png');
background-size: 100% 100%;
margin: -1.85rem auto 0;
position: relative;
overflow: hidden;
li {
width: px2rem(709, );
height: px2rem(86, );
line-height: px2rem(86, );
background: url(prefixurl()+'cf-result_list_bg.png');
background-size: 100% 100%;
box-sizing: border-box;
margin: 0 auto 0.24rem;
&:nth-child(1) {
margin-top: px2rem(118, );
}
.session {
float: left;
width: px2rem(126, );
height: 100%;
font-size: px2rem(30, );
font-weight: 600;
color: #FFFFFF;
-webkit-text-stroke: px2rem(1, ) #FC8220;
margin-left: px2rem(30, );
text-align: center;
}
.list {
float: right;
// width: px2rem(450, );
height: 100%;
margin-right: px2rem(60, );
display: flex;
align-items: center;
p {
width: px2rem(62, );
height: px2rem(62, );
line-height: px2rem(86, );
margin-left: px2rem(35, );
background: url(prefixurl()+'cf-record_bubble.png');
background-size: 100% 100%;
img {
width: 80%;
height: 80%;
margin-top: 0.1rem;
margin-left: 0.07rem;
}
}
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 211 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 111 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

After

Width:  |  Height:  |  Size: 54 KiB

View File

@@ -14,16 +14,16 @@
<body>
<div class="wrap no-in-app">
<!-- <div class="wrap "> -->
<div class="banner"><img src="./images/banner.png" alt=""></div>
<div class="rule"><img src="./images/rule.png" alt=""></div>
<div class="record"><img src="./images/record.png" alt=""></div>
<div class="banner"><img src="https://img.pekolive.com/cf-banner.png" alt=""></div>
<div class="rule"><img src="https://img.pekolive.com/cf-rule.png" alt=""></div>
<div class="record"><img src="https://img.pekolive.com/cf-record.png" alt=""></div>
<!-- 特权商城 -->
<div class="mall" style="display: none;">
<img src="./images/mall.png" alt="">
</div>
<!-- 底部 -->
<div class="bottom">
<div class="bottom" style="display: none;">
<div class="avatar"><img src="./images/logo.png" alt=""></div>
<div class="info-wrap">
<div class="diamond-num" style="width: 4rem;">我的鉆石:<span>0</span></div>
@@ -34,22 +34,24 @@
</div>
<!-- 游戏区域 -->
<div class="game-area">
<!-- 本轮轮次 -->
<div class="roundId"></div>
<!-- 选择时间 -->
<div class="select-time">
<div class="count-down">开奖倒计时:<span class="count-down-num"></span></div>
<div class="current-tip">玩法:选择鉆石数量→选择食材</div>
<div class="btn-wrap">
<div class="active">1000</div>
<div class="active">100</div>
<div>1000</div>
<div>10000</div>
<div>100000</div>
</div>
<ul>
</ul>
<div class="shelf"><img src="./images/shelf.png" alt=""></div>
<div class="shelf"><img src="./images/shelf.png" alt=""></div>
<div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
<div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
</div>
<!-- 等待结果 -->
<div class="wait-time">
@@ -64,9 +66,23 @@
<div class="draw-pic">
<img src="" alt="">
</div>
<!-- 投入列表 -->
<div class="put-wrap">
<div class="put">投入</div>
<div class="list">
<!-- <div class="item">
<p><img src="" class="gift" alt=""></p>
<div>
<img src="cf-diamond.png" class="diamond" alt="">
<span class="in"></span>
</div>
</div> -->
</div>
</div>
<!-- 用户本轮中奖情况 -->
<div class="award-info">
<div class="desc"></div>
<div class="desc">奖励</div>
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
<div class="award-wrap"></div>
</div>
<!-- 本轮前3名 -->
@@ -77,9 +93,33 @@
<span class="line"></span>
</div>
<div class="top-three-list">
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<div class="no no1">
<img src="./images/logo.png" class="tx" alt="">
<img src="https://img.pekolive.com/cf-no1.png" class="txBox" alt="">
<div class="nick">虚位以待</div>
<div class="num">
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
<span></span>
</div>
</div>
<div class="no no2">
<img src="./images/logo.png" class="tx" alt="">
<img src="https://img.pekolive.com/cf-no2.png" class="txBox" alt="">
<div class="nick">虚位以待</div>
<div class="num">
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
<span></span>
</div>
</div>
<div class="no no3">
<img src="./images/logo.png" class="tx" alt="">
<img src="https://img.pekolive.com/cf-no3.png" class="txBox" alt="">
<div class="nick">虚位以待</div>
<div class="num">
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
<span></span>
</div>
</div>
</div>
</div>
</div>
@@ -99,19 +139,20 @@
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<!-- <p><img src="" alt=""></p> -->
</div>
<span class="more-result"><img src="https://img.pekolive.com/cf-btn_result.png" alt=""></span>
</div>
<!-- 个人信息 -->
<div class="info-bottom" style="display: none;">
<div class="info-bottom">
<div class="avatar"><img src="./images/logo.png" alt=""></div>
<div class="f-wrap">
<div class="fragment">我的碎片<span>0</span></div>
<div class="award">今日奖励:<span>0</span></div>
<div class="info-wrap">
<div class="diamond-num">我的鉆石<span>0</span></div>
<div class="fragment-num">今日奖励:<span>0</span></div>
</div>
<div class="add"><img src="./images/add.png" alt=""></div>
<div class="rank"><img src="./images/rank.png" alt=""></div>
<div class="add"><img src="https://img.pekolive.com/cf-add.png" alt=""></div>
<div class="rank"><img src="https://img.pekolive.com/cf-rank.png" alt=""></div>
</div>
<!-- 规则弹窗 -->
@@ -120,16 +161,16 @@
<main>
<div class="cyfs">
<p class="title">参与方式</p>
用戶可通過花費鉆石參與《星級廚房》遊戲每次最少消耗1000鉆石每回合時間30秒
<p class="jietu"><img src="./images/t1.png" alt=""></p>
用戶可通過花費鉆石參與《星級廚房》遊戲每次最少消耗100鉆石每回合時間30秒
<p class="jietu"><img src="https://img.pekolive.com/cf-t1.png" alt=""></p>
</div>
<div class="lwff">
<p class="title">礼物发放</p>
每次參與遊戲後會獲得一次禮物開獎機會
<p class="jietu t2"><img src="./images/t2.png" alt=""></p>
每次隨機從8種食材中選取一個作為中獎物品中獎後獲得【中獎物品購買碎片數*中獎物品對應倍數*1000】的鉆石獎勵,鉆石將直接發放到錢包
<p class="jietu t3"><img src="./images/t3.png" alt=""></p>
例如購買1個5倍的洋蔥中獎後獲得1*5*1000的鉆石
<p class="jietu t2"><img src="https://img.pekolive.com/cf-t2.png" alt=""></p>
每次隨機從8種食材中選取一個作為中獎物品中獎後獲得【中獎物品購買碎片數*中獎物品對應倍數*100】的鉆石獎勵鉆石將直接發放到錢包
<p class="jietu t3"><img src="https://img.pekolive.com/cf-t3.png" alt=""></p>
例如購買1個5倍的番茄中獎後獲得1*5*100的鉆石
</div>
<div class="qtsm">
<p class="title">其他說明</p>
@@ -146,8 +187,8 @@
<div class="rank-top">
<div class="tab-wrap">
<span class="diamond-rank active">今日礼物</span>
<span class="num-rank">今日皇榜</span>
<span class="diamond-rank active">今日獎勵</span>
<span class="num-rank">今日皇榜</span>
</div>
<div class="topthree-wrap">

View File

@@ -32,7 +32,7 @@ const toastMsg = (content = '操作完成', time = 2) => {
})
}
if (!browser.app) {
if (!browser.app) { //false
toastMsg('請在app內打開');
} else {
$('.wrap').removeClass('no-in-app')
@@ -48,9 +48,9 @@ const getUserInfo = (param) => {
success (res) {
if (res.code === 200) {
$('.bottom .info-wrap .fragment-num span').text(res.data.todayReward);
$('.bottom .info-wrap .diamond-num span').text(res.data.diamonds);
$('.bottom .avatar img').attr('src', res.data.avatar);
$('.info-bottom .info-wrap .fragment-num span').text(res.data.todayReward);
$('.info-bottom .info-wrap .diamond-num span').text(res.data.diamonds);
$('.info-bottom .avatar img').attr('src', res.data.avatar);
$('.info-bottom').find('.avatar img').attr('src', res.data.avatar)
if (res.data.todayReward.toString().length >= 5) {
@@ -119,6 +119,7 @@ const getNewestAct = () => {
networkRequest({
type: 'GET',
url: urlPrefix + '/act/luckySea/getNewestAct',
timeout: 8000,
success (res) {
if (res.code === 200) {
if ($.isEmptyObject(res.data) || res.data.status === 4) {
@@ -136,6 +137,7 @@ const getNewestAct = () => {
hideLoading(layerIndex)
roundId = res.data.roundId
$('.game-area .roundId').html(roundId)
getListItem(roundId, modelType)
// 進行下一輪時arrTime重新置為空數組不然在下一輪開始的時候也會執行location.reload()
@@ -168,6 +170,12 @@ const getNewestAct = () => {
},
error (err) {
toastMsg('網絡錯誤,請退出重進')
},
complete: function (XMLHttpRequest, status) {
if (status == 'timeout') {
XMLHttpRequest.abort()// 超时后中断请求
toastMsg('网络开小差,请退出重进,开奖结果可通过【游戏记录】/【往轮结果】查看~')
}
}
})
}
@@ -193,6 +201,7 @@ const showView = () => {
console.log('進入第一階段');
isSelectTab = false
$('.select-time').show().siblings().hide()
$('.roundId').show()
$countDown = $('.select-time .count-down .count-down-num')
mySelect = sessionStorage.getItem("mySelect")
@@ -207,9 +216,9 @@ const showView = () => {
}
$('.award-wrap').html('').show()
$('.award-info .desc').html('')
// $('.award-info .desc').html('')
getPreviousResults(11, roundId)
getPreviousResults(10, roundId)
showCountDown(userComeinTime, startTime, drawStageStartTime)
getUserInfo()
@@ -220,6 +229,7 @@ const showView = () => {
sessionStorage.removeItem("mySelect")
$('.wait-time').show().siblings().hide()
$('.roundId').show()
$countDown = $('.wait-time .count-down .count-down-num')
clearTimeout(timer2s) //清除第一階段的2s氣泡定時器
@@ -230,7 +240,7 @@ const showView = () => {
// $('.btn-wrap').find('div').removeClass('active')
getPreviousResults(11, roundId)
getPreviousResults(10, roundId)
showCountDown(userComeinTime, drawStageStartTime, showResultStageStartTime)
judgeStatus()
getUserInfo()
@@ -238,7 +248,7 @@ const showView = () => {
// 播放5s動畫
let player = new SVGA.Player('.wait-time');
let parser = new SVGA.Parser('.wait-time');
parser.load('./images/wait.svga', function (videoItem) {
parser.load('https://img.pekolive.com/cf-wait.svga', function (videoItem) {
// player.loops = 2;
player.clearsAfterStop = false;
player.setVideoItem(videoItem);
@@ -249,6 +259,7 @@ const showView = () => {
// 第三階段
console.log('進入第三階段');
$('.draw-time').show().siblings().hide()
$('.roundId').show()
$countDown = $('.draw-time .count-down .count-down-num')
isStatus3 = true //處於第三階段的標識
@@ -257,7 +268,7 @@ const showView = () => {
showCountDown(userComeinTime, showResultStageStartTime, endTime)
judgeStatus()
getUserInfo()
// getPreviousResults(11, roundId)
// getPreviousResults(10, roundId)
}
}
@@ -390,7 +401,7 @@ const judgeStatus = () => {
drawInfo = res.data
img = res.data.drawImageUrl
if (isStatus3) {
getPreviousResults(11, roundId)
getPreviousResults(10, roundId)
}
renderDrawInfo()
} else {
@@ -416,41 +427,68 @@ const renderDrawInfo = () => {
$('.draw-time .current-tip .current-result').html(drawInfo.drawName)
$('.draw-pic img').attr('src', drawInfo.drawImageUrl)
if (isStatus3) {
if (drawInfo.userDrawResult.drawStatus === 1) {
$('.award-info .desc').html('恭喜你,猜中了!')
// if (modelType === 1) {
// $('.award-wrap').html(`獲得 <span class="award-total">${drawInfo.userDrawResult.prizeDiamonds} </span>鉆石`)
// } else {
// $('.award-wrap').html(`獲得 <span class="award-name">${drawInfo.userDrawResult.prizeName} </span>(<span class="awrad-price">${drawInfo.userDrawResult.prizePrice}</span>鉆)*<span class="award-num">${drawInfo.userDrawResult.prizeCount}</span>個 累計<span class="award-total">${drawInfo.userDrawResult.prizeDiamonds}</span>鉆石`)
// }
} else if (drawInfo.userDrawResult.drawStatus === 2) {
$('.award-info .desc').html('很遺憾,本輪未猜中')
$('.award-wrap').hide()
} else if (drawInfo.userDrawResult.drawStatus === 3) {
$('.award-info .desc').html('本輪未參與')
$('.award-wrap').hide()
}
}
// if (isStatus3) {
// if (drawInfo.userDrawResult.drawStatus === 1) {
// $('.award-info .desc').html('恭喜你,猜中了!')
// // if (modelType === 1) {
// // $('.award-wrap').html(`獲得 <span class="award-total">${drawInfo.userDrawResult.prizeDiamonds} </span>鉆石`)
// // } else {
// // $('.award-wrap').html(`獲得 <span class="award-name">${drawInfo.userDrawResult.prizeName} </span>(<span class="awrad-price">${drawInfo.userDrawResult.prizePrice}</span>鉆)*<span class="award-num">${drawInfo.userDrawResult.prizeCount}</span>個 累計<span class="award-total">${drawInfo.userDrawResult.prizeDiamonds}</span>鉆石`)
// // }
// } else if (drawInfo.userDrawResult.drawStatus === 2) {
// $('.award-info .desc').html('很遺憾,本輪未猜中')
// $('.award-wrap').hide()
// } else if (drawInfo.userDrawResult.drawStatus === 3) {
// $('.award-info .desc').html('本輪未參與')
// $('.award-wrap').hide()
// }
// }
$('.put-wrap .list .item').remove()
// 渲染投入列表
let list = ''
drawInfo.userDrawResult.drawRecords.map(res => {
list += `
<div class="item">
<p><img src="${res.imgUrl}" class="gift" alt=""></p>
<div>
<img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
<span class="in">${res.costPieceNum}</span>
</div>
</div>
`
});
$('.put-wrap .list').append(list)
$('.award-info .award-wrap').html(drawInfo.userDrawResult.prizeDiamonds)
// 渲染前三名
topThreeArr = drawInfo.rankUserList
let str = ''
if (topThreeArr.length === 0) {
$('.topthree-desc').html('本輪無人猜中')
$('.top-three-list p img').attr('src', './images/default-hui.png')
$('.top-three-list').css('display', 'none')
$('.top-three').css('line-height', '4rem')
// $('.top-three-list p img').attr('src', './images/default-hui.png')
} else {
$('.topthree-desc').html('本輪前三名')
$('.topthree-desc').html('本輪MVP')
$('.top-three-list').css('display', 'block')
$('.top-three').css('line-height', '0rem')
if (topThreeArr.length < 3) {
let arr = new Array(3 - topThreeArr.length).fill({
avatar: './images/default-hui.png',
nick: '虚位以待',
uid: null,
num: 0
})
topThreeArr.push(...arr)
};
topThreeArr.map((item, index) => {
$('.top-three-list p img').eq(index).attr('src', item)
$(`.top-three-list .no${index + 1} .tx`).attr('uid', item.uid)
$(`.top-three-list .no${index + 1} .tx`).attr('src', item.avatar)
$(`.top-three-list .no${index + 1} .nick`).html(item.nick)
$(`.top-three-list .no${index + 1} .num span`).html(item.prizeDiamonds)
})
if (topThreeArr.length === 1) {
$('.top-three-list p img').eq(1).attr('src', './images/default-hui.png')
$('.top-three-list p img').eq(2).attr('src', './images/default-hui.png')
} else if (topThreeArr.length === 2) {
$('.top-three-list p img').eq(2).attr('src', './images/default-hui.png')
}
}
}
// 獲取每一輪抽獎的相關配置
@@ -582,27 +620,46 @@ const renderPreviousResults = () => {
}
// 發送用戶抽獎數量
const sendUserDrawInfo = (itemId, num) => {
const sendUserDrawInfo = (itemId, num, tais) => {
showLoading();
networkRequest({
type: 'POST',
url: urlPrefix + '/act/luckySea/draw',
contentType: 'application/json',
data: `[ {
"itemId":${itemId},
"num":${num}
}]`,
// contentType: 'application/json',
// data: `[ {
// "itemId":${itemId},
// "num":${num}
// }]`,
data: { itemId, num },
success (res) {
if (res.code === 200) {
} else if (31005) (
tais.data('total-num').number = parseInt(tais.data('total-num').number) + fragmentNum
tais
.stop(true, true)
.animate({ scale: 1.1 }, 200)
.animate({ scale: 1 }, 200, function () {
if (lock) {
tais.find('.select-num').html('+' + tais.data('total-num').number).hide().fadeIn(200)
}
setTimeout(() => {
// getUserInfo()
getUserPieceNum()
// getListItem(roundId)
}, 100)
})
hideLoading(layerIndex)
} else if (31005) {
toastMsg(res.message)
)
hideLoading(layerIndex)
}
else {
toastMsg(res.message)
hideLoading(layerIndex)
}
},
error (err) {
toastMsg('網絡錯誤,請退出重進')
hideLoading(layerIndex)
}
})
}
@@ -613,7 +670,7 @@ const sendUserDrawInfo = (itemId, num) => {
// 榜單類型1是鉆石榜2是歐皇榜
let type = 1
let pageSize = 10
let pageSize = 20
// 鉆石榜單
let pageD = 1
@@ -708,7 +765,8 @@ const renderMyInfo = () => {
} else {
num = myInfoD.num
}
$('.mine-diamond-num').html('今日獎勵' + num)
// $('.mine-diamond-num').html('今日獎勵' + num)
$('.mine-diamond-num').html(num)
} else {
let erbanNo = myInfoN.erbanNo
let myIndex = rankListN.findIndex((item, index) => {
@@ -756,7 +814,7 @@ const renderRankList = () => {
}
topThreeStr = `
<div class="info-wrap">
<div class="info-wrap" uid="${item.uid}">
<div class="avatar">
<p></p>
<img src="${item.avatar}" alt="">
@@ -767,6 +825,10 @@ const renderRankList = () => {
`
})
$('.topthree-wrap').html(topThreeStr)
$('.topthree-wrap .info-wrap').click(function () {
let uid = $(this).attr('uid')
openPerson(uid)
})
// 渲染非前3
@@ -781,17 +843,21 @@ const renderRankList = () => {
num = item.num
}
others += `
<li>
<li uid="${item.uid}">
<span class="index">${index + 2}</span>
<div class="others-info">
<img src="${item.avatar}" alt="">
<span class="others-nick">${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}</span>
</div>
<span class="others-diamond-num">距離上一名${num}</span>
<span class="others-diamond-num">${num}</span>
</li>
`
})
$('.other-rank').html(others)
$('.other-rank li').click(function () {
let uid = $(this).attr('uid')
openPerson(uid)
})
} else {
// 歐皇榜單
// 渲染前3
@@ -811,7 +877,7 @@ const renderRankList = () => {
num = '猜中' + item.num + '次'
}
topThreeStr = `
<div class="info-wrap">
<div class="info-wrap" uid="${item.uid}">
<div class="avatar">
<p></p>
<img src="${item.avatar}" alt="">
@@ -822,6 +888,10 @@ const renderRankList = () => {
`
})
$('.topthree-wrap').html(topThreeStr)
$('.topthree-wrap .info-wrap').click(function () {
let uid = $(this).attr('uid')
openPerson(uid)
})
// 渲染非前3
let othersArr = rankListN.slice(1)
@@ -833,7 +903,7 @@ const renderRankList = () => {
num = '猜中' + item.num + '次'
}
others += `
<li>
<li uid="${item.uid}">
<span class="index">${index + 2}</span>
<div class="others-info">
<img src="${item.avatar}" alt="">
@@ -844,10 +914,27 @@ const renderRankList = () => {
`
})
$('.other-rank').html(others)
$('.other-rank li').click(function () {
let uid = $(this).attr('uid')
openPerson(uid)
})
}
}
//跳转个人主页
function openPerson (uid) {
console.log('跳转个人主页方法');
if (!browser.app) return
if (browser.ios) {
window.webkit.messageHandlers.openPersonPage.postMessage(uid);
} else if (browser.android) {
if (androidJsObj && typeof androidJsObj === 'object') {
window.androidJsObj.openPersonPage(uid);
}
}
}
$(function () {
getInfoFromClient()
@@ -874,8 +961,9 @@ $(function () {
// }
if (browser.app) {
if (browser.android) {
window.androidJsObj.openChargePage();
window.androidJsObj.openChargePage(6);
} else if (browser.ios) {
window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
}
@@ -906,14 +994,36 @@ $(function () {
$('.mall').on('click', function () {
window.location.href = './mall.html'
})
// +按钮跳转充值
$('.add').on('click', function () {
window.location.href = './mall.html'
if (browser.app) {
if (browser.android) {
let channel = pubInfo.deviceInfo.channel;
console.log(pubInfo.deviceInfo);
if (channel == "google") {
window.androidJsObj.openChargePage(6);
} else {
window.androidJsObj.openChargePage(6);
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
} else if (browser.ios) {
window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
} else {
toastMsg('請在app內打開')
}
})
// 監聽遊戲記錄按鈕點擊事件
$('.record').on('click', function () {
window.location.href = './record.html'
})
// 监听历史开奖记录按钮点击事件
$('.more-result').on('click', function () {
window.location.href = './result.html?roundId=' + roundId
})
// 監聽今日排名按鈕點擊事件
$('.rank').on('click', function () {
getListRank(type, pageD)
@@ -958,66 +1068,73 @@ $(function () {
e.stopPropagation()
})
// 監聽滾動
$('.other-rank').on('scroll', function () {
let scrollTop = $(this).scrollTop();//這是已經卷進去滾動條的的高度
let scrollHeight = $('.other-rank')[0].scrollHeight;//這個是other-rank包含滾動條的總高度
let ulHeight = $(this).innerHeight();//這個是other-rank的高度
// $('.other-rank').on('scroll', function () {
// let scrollTop = $(this).scrollTop();//這是已經卷進去滾動條的的高度
// let scrollHeight = $('.other-rank')[0].scrollHeight;//這個是other-rank包含滾動條的總高度
// let ulHeight = $(this).innerHeight();//這個是other-rank的高度
//這樣距離到底還有一段距離就請求,但是會導致重復請求,所以要加鎖限製
if (scrollTop + ulHeight + 100 >= scrollHeight) {
if (type === 1) {
if (isLockD) {
isLockD = false
pageD++
if (pageSize * pageD > 30) {
toastMsg('沒有更多數據啦~')
} else {
if (canRequsetNextPageD) {
getListRank(type, pageD);
} else {
toastMsg('沒有更多數據啦~')
}
}
} else {
if (scrollTop + ulHeight >= scrollHeight) {
if (pageSize * pageD > 30) {
toastMsg('沒有更多數據啦~')
}
}
}
// //這樣距離到底還有一段距離就請求,但是會導致重復請求,所以要加鎖限製
// if (scrollTop + ulHeight + 100 >= scrollHeight) {
// if (type === 1) {
// if (isLockD) {
// isLockD = false
// pageD++
// if (pageSize * pageD > 30) {
// toastMsg('沒有更多數據啦~')
// } else {
// if (canRequsetNextPageD) {
// getListRank(type, pageD);
// } else {
// toastMsg('沒有更多數據啦~')
// }
// }
// } else {
// if (scrollTop + ulHeight >= scrollHeight) {
// if (pageSize * pageD > 30) {
// toastMsg('沒有更多數據啦~')
// }
// }
// }
} else {
if (isLockN) {
isLockN = false
pageN++
if (pageSize * pageN > 30) {
toastMsg('沒有更多數據啦~')
} else {
if (canRequsetNextPageN) {
getListRank(type, pageN);
} else {
toastMsg('沒有更多數據啦')
}
}
} else {
if (scrollTop + ulHeight >= scrollHeight) {
if (pageSize * pageN > 30) {
toastMsg('沒有更多數據啦~')
}
}
}
}
}
})
// } else {
// if (isLockN) {
// isLockN = false
// pageN++
// if (pageSize * pageN > 30) {
// toastMsg('沒有更多數據啦~')
// } else {
// if (canRequsetNextPageN) {
// getListRank(type, pageN);
// } else {
// toastMsg('沒有更多數據啦')
// }
// }
// } else {
// if (scrollTop + ulHeight >= scrollHeight) {
// if (pageSize * pageN > 30) {
// toastMsg('沒有更多數據啦~')
// }
// }
// }
// }
// }
// })
// 播放3s動畫
let player1 = new SVGA.Player('.draw-time');
let parser1 = new SVGA.Parser('.draw-time');
parser1.load('./images/draw.svga', function (videoItem) {
// player.loops = 2;
player1.clearsAfterStop = false;
player1.setVideoItem(videoItem);
player1.startAnimation();
// let player1 = new SVGA.Player('.draw-time');
// let parser1 = new SVGA.Parser('.draw-time');
// parser1.load('./images/draw.svga', function (videoItem) {
// // player.loops = 2;
// player1.clearsAfterStop = false;
// player1.setVideoItem(videoItem);
// player1.startAnimation();
// })
// 点击跳转个人主页
// $('.draw-time .top-three .top-three-list .no').off()
$('.draw-time .top-three .top-three-list .no').click(function () {
let uid = $(this).find('.tx').attr('uid');
console.log('uid', uid);
openPerson(uid)
})
// 關閉碎片不足提示彈窗
@@ -1037,11 +1154,13 @@ $(function () {
let channel = pubInfo.deviceInfo.channel;
console.log(pubInfo.deviceInfo);
if (channel == "google") {
window.androidJsObj.openChargePage();
window.androidJsObj.openChargePage(6);
} else {
window.androidJsObj.openChargePage(6);
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
} else if (browser.ios) {
window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
}
} else {
@@ -1064,24 +1183,24 @@ $(function () {
if (!lock) {
lock = !lock
console.log($(this).data('total-num'));
console.log($(this).data('total-num').number);
console.log(fragmentNum);
$(this).data('total-num').number = parseInt($(this).data('total-num').number) + fragmentNum
$(this)
.stop(true, true)
.animate({ scale: 1.1 }, 200)
.animate({ scale: 1 }, 200, function () {
if (lock) {
$(this).find('.select-num').html('+' + $(this).data('total-num').number).hide().fadeIn(200)
}
setTimeout(() => {
// getUserInfo()
getUserPieceNum()
// getListItem(roundId)
}, 100)
})
sendUserDrawInfo($(this).data('total-num').id, fragmentNum)
// console.log($(this).data('total-num'));
// console.log($(this).data('total-num').number);
// console.log(fragmentNum);
// $(this).data('total-num').number = parseInt($(this).data('total-num').number) + fragmentNum
// $(this)
// .stop(true, true)
// .animate({ scale: 1.1 }, 200)
// .animate({ scale: 1 }, 200, function () {
// if (lock) {
// $(this).find('.select-num').html('+' + $(this).data('total-num').number).hide().fadeIn(200)
// }
// setTimeout(() => {
// // getUserInfo()
// getUserPieceNum()
// // getListItem(roundId)
// }, 100)
// })
sendUserDrawInfo($(this).data('total-num').id, fragmentNum, $(this))
}
})

View File

@@ -1,12 +1,12 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
// 获取用户的游戏记录
let recordList = []
// let recordList = []
let page = 1
let pageSize = 10
let canNext = true;
let lisIndexId = 0;
var lisIndex = 0;
const toastMsg = (content = '', time = 2) => {
layer.open({
@@ -23,7 +23,7 @@ $(function () {
getUserRecord()
}, 100)
const getUserRecord = () => {
function getUserRecord() {
canNext = false
networkRequest({
type: 'GET',
@@ -32,77 +32,119 @@ $(function () {
page,
pageSize
},
success (res) {
success(res) {
if (res.code === 200) {
if (res.data.length != 0) {
// 能够继续请求下一页
canNext = true
// recordList.push(...res.data)
renderRecord(res.data)
} else {
canNext = false
toastMsg('沒有更多啦~')
}
recordList.push(...res.data)
renderRecord(res)
} else {
canNext = true
toastMsg(res.message)
}
},
error (err) {
error(err) {
canNext = true
toastMsg('網絡錯誤,請退出重進')
}
})
}
// 渲染游戏记录
const renderRecord = (res) => {
const renderRecord = (recordList) => {
if (recordList.length === 0) {
$('.record-list').hide();
$('.img').show();
} else {
// $('.record-list li').remove();
$('.record-list').show();
$('.img').hide();
var str = '';
let str2 = '';
let drawId = [];;
console.log(recordList, 'recordList')
var drawId;
var itemUrl;
var results = [];
var lisIndexId = 0;
console.log(res.data)
res.data.forEach((res, index) => {
drawId.push(res.drawId);
str += `
<li style="margin-bottom: 0.8rem;">
<h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
<div class="goldBox">
<span>遊戲獎勵:</span>
<span class="gold">${res.reward}鉆石</span>
</div>
<div class="marine_organism"></div>
<p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
<p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
</li>
`
let str = '';
recordList.forEach((res, index) => {
drawId = res.drawId;
results.push(res.results);
});
res.results.forEach(item => {
// console.log(drawId, 'drawId');
if (drawId == item.itemId) {
itemUrl = item.itemUrl
}
})
str += `
<li style="margin-bottom: 0.8rem;">
<h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
<div class="goldBox">
<span>NO.${res.roundId}</span>
<p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
<p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
</div>
<div class="result-wrap">
<div class="result">
<span>本輪結果</span>
<div class="bg"><img src="${itemUrl}" alt=""></div>
</div>
<div class="award">
<p>獎勵:</p>
<img src="./images/diamond.png" class="diamond" alt="">
<b>${res.reward}</b>
</div>
</div>
<div class="put-wrap">
<div class="put">投入</div>
<div class="list">
</div>
</div>
</li>
`
})
$('.record-list').append(str)
results.forEach((res, index) => {
res.forEach(val => {
$('.record-list li').eq(lisIndex).children('.marine_organism').append(`<span class='${drawId[lisIndexId] == val.itemId ? 'active' : ''}'><img src="${val.itemUrl}" alt=""><b>+${val.costPiece}</b></span>`)
$('.record-list li').eq(lisIndexId).find('.list').append(`
<div class="item">
<p><img src="${val.itemUrl}" class="gift" alt=""></p>
<div>
<img src="./images/diamond.png" class="diamond" alt="">
<span class="in">${val.costPiece}</span>
</div>
</div>
`)
})
lisIndex = lisIndex + 1;
lisIndexId = lisIndexId + 1;
});
}
}
})
$(window).scroll(function () {
if ($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
// 请求下一页
if (canNext) {
getUserRecord(page++)
} else {
console.log('无数据被锁定');
$(window).scroll(function () {
if ($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
// 请求下一页
if (canNext) {
page++
getUserRecord()
} else {
console.log('无数据被锁定');
}
}
}
});
});
})

View File

@@ -0,0 +1,88 @@
let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let locateObj = getQueryString();
let roundId
// 封裝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'
})
}
$(function () {
getInfoFromClient()
roundId = locateObj.roundId
console.log(roundId);
if (EnvCheck() === 'test') { new VConsole }
setTimeout(function () {
getPreviousResults()
}, 100)
})
// 獲取往輪遊戲結果
let previousResults = []
const getPreviousResults = () => {
showLoading()
networkRequest({
type: 'GET',
url: urlPrefix + '/act/luckySea/listLuckySeaActInfo',
data: {
count: 50,
roundId
},
success(res) {
if (res.code === 200) {
// previousResults = res.data
for (var i = 0; i < res.data.length; i += 5) {
previousResults.push(res.data.slice(i, i + 5));
}
console.log(previousResults)
let str
previousResults.forEach((item, index) => {
str = ''
item.forEach(res => {
// console.log(index);
str += `
<p><img src="${res.drawImageUrl}" alt=""></p>
`
})
// console.log(str);
$('.main li').eq(index).find('.list').append(str)
})
hideLoading(layerIndex)
}
},
error(err) {
toastMsg('網絡錯誤,請退出重進')
hideLoading(layerIndex)
}
})
}

View File

@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
@@ -11,10 +12,34 @@
</head>
<body>
<ul class="record-list">
</ul>
<ul class="none" style="display: none;"></ul>
<ul class="record-list">
<!-- <li style="margin-bottom: 0.8rem;">
<h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
<div class="goldBox">
<span>NO.2212092000</span>
<p class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
<p class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
</div>
<div class="result-wrap">
<div class="result">
<span>本輪結果</span>
<div class="bg"><img src="" alt=""></div>
</div>
<div class="award">
<p>獎勵:</p>
<img src="./images/diamond.png" class="diamond" alt="">
<b></b>
</div>
</div>
<div class="put-wrap">
<div class="put">投入</div>
<div class="list">
</div>
</div>
</li> -->
</ul>
<ul class="none" style="display: none;"></ul>
<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>

View File

@@ -0,0 +1,77 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>中奖结果</title>
<link rel="stylesheet" href="../../common/css/reset.css">
<link rel="stylesheet" href="./css/result.css">
</head>
<body>
<div class="result">
<div class="header">
<img src="https://img.pekolive.com/cf-count-down.png" class="title" alt="">
<span>前50轮中奖结果</span>
</div>
<ul class="main">
<li>
<div class="session">前5轮</div>
<div class="list">
<!-- <p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p>
<p><img src="" alt=""></p> -->
</div>
</li>
<li>
<div class="session">6-10轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">11-15轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">16-20轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">21-25轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">26-30轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">31-35轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">36-40轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">41-45轮</div>
<div class="list"></div>
</li>
<li>
<div class="session">46-50轮</div>
<div class="list"></div>
</li>
</ul>
</div>
<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="./js/result.js"></script>
</body>
</html>

View File

@@ -40,7 +40,7 @@
<script src="../../common/js/vconsole.min.js"></script>
<script src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script src="//lkme.cc/js/linkedme.min.js"></script>
<script src="./js/index.js"></script>
<script src="./js/index.js?v=1.0"></script>
</body>
</html>

View File

@@ -12,7 +12,7 @@ const showLoading = (content = '加載中...') => {
type: 2,
shadeClose: false,
content,
success(e) {
success (e) {
layerIndex = $(e).attr('index')
}
})
@@ -38,12 +38,20 @@ const getUserInfo = (param) => {
data: {
uid: pubInfo.uid
},
success(res){
if(res.code === 200){
timeout: 8000, //超时时间设置,单位毫秒
complete: function (XMLHttpRequest, status) {//请求完成后最终执行参数
if (status == 'timeout') {//超时,status还有success,error等值的情况
//这里我使用的是layer中的弹出框当然也可以用其他的
hideLoading(layerIndex)
toastMsg('请求连接超时')
}
},
success (res) {
if (res.code === 200) {
isGetUserInfoInterFace = true
isShow()
$('.mine').find('.avatar img').attr('src', res.data.avatar)
if(!res.data.nick){
if (!res.data.nick) {
res.data.nick = '未知'
}
if (res.data.nick.length > 10) {
@@ -51,17 +59,18 @@ const getUserInfo = (param) => {
}
$('.mine').find('.nick').html(res.data.nick)
$('.mine').find('.diamond-num span').html(res.data.userPurse.diamonds)
if(param){
$('.mine').find('.meteor-num span')[0].innerHTML = parseInt($('.mine').find('.meteor-num span')[0].innerHTML) + param
} else{
if (param) {
$('.mine').find('.meteor-num span')[0].innerHTML = parseInt($('.mine').find('.meteor-num span')[0].innerHTML) + param
} else {
$('.mine').find('.meteor-num span').html(res.data.num)
}
}else{
getListPack()
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(err){
error (err) {
toastMsg('網絡錯誤')
hideLoading(layerIndex)
}
@@ -77,20 +86,28 @@ const getListPack = () => {
type: 'POST',
url: urlPrefix + '/activities/draw/getPackList',
data: {
uid: pubInfo.uid
uid: pubInfo.uid
},
success(res){
timeout: 8000, //超时时间设置,单位毫秒
complete: function (XMLHttpRequest, status) {//请求完成后最终执行参数
if (status == 'timeout') {//超时,status还有success,error等值的情况
//这里我使用的是layer中的弹出框当然也可以用其他的
hideLoading(layerIndex)
toastMsg('请求连接超时')
}
},
success (res) {
if (res.code === 200) {
isGetListPackInterFace = true
isShow()
listPack = res.data
renderList()
}else{
} else {
toastMsg(res.message)
}
hideLoading(layerIndex)
},
error(){
error () {
toastMsg('網絡錯誤')
hideLoading(layerIndex)
}
@@ -124,20 +141,19 @@ const renderList = () => {
//只有兩個接口都請求到數據,才渲染默認頁面
const isShow = () => {
if(isGetListPackInterFace && isGetUserInfoInterFace){
if (isGetListPackInterFace && isGetUserInfoInterFace) {
hideLoading(layerIndex)
$('.wrap').show()
}else{
} else {
showLoading('加載中...')
}
}
$(function(){
$(function () {
getInfoFromClient()
setTimeout(function(){
setTimeout(function () {
getUserInfo()
getListPack()
}, 50)
}, 500)
// 點擊玩法介紹按鈕
$('.rule-btn').on('click', function () {
@@ -146,24 +162,24 @@ $(function(){
$('body').css('overflow', 'hidden')
})
// 關閉規則彈窗
$('.rule-mask .cancel').on('click', function(){
$('.rule-mask .cancel').on('click', function () {
$('.shade').fadeOut(300)
$('.rule-mask').fadeOut(300)
$('body').css('overflow', 'auto')
})
$('.shade').on('click', function(){
$('.shade').on('click', function () {
$('.shade').hide()
$('.rule-mask').hide()
$('.shade-mask-success').hide()
$('.shade-mask-no-money').hide()
$('body').css('overflow', 'auto')
})
$('.rule-mask').on('click', function(e){
$('.rule-mask').on('click', function (e) {
e.stopPropagation()
})
// 監聽購買按鈕點擊事件
$('ul.buy-area').on('click', '.buy-btn', function(){
$('ul.buy-area').on('click', '.buy-btn', function () {
console.log($(this).data());
if (!$(this).data('name') || !$(this).data('day') || !$(this).data('gold') || !$(this).data('giftId')) {
toastMsg('禮包信息不完整')
@@ -178,7 +194,7 @@ $(function(){
giftObj['num'] = 1
giftObj['ticketNum'] = $(this).data('ticketNum')
$('.shade-mask-buy').find('.title span').html(giftObj['name'])
$('.shade-mask-buy').find('.buy-day span').html(giftObj['day'])
$('.shade-mask-buy').find('.buy-price span').html(giftObj['gold'])
@@ -187,53 +203,53 @@ $(function(){
$('body').css('overflow', 'hidden')
})
// 關閉購買彈窗
$('.buy-confirm-btn .cancel').on('click', function(){
$('.buy-confirm-btn .cancel').on('click', function () {
$('.shade-mask-buy').fadeOut(50)
$('body').css('overflow', 'auto')
})
$('.shade-mask-buy').on('click', function(){
$('.shade-mask-buy').on('click', function () {
$('.shade-mask-buy').fadeOut(50)
$('body').css('overflow', 'auto')
})
$('.shade-content-buy').on('click', function(e){
$('.shade-content-buy').on('click', function (e) {
e.stopPropagation()
})
// 增加購買數量
$('.increase').on('click', function(){
if(giftObj['num']<999){
$('.increase').on('click', function () {
if (giftObj['num'] < 999) {
giftObj['num']++;
giftObj['day']++;
let allPrice = giftObj['num'] * giftObj['gold'];
$('.inputNum').val(giftObj['num'])
$('.buy-day span').html(giftObj['day'])
$('.buy-price span').html(allPrice)
}else{
} else {
toastMsg('單次購買數量最多為999')
}
})
// 減少購買數量
$('.decrease').on('click', function(){
if($('.inputNum').val()>0){
$('.decrease').on('click', function () {
if ($('.inputNum').val() > 0) {
giftObj['num']--;
giftObj['day']--;
let allPrice = giftObj['num'] * giftObj['gold'];
$('.inputNum').val(giftObj['num'])
$('.buy-day span').html(giftObj['day'])
$('.buy-price span').html(allPrice)
}else{
} else {
toastMsg('最少購買數量為1')
}
})
// 手動輸入購買數量
$('.inputNum').on('input', function(){
$('.inputNum').on('input', function () {
let exp = /^[0-9]+$/
if (!exp.test($(this).val())) {
toastMsg('請輸入數字')
return
}
if($(this).val() > 999){
if ($(this).val() > 999) {
giftObj['num'] = 999
}else{
} else {
giftObj['num'] = $(this).val()
}
giftObj['day'] = giftObj['num'];
@@ -244,17 +260,17 @@ $(function(){
})
// 確認購買
let lock = false
$('.confirm').on('click', function(){
$('.confirm').on('click', function () {
let exp = /^[0-9]+$/
if(!exp.test($('.inputNum').val())){
if (!exp.test($('.inputNum').val())) {
toastMsg('請輸入數字')
$('.inputNum').val(1)
return
}
if($('.inputNum').val() == 0){
if ($('.inputNum').val() == 0) {
return toastMsg('最少購買數量為1')
}
if(!lock){
if (!lock) {
lock = true
networkRequest({
type: 'POST',
@@ -265,63 +281,75 @@ $(function(){
packNum: giftObj.num,
ticket: pubInfo.ticket
},
success(res){
if(res.code === 200){
success (res) {
if (res.code === 200) {
getUserInfo(res.data)
$('.shade-mask-buy').hide()
$('.shade').fadeIn(300)
$('.shade-mask-success .tip').html(`獲贈信物x` + giftObj.ticketNum * giftObj.num)
$('.shade-mask-success .tip').html(`獲贈信物x` + giftObj.ticketNum * giftObj.num)
$('.shade-mask-success').fadeIn()
}else if(res.code === 2103){
} else if (res.code === 2103) {
$('.shade-mask-buy').hide()
$('.shade').fadeIn(300)
$('.shade-mask-no-money').show()
$('.shade-mask-no-money').fadeIn()
}else{
} else {
toastMsg(res.message)
}
lock = false
},
error(err){
error (err) {
toastMsg('網絡錯誤')
}
})
}
})
// 關閉購買成功彈窗
$('.in-btn').on('click', function(){
$('.in-btn').on('click', function () {
$('.shade-mask-success').fadeOut()
$('.shade').fadeOut()
$('body').css('overflow', 'auto')
})
// 跳轉充值
$('.recharge').on('click', function(){
$('.recharge').on('click', function () {
$('.shade-mask-no-money').fadeOut(300)
$('.shade').fadeOut(300)
$('body').css('overflow', 'auto')
if(browser.app){
if(browser.android){
if (browser.app) {
if (browser.android) {
tools.nativeUtils.jumpAppointPage('RECHARGE_PAGE')
}else if(browser.ios){
} else if (browser.ios) {
window.webkit.messageHandlers.openChargePage.postMessage(null)
}
}else{
} else {
toastMsg('請在app內打開')
}
})
//從充值頁面返回活動頁面 重新請求用戶信息接口
// //從充值頁面返回活動頁面 重新請求用戶信息接口
// var hiddenProperty = 'hidden' in document ? 'hidden' :
// 'webkitHidden' in document ? 'webkitHidden' :
// 'mozHidden' in document ? 'mozHidden' : null;
// var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
// var onVisibilityChange = function () {
// if(!document[hiddenProperty]){
// $('.shade-mask-no-money').hide()
// getUserInfo()
// }
// }
// document.addEventListener(visibilityChangeEvent, onVisibilityChange);
//返回页面 重新请求接口
var hiddenProperty = 'hidden' in document ? 'hidden' :
'webkitHidden' in document ? 'webkitHidden' :
'mozHidden' in document ? 'mozHidden' : null;
'webkitHidden' in document ? 'webkitHidden' :
'mozHidden' in document ? 'mozHidden' : null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
var onVisibilityChange = function () {
if(!document[hiddenProperty]){
$('.shade-mask-no-money').hide()
getUserInfo()
}
if (!document[hiddenProperty]) {
location.reload()
}
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);
})

View File

@@ -1 +1 @@
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>peko</title><link href=./static/css/app.29f52b4609822ff24ca9d1138afa5e9c.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.37353e45eb4e1eaf0dfb.js></script><script type=text/javascript src=./static/js/vendor.e1f3b20580f807878b61.js></script><script type=text/javascript src=./static/js/app.bf94490e3e4d07823af1.js></script></body></html>
<!DOCTYPE html><html><head><meta charset=UTF-8><meta name=viewport content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1"><title>peko</title><link href=./static/css/app.bd5e7f6f3013d3bb76f444e34bf50f1e.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.ff90bd02ecb0d2060419.js></script><script type=text/javascript src=./static/js/vendor.e1f3b20580f807878b61.js></script><script type=text/javascript src=./static/js/app.861748a1f83bae0fde49.js></script></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,2 @@
webpackJsonp([10],{Y4f9:function(t,e){},"b+89":function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var s=i("Gu7T"),a=i.n(s),l=i("hff3"),n=i("+EAh"),o=i("X2Oc"),d={filters:{ellipsis:function(t){return t?t.length>13?t.slice(0,13)+"...":t:""},abs:function(t){return Math.abs(t)}},data:function(){return{type:0,billList:[],typeList:["收入記錄","支出記錄"],tableType:14,info:{},loading:!1,finished:!1,page:0,downTitle:"暫無更多記錄"}},watch:{tableType:function(t,e){switch(console.log(t,e),t){case 5:this.downTitle="無更多結算記錄";break;case 6:this.downTitle="無更多活動發放記錄";break;case 9:this.downTitle="無更多提現記錄";break;case 10:this.downTitle="無更多兌換記錄";break;case 14:this.downTitle="暫無更多記錄"}}},components:{navigation:l.a},created:function(){document.title="提現記錄",this.getInfo(),o.a.initNav({type:1,data:{msg:"鉆石記錄",link:n.e,title:"",showUrl:n.e,imgUrl:n.e,desc:""}})},methods:{setType:function(t){if(this.billList=[],this.loading=!0,this.finished=!1,this.page=0,this.type=t,t)return this.tableType=9,void this.getList(this.tableType);this.getList(this.tableType)},back:function(){this.$router.go(-1)},getDate:function(t){this.billList=[],this.page=0,this.finished=!1,this.loading=!0,this.tableType=t,this.getList(t)},onLoad:function(){this.page++,this.getList(this.tableType,this.page)},getList:function(t){var e=this,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1;(new Date).getTime();Object(n.i)({uid:window.sessionStorage.getItem("uid")||info.uid,type:t,date:(new Date).getTime(),pageNo:i,pageSize:20}).then(function(t){if(200===t.data.code){var s;if(1===i)e.billList=t.data.data.billList;else(s=e.billList).push.apply(s,a()(t.data.data.billList));e.loading=!1,console.log(t.data.data.billList,i),0===t.data.data.billList.length&&(e.finished=!0)}else e.$message.error(t.data.message),e.finished=!0})},dateFormat:function(t){return function(t){var e=new Date(t),i=e.getFullYear(),s=e.getMonth()+1;s=s<10?"0"+s:s;var a=e.getDate();a=a<10?"0"+a:a;var l=e.getHours();l=l<10?"0"+l:l;var n=e.getMinutes();n=n<10?"0"+n:n;var o=e.getSeconds();return i+"-"+s+"-"+a+" "+l+":"+n+":"+(o=o<10?"0"+o:o)}(t)},getInfo:function(){this.info.uid=o.a.tools.nativeUtils.getUid(),this.info.ticket=o.a.tools.nativeUtils.getTicket()}}},c={render:function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",{staticClass:"box-all"},[this.$store.state.isApp?t._e():s("navigation",{attrs:{title:"金幣記錄"}}),t._v(" "),s("div",{class:this.$store.state.isApp?"crystal-top crystal-top-app":"crystal-top"}),t._v(" "),s("van-list",{attrs:{finished:t.finished,"finished-text":t.downTitle},on:{load:t.onLoad},model:{value:t.loading,callback:function(e){t.loading=e},expression:"loading"}},t._l(t.billList,function(e,a){return s("div",{key:a},t._l(e[e.date],function(e,a){return s("div",{key:a,staticClass:"data-list"},[s("div",{staticClass:"item"},[s("div",{staticClass:"item-left"},[5==t.tableType?s("div",{staticClass:"item-left-title"},[t._v("水晶 轉換 金幣收入")]):t._e(),t._v(" "),6==t.tableType?s("div",{staticClass:"item-left-title"},[t._v("活動發放 金幣收入")]):t._e(),t._v(" "),9==t.tableType?s("div",{staticClass:"item-left-title"},[t._v(t._s(t._f("abs")(e.amount))+"金幣提現")]):t._e(),t._v(" "),10==t.tableType?s("div",{staticClass:"item-left-title"},[t._v(t._s(t._f("abs")(e.amount))+"金幣兌換鉆石")]):t._e(),t._v(" "),14==t.tableType&&2==e.objType?s("div",{staticClass:"item-left-title"},[t._v("提現")]):t._e(),t._v(" "),14==t.tableType&&25==e.objType?s("div",{staticClass:"item-left-title"},[t._v("提現駁回")]):t._e(),t._v(" "),s("div",{staticClass:"item-left-dsc"},[t._v(t._s(t.dateFormat(e.recordTime)))])]),t._v(" "),s("div",{staticClass:"item-right"},[s("div",{staticClass:"item-right-img"},[s("img",{attrs:{src:i("Yxsz")}})]),t._v(" "),s("div",{class:2==e.objType?"reduceNum":"addNum"},[t._v(t._s(e.amount))])])])])}),0)}),0)],1)},staticRenderFns:[]};var r=i("VU/8")(d,c,!1,function(t){i("Y4f9")},"data-v-2c6c9454",null);e.default=r.exports}});
//# sourceMappingURL=10.e221f303b5cd6ea692bf.js.map

View File

@@ -0,0 +1,2 @@
webpackJsonp([11],{"7c74":function(t,v){},CXh3:function(t,v,n){"use strict";Object.defineProperty(v,"__esModule",{value:!0});var a={created:function(){document.title="領獎說明"},components:{navigation:n("hff3").a}},e={render:function(){var t=this,v=t.$createElement,n=t._self._c||v;return n("div",{staticClass:"wrap"},[this.$store.state.isApp?t._e():n("navigation",{attrs:{title:"領獎說明"}}),t._v(" "),n("div",{staticClass:"part-title nomt"},[t._v("一、領獎綁定說明")]),t._v(" "),n("p",[t._v("\n 1.領獎前請前往app設置支付密碼、實名認證和綁定支付寶。\n ")]),t._v(" "),n("p",[t._v("\n 2.綁定時務必確保所填信息有效,填寫資料錯誤導致的提現失敗損失將由用戶自行承擔。\n ")]),t._v(" "),n("p",[t._v("\n 3.修改支付寶賬號時,暫不支持對賬號主體(即真實姓名和身份證號)進行修改。\n ")]),t._v(" "),n("div",{staticClass:"part-title"},[t._v("二、領獎規則")]),t._v(" "),n("p",[t._v("\n 1.用戶賬戶內可領獎金額大於等於10元時可申請領獎每次領獎按聽獎金額的6.5%收取交易手續費。\n ")]),t._v(" "),n("p",[t._v("\n 2.用戶隨時可申請提現每周可提現5次提交申請後審核及到賬時間為1個工作日內具體到賬時間以綁定的支付寶賬號的到賬時間為準。\n ")]),t._v(" "),n("div",{staticClass:"part-title"},[t._v("三、領獎審核不通過的原因")]),t._v(" "),t._m(0),t._v(" "),n("p",[t._v("\n 2.如平臺檢測到用戶的peko賬戶有作弊或異常狀況平臺將拒絕該用戶對收益進行提現。\n ")]),t._v(" "),n("p",[t._v("3.如對領獎金額有疑問,可聯系在線客服並提供相關信息進行查詢。")]),t._v(" "),n("p",[t._v("\n 4.peko有權依據國家政策、技術條件、產品功能等變化需要而對本說明進行修改並將修改後的說明予以發布並對具體獎金發放規則及《領獎說明》擁有最終解釋權。\n ")])],1)},staticRenderFns:[function(){var t=this,v=t.$createElement,n=t._self._c||v;return n("div",[n("p",[t._v("1.支付寶賬號未完成實名認證或開啟了隱私保護功能。")]),t._v(" "),n("p",{staticClass:"a"},[t._v("解決辦法:")]),t._v(" "),n("p",{staticClass:"b"},[t._v("1完成支付寶收款賬號實名認證")]),t._v(" "),n("p",{staticClass:"b c"},[t._v("2前往支付寶→我的→設置→開啟【通過手機號找到我】")]),t._v(" "),n("p",{staticClass:"b"},[t._v("3完成上述操作後可重新進行領獎申請")])])}]};var s=n("VU/8")(a,e,!1,function(t){n("7c74")},"data-v-2943ef01",null);v.default=s.exports}});
//# sourceMappingURL=11.d272cf261efb570c4c27.js.map

View File

@@ -0,0 +1,2 @@
webpackJsonp([12],{RpvA:function(t,s,e){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var a=e("hff3"),i=e("+EAh"),n=e("X2Oc"),r=e("Fd2+"),o=e("KTi7"),c=e("QLzJ"),d=e("Z4iZ"),u={data:function(){return{number:"",gold:0,purse:{},info:{},showKeyboard:!1,password:""}},components:{navigation:a.a},created:function(){document.title="金幣兌換鉆石",this.getInfo(),this.getPurse(),n.a.initNav({type:4,data:{msg:"",link:"",title:"",showUrl:"",imgUrl:"",desc:""}})},methods:{back:function(){this.$router.go(-1)},sure:function(){if(this.number<=0)return this.$toast("兌換數量不可為0");this.showKeyboard=!0},exchange:function(){var t=this;r.b.loading({message:"加載中...",forbidClick:!0});var s="";s=Object(d.b)().app?Object(o.a)(this.password,"1ea53d260ecf11e7b56e00163e046a26"):Object(c.a)(this.password+"");var e={uid:window.sessionStorage.getItem("uid"),changeNum:this.number,paymentPwd:s,changeType:2};Object(i.d)(e).then(function(s){null!=s.data.data?(r.b.clear,Object(r.b)("兌換成功"),t.getPurse()):(r.b.clear,Object(r.b)(s.data.message),t.$message.error(s.data.message))})},getPurse:function(){var t=this;Object(i.q)({uid:window.sessionStorage.getItem("uid")}).then(function(s){null!=s.data?(t.purse=s.data.data,window.console.log(t.purse)):t.$message.error(s.data.message)})},getInfo:function(){this.info.uid=n.a.tools.nativeUtils.getUid(),this.info.ticket=n.a.tools.nativeUtils.getTicket()},onInput:function(t){this.password=(this.password+t).slice(0,6),6==this.password.length&&(this.showKeyboard=!1,this.exchange(),this.password="")},onDelete:function(){this.password=this.password.slice(0,this.password.length-1)}}},l={render:function(){var t=this,s=t.$createElement,e=t._self._c||s;return e("div",{staticClass:"box-all"},[this.$store.state.isApp?t._e():e("navigation",{attrs:{title:"金幣兌換鉆石",rightTitle:""}}),t._v(" "),e("div",{staticClass:"crystal-father"},[t._m(0),t._v(" "),e("span",{staticClass:"crystal-text"},[t._v("余額:")]),t._v(" "),e("span",{staticClass:"crystal-number"},[t._v(t._s(t.purse.golds))])]),t._v(" "),e("div",{staticClass:"input-number"},[e("input",{directives:[{name:"model",rawName:"v-model",value:t.number,expression:"number"}],staticClass:"number",attrs:{placeholder:"請輸入兌換的金幣數量"},domProps:{value:t.number},on:{input:function(s){s.target.composing||(t.number=s.target.value)}}})]),t._v(" "),e("div",{staticClass:"diamond"},[t._m(1),t._v(" "),e("span",{staticClass:"crystal-text"},[t._v("余額:")]),t._v(" "),e("span",{staticClass:"crystal-number"},[t._v(t._s(t.purse.diamonds))])]),t._v(" "),e("div",{staticClass:"sure",on:{click:t.sure}},[t._v("確認兌換")]),t._v(" "),e("div",{staticClass:"bottom-text"},[t._v("金幣可兌換鉆石兌換比率1金幣=1鉆石金幣數量必須為10的整數倍。")]),t._v(" "),e("van-password-input",{directives:[{name:"show",rawName:"v-show",value:t.showKeyboard,expression:"showKeyboard"}],staticClass:"passwrod-input",attrs:{value:t.password,focused:t.showKeyboard},on:{focus:function(s){t.showKeyboard=!0}}}),t._v(" "),e("van-number-keyboard",{attrs:{show:t.showKeyboard},on:{blur:function(s){t.showKeyboard=!1},input:t.onInput,delete:t.onDelete}})],1)},staticRenderFns:[function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"crystal"},[s("img",{attrs:{src:e("Yxsz")}})])},function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"crystal"},[s("img",{attrs:{src:e("QCm6")}})])}]};var h=e("VU/8")(u,l,!1,function(t){e("RsFa")},"data-v-07dc88dc",null);s.default=h.exports},RsFa:function(t,s){}});
//# sourceMappingURL=12.abcd45ba53d9774263d2.js.map

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,2 @@
webpackJsonp([6],{"160G":function(t,e){},CroZ:function(t,e,i){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=i("+EAh"),s=i("Fd2+");i("7+uW").a.use(s.c);var o=null,a={data:function(){return{phone:"",code:"",getCodeTitle:"獲取驗證碼",styleCode:!0}},methods:{blurBtn:function(){setTimeout(function(){var t=document.documentElement.scrollTop||document.body.scrollTop||0;window.scrollTo(0,Math.max(t-1,0))},100)},getCode:function(){var t=this;if(this.styleCode){/^[1]([3-9])[0-9]{9}$/.test(this.phone)?(this.styleCode=!1,Object(n.h)({mobile:this.phone,type:1}).then(function(e){200===e.data.code&&(Object(s.b)(e.data.message),t.timer())})):Object(s.b)("請輸入正確的手機號")}},logining:function(){var t=this;/^[1]([3-9])[0-9]{9}$/.test(this.phone)?(s.b.loading({message:"loading",forbidClick:!0}),Object(n.p)({mobile:this.phone,code:this.code}).then(function(e){if(200===e.data.code){window.sessionStorage.clear(),info.ticket=e.data.data.token,info.uid=e.data.data.uid,window.sessionStorage.setItem("uid",info.uid),window.sessionStorage.setItem("ticket",info.ticket),window.sessionStorage.setItem("jurisdiction","h5");var i=setTimeout(function(){t.$router.replace({path:"/MyIncome"}),s.b.clear(),clearTimeout(i)},600)}}).catch(function(t){503===t.code&&Object(s.b)("該手機號未註冊\n請先去pekoapp完成註冊")})):Object(s.b)("請輸入正確的手機號")},timer:function(){var t=this,e=60;clearInterval(o),this.getCodeTitle="重新獲取("+e+"s)",o=setInterval(function(){e--,t.getCodeTitle="重新獲取("+e+"s)",e<=0&&(clearInterval(o),t.styleCode=!0,t.getCodeTitle="獲取驗證碼")},1e3)}}},c={render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",[n("img",{attrs:{src:i("Nl6a")}}),t._v(" "),n("p",{staticClass:"tit"},[t._v("登錄peko")]),t._v(" "),n("div",{staticClass:"max"},[n("div",{staticClass:"phone"},[n("input",{directives:[{name:"model",rawName:"v-model",value:t.phone,expression:"phone"}],attrs:{type:"type",maxlength:"11",placeholder:"請輸入手機號碼"},domProps:{value:t.phone},on:{blur:t.blurBtn,input:function(e){e.target.composing||(t.phone=e.target.value)}}})]),t._v(" "),n("div",{staticClass:"phone_code"},[n("input",{directives:[{name:"model",rawName:"v-model",value:t.code,expression:"code"}],attrs:{type:"type",maxlength:"5",placeholder:"請輸入驗證碼"},domProps:{value:t.code},on:{blur:t.blurBtn,input:function(e){e.target.composing||(t.code=e.target.value)}}}),t._v(" "),n("span",{staticClass:"get-code",on:{click:function(e){return t.getCode()}}},[t._v(t._s(t.getCodeTitle))])])]),t._v(" "),n("p",{staticClass:"btn",attrs:{"data-lg":"1"},on:{click:t.logining}},[t._v("登錄")]),t._v(" "),t._m(0),t._v(" "),t._m(1),t._v(" "),t._m(2)])},staticRenderFns:[function(){var t=this.$createElement,e=this._self._c||t;return e("p",{staticClass:"message"},[this._v("\n 驗證碼錯誤或者過期\n "),e("span")])},function(){var t=this.$createElement,e=this._self._c||t;return e("div",{staticClass:"pop1"},[e("div",{staticClass:"content"},[e("div",{staticClass:"message_"}),this._v(" "),e("p",{staticClass:"check1",attrs:{id:"confirm1"}},[this._v("確定")])])])},function(){var t=this.$createElement,e=this._self._c||t;return e("div",{staticClass:"contact"},[e("p",[this._v("peko客服微信號pekokefu01")]),this._v(" "),e("p",[e("span",[this._v("粵網文:(2018)8220-2981號")]),this._v(" "),e("span",[e("a",{attrs:{href:"http://www.beian.miit.gov.cn"}},[this._v("粵ICP備20032171")])])])])}]};var r=i("VU/8")(a,c,!1,function(t){i("160G")},"data-v-5659291e",null);e.default=r.exports},Nl6a:function(t,e,i){t.exports=i.p+"static/fonts/login.e6f4fdc.png"}});
//# sourceMappingURL=6.3655d80f5f2b212e3b9f.js.map

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,2 @@
webpackJsonp([9],{"3IW4":function(t,s,e){"use strict";Object.defineProperty(s,"__esModule",{value:!0});var a=e("+EAh"),i=e("X2Oc"),n=e("Fd2+"),r=e("KTi7"),o=e("hff3"),c=e("QLzJ"),d=e("Z4iZ"),u={data:function(){return{number:"",crystal:0,diamonds:0,purse:{},info:{},showKeyboard:!1,password:"",hasPaymentPwd:!1}},components:{navigation:o.a},created:function(){document.title="水晶兌換鉆石",this.getInfo(),this.getPurse(),i.a.initNav({type:4,data:{msg:"",link:"",title:"",showUrl:"",imgUrl:"",desc:""}})},methods:{back:function(){this.$router.go(-1)},sure:function(){if(this.hasPaymentPwd)return this.number<=0?this.$toast("兌換數量不可為0"):void(this.showKeyboard=!0);Object(n.b)("未設置支付密碼,請前往我的-設置支付密碼")},exchange:function(){var t=this;n.b.loading({message:"加載中...",forbidClick:!0});var s="";s=Object(d.b)().app?Object(r.a)(this.password,"1ea53d260ecf11e7b56e00163e046a26"):Object(c.a)(this.password+"");var e={uid:window.sessionStorage.getItem("uid"),changeNum:this.number,paymentPwd:s,changeType:1};Object(a.d)(e).then(function(s){null!=s.data.data?(n.b.clear,Object(n.b)("兌換成功"),t.getPurse()):(n.b.clear,Object(n.b)(s.data.message),t.$message.error(s.data.message))})},getPurse:function(){var t=this;Object(a.q)({uid:window.sessionStorage.getItem("uid")||info.uid}).then(function(s){null!=s.data?(t.purse=s.data.data,t.hasPaymentPwd=s.data.data.hasPaymentPwd,window.console.log(t.purse)):t.$message.error(s.data.message)})},getInfo:function(){this.info.uid=i.a.tools.nativeUtils.getUid(),this.info.ticket=i.a.tools.nativeUtils.getTicket()},onInput:function(t){this.password=(this.password+t).slice(0,6),6==this.password.length&&(this.showKeyboard=!1,this.exchange(),this.password="")},onDelete:function(){this.password=this.password.slice(0,this.password.length-1)}}},l={render:function(){var t=this,s=t.$createElement,e=t._self._c||s;return e("div",{staticClass:"box-all"},[this.$store.state.isApp?t._e():e("navigation",{attrs:{title:"水晶兌換鉆石",rightTitle:""}}),t._v(" "),e("div",{staticClass:"crystal-father"},[t._m(0),t._v(" "),e("span",{staticClass:"crystal-text"},[t._v("余額:")]),t._v(" "),e("span",{staticClass:"crystal-number"},[t._v(t._s(t.purse.crystals))])]),t._v(" "),e("div",{staticClass:"input-number"},[e("input",{directives:[{name:"model",rawName:"v-model",value:t.number,expression:"number"}],staticClass:"number",attrs:{placeholder:"請輸入兌換的水晶數量"},domProps:{value:t.number},on:{input:function(s){s.target.composing||(t.number=s.target.value)}}})]),t._v(" "),e("div",{staticClass:"diamond"},[t._m(1),t._v(" "),e("span",{staticClass:"crystal-text"},[t._v("余額:")]),t._v(" "),e("span",{staticClass:"crystal-number"},[t._v(t._s(t.purse.diamonds))])]),t._v(" "),e("div",{staticClass:"sure",on:{click:t.sure}},[t._v("確認兌換")]),t._v(" "),e("div",{staticClass:"bottom-text"},[t._v("水晶可兌換鉆石兌換比率1水晶=1鉆石水晶數量必須為10的整數倍。")]),t._v(" "),e("van-password-input",{directives:[{name:"show",rawName:"v-show",value:t.showKeyboard,expression:"showKeyboard"}],staticClass:"passwrod-input",attrs:{value:t.password,focused:t.showKeyboard},on:{focus:function(s){t.showKeyboard=!0}}}),t._v(" "),e("van-number-keyboard",{attrs:{show:t.showKeyboard,gutter:"15"},on:{blur:function(s){t.showKeyboard=!1},input:t.onInput,delete:t.onDelete}})],1)},staticRenderFns:[function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"crystal"},[s("img",{attrs:{src:e("ujUd")}})])},function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"crystal"},[s("img",{attrs:{src:e("QCm6")}})])}]};var h=e("VU/8")(u,l,!1,function(t){e("cAtB")},"data-v-b59c778a",null);s.default=h.exports},cAtB:function(t,s){}});
//# sourceMappingURL=9.13c87d6f964112c86413.js.map

View File

@@ -0,0 +1,2 @@
webpackJsonp([14],{"2KIr":function(n,e){},"4ml/":function(n,e){},NHnr:function(n,e,t){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var i=t("7+uW"),o={render:function(){var n=this.$createElement,e=this._self._c||n;return e("div",{attrs:{id:"app"}},[e("router-view")],1)},staticRenderFns:[]};var a=t("VU/8")({name:"App"},o,!1,function(n){t("nnj/")},null,null).exports,r=t("YaEn"),c=(t("2KIr"),t("NYxO")),s=t("Z4iZ"),d=Object(s.b)().app;console.log(d,"store"),i.a.use(c.a);var u=new c.a.Store({state:{info:{ticket:"123",uid:"678"},isApp:d},mutations:{setInfo:function(n,e){n.info.ticket=e.ticket,n.info.uid=e.uid}},getters:{getInfo:function(n){return n.info},getIsApp:function(n){return n.info}},actions:{getUserInfo:function(n){return n.state}}}),l=t("pFYg"),f=t.n(l);window.info={},window.getMessage=function(n,e){info[n]=e};t("4ml/");var p=t("Fd2+"),m=(t("sVYa"),t("Lw6n")),h=t.n(m),g=t("DVXL"),w=t.n(g);!function(){var n=Object(s.b)();if(n.app)if(window.sessionStorage.clear(),n.ios){var e=document.cookie.match(/\d+/);info.uid=e[0],window.webkit.messageHandlers.getTicket.postMessage(null),window.webkit.messageHandlers.getDeviceId.postMessage(null)}else n.android&&androidJsObj&&"object"===("undefined"==typeof androidJsObj?"undefined":f()(androidJsObj))&&(info.uid=parseInt(window.androidJsObj.getUid()),info.ticket=window.androidJsObj.getTicket(),info.deviceId=window.androidJsObj.getDeviceId());else window.sessionStorage.clear(),info.uid=1016,info.ticket="test"}(),i.a.config.productionTip=!1,"test"===Object(s.a)()&&new h.a,w.a.attach(document.body),w.a.prototype.focus=function(n){var e;n.setSelectionRange&&0!==n.type.indexOf("date")&&"time"!==n.type&&"month"!==n.type?(e=n.value.length,n.focus(),n.setSelectionRange(e,e)):n.focus()},i.a.use(p.c),new i.a({el:"#app",router:r.a,store:u,components:{App:a},template:"<App/>"})},YaEn:function(n,e,t){"use strict";var i=t("7+uW"),o=t("/ocq");i.a.use(o.a);var a=new o.a({routes:[{path:"/MyIncome",name:"MyIncome",component:function(){return Promise.all([t.e(0),t.e(4)]).then(t.bind(null,"kutM"))}},{path:"/CrystalExchangeDiamond",name:"CrystalExchangeDiamond",component:function(){return Promise.all([t.e(0),t.e(9)]).then(t.bind(null,"3IW4"))}},{path:"/GoldExchangeDiamond",name:"GoldExchangeDiamond",component:function(){return Promise.all([t.e(0),t.e(12)]).then(t.bind(null,"RpvA"))}},{path:"/WithDraw",name:"WithDraw",component:function(){return Promise.all([t.e(0),t.e(3)]).then(t.bind(null,"9SZj"))}},{path:"/BindAlipay",name:"BindAlipay",component:function(){return Promise.all([t.e(0),t.e(2)]).then(t.bind(null,"b+Mi"))}},{path:"/CrystalLog",name:"CrystalLog",component:function(){return Promise.all([t.e(0),t.e(8)]).then(t.bind(null,"4tis"))}},{path:"/GoldLog",name:"GoldLog",component:function(){return Promise.all([t.e(0),t.e(10)]).then(t.bind(null,"b+89"))}},{path:"/DiamondLog",name:"DiamondLog",component:function(){return Promise.all([t.e(0),t.e(5)]).then(t.bind(null,"QAJJ"))},meta:{title:"鉆石記錄"}},{path:"/Login",name:"Login",component:function(){return Promise.all([t.e(0),t.e(6)]).then(t.bind(null,"CroZ"))},meta:{title:"登錄"}},{path:"/runningWater",name:"runningWater",component:function(){return t.e(7).then(t.bind(null,"Ok5E"))},meta:{title:"房間流水"}},{path:"/GameWithDrawDesc",name:"GameWithDrawDesc",component:function(){return Promise.all([t.e(0),t.e(11)]).then(t.bind(null,"CXh3"))},meta:{title:"領獎說明"}},{path:"/WithDrawInfoBind",name:"WithDrawInfoBind",component:function(){return Promise.all([t.e(0),t.e(1)]).then(t.bind(null,"Vj3e"))},meta:{title:"個人信息綁定"}}]});a.beforeEach(function(n,e,t){"Login"===e.name||window.sessionStorage.getItem("ticket")?t():setTimeout(function(){window.sessionStorage.setItem("uid",info.uid),window.sessionStorage.setItem("ticket",info.ticket),console.log(info,"router"),t()},50)}),e.a=a},Z4iZ:function(n,e,t){"use strict";t.d(e,"b",function(){return i}),t.d(e,"a",function(){return o});var i=function(){var n=navigator.userAgent;navigator.appVersion;return{trident:n.indexOf("Trident")>-1,presto:n.indexOf("Presto")>-1,webKit:n.indexOf("AppleWebKit")>-1,gecko:n.indexOf("Gecko")>-1&&-1==n.indexOf("KHTML"),mobile:!!n.match(/AppleWebKit.*Mobile.*/),ios:!!n.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),android:n.indexOf("Android")>-1||n.indexOf("Adr")>-1,iPhone:n.indexOf("iPhone")>-1,iPad:n.indexOf("iPad")>-1,webApp:-1==n.indexOf("Safari"),weixin:n.indexOf("MicroMessenger")>-1,qq:" qq"==n.match(/\sQQ/i),app:"pekoApp"==n.match("pekoApp")}},o=function(){if(window.location.href){var n=window.location.href,e=n.match(/api.uat.z/),t=n.match(/120.79.211.243/),i=n.match(/192.168/),o=n.match(/127.0.0.1/),a=n.match(/api.uat/),r=n.match(/beta./);return e||t||i||o||a||r?"test":"live"}}},"nnj/":function(n,e){}},["NHnr"]);
//# sourceMappingURL=app.861748a1f83bae0fde49.js.map

View File

@@ -0,0 +1,2 @@
!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,f){for(var a,i,u,d=0,s=[];d<r.length;d++)i=r[d],t[i]&&s.push(t[i][0]),t[i]=0;for(a in c)Object.prototype.hasOwnProperty.call(c,a)&&(e[a]=c[a]);for(n&&n(r,c,f);s.length;)s.shift()();if(f)for(d=0;d<f.length;d++)u=o(o.s=f[d]);return u};var r={},t={15:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],f=document.createElement("script");f.type="text/javascript",f.charset="utf-8",f.async=!0,f.timeout=12e4,o.nc&&f.setAttribute("nonce",o.nc),f.src=o.p+"static/js/"+e+"."+{0:"ffe9e684b35b5e6eef2f",1:"531cbf904bcc3493870e",2:"35b21c0ce9f58c2c0810",3:"44d854121d9073f4c390",4:"59c8399860fe4c31bfad",5:"cd3cfd0105b22f60c73f",6:"3655d80f5f2b212e3b9f",7:"74b4774fa9af85fa0de2",8:"d9f33ba9220054db9973",9:"13c87d6f964112c86413",10:"e221f303b5cd6ea692bf",11:"d272cf261efb570c4c27",12:"abcd45ba53d9774263d2"}[e]+".js";var a=setTimeout(i,12e4);function i(){f.onerror=f.onload=null,clearTimeout(a);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return f.onerror=f.onload=i,c.appendChild(f),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
//# sourceMappingURL=manifest.ff90bd02ecb0d2060419.js.map

View File

@@ -1,108 +1,94 @@
@font-face {
font-family: 'pingfang-bold';
font-family: "pingfang-bold";
src: url("../../../common/fonts/PingFang Bold.ttf");
src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
}
@font-face {
font-family: 'pingfang-medium';
font-family: "pingfang-medium";
src: url("../../../common/fonts/PingFang Medium.ttf");
src: url("../../../common/fonts/PingFang Medium.ttf") format("woff"), url("../../../common/fonts/PingFang Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang Medium.ttf") format("svg");
}
body {
width: 100%;
font-family: 'pingfang-bold';
font-family: "pingfang-bold";
background-color: #fff;
}
.wrap {
display: none;
}
.wrap .tab_wrap {
position: fixed;
top: 0;
left: 0;
z-index: 99;
width: 100%;
height: 2.66667rem;
height: 2.6666666667rem;
background: url("../images/top.png") no-repeat 0 0/100% 100%;
overflow: hidden;
}
.wrap .tab_wrap .tab_contain {
display: flex;
justify-content: space-between;
align-items: center;
width: 8.53333rem;
width: 8.5333333333rem;
height: 0.96rem;
margin: 0.66667rem auto 0.34667rem;
margin: 0.6666666667rem auto 0.3466666667rem;
background-color: #9785FA;
border-radius: 0.53333rem;
border-radius: 0.5333333333rem;
color: rgba(255, 255, 255, 0.6);
font-size: 0.4rem;
}
.wrap .tab_wrap .tab_contain p {
width: 4.16rem;
height: 0.85333rem;
line-height: 0.85333rem;
margin: 0 0.05333rem;
height: 0.8533333333rem;
line-height: 0.8533333333rem;
margin: 0 0.0533333333rem;
text-align: center;
font-weight: bold;
}
.wrap .tab_wrap .tab_contain p.active {
background-color: #fff;
color: #7898F3;
border-radius: 0.53333rem;
border-radius: 0.5333333333rem;
}
.wrap .tab_wrap .rank_type {
display: flex;
margin-left: 0.8rem;
}
.wrap .tab_wrap .rank_type p {
position: relative;
margin-right: 0.42667rem;
margin-right: 0.4266666667rem;
color: rgba(255, 255, 255, 0.6);
font-size: 0.32rem;
}
.wrap .tab_wrap .rank_type p.active {
color: white;
}
.wrap .tab_wrap .rank_type p.active::after {
content: '';
content: "";
position: absolute;
bottom: -0.21333rem;
bottom: -0.2133333333rem;
left: 50%;
transform: translateX(-50%);
width: 0.26667rem;
height: 0.10667rem;
border-radius: 0.05333rem;
width: 0.2666666667rem;
height: 0.1066666667rem;
border-radius: 0.0533333333rem;
background-color: #fff;
}
.wrap .tab_wrap .rank_type p:last-child {
display: none;
}
.wrap .rank_wrap {
overflow: auto;
}
.wrap .rank_wrap .top_three_wrap {
position: relative;
width: 100%;
height: 5.33333rem;
height: 5.3333333333rem;
background: url("../images/topthree-bg.png") no-repeat 0 0/100% 100%;
margin-top: 2.66667rem;
margin-top: 2.6666666667rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item {
position: absolute;
left: 50%;
@@ -111,42 +97,34 @@ body {
text-align: center;
color: #fff;
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2), .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) {
left: 0.8rem;
transform: translateX(0);
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar {
width: 1.89333rem;
height: 2.18667rem;
margin-top: 1.49333rem;
width: 1.8933333333rem;
height: 2.1866666667rem;
margin-top: 1.4933333333rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar p, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar p {
background-image: url("../images/second.png");
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(2) .avatar img, .wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar img {
top: -1.76rem;
width: 1.54667rem;
height: 1.54667rem;
width: 1.5466666667rem;
height: 1.5466666667rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) {
left: 6.88rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item:nth-child(3) .avatar p {
background-image: url("../images/third.png");
}
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar {
width: 2.32rem;
height: 2.66667rem;
margin: 0.45333rem auto 0.32rem;
height: 2.6666666667rem;
margin: 0.4533333333rem auto 0.32rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar p {
position: relative;
z-index: 99;
@@ -154,99 +132,88 @@ body {
height: 100%;
background: url("../images/first.png") no-repeat 0 0/100% 100%;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .avatar img {
position: relative;
top: -2.13333rem;
top: -2.1333333333rem;
width: 1.92rem;
height: 1.92rem;
border-radius: 50%;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .nick {
display: flex;
justify-content: center;
align-items: center;
font-size: 0.32rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .nick img {
width: 0.4rem;
width: 0.4rem;
margin-left: 0.05333rem;
margin-left: 0.0533333333rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .erbanNo {
font-size: 0.26667rem;
font-size: 0.2666666667rem;
color: rgba(255, 255, 255, 0.6);
margin: 0.10667rem 0 0.10667rem;
margin: 0.1066666667rem 0 0.1066666667rem;
}
.wrap .rank_wrap .top_three_wrap .top_three_item .num {
font-size: 0.37333rem;
font-size: 0.3733333333rem;
color: #FF7979;
}
.wrap .rank_wrap ul {
height: 3.73333rem;
margin-top: 0.45333rem;
height: 3.7333333333rem;
margin-top: 0.4533333333rem;
}
.wrap .rank_wrap ul li {
display: flex;
align-items: center;
margin-bottom: 0.42667rem;
margin-bottom: 0.4266666667rem;
}
.wrap .rank_wrap ul li .index {
width: 0.4rem;
text-align: center;
font-size: 0.48rem;
font-weight: bold;
color: #666;
margin: 0 0.53333rem;
margin: 0 0.5333333333rem;
}
.wrap .rank_wrap ul li .others_avatar {
width: 1.33333rem;
height: 1.33333rem;
margin-right: 0.42667rem;
width: 1.3333333333rem;
height: 1.3333333333rem;
margin-right: 0.4266666667rem;
}
.wrap .rank_wrap ul li .others_avatar img {
width: 100%;
height: 100%;
border-radius: 50%;
}
.wrap .rank_wrap ul li .info_wrap {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-around;
height: 0.93333rem;
height: 0.9333333333rem;
}
.wrap .rank_wrap ul li .info_wrap .others_nick {
color: #333;
font-size: 0.37333rem;
font-size: 0.3733333333rem;
}
.wrap .rank_wrap ul li .info_wrap .others_nick img {
width: 0.4rem;
height: 0.4rem;
vertical-align: bottom;
}
.wrap .rank_wrap ul li .info_wrap .others_erbanNo {
color: rgba(102, 102, 102, 0.6);
}
.wrap .rank_wrap ul li .others_num {
color: #FF7979;
font-size: 0.37333rem;
font-size: 0.3733333333rem;
font-weight: bold;
margin-right: 0.66667rem;
margin-right: 0.6666666667rem;
}
::-webkit-scrollbar {
display: none;
}
/*# sourceMappingURL=index.css.map */

View File

@@ -191,6 +191,8 @@ body{
height: px2rem(100, );
margin-right: px2rem(32, );
img{
width: 100%;
height: 100%;
border-radius: 50%;
}
}

View File

@@ -22,8 +22,8 @@ module.exports = {
}},
// Various Dev Server settings
// host: '127.0.0.1', // can be overwritten by process.env.HOST
host: '192.168.3.153', // can be overwritten by process.env.HOST
host: '127.0.0.1', // can be overwritten by process.env.HOST
// host: '192.168.3.153', // can be overwritten by process.env.HOST
// host: '192.168.9.200', // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,

View File

@@ -76,6 +76,7 @@
<p v-else-if="tab === 12 && item1.objType === 31">购买座驾支出</p>
<p v-else-if="tab === 12 && item1.objType === 32">赠送座驾支出</p>
<p v-else-if="tab === 12 && item1.objType === 87">星级厨房抽奖</p>
<p v-else-if="tab === 12 && item1.objType === 95">新年煙花抽獎</p>
<p v-else-if="tab === 12 && item1.objType === 90">转赠鉆石给 {{item1.targetNick}} {{item1.sendDiamondAmount}}</p>
<!-- <p v-if="tab === 12">{{ item1.srcNick }}</p> -->
<p