完成邀请好友页面，联调第三方充值，迁移星级厨房页面
Dragon
@@ -1,139 +1,163 @@
|
||||
@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: "din-medium";
|
||||
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");
|
||||
}
|
||||
|
||||
@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");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "pingfang-regular";
|
||||
font-family: 'pingfang-regular';
|
||||
src: url("../../../common/fonts/PingFang-Regular.ttf");
|
||||
src: url("../../../common/fonts/PingFang-Regular.ttf") format("woff"), url("../../../common/fonts/PingFang-Regular.ttf") format("truetype"), url("../../../common/fonts/PingFang-Regular.ttf") format("svg");
|
||||
}
|
||||
|
||||
html, body {
|
||||
font-family: "pingfang-bold";
|
||||
font-family: 'pingfang-bold';
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.rank-top {
|
||||
height: 6.6666666667rem;
|
||||
height: 6.66667rem;
|
||||
background-image: linear-gradient(#3491F5, #60C7FC);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.rank-top .tab-wrap {
|
||||
font-family: "pingfang-regular";
|
||||
width: 5.3333333333rem;
|
||||
height: 0.9333333333rem;
|
||||
font-family: 'pingfang-regular';
|
||||
width: 5.33333rem;
|
||||
height: 0.93333rem;
|
||||
background-color: #7ABDF9;
|
||||
border-radius: 0.48rem;
|
||||
margin: 0.48rem auto 0.2933333333rem;
|
||||
margin: 0.48rem auto 0.29333rem;
|
||||
}
|
||||
|
||||
.rank-top .tab-wrap span {
|
||||
display: inline-block;
|
||||
width: 2.5333333333rem;
|
||||
width: 2.53333rem;
|
||||
height: 0.8rem;
|
||||
line-height: 0.8rem;
|
||||
text-align: center;
|
||||
font-size: 0.4rem;
|
||||
color: white;
|
||||
margin-top: 0.0666666667rem;
|
||||
margin-top: 0.06667rem;
|
||||
}
|
||||
|
||||
.rank-top .tab-wrap span:first-child {
|
||||
margin-left: 0.08rem;
|
||||
}
|
||||
|
||||
.rank-top .tab-wrap .active {
|
||||
background-color: white;
|
||||
color: #3C9BF7;
|
||||
border-radius: 0.4rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 2.6666666667rem;
|
||||
width: 2.66667rem;
|
||||
height: 3.2rem;
|
||||
background-image: linear-gradient(#3F9EF7, #52B6FA);
|
||||
margin-top: 1.68rem;
|
||||
border-radius: 0.2666666667rem 0.2666666667rem 0 0;
|
||||
border-radius: 0.26667rem 0.26667rem 0 0;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:first-child {
|
||||
width: 3.2rem;
|
||||
height: 3.7333333333rem;
|
||||
margin-top: 1.1466666667rem;
|
||||
height: 3.73333rem;
|
||||
margin-top: 1.14667rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(2) {
|
||||
left: 0.48rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(2) .avatar {
|
||||
width: 1.8666666667rem;
|
||||
height: 2.5333333333rem;
|
||||
margin-top: -1.1466666667rem;
|
||||
width: 1.86667rem;
|
||||
height: 2.53333rem;
|
||||
margin-top: -1.14667rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(2) .avatar p {
|
||||
background-image: url("../images/second.png");
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(2) .avatar img {
|
||||
width: 1.8666666667rem;
|
||||
height: 1.8666666667rem;
|
||||
top: -1.9733333333rem;
|
||||
width: 1.86667rem;
|
||||
height: 1.86667rem;
|
||||
top: -1.97333rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(3) {
|
||||
right: 0.48rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(3) .avatar {
|
||||
width: 1.8666666667rem;
|
||||
height: 2.5333333333rem;
|
||||
margin-top: -1.1466666667rem;
|
||||
width: 1.86667rem;
|
||||
height: 2.53333rem;
|
||||
margin-top: -1.14667rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(3) .avatar p {
|
||||
background-image: url("../images/third.png");
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap:nth-child(3) .avatar img {
|
||||
width: 1.8666666667rem;
|
||||
height: 1.8666666667rem;
|
||||
top: -1.9733333333rem;
|
||||
width: 1.86667rem;
|
||||
height: 1.86667rem;
|
||||
top: -1.97333rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap .avatar {
|
||||
width: 2.1333333333rem;
|
||||
height: 2.8533333333rem;
|
||||
margin-top: -0.9333333333rem;
|
||||
width: 2.13333rem;
|
||||
height: 2.85333rem;
|
||||
margin-top: -0.93333rem;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap .avatar p {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
height: 100%;
|
||||
background: url("../images/first.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap .avatar img {
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
top: -2.24rem;
|
||||
width: 2.1333333333rem;
|
||||
height: 2.1333333333rem;
|
||||
width: 2.13333rem;
|
||||
height: 2.13333rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap .nick, .rank-top .topthree-wrap .info-wrap .diamond-num {
|
||||
font-size: 0.4rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
margin: 0.2133333333rem 0;
|
||||
margin: 0.21333rem 0;
|
||||
}
|
||||
|
||||
.rank-top .topthree-wrap .info-wrap .diamond-num {
|
||||
font-family: "din-medium";
|
||||
font-family: 'din-medium';
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@@ -142,19 +166,22 @@ html, body {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
border-radius: 0.4rem 0.4rem 0 0;
|
||||
margin-top: -0.3466666667rem;
|
||||
margin-top: -0.34667rem;
|
||||
background-color: white;
|
||||
padding: 0.5333333333rem 0.7733333333rem 0;
|
||||
padding: 0.53333rem 0.77333rem 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.other-rank li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.5333333333rem;
|
||||
margin-bottom: 0.53333rem;
|
||||
}
|
||||
|
||||
.other-rank li:last-child {
|
||||
margin-bottom: 1.8666666667rem;
|
||||
margin-bottom: 1.86667rem;
|
||||
}
|
||||
|
||||
.other-rank li .index {
|
||||
display: inline-block;
|
||||
width: 0.4rem;
|
||||
@@ -162,25 +189,29 @@ html, body {
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.other-rank li .others-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
.other-rank li .others-info img {
|
||||
width: 1.3333333333rem;
|
||||
height: 1.3333333333rem;
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
border-radius: 50%;
|
||||
margin-right: 0.2666666667rem;
|
||||
margin-right: 0.26667rem;
|
||||
}
|
||||
|
||||
.other-rank li .others-info .others-nick {
|
||||
font-size: 0.3733333333rem;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.other-rank li .others-diamond-num {
|
||||
font-size: 0.3466666667rem;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: bold;
|
||||
color: #ED7B50;
|
||||
}
|
||||
@@ -193,40 +224,46 @@ html, body {
|
||||
width: 100%;
|
||||
height: 1.6rem;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
padding: 0 0.7733333333rem;
|
||||
padding: 0 0.77333rem;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mine .mine-rank {
|
||||
font-size: 0.3466666667rem;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.mine .mine-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mine .mine-info img {
|
||||
width: 1.3333333333rem;
|
||||
height: 1.3333333333rem;
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
border-radius: 50%;
|
||||
margin-left: 0.4rem;
|
||||
margin-right: 0.2666666667rem;
|
||||
margin-right: 0.26667rem;
|
||||
}
|
||||
|
||||
.mine .mine-info .mine-nick {
|
||||
font-size: 0.3733333333rem;
|
||||
font-size: 0.37333rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.mine .mine-diamond-num {
|
||||
font-size: 0.3466666667rem;
|
||||
font-size: 0.34667rem;
|
||||
font-weight: bold;
|
||||
color: #ED7B50;
|
||||
}
|
||||
|
||||
.no-in-app {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@@ -235,5 +272,3 @@ html, body {
|
||||
z-index: 99999;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=rank.css.map */
|
||||
|
||||
@@ -246,7 +246,7 @@ html,body{
|
||||
}
|
||||
|
||||
.no-in-app{
|
||||
// display: none;
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
@@ -1,125 +1,155 @@
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #233346;
|
||||
@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");
|
||||
}
|
||||
|
||||
.img {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 6rem;
|
||||
height: 4.1333333333rem;
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.img p {
|
||||
text-align: center;
|
||||
width: 1.3333333333%rem;
|
||||
position: absolute;
|
||||
bottom: -1rem;
|
||||
left: 50%;
|
||||
transform: translate(-50%);
|
||||
color: #fff;
|
||||
font-size: 0.2666666667rem;
|
||||
@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");
|
||||
}
|
||||
|
||||
.record-list {
|
||||
width: 9.2rem;
|
||||
margin: 0.4rem auto;
|
||||
@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");
|
||||
}
|
||||
.record-list li {
|
||||
width: 100%;
|
||||
height: 4.8rem;
|
||||
background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
|
||||
border-radius: 0.2666666667rem;
|
||||
|
||||
.clearfix:after {
|
||||
display: block;
|
||||
content: ' ';
|
||||
clear: both;
|
||||
}
|
||||
.record-list li h3 {
|
||||
width: 100%;
|
||||
height: 0.7rem;
|
||||
line-height: 0.7rem;
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
html, body {
|
||||
font-family: 'pingfang-bold';
|
||||
background-image: linear-gradient(#E6AD6A, #F9CA92);
|
||||
}
|
||||
|
||||
ul.record-list {
|
||||
height: 100vh;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-top: 0.69333rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item {
|
||||
overflow: hidden;
|
||||
width: 10rem;
|
||||
height: 5.6rem;
|
||||
background: url("../images/record/record-bg.png") no-repeat 0 0/100% 100%;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item .time {
|
||||
font-family: 'pingfang-medium';
|
||||
font-size: 0.34667rem;
|
||||
color: white;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
margin-top: 0.58667rem;
|
||||
margin-bottom: 0.21333rem;
|
||||
}
|
||||
.record-list li .goldBox {
|
||||
width: 1.3333333333%rem;
|
||||
height: 0.5866666667rem;
|
||||
line-height: 0.5866666667rem;
|
||||
background: #1B9196;
|
||||
|
||||
ul.record-list li.record-item .award {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.2666666667rem;
|
||||
align-items: center;
|
||||
width: 9.04rem;
|
||||
height: 0.58667rem;
|
||||
background-color: #F46331;
|
||||
margin: auto;
|
||||
}
|
||||
.record-list li .goldBox span {
|
||||
color: #fff;
|
||||
font-size: 0.3733333333rem;
|
||||
|
||||
ul.record-list li.record-item .award .text {
|
||||
font-size: 0.37333rem;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
margin-left: 0.32rem;
|
||||
}
|
||||
.record-list li .goldBox .gold {
|
||||
font-size: 0.3466666667rem;
|
||||
|
||||
ul.record-list li.record-item .award .diamond-num {
|
||||
font-family: 'din-medium';
|
||||
font-size: 0.34667rem;
|
||||
color: white;
|
||||
margin-right: 0.34667rem;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item .award img.diamond-pic {
|
||||
width: 0.48rem;
|
||||
height: 0.37333rem;
|
||||
margin: 0 0.34667rem 0 -0.26667rem;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item .award img.diamond-pic1 {
|
||||
width: 0.48rem;
|
||||
height: 0.37333rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 0.66667rem 0 0.8rem;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item {
|
||||
width: 25%;
|
||||
margin: 0.26667rem 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item.active {
|
||||
margin: 0.13333rem 0;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item.active div {
|
||||
width: 1.06667rem;
|
||||
height: 1.06667rem;
|
||||
background: url("../images/little-bubble-active.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item.active span {
|
||||
color: #FEEF60;
|
||||
}
|
||||
.record-list li .marine_organism {
|
||||
width: 7.4666666667rem;
|
||||
height: 2.1333333333rem;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.record-list li .marine_organism span {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
.record-list li .marine_organism span img {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 0.72rem;
|
||||
height: 0.6266666667rem;
|
||||
display: block;
|
||||
}
|
||||
.record-list li .marine_organism span b {
|
||||
position: absolute;
|
||||
right: -0.1rem;
|
||||
top: 0.3rem;
|
||||
color: #FFFFFF;
|
||||
font-size: 0.2666666667rem;
|
||||
}
|
||||
.record-list li .marine_organism .active {
|
||||
width: 1.6rem;
|
||||
height: 1.6rem;
|
||||
position: relative;
|
||||
}
|
||||
.record-list li .marine_organism .active img {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 0.96rem;
|
||||
height: 0.8266666667rem;
|
||||
display: block;
|
||||
}
|
||||
.record-list li .marine_organism .active b {
|
||||
position: absolute;
|
||||
right: -0.1rem;
|
||||
top: 0.3rem;
|
||||
color: #FFFFFF;
|
||||
-webkit-text-stroke: 0.0266666667rem #FF5C7E;
|
||||
text-stroke: 0.0266666667rem #FF5C7E;
|
||||
font-weight: bold;
|
||||
font-size: 0.32rem;
|
||||
}
|
||||
.record-list li p {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 0.9rem;
|
||||
display: none;
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item div {
|
||||
width: 0.8rem;
|
||||
height: 0.8rem;
|
||||
background: url("../images/little-bubble.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=record.css.map */
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item div img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item ul.award-animal li.animal-item span {
|
||||
font-size: 0.26667rem;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
margin-left: 0.10667rem;
|
||||
}
|
||||
|
||||
ul.record-list li.record-item .tip {
|
||||
font-family: 'pingfang-medium';
|
||||
font-size: 0.26667rem;
|
||||
color: white;
|
||||
text-align: center;
|
||||
margin-top: 0.26667rem;
|
||||
}
|
||||
|
||||
ul.record-list .no-record {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 0.42667rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@@ -2,137 +2,149 @@
|
||||
@return $px / $rem+rem;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
background: #233346;
|
||||
@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');
|
||||
}
|
||||
.img{
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
width: px2rem(450, );
|
||||
height: px2rem(310, );
|
||||
background: url(../images/null.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
p{
|
||||
text-align: center;
|
||||
width: px2rem(100%, );
|
||||
position: absolute;
|
||||
bottom: -1rem;
|
||||
left: 50%;
|
||||
transform: translate(-50%);
|
||||
color: #fff;
|
||||
font-size: px2rem(20, );
|
||||
}
|
||||
|
||||
@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');
|
||||
}
|
||||
.record-list {
|
||||
width: px2rem(690, );
|
||||
margin: px2rem(30, ) auto;
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
height: px2rem(360, );
|
||||
background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
|
||||
border-radius: px2rem(20, );
|
||||
h3 {
|
||||
width: 100%;
|
||||
height: 0.7rem;
|
||||
line-height: 0.7rem;
|
||||
@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');
|
||||
}
|
||||
|
||||
.clearfix:after{
|
||||
display:block;
|
||||
content:' ';
|
||||
clear:both;
|
||||
}
|
||||
.clearfix{
|
||||
*zoom:1;//兼容到ie6
|
||||
}
|
||||
|
||||
html,body{
|
||||
font-family: 'pingfang-bold';
|
||||
background-image: linear-gradient(#E6AD6A, #F9CA92) ;
|
||||
}
|
||||
|
||||
ul.record-list{
|
||||
height: 100vh;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-top: px2rem(52);
|
||||
box-sizing: border-box;
|
||||
li.record-item{
|
||||
overflow: hidden;
|
||||
width: px2rem(750);
|
||||
height: px2rem(420);
|
||||
background: url('../images/record/record-bg.png') no-repeat 0 0/100% 100%;
|
||||
margin-bottom: px2rem(30);
|
||||
.time{
|
||||
font-family: 'pingfang-medium';
|
||||
font-size: px2rem(26);
|
||||
color: white;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
|
||||
margin-top: px2rem(44);
|
||||
margin-bottom: px2rem(16);
|
||||
}
|
||||
|
||||
.goldBox {
|
||||
width: px2rem(100%, );
|
||||
height: px2rem(44, );
|
||||
line-height: px2rem(44, );
|
||||
background: #1B9196;
|
||||
.award{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 0 px2rem(20, );
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
font-size: px2rem(28, );
|
||||
align-items: center;
|
||||
width: px2rem(678);
|
||||
height: px2rem(44);
|
||||
background-color: #F46331;
|
||||
margin: auto;
|
||||
.text{
|
||||
font-size: px2rem(28);
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
margin-left: px2rem(24);
|
||||
}
|
||||
|
||||
.gold {
|
||||
font-size: px2rem(26, );
|
||||
.diamond-num{
|
||||
font-family: 'din-medium';
|
||||
font-size: px2rem(26);
|
||||
color: white;
|
||||
margin-right: px2rem(26);
|
||||
}
|
||||
img.diamond-pic{
|
||||
width: px2rem(36);
|
||||
height: px2rem(28);
|
||||
margin: 0 px2rem(26) 0 px2rem(-20);
|
||||
}
|
||||
img.diamond-pic1{
|
||||
width: px2rem(36);
|
||||
height: px2rem(28);
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
ul.award-animal{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0 px2rem(50) 0 px2rem(60);
|
||||
// margin-left: px2rem(60);
|
||||
li.animal-item{
|
||||
// float: left;
|
||||
width: 25%;
|
||||
margin: px2rem(20) 0;
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
align-items: center;
|
||||
&.active{
|
||||
margin: px2rem(10) 0;
|
||||
div{
|
||||
width: px2rem(80);
|
||||
height: px2rem(80);
|
||||
background: url('../images/little-bubble-active.png') no-repeat 0 0/100% 100%;
|
||||
}
|
||||
span{
|
||||
color: #FEEF60;
|
||||
}
|
||||
}
|
||||
|
||||
.marine_organism {
|
||||
width: px2rem(560, );
|
||||
height: px2rem(160, );
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
|
||||
span {
|
||||
width: px2rem(120, );
|
||||
height: px2rem(120, );
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: px2rem(54, );
|
||||
height: px2rem(47, );
|
||||
display: block;
|
||||
}
|
||||
|
||||
b {
|
||||
position: absolute;
|
||||
right: -0.1rem;
|
||||
top: 0.3rem;
|
||||
color: #FFFFFF;
|
||||
font-size: px2rem(20, );
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
width: px2rem(120, );
|
||||
height: px2rem(120, );
|
||||
position: relative;
|
||||
|
||||
img {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: px2rem(72, );
|
||||
height: px2rem(62, );
|
||||
display: block;
|
||||
}
|
||||
|
||||
b {
|
||||
position: absolute;
|
||||
right: -0.1rem;
|
||||
top: 0.3rem;
|
||||
color: #FFFFFF;
|
||||
-webkit-text-stroke: px2rem(2, ) #FF5C7E;
|
||||
text-stroke: px2rem(2, ) #FF5C7E;
|
||||
font-weight: bold;
|
||||
font-size: px2rem(24, );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
color: #fff;
|
||||
div{
|
||||
width: px2rem(60);
|
||||
height: px2rem(60);
|
||||
background: url('../images/little-bubble.png') no-repeat 0 0/100% 100%;
|
||||
img{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 0.9rem;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
span{
|
||||
font-size: px2rem(20);
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
margin-left: px2rem(8);
|
||||
}
|
||||
}
|
||||
}
|
||||
.tip{
|
||||
font-family: 'pingfang-medium';
|
||||
font-size: px2rem(20);
|
||||
color: white;
|
||||
text-align: center;
|
||||
margin-top: px2rem(20);
|
||||
}
|
||||
}
|
||||
.no-record{
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: px2rem(32);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 459 B After Width: | Height: | Size: 505 B |
|
Before Width: | Height: | Size: 101 KiB After Width: | Height: | Size: 61 KiB |
|
Before Width: | Height: | Size: 8.1 KiB After Width: | Height: | Size: 9.8 KiB |
|
Before Width: | Height: | Size: 6.4 KiB After Width: | Height: | Size: 7.3 KiB |
|
Before Width: | Height: | Size: 598 B |
|
Before Width: | Height: | Size: 1.0 KiB |
|
Before Width: | Height: | Size: 8.3 KiB After Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 3.3 KiB After Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 3.7 KiB After Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 7.0 KiB |
|
Before Width: | Height: | Size: 78 KiB After Width: | Height: | Size: 168 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 452 B After Width: | Height: | Size: 578 B |
BIN
view/peko/activity/act-ocean/images/little-bubble-active.png
Normal file
|
After Width: | Height: | Size: 1011 B |
BIN
view/peko/activity/act-ocean/images/logo.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 43 KiB |
|
Before Width: | Height: | Size: 7.4 KiB After Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 7.2 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 471 B After Width: | Height: | Size: 548 B |
|
Before Width: | Height: | Size: 491 B After Width: | Height: | Size: 572 B |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 273 B After Width: | Height: | Size: 324 B |
|
Before Width: | Height: | Size: 803 B After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.7 KiB |
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.5 KiB |
BIN
view/peko/activity/act-ocean/images/record/diamond.png
Normal file
|
After Width: | Height: | Size: 841 B |
|
Before Width: | Height: | Size: 14 KiB |
BIN
view/peko/activity/act-ocean/images/record/record-bg.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
|
Before Width: | Height: | Size: 766 B |
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 111 KiB |
|
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 123 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 64 KiB |
|
Before Width: | Height: | Size: 729 B After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 736 B After Width: | Height: | Size: 1.8 KiB |
@@ -1,14 +1,13 @@
|
||||
<!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>
|
||||
<title>星级厨房</title>
|
||||
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/index.css?v=3.0">
|
||||
<link rel="stylesheet" href="./css/index.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
@@ -19,20 +18,20 @@
|
||||
<div class="record"><img src="./images/record.png" alt=""></div>
|
||||
|
||||
<!-- 特权商城 -->
|
||||
<!-- <div class="mall">
|
||||
<div class="mall">
|
||||
<img src="./images/mall.png" alt="">
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- 游戏区域 -->
|
||||
<div class="game-area">
|
||||
<!-- 选择时间 -->
|
||||
<div class="select-time">
|
||||
<div class="count-down">倒計時：<span class="count-down-num"></span><span>S</span></div>
|
||||
<!-- <div class="current-tip">玩法：选择碎片数量→选择食材</div> -->
|
||||
<div class="count-down">开奖倒计时：<span class="count-down-num"></span>秒</div>
|
||||
<div class="current-tip">玩法：选择碎片数量→选择食材</div>
|
||||
|
||||
<div class="btn-wrap">
|
||||
<div class="active">100钻石</div>
|
||||
<div>1000钻石</div>
|
||||
<div>10000钻石</div>
|
||||
<div class="active">1</div>
|
||||
<div>10</div>
|
||||
<div>100</div>
|
||||
</div>
|
||||
<ul>
|
||||
|
||||
@@ -43,20 +42,20 @@
|
||||
</div>
|
||||
<!-- 等待结果 -->
|
||||
<div class="wait-time">
|
||||
<div class="count-down">開獎中：<span class="count-down-num"></span><span>S</span></div>
|
||||
<!-- <div class="current-tip">等待結果</div> -->
|
||||
<div class="count-down">开奖中：<span class="count-down-num"></span>秒</div>
|
||||
<div class="current-tip">等待结果</div>
|
||||
</div>
|
||||
<!-- 开奖展示动画时间 -->
|
||||
<div class="draw-time">
|
||||
<div class="count-down">下一輪：<span class="count-down-num"></span><span>S</span></div>
|
||||
<div class="current-tip">本輪結果：<span class="current-result"></span></div>
|
||||
<div class="count-down">下一轮：<span class="count-down-num"></span>秒</div>
|
||||
<div class="current-tip">本轮结果：<span class="current-result"></span></div>
|
||||
<!-- 中奖物品展示 -->
|
||||
<div class="draw-pic">
|
||||
<img src="" alt="">
|
||||
</div>
|
||||
<!-- 用户本轮中奖情况 -->
|
||||
<div class="award-info">
|
||||
<!-- <div class="desc"></div> -->
|
||||
<div class="desc"></div>
|
||||
<div class="award-wrap"></div>
|
||||
</div>
|
||||
<!-- 本轮前3名 -->
|
||||
@@ -71,20 +70,13 @@
|
||||
<p><img src="" alt=""></p>
|
||||
<p><img src="" alt=""></p>
|
||||
</div>
|
||||
<div class="top_three">
|
||||
<span class="text">本輪前三名</span>
|
||||
<!-- <img src="./images/close.png" alt=""> -->
|
||||
<span class="img img1">虛位以待</span>
|
||||
<span class="img img2">虛位以待</span>
|
||||
<span class="img img3">虛位以待</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 往轮结果 -->
|
||||
<div class="previous-result">
|
||||
<span>往輪結果</span>
|
||||
<span>往轮结果</span>
|
||||
<div class="result-list">
|
||||
<p><img src="" alt=""></p>
|
||||
<p><img src="" alt=""></p>
|
||||
@@ -102,29 +94,38 @@
|
||||
|
||||
<!-- 个人信息 -->
|
||||
<div class="info-bottom">
|
||||
<div class="avatar"><img src="" alt=""></div>
|
||||
<div class="avatar"><img src="./images/logo.png" alt=""></div>
|
||||
<div class="f-wrap">
|
||||
<div class="fragment">用户昵称</div>
|
||||
<div class="award">今日獎勵：<span>0</span></div>
|
||||
<div class="fragment">我的碎片：<span>0</span></div>
|
||||
<div class="award">今日奖励：<span>0</span></div>
|
||||
</div>
|
||||
<div class="activeBalance">余額：<span></span>钻石 <b>儲值></b></div>
|
||||
<!-- <div class="add"><img src="./images/add.png" alt=""></div> -->
|
||||
|
||||
</div>
|
||||
<!-- 今日排名 -->
|
||||
<div class="add"><img src="./images/add.png" alt=""></div>
|
||||
<div class="rank"><img src="./images/rank.png" alt=""></div>
|
||||
</div>
|
||||
|
||||
<!-- 规则弹窗 -->
|
||||
<div class="shade-mask">
|
||||
<div class="shade-content">
|
||||
<main>
|
||||
<h3>遊戲規則</h3>
|
||||
<div>
|
||||
<p>1.每次至少選擇1種森林動物，可多次疊加選擇，中獎後可以獲得對應钻石獎勵（中獎森林動物選中數*中獎森林動物對應倍數）</p>
|
||||
<p>2.活動結束將關閉頁面，請留意活動關閉時間。</p>
|
||||
<p>3.本活動與Apple Inc.無關，最終解釋權歸平臺所有。</p>
|
||||
<div class="cyfs">
|
||||
<p class="title">参与方式</p>
|
||||
用戶可通過花費「碎片」參與《星級廚房》遊戲，「碎片」為購買商店內頭飾的贈品，每次最少消耗1個碎片，每回合時間30秒
|
||||
<p class="jietu"><img src="./images/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的鉆石
|
||||
</div>
|
||||
<div class="qtsm">
|
||||
<p class="title">其他說明</p>
|
||||
如果以上說明未能解答您的疑問，請聯系客服，會有專人解答疑難
|
||||
<p>本活动与苹果公司无关</p>
|
||||
</div>
|
||||
</main>
|
||||
<img class="shade-content-close" src="./images/close.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -134,8 +135,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">
|
||||
@@ -150,7 +151,7 @@
|
||||
<div class="mine">
|
||||
<span class="mine-rank"></span>
|
||||
<div class="mine-info">
|
||||
<img src="" alt="">
|
||||
<img src="./images/logo.png" alt="">
|
||||
<span class="mine-nick"></span>
|
||||
</div>
|
||||
<span class="mine-diamond-num"></span>
|
||||
@@ -161,12 +162,12 @@
|
||||
<!-- 碎片不足提示弹窗 -->
|
||||
<div class="shade-mask-fragmentNum">
|
||||
<div class="shade-content-fragmentNum">
|
||||
<div class="fragmentNum-title">钻石不足</div>
|
||||
<div class="fragmentNum-title">碎片不足</div>
|
||||
<img src="./images/mall/no-money.png" alt="">
|
||||
<p>當前钻石不足</p>
|
||||
<p>当前碎片不足，购买头像框获取碎片</p>
|
||||
<div class="fragmentNum-btn-wrap">
|
||||
<div class="cancel-btn">取消</div>
|
||||
<div class="confirm-btn">獲取钻石</div>
|
||||
<div class="confirm-btn">获取碎片</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -178,7 +179,7 @@
|
||||
<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.111"></script>
|
||||
<script src="./js/index.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -5,14 +5,14 @@ if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
|
||||
// 封装layer消息提醒框
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
const showLoading = () => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content: '加载中...',
|
||||
success(e) {
|
||||
content: '加載中...',
|
||||
success (e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
@@ -27,51 +27,51 @@ const toastMsg = (content = '操作完成', time = 2) => {
|
||||
skin: 'msg'
|
||||
})
|
||||
}
|
||||
// 获取用户相关信息
|
||||
// 獲取用戶相關信息
|
||||
const getUserInfo = (param) => {
|
||||
networkRequest({
|
||||
type: 'GET',
|
||||
url: urlPrefix + '/act/luckySea/getUserActInfo',
|
||||
success(res){
|
||||
if(res.code === 200){
|
||||
success (res) {
|
||||
if (res.code === 200) {
|
||||
// console.log(res.data);
|
||||
$('.bottom').find('.avatar img').attr('src', res.data.avatar)
|
||||
if(res.data.nick.length > 10){
|
||||
res.data.nick = res.data.nick.slice(0,10) + '...'
|
||||
if (res.data.nick.length > 10) {
|
||||
res.data.nick = res.data.nick.slice(0, 10) + '...'
|
||||
}
|
||||
$('.bottom').find('.nick').html(res.data.nick)
|
||||
$('.bottom').find('.diamond-num span').html(res.data.diamonds)
|
||||
if(param){
|
||||
if (param) {
|
||||
$('.bottom').find('.fragment-num span')[0].innerHTML = parseInt($('.bottom').find('.fragment-num span')[0].innerHTML) + param
|
||||
} else{
|
||||
} else {
|
||||
$('.bottom').find('.fragment-num span').html(res.data.pieceNum)
|
||||
}
|
||||
}
|
||||
},
|
||||
error(err){
|
||||
toastMsg('网络错误')
|
||||
error (err) {
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 获取头饰礼包信息
|
||||
// 獲取頭飾禮包信息
|
||||
let listPack = []
|
||||
const getListPack = () => {
|
||||
networkRequest({
|
||||
type: 'GET',
|
||||
url: urlPrefix + '/act/luckySea/listPack',
|
||||
success(res){
|
||||
if(res.code === 200){
|
||||
success (res) {
|
||||
if (res.code === 200) {
|
||||
// console.log(res.data);
|
||||
listPack = res.data
|
||||
renderList()
|
||||
}
|
||||
},
|
||||
error(err){
|
||||
toastMsg('网络错误')
|
||||
error (err) {
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 渲染礼包
|
||||
// 渲染禮包
|
||||
const renderList = () => {
|
||||
listPack.map((item, index) => {
|
||||
let $li = $('ul.buy-area li').eq(index)
|
||||
@@ -89,19 +89,19 @@ const renderList = () => {
|
||||
})
|
||||
}
|
||||
|
||||
$(function(){
|
||||
$(function () {
|
||||
|
||||
getInfoFromClient()
|
||||
setTimeout(function(){
|
||||
setTimeout(function () {
|
||||
getUserInfo()
|
||||
getListPack()
|
||||
}, 50)
|
||||
|
||||
// 监听购买按钮点击事件
|
||||
$('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('礼包信息不完整')
|
||||
toastMsg('禮包信息不完整')
|
||||
return
|
||||
}
|
||||
|
||||
@@ -120,60 +120,60 @@ $(function(){
|
||||
$('.shade-mask-buy').find('.inputNum').val(giftObj['num'])
|
||||
$('.shade-mask-buy').fadeIn(50)
|
||||
})
|
||||
// 关闭购买弹窗
|
||||
$('.cancel').on('click', function(){
|
||||
// 關閉購買彈窗
|
||||
$('.cancel').on('click', function () {
|
||||
$('.shade-mask-buy').fadeOut(50)
|
||||
})
|
||||
$('.shade-mask-buy').on('click', function(){
|
||||
$('.shade-mask-buy').on('click', function () {
|
||||
$('.shade-mask-buy').fadeOut(50)
|
||||
})
|
||||
$('.shade-content-buy').on('click', function(e){
|
||||
$('.shade-content-buy').on('click', function (e) {
|
||||
e.stopPropagation()
|
||||
})
|
||||
// 关闭余额不足弹窗
|
||||
$('.shade-mask-no-money').on('click', function(){
|
||||
// 關閉余額不足彈窗
|
||||
$('.shade-mask-no-money').on('click', function () {
|
||||
$('.shade-mask-no-money').fadeOut(50)
|
||||
})
|
||||
$('.shade-content-no-money').on('click', function(e){
|
||||
$('.shade-content-no-money').on('click', function (e) {
|
||||
e.stopPropagation()
|
||||
})
|
||||
// 增加购买数量
|
||||
$('.increase').on('click', function(){
|
||||
if(giftObj['num']<9999){
|
||||
// 增加購買數量
|
||||
$('.increase').on('click', function () {
|
||||
if (giftObj['num'] < 9999) {
|
||||
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{
|
||||
toastMsg('单次购买数量最多为9999')
|
||||
} else {
|
||||
toastMsg('單次購買數量最多為9999')
|
||||
}
|
||||
})
|
||||
// 减少购买数量
|
||||
$('.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{
|
||||
toastMsg('最少购买数量为1')
|
||||
} else {
|
||||
toastMsg('最少購買數量為1')
|
||||
}
|
||||
})
|
||||
// 手动输入购买数量
|
||||
$('.inputNum').on('input', function(){
|
||||
// 手動輸入購買數量
|
||||
$('.inputNum').on('input', function () {
|
||||
let exp = /^[0-9]+$/
|
||||
if (!exp.test($(this).val())) {
|
||||
toastMsg('请输入数字')
|
||||
toastMsg('請輸入數字')
|
||||
// $(this).val(1)
|
||||
return
|
||||
}
|
||||
if($(this).val() > 9999){
|
||||
if ($(this).val() > 9999) {
|
||||
giftObj['num'] = 9999
|
||||
}else{
|
||||
} else {
|
||||
giftObj['num'] = $(this).val()
|
||||
}
|
||||
giftObj['day'] = giftObj['num'];
|
||||
@@ -182,19 +182,19 @@ $(function(){
|
||||
$('.buy-day span').html(giftObj['day'])
|
||||
$('.buy-price span').html(allPrice)
|
||||
})
|
||||
// 确认购买
|
||||
// 確認購買
|
||||
let lock = false
|
||||
$('.confirm').on('click', function(){
|
||||
$('.confirm').on('click', function () {
|
||||
let exp = /^[0-9]+$/
|
||||
if(!exp.test($('.inputNum').val())){
|
||||
toastMsg('请输入数字')
|
||||
if (!exp.test($('.inputNum').val())) {
|
||||
toastMsg('請輸入數字')
|
||||
$('.inputNum').val(1)
|
||||
return
|
||||
}
|
||||
if($('.inputNum').val() == 0){
|
||||
return toastMsg('最少购买数量为1')
|
||||
if ($('.inputNum').val() == 0) {
|
||||
return toastMsg('最少購買數量為1')
|
||||
}
|
||||
if(!lock){
|
||||
if (!lock) {
|
||||
lock = true
|
||||
networkRequest({
|
||||
type: 'POST',
|
||||
@@ -205,48 +205,48 @@ $(function(){
|
||||
packNum: giftObj.num,
|
||||
ticket: pubInfo.ticket
|
||||
},
|
||||
success(res){
|
||||
if(res.code === 200){
|
||||
success (res) {
|
||||
if (res.code === 200) {
|
||||
$('.shade-mask-buy').hide()
|
||||
toastMsg('购买成功！')
|
||||
toastMsg('購買成功！')
|
||||
getUserInfo(res.data)
|
||||
}else if(res.code === 2103){
|
||||
} else if (res.code === 2103) {
|
||||
$('.shade-mask-buy').hide()
|
||||
$('.shade-mask-no-money').show()
|
||||
}else{
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
lock = false
|
||||
},
|
||||
error(err){
|
||||
toastMsg('网络错误')
|
||||
error (err) {
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
// 跳转充值
|
||||
// 跳轉充值
|
||||
$('.recharge, .no-money-recharge').on('click', function () {
|
||||
if(browser.app){
|
||||
if(browser.android){
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
// window.androidJsObj.openChargePage()
|
||||
tools.nativeUtils.jumpAppointPage('RECHARGE_PAGE')
|
||||
}else if(browser.ios){
|
||||
} else if (browser.ios) {
|
||||
window.webkit.messageHandlers.openChargePage.postMessage(null)
|
||||
}
|
||||
}else{
|
||||
toastMsg('请在app内打开')
|
||||
} 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]){
|
||||
if (!document[hiddenProperty]) {
|
||||
$('.shade-mask-no-money').hide()
|
||||
getUserInfo()
|
||||
}
|
||||
|
||||
@@ -1,369 +0,0 @@
|
||||
let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
let env = EnvCheck();
|
||||
if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
|
||||
// 封装layer消息提醒框
|
||||
let layerIndex
|
||||
const showLoading = () => {
|
||||
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'
|
||||
})
|
||||
}
|
||||
|
||||
if(!browser.app){
|
||||
toastMsg('请在app内打开！');
|
||||
}else{
|
||||
$('body').removeClass('no-in-app')
|
||||
}
|
||||
|
||||
// 榜单类型，1是钻石榜，2是欧皇榜
|
||||
let type = 1
|
||||
|
||||
let pageSize = 20
|
||||
|
||||
// 钻石榜单
|
||||
let pageD = 1
|
||||
let myInfoD = []
|
||||
let rankListD = []
|
||||
// 欧皇榜单
|
||||
let pageN = 1
|
||||
let myInfoN = []
|
||||
let rankListN = []
|
||||
let clickTabCanNetworkN = true
|
||||
|
||||
let isLockD = true
|
||||
let isLockN = true
|
||||
let isLock = true
|
||||
|
||||
let canRequsetNextPageD = true
|
||||
let canRequsetNextPageN = true
|
||||
|
||||
const getListRank = (type, page) => {
|
||||
networkRequest({
|
||||
type: 'GET',
|
||||
url: urlPrefix + '/act/luckySea/listRank',
|
||||
data:{
|
||||
type,
|
||||
page,
|
||||
pageSize
|
||||
},
|
||||
success(res){
|
||||
if(res.code === 200){
|
||||
if(type === 1){
|
||||
// 钻石榜单
|
||||
if(res.data.rankList.length === pageSize){
|
||||
// 可以请求下一页
|
||||
canRequsetNextPageD = true
|
||||
}else{
|
||||
// 不再请求下一页
|
||||
canRequsetNextPageD = false
|
||||
}
|
||||
rankListD.push(...res.data.rankList)
|
||||
// 底部个人信息只渲染一次 x
|
||||
// if(pageD === 1){
|
||||
// }
|
||||
myInfoD = res.data.myRankInfo
|
||||
renderMyInfo()
|
||||
renderRankList()
|
||||
isLockD = true
|
||||
}else{
|
||||
if(res.data.rankList.length === pageSize){
|
||||
// 可以请求下一页
|
||||
console.log('gekk');
|
||||
canRequsetNextPageN = true
|
||||
}else{
|
||||
// 不再请求下一页
|
||||
canRequsetNextPageN = false
|
||||
}
|
||||
rankListN.push(...res.data.rankList)
|
||||
// 底部个人信息只渲染一次 x
|
||||
// if(pageN === 1){
|
||||
// }
|
||||
myInfoN = res.data.myRankInfo
|
||||
renderMyInfo()
|
||||
// renderMyInfo()
|
||||
renderRankList()
|
||||
isLockN = true
|
||||
}
|
||||
// isLock = true
|
||||
}else{
|
||||
toastMsg(res.message)
|
||||
}
|
||||
},
|
||||
error(err){
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 渲染底部个人信息
|
||||
const renderMyInfo = () => {
|
||||
if(type === 1){
|
||||
// 钻石榜单
|
||||
let erbanNo = myInfoD.erbanNo
|
||||
let myIndex = rankListD.findIndex((item, index) => {
|
||||
return item.erbanNo === erbanNo
|
||||
})
|
||||
if(myIndex === -1){
|
||||
$('.mine-rank').html('未上榜')
|
||||
}else{
|
||||
$('.mine-rank').html(myIndex + 1)
|
||||
}
|
||||
$('.mine-info').find('img').attr('src', myInfoD.avatar)
|
||||
$('.mine-info').find('.mine-nick').html(myInfoD.nick)
|
||||
// if(myInfoD.num.toString().length >= 5) {
|
||||
// myInfoD.num = (myInfoD.num/10000).toFixed(2) + 'w'
|
||||
// }
|
||||
let tostr = myInfoD.num.toString()
|
||||
let num
|
||||
if(tostr.length >= 5) {
|
||||
num = (myInfoD.num/10000).toFixed(2) + 'w'
|
||||
}else{
|
||||
num = myInfoD.num
|
||||
}
|
||||
$('.mine-diamond-num').html(num)
|
||||
}else{
|
||||
let erbanNo = myInfoN.erbanNo
|
||||
let myIndex = rankListN.findIndex((item, index) => {
|
||||
return item.erbanNo === erbanNo
|
||||
})
|
||||
if(myIndex === -1){
|
||||
$('.mine-rank').html('未上榜')
|
||||
}else{
|
||||
$('.mine-rank').html(myIndex + 1)
|
||||
}
|
||||
$('.mine-info').find('img').attr('src', myInfoN.avatar)
|
||||
$('.mine-info').find('.mine-nick').html(myInfoN.nick)
|
||||
$('.mine-diamond-num').html('猜對' + myInfoN.num + '次')
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染榜单信息
|
||||
const renderRankList = () => {
|
||||
if(type === 1){
|
||||
// 钻石榜单
|
||||
// 渲染前3
|
||||
let topThreeArr = rankListD.slice(0, 3)
|
||||
console.log(topThreeArr);
|
||||
if(rankListD.length < 3){
|
||||
let len = 3 - rankListD.length
|
||||
let arr = new Array(len).fill({
|
||||
nick: '虛位以待',
|
||||
avatar: './images/default.png',
|
||||
num: ''
|
||||
})
|
||||
topThreeArr.push(...arr)
|
||||
}
|
||||
let topThreeStr = ''
|
||||
topThreeArr.map((item) => {
|
||||
let tostr = item.num.toString()
|
||||
let num
|
||||
if(tostr.length >= 5) {
|
||||
num = (item.num/10000).toFixed(2) + 'w'
|
||||
}else{
|
||||
num = item.num
|
||||
}
|
||||
|
||||
topThreeStr += `
|
||||
<div class="info-wrap">
|
||||
<div class="avatar">
|
||||
<p></p>
|
||||
<img src="${item.avatar}" alt="">
|
||||
</div>
|
||||
<p class="nick">${item.nick.length > 5 ? item.nick.slice(0,5) + '...' : item.nick}</p>
|
||||
<p class="diamond-num">${num}</p>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
$('.topthree-wrap').html(topThreeStr)
|
||||
|
||||
|
||||
// 渲染非前3
|
||||
let othersArr = rankListD.slice(3)
|
||||
console.log(othersArr);
|
||||
let others = ''
|
||||
othersArr.map((item, index) => {
|
||||
let tostr = item.num.toString()
|
||||
let num
|
||||
if(tostr.length >= 5) {
|
||||
num = (item.num/10000).toFixed(2) + 'w'
|
||||
}else{
|
||||
num = item.num
|
||||
}
|
||||
others += `
|
||||
<li>
|
||||
<span class="index">${index+4}</span>
|
||||
<div class="others-info">
|
||||
<img src="${item.avatar}" alt="">
|
||||
<span class="others-nick">${item.nick}</span>
|
||||
</div>
|
||||
<span class="others-diamond-num">${num}</span>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.other-rank').html(others)
|
||||
}else{
|
||||
// 欧皇榜单
|
||||
// 渲染前3
|
||||
let topThreeArr = rankListN.slice(0, 3)
|
||||
console.log(topThreeArr);
|
||||
if(rankListN.length < 3){
|
||||
let len = 3 - rankListN.length
|
||||
let arr = new Array(len).fill({
|
||||
nick: '虛位以待',
|
||||
avatar: './images/default.png'
|
||||
})
|
||||
topThreeArr.push(...arr)
|
||||
}
|
||||
let topThreeStr = ''
|
||||
topThreeArr.map((item) => {
|
||||
let num = ''
|
||||
if(item.erbanNo){
|
||||
num = '猜對'+item.num + '次'
|
||||
}
|
||||
topThreeStr += `
|
||||
<div class="info-wrap">
|
||||
<div class="avatar">
|
||||
<p></p>
|
||||
<img src="${item.avatar}" alt="">
|
||||
</div>
|
||||
<p class="nick">${item.nick.length > 5 ? item.nick.slice(0,5) + '...' : item.nick}</p>
|
||||
<p class="diamond-num">${num}</p>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
$('.topthree-wrap').html(topThreeStr)
|
||||
|
||||
// 渲染非前3
|
||||
let othersArr = rankListN.slice(3)
|
||||
console.log(othersArr);
|
||||
let others = ''
|
||||
othersArr.map((item, index) => {
|
||||
let num
|
||||
if(item.erbanNo){
|
||||
num = '猜對'+item.num + '次'
|
||||
}
|
||||
others += `
|
||||
<li>
|
||||
<span class="index">${index+4}</span>
|
||||
<div class="others-info">
|
||||
<img src="${item.avatar}" alt="">
|
||||
<span class="others-nick">${item.nick}</span>
|
||||
</div>
|
||||
<span class="others-diamond-num">${num}</span>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
$('.other-rank').html(others)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$(function(){
|
||||
getInfoFromClient()
|
||||
setTimeout(function(){
|
||||
getListRank(type, pageD)
|
||||
}, 50)
|
||||
|
||||
$('.other-rank').height($(window).innerHeight() - $('.rank-top').height());
|
||||
|
||||
$('.tab-wrap').on('click', 'span', function(){
|
||||
$(this).addClass('active').siblings().removeClass('active')
|
||||
if(type === $(this).index() + 1) return
|
||||
type = $(this).index() + 1
|
||||
|
||||
|
||||
$('.other-rank').scrollTop(0)
|
||||
if(type === 1){
|
||||
renderRankList()
|
||||
renderMyInfo()
|
||||
// getListRank(type, pageD)
|
||||
}else{
|
||||
if(clickTabCanNetworkN){
|
||||
getListRank(type, pageN)
|
||||
}else{
|
||||
renderRankList()
|
||||
renderMyInfo()
|
||||
}
|
||||
clickTabCanNetworkN = false
|
||||
}
|
||||
})
|
||||
|
||||
// 监听滚动
|
||||
$('.other-rank').scroll(function(){
|
||||
|
||||
let scrollTop = $(this).scrollTop();//这是已经卷进去滚动条的的高度
|
||||
let scrollHeight = $('.other-rank')[0].scrollHeight;//这个是other-rank包含滚动条的总高度
|
||||
let ulHeight = $(this).innerHeight();//这个是other-rank的高度
|
||||
console.log(ulHeight,scrollTop, scrollHeight);
|
||||
|
||||
// 安卓可以只触发一次(安卓机型太多，不确定是否所有安卓都能触发一次)，ios会触发多次，ios要加锁, pc端触发不了
|
||||
|
||||
|
||||
//这样距离到底还有一段距离就请求，但是会导致重复请求，所以要加锁限制
|
||||
if(scrollTop + ulHeight + 100 >= scrollHeight){
|
||||
console.log('到底了');
|
||||
if(type === 1){
|
||||
if(isLockD){
|
||||
isLockD = false
|
||||
pageD++
|
||||
if(pageSize * pageD > 100){
|
||||
toastMsg('沒有更多數據啦~')
|
||||
}else{
|
||||
if(canRequsetNextPageD){
|
||||
getListRank(type,pageD);
|
||||
}else{
|
||||
toastMsg('沒有更多數據啦~')
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(scrollTop + ulHeight >= scrollHeight){
|
||||
if(pageSize * pageD > 100){
|
||||
toastMsg('沒有更多數據啦~')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}else{
|
||||
// getListRank(type,++pageN);
|
||||
if(isLockN){
|
||||
isLockN = false
|
||||
pageN++
|
||||
if(pageSize * pageN > 100){
|
||||
toastMsg('沒有更多數據啦~')
|
||||
}else{
|
||||
if(canRequsetNextPageN){
|
||||
getListRank(type,pageN);
|
||||
}else{
|
||||
toastMsg('没有更多数据啦')
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(scrollTop + ulHeight >= scrollHeight){
|
||||
if(pageSize * pageN > 100){
|
||||
toastMsg('沒有更多數據啦~')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
@@ -2,13 +2,13 @@ let urlPrefix = getUrlPrefix()
|
||||
let browser = checkVersion()
|
||||
if (EnvCheck() === 'test') new VConsole
|
||||
|
||||
// 封装layer消息提醒框
|
||||
// 封裝layer消息提醒框
|
||||
let layerIndex
|
||||
const showLoading = () => {
|
||||
layer.open({
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content: '加载中...',
|
||||
content: '加載中...',
|
||||
success (e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
@@ -26,7 +26,7 @@ const toastMsg = (content = '操作完成', time = 2) => {
|
||||
}
|
||||
|
||||
|
||||
// 获取用户的游戏记录
|
||||
// 獲取用戶的遊戲記錄
|
||||
let recordList = []
|
||||
let page = 1
|
||||
let pageSize = 10
|
||||
@@ -43,58 +43,107 @@ const getUserRecord = () => {
|
||||
success (res) {
|
||||
if (res.code === 200) {
|
||||
if (res.data.length === pageSize) {
|
||||
// 能够继续请求下一页
|
||||
// 能夠繼續請求下一頁
|
||||
canNext = true
|
||||
} else {
|
||||
canNext = false
|
||||
}
|
||||
recordList.push(...res.data)
|
||||
renderRecord(res)
|
||||
renderRecord()
|
||||
isLock = true
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
},
|
||||
error (err) {
|
||||
toastMsg('网络错误')
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
}
|
||||
// 渲染游戏记录
|
||||
const renderRecord = (res) => {
|
||||
// 渲染遊戲記錄
|
||||
const renderRecord = () => {
|
||||
if (recordList.length === 0) {
|
||||
$('.record-list').hide();
|
||||
$('.img').show();
|
||||
$('.record-list').html('<li class="no-record">暫無遊戲記錄</li>')
|
||||
} else {
|
||||
$('.record-list').show();
|
||||
$('.img').hide();
|
||||
var str = '';
|
||||
let str2 = '';
|
||||
let drawId = [];;
|
||||
var results = [];
|
||||
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>
|
||||
let str = ''
|
||||
recordList.map((item, index) => {
|
||||
let drawId = item.drawId
|
||||
let itemType = item.itemType
|
||||
// 渲染li裏面的ul
|
||||
let str1 = ''
|
||||
let userCostPiece = '' //用戶投註情況
|
||||
let userReward = '' //用戶獎勵情況
|
||||
item.results.map((item1, index) => {
|
||||
if (itemType === 1) {
|
||||
userCostPiece = '+' + item1.costPiece
|
||||
} else {
|
||||
userCostPiece = item1.multiple * 10 + '*' + item1.costPiece
|
||||
}
|
||||
|
||||
str1 += `
|
||||
<li class="animal-item">
|
||||
<div><img src="${item1.itemUrl}" alt=""></div>
|
||||
<span>${userCostPiece}</span>
|
||||
</li>
|
||||
`
|
||||
results.push(res.results);
|
||||
});
|
||||
$('.record-list').append(str)
|
||||
results.forEach((res, index) => {
|
||||
res.forEach(val => {
|
||||
$('.record-list li').eq(index).children('.marine_organism').append(`<span class='${drawId[index] == val.itemId ? 'active' : ''}'><img src="${val.itemUrl}" alt=""><b>+${val.costPiece}</b></span>`)
|
||||
|
||||
if (item1.itemId === drawId) {
|
||||
$('.none').html(str1)
|
||||
$('.none').find('li').eq(index).addClass('active')
|
||||
str1 = $('.none').html()
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
if (itemType === 1) {
|
||||
if (item.reward) {
|
||||
userReward = `
|
||||
<span class="diamond-num">${item.reward}</span>
|
||||
<img src="./images/record/diamond.png" alt="" class="diamond-pic"></img>
|
||||
`
|
||||
} else {
|
||||
userReward = `
|
||||
<span class="diamond-num">未猜中</span>
|
||||
`
|
||||
}
|
||||
} else {
|
||||
if (item.reward) {
|
||||
userReward = `
|
||||
<span class="diamond-num">
|
||||
${item.itemName} (${item.price}<img src="./images/record/diamond.png" alt="" class="diamond-pic1">) *${item.reward / item.price}個 (共計${item.reward}<img src="./images/record/diamond.png" alt="" class="diamond-pic1"></img>)
|
||||
</span>
|
||||
`
|
||||
|
||||
} else {
|
||||
userReward = `
|
||||
<span class="diamond-num">未猜中</span>
|
||||
`
|
||||
}
|
||||
}
|
||||
|
||||
// 渲染li
|
||||
let text = ''
|
||||
if (item.drawStatus === 1) {
|
||||
text = '厲害~猜對了(*^▽^*)'
|
||||
} else {
|
||||
text = '哎呀~猜錯了o(╥﹏╥)o'
|
||||
}
|
||||
str += `
|
||||
<li class="record-item">
|
||||
<div class="time">${dateFormat(item.drawTime, "yyyy-MM-dd hh:mm:ss")}</div>
|
||||
<div class="award">
|
||||
<span class="text">遊戲獎勵：</span>
|
||||
<p>
|
||||
${userReward}
|
||||
</p>
|
||||
</div>
|
||||
<ul class="award-animal clearfix">
|
||||
${str1}
|
||||
</ul>
|
||||
<div class="tip">${text}</div>
|
||||
<li>
|
||||
`
|
||||
})
|
||||
$('.record-list').html(str)
|
||||
}
|
||||
|
||||
}
|
||||
@@ -103,14 +152,14 @@ $(function () {
|
||||
setTimeout(function () {
|
||||
getUserRecord()
|
||||
}, 50)
|
||||
// 监听滚动
|
||||
// 監聽滾動
|
||||
$('ul').scroll(function () {
|
||||
let scrollTop = $(this).scrollTop()
|
||||
let scrollHeight = $('ul')[0].scrollHeight
|
||||
let ulHeight = $(this).innerHeight()
|
||||
if (scrollTop + ulHeight + 100 >= scrollHeight) {
|
||||
if (isLock) {
|
||||
// 请求下一页
|
||||
// 請求下一頁
|
||||
if (canNext) {
|
||||
getUserRecord(page++)
|
||||
isLock = false
|
||||
|
||||
@@ -1,47 +0,0 @@
|
||||
<!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/rank.css">
|
||||
</head>
|
||||
|
||||
<body class="no-in-app">
|
||||
<div class="rank-top">
|
||||
|
||||
<div class="tab-wrap">
|
||||
<span class="diamond-rank active">钻石榜</span>
|
||||
<span class="num-rank">欧皇榜</span>
|
||||
</div>
|
||||
|
||||
<div class="topthree-wrap">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="other-rank">
|
||||
|
||||
</ul>
|
||||
|
||||
<div class="mine">
|
||||
<span class="mine-rank"></span>
|
||||
<div class="mine-info">
|
||||
<img src="" alt="">
|
||||
<span class="mine-nick"></span>
|
||||
</div>
|
||||
<span class="mine-diamond-num">0</span>
|
||||
</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/rank.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,44 +1,26 @@
|
||||
<!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>
|
||||
<title>游戏记录</title>
|
||||
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/record.css?v=1.0">
|
||||
<link rel="stylesheet" href="./css/record.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<ul class="record-list">
|
||||
<!-- <li>
|
||||
<h3>2020-12-21 12:22</h3>
|
||||
<div class="goldBox">
|
||||
<span>游戏奖励：</span>
|
||||
<span class="gold">0金币</span>
|
||||
</div>
|
||||
<div class="marine_organism">
|
||||
<span>
|
||||
<img src="./images/add.png" alt="">
|
||||
<b>+10</b>
|
||||
</span>
|
||||
</div>
|
||||
<p class="fasle">哎呀~猜錯了o(╥﹏╥)o</p>
|
||||
<p class="true">厲害~猜對了୧(๑•̀◡•́๑)૭</p>
|
||||
</li> -->
|
||||
|
||||
</ul>
|
||||
<div class="img">
|
||||
<p>暫無遊戲記錄</p>
|
||||
</div>
|
||||
<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>
|
||||
<script src="../../common/js/layer.js"></script>
|
||||
<script src="../../common/js/vconsole.min.js"></script>
|
||||
<script src="./js/record.js?v=1.2"></script>
|
||||
<script src="./js/record.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -1,34 +1,30 @@
|
||||
@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");
|
||||
}
|
||||
|
||||
@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-regular';
|
||||
font-family: "pingfang-regular";
|
||||
src: url("../../../common/fonts/PingFang-Regular.ttf");
|
||||
src: url("../../../common/fonts/PingFang-Regular.ttf") format("woff"), url("../../../common/fonts/PingFang-Regular.ttf") format("truetype"), url("../../../common/fonts/PingFang-Regular.ttf") format("svg");
|
||||
}
|
||||
|
||||
body {
|
||||
display: none;
|
||||
background-color: #11111D;
|
||||
background-color: #DFF7F3;
|
||||
position: relative;
|
||||
font-family: 'pingfang-medium';
|
||||
font-family: "pingfang-medium";
|
||||
}
|
||||
|
||||
.banner {
|
||||
width: 10rem;
|
||||
height: 11.46667rem;
|
||||
height: 5.7733333333rem;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.banner img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@@ -36,75 +32,68 @@ body {
|
||||
|
||||
.personal-info-wrap {
|
||||
position: absolute;
|
||||
top: 8.32rem;
|
||||
top: 4.0933333333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 10rem;
|
||||
height: 3.02667rem;
|
||||
width: 9.0666666667rem;
|
||||
height: 2.4rem;
|
||||
background: url("../images/info-bg.png") no-repeat 0 0/100% 100%;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content {
|
||||
width: 100%;
|
||||
height: 2.4rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .avatar {
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
margin-left: 0.86667rem;
|
||||
margin-right: 0.26667rem;
|
||||
width: 1.3333333333rem;
|
||||
height: 1.3333333333rem;
|
||||
margin-left: 0.8666666667rem;
|
||||
margin-right: 0.2666666667rem;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .avatar img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .personal-info {
|
||||
flex: 1;
|
||||
font-size: 0.26667rem;
|
||||
color: white;
|
||||
font-size: 0.2666666667rem;
|
||||
color: #141949;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .personal-info .nickname {
|
||||
font-size: 0.4rem;
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.24rem;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .personal-info .platform-code, .personal-info-wrap .personal-info-content .personal-info .invite-code {
|
||||
font-family: 'pingfang-regular';
|
||||
margin-bottom: 0.10667rem;
|
||||
.personal-info-wrap .personal-info-content .personal-info .platform-code,
|
||||
.personal-info-wrap .personal-info-content .personal-info .invite-code {
|
||||
font-family: "pingfang-regular";
|
||||
margin-bottom: 0.1066666667rem;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .qr {
|
||||
width: 1.42667rem;
|
||||
height: 1.42667rem;
|
||||
margin-right: 0.93333rem;
|
||||
width: 1.4266666667rem;
|
||||
height: 1.4266666667rem;
|
||||
margin-right: 0.9333333333rem;
|
||||
}
|
||||
|
||||
.personal-info-wrap .personal-info-content .qr .active {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
border-radius: 0.16rem;
|
||||
border: 0.13333rem solid white;
|
||||
border: 0.1333333333rem solid white;
|
||||
}
|
||||
|
||||
.share-btn {
|
||||
position: absolute;
|
||||
top: 10.44rem;
|
||||
top: 6.2rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 4.52rem;
|
||||
height: 0.92rem;
|
||||
line-height: 0.92rem;
|
||||
height: 0.9466666667rem;
|
||||
line-height: 0.9466666667rem;
|
||||
background: url("../images/share-btn.png") no-repeat 0 0/100% 100%;
|
||||
font-family: 'pingfang-bold';
|
||||
font-family: "pingfang-bold";
|
||||
font-size: 0.4rem;
|
||||
font-weight: bold;
|
||||
color: #DB98FF;
|
||||
@@ -112,86 +101,96 @@ body {
|
||||
}
|
||||
|
||||
.rule-wrap {
|
||||
width: 9.13333rem;
|
||||
width: 9.1333333333rem;
|
||||
height: 2.8rem;
|
||||
background: url("../images/rule-bg.png") no-repeat 0 0/100% 100%;
|
||||
margin: 0.56rem auto 0.66667rem;
|
||||
padding: 0.96rem 0.4rem 0 0.4rem;
|
||||
background: url("../images/ruleBg.png") no-repeat 0 0/100% 100%;
|
||||
margin: 2.2rem auto 0.6666666667rem;
|
||||
padding: 0.96rem 0.3333333333rem 0 0.4rem;
|
||||
box-sizing: border-box;
|
||||
font-size: 0.34667rem;
|
||||
color: white;
|
||||
line-height: 1.5;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.rule-wrap.rule-wrap-big {
|
||||
height: 3.89333rem;
|
||||
background: url("../images/rule-bg-big.png") no-repeat 0 0/100% 100%;
|
||||
.rule-wrap P {
|
||||
color: #141949;
|
||||
font-size: 0.3466666667rem;
|
||||
margin-bottom: 0.2rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
.rule-wrap div {
|
||||
position: absolute;
|
||||
top: 0.2133333333rem;
|
||||
left: 0.24rem;
|
||||
color: #141949;
|
||||
font-size: 0.32rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.invite-record-wrap {
|
||||
width: 9.13333rem;
|
||||
height: 4.25333rem;
|
||||
width: 9.1333333333rem;
|
||||
height: 4.7066666667rem;
|
||||
background: url("../images/record-bg.png") no-repeat 0 0/100% 100%;
|
||||
margin: auto;
|
||||
padding-top: 1.05333rem;
|
||||
padding-top: 1.0533333333rem;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
}
|
||||
.invite-record-wrap .text {
|
||||
color: #141949;
|
||||
font-size: 0.32rem;
|
||||
position: absolute;
|
||||
font-weight: bold;
|
||||
top: 0.2266666667rem;
|
||||
left: 0.2533333333rem;
|
||||
}
|
||||
|
||||
.invite-record-wrap::after {
|
||||
content: '';
|
||||
border: 0.53333rem solid transparent;
|
||||
content: "";
|
||||
border: 0.5333333333rem solid transparent;
|
||||
}
|
||||
|
||||
.invite-record-wrap li {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 0.53333rem;
|
||||
margin-bottom: 0.5333333333rem;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-avatar {
|
||||
width: 1.33333rem;
|
||||
height: 1.33333rem;
|
||||
margin-left: 0.42667rem;
|
||||
margin-right: 0.25333rem;
|
||||
width: 1.3333333333rem;
|
||||
height: 1.3333333333rem;
|
||||
margin-left: 0.4266666667rem;
|
||||
margin-right: 0.2533333333rem;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-avatar img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-info .item-nickname {
|
||||
font-size: 0.4rem;
|
||||
font-weight: 600;
|
||||
color: #E1E1E2;
|
||||
margin-bottom: 0.45333rem;
|
||||
color: #141949;
|
||||
margin-bottom: 0.4533333333rem;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-info .item-nickname img {
|
||||
width: 0.4rem;
|
||||
height: 0.4rem;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .item-info .item-date {
|
||||
font-size: 0.26667rem;
|
||||
color: #7A767C;
|
||||
font-size: 0.2666666667rem;
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .isActive {
|
||||
position: absolute;
|
||||
right: 0.29333rem;
|
||||
right: 0.2933333333rem;
|
||||
bottom: 0.08rem;
|
||||
font-family: 'pingfang-regular';
|
||||
font-family: "pingfang-regular";
|
||||
font-size: 0.32rem;
|
||||
color: #E1E1E2;
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
}
|
||||
.invite-record-wrap li .isActive.inactive {
|
||||
color: #FF6BEF;
|
||||
}
|
||||
|
||||
.invite-record-wrap li .isActive.inactive {
|
||||
color: #4A7DFF;
|
||||
}
|
||||
/*# sourceMappingURL=index.css.map */
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
@function px2rem($px, $rem:75){
|
||||
@function px2rem($px, $rem:75) {
|
||||
@return $px/$rem+rem;
|
||||
}
|
||||
|
||||
@font-face{
|
||||
@font-face {
|
||||
font-family: 'pingfang-medium';
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf');
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf') format('woff'),
|
||||
@@ -10,7 +10,7 @@
|
||||
url('../../../common/fonts/PingFang-Medium.ttf') format('svg');
|
||||
}
|
||||
|
||||
@font-face{
|
||||
@font-face {
|
||||
font-family: 'pingfang-bold';
|
||||
src: url('../../../common/fonts/PingFang\ Bold.ttf');
|
||||
src: url('../../../common/fonts/PingFang\ Bold.ttf') format('woff'),
|
||||
@@ -18,7 +18,7 @@
|
||||
url('../../../common/fonts/PingFang\ Bold.ttf') format('svg');
|
||||
}
|
||||
|
||||
@font-face{
|
||||
@font-face {
|
||||
font-family: 'pingfang-regular';
|
||||
src: url('../../../common/fonts/PingFang-Regular.ttf');
|
||||
src: url('../../../common/fonts/PingFang-Regular.ttf') format('woff'),
|
||||
@@ -26,66 +26,76 @@
|
||||
url('../../../common/fonts/PingFang-Regular.ttf') format('svg');
|
||||
}
|
||||
|
||||
body{
|
||||
body {
|
||||
display: none;
|
||||
background-color: #11111D;
|
||||
background-color: #DFF7F3;
|
||||
position: relative;
|
||||
font-family: 'pingfang-medium';
|
||||
}
|
||||
|
||||
.banner{
|
||||
.banner {
|
||||
width: px2rem(750);
|
||||
height: px2rem(860);
|
||||
height: px2rem(433);
|
||||
margin: auto;
|
||||
img{
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.personal-info-wrap{
|
||||
.personal-info-wrap {
|
||||
position: absolute;
|
||||
top: px2rem(624);
|
||||
top: px2rem(307);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(750);
|
||||
height: px2rem(227);
|
||||
width: px2rem(680);
|
||||
height: px2rem(180);
|
||||
background: url('../images/info-bg.png') no-repeat 0 0/100% 100%;
|
||||
.personal-info-content{
|
||||
|
||||
.personal-info-content {
|
||||
width: 100%;
|
||||
height: px2rem(180);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.avatar{
|
||||
|
||||
.avatar {
|
||||
width: px2rem(100);
|
||||
height: px2rem(100);
|
||||
margin-left: px2rem(65);
|
||||
margin-right: px2rem(20);
|
||||
img{
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.personal-info{
|
||||
|
||||
.personal-info {
|
||||
flex: 1;
|
||||
font-size: px2rem(20);
|
||||
color: white;
|
||||
.nickname{
|
||||
color: #141949;
|
||||
|
||||
.nickname {
|
||||
font-size: px2rem(30);
|
||||
font-weight: 600;
|
||||
margin-bottom: px2rem(18);
|
||||
}
|
||||
.platform-code, .invite-code{
|
||||
|
||||
.platform-code,
|
||||
.invite-code {
|
||||
font-family: 'pingfang-regular';
|
||||
margin-bottom: px2rem(8);
|
||||
}
|
||||
}
|
||||
.qr{
|
||||
|
||||
.qr {
|
||||
width: px2rem(107);
|
||||
height: px2rem(107);
|
||||
margin-right: px2rem(70);
|
||||
.active{
|
||||
|
||||
.active {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
@@ -96,14 +106,14 @@ body{
|
||||
}
|
||||
}
|
||||
|
||||
.share-btn{
|
||||
.share-btn {
|
||||
position: absolute;
|
||||
top: px2rem(783);
|
||||
top: px2rem(465);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(339);
|
||||
height: px2rem(69);
|
||||
line-height: px2rem(69);
|
||||
height: px2rem(71);
|
||||
line-height: px2rem(71);
|
||||
background: url('../images/share-btn.png') no-repeat 0 0/100% 100%;
|
||||
font-family: 'pingfang-bold';
|
||||
font-size: px2rem(30);
|
||||
@@ -112,75 +122,107 @@ body{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.rule-wrap{
|
||||
.rule-wrap {
|
||||
width: px2rem(685);
|
||||
height: px2rem(210);
|
||||
background: url('../images/rule-bg.png') no-repeat 0 0/100% 100%;
|
||||
margin: px2rem(42) auto px2rem(50);
|
||||
padding: px2rem(72) px2rem(30) 0 px2rem(30);
|
||||
background: url('../images/ruleBg.png') no-repeat 0 0/100% 100%;
|
||||
margin: 2.2rem auto px2rem(50);
|
||||
padding: px2rem(72) px2rem(25) 0 px2rem(30);
|
||||
box-sizing: border-box;
|
||||
font-size: px2rem(26);
|
||||
color: white;
|
||||
line-height: 1.5;
|
||||
&.rule-wrap-big{
|
||||
height: px2rem(292);
|
||||
background: url('../images/rule-bg-big.png') no-repeat 0 0/100% 100%;
|
||||
position: relative;
|
||||
|
||||
P {
|
||||
color: #141949;
|
||||
font-size: px2rem(26, );
|
||||
margin-bottom: px2rem(15, );
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
div {
|
||||
position: absolute;
|
||||
top: px2rem(16, );
|
||||
left: px2rem(18, );
|
||||
color: #141949;
|
||||
font-size: px2rem(24, );
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.invite-record-wrap{
|
||||
.invite-record-wrap {
|
||||
width: px2rem(685);
|
||||
height: px2rem(319);
|
||||
height: px2rem(353);
|
||||
background: url('../images/record-bg.png') no-repeat 0 0/100% 100%;
|
||||
margin: auto;
|
||||
padding-top: px2rem(79);
|
||||
box-sizing: border-box;
|
||||
&::after{
|
||||
position: relative;
|
||||
|
||||
.text {
|
||||
color: #141949;
|
||||
font-size: px2rem(24, );
|
||||
position: absolute;
|
||||
font-weight: bold;
|
||||
top: px2rem(17, );
|
||||
left: px2rem(19, );
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
border: px2rem(40) solid transparent;
|
||||
}
|
||||
li{
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: px2rem(40);
|
||||
.item-avatar{
|
||||
|
||||
.item-avatar {
|
||||
width: px2rem(100);
|
||||
height: px2rem(100);
|
||||
margin-left: px2rem(32);
|
||||
margin-right: px2rem(19);
|
||||
img{
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.item-info{
|
||||
|
||||
.item-info {
|
||||
flex: 1;
|
||||
.item-nickname{
|
||||
|
||||
.item-nickname {
|
||||
font-size: px2rem(30);
|
||||
font-weight: 600;
|
||||
color: #E1E1E2;
|
||||
color: #141949;
|
||||
margin-bottom: px2rem(34);
|
||||
img{
|
||||
|
||||
img {
|
||||
width: px2rem(30);
|
||||
height: px2rem(30);
|
||||
}
|
||||
}
|
||||
.item-date{
|
||||
|
||||
.item-date {
|
||||
font-size: px2rem(20);
|
||||
color: #7A767C;
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.isActive{
|
||||
|
||||
.isActive {
|
||||
position: absolute;
|
||||
right: px2rem(22);
|
||||
bottom: px2rem(6);
|
||||
font-family: 'pingfang-regular';
|
||||
font-size: px2rem(24);
|
||||
color: #E1E1E2;
|
||||
&.inactive{
|
||||
color: #4A7DFF;
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
|
||||
&.inactive {
|
||||
color: #FF6BEF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,27 +1,29 @@
|
||||
@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");
|
||||
}
|
||||
html {
|
||||
background: #E7F5F8;
|
||||
}
|
||||
|
||||
body {
|
||||
display: none;
|
||||
font-family: 'pingfang-medium';
|
||||
font-family: "pingfang-medium";
|
||||
width: 100%;
|
||||
height: 17.78667rem;
|
||||
background: url("../images/register.png") #080709 no-repeat 0 0/100% 100%;
|
||||
height: 17.7866666667rem;
|
||||
background: url("../images/register.png") #E7F5F8 no-repeat 0 0/100% 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
position: absolute;
|
||||
top: 6.05333rem;
|
||||
left: 50%;
|
||||
top: 5.3rem;
|
||||
left: 49.6%;
|
||||
transform: translateX(-50%);
|
||||
width: 2.13333rem;
|
||||
height: 2.13333rem;
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
}
|
||||
|
||||
.avatar img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@@ -30,7 +32,7 @@ body {
|
||||
|
||||
.tip {
|
||||
position: absolute;
|
||||
top: 10.05333rem;
|
||||
top: 10.0533333333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
font-size: 0.4rem;
|
||||
@@ -38,80 +40,79 @@ body {
|
||||
color: white;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.form-wrap {
|
||||
position: absolute;
|
||||
top: 10.93333rem;
|
||||
top: 8.933333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.form-wrap .mobile-number, .form-wrap .verify-ipt {
|
||||
width: 8.4rem;
|
||||
height: 0.93333rem;
|
||||
.form-wrap .mobile-number,
|
||||
.form-wrap .verify-ipt {
|
||||
width: 8.28rem;
|
||||
height: 1.2266666667rem;
|
||||
outline: none;
|
||||
border-radius: 0.4rem;
|
||||
border-radius: 1.2266666667rem;
|
||||
padding-left: 0.4rem;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
background: #fff;
|
||||
margin-bottom: 0.4rem;
|
||||
font-size: 0.4rem;
|
||||
color: white;
|
||||
color: #141949;
|
||||
border: 1px solid #C8C9FF;
|
||||
box-sizing: border-box;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.form-wrap .mobile-number::placeholder, .form-wrap .verify-ipt::placeholder {
|
||||
color: white;
|
||||
font-weight: 200;
|
||||
.form-wrap .mobile-number::placeholder,
|
||||
.form-wrap .verify-ipt::placeholder {
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.form-wrap .verify-wrap {
|
||||
position: relative;
|
||||
height: 0.93333rem;
|
||||
height: 0.9333333333rem;
|
||||
}
|
||||
|
||||
.form-wrap .verify-wrap .verify-btn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 1.84rem;
|
||||
height: 0.93333rem;
|
||||
background-image: linear-gradient(to right, #256DC2, #5E2AB0);
|
||||
border-radius: 0.46667rem;
|
||||
right: 0.32rem;
|
||||
top: 0.2533333333rem;
|
||||
width: 1.8666666667rem;
|
||||
height: 0.7333333333rem;
|
||||
background: #FF6BEF;
|
||||
border-radius: 0.7333333333rem;
|
||||
color: white;
|
||||
font-size: 0.4rem;
|
||||
text-align: center;
|
||||
line-height: 0.93333rem;
|
||||
line-height: 0.7333333333rem;
|
||||
}
|
||||
|
||||
.form-wrap .verify-wrap .invite-code {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
top: 63%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: white;
|
||||
color: #141949;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.form-wrap .register-btn {
|
||||
display: block;
|
||||
height: 0.93333rem;
|
||||
background-image: linear-gradient(to right, #218EFF, #7727E4);
|
||||
border-radius: 0.46667rem;
|
||||
width: 8.28rem;
|
||||
height: 1.2266666667rem;
|
||||
background: linear-gradient(-90deg, #BBFFFF 0%, #A9AAFF 52%, #ECD0FF 100%);
|
||||
border-radius: 1.2266666667rem;
|
||||
margin: 0.8rem auto 0;
|
||||
color: white;
|
||||
color: #141949;
|
||||
font-size: 0.48rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
line-height: 0.93333rem;
|
||||
line-height: 1.2266666667rem;
|
||||
}
|
||||
|
||||
.form-wrap .form-tip {
|
||||
color: #999;
|
||||
font-size: 0.34667rem;
|
||||
font-size: 0.3466666667rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.form-wrap .form-tip a {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
@@ -125,34 +126,33 @@ body {
|
||||
z-index: 999;
|
||||
width: 10rem;
|
||||
height: 1.68rem;
|
||||
background-color: rgba(101, 61, 233, 0.4);
|
||||
background: linear-gradient(-90deg, #A493FC 0%, #40D3F8 100%);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bottom img {
|
||||
width: 1.14667rem;
|
||||
height: 1.14667rem;
|
||||
border-radius: 0.21333rem;
|
||||
margin-left: 0.26667rem;
|
||||
margin-right: 0.13333rem;
|
||||
width: 1.1466666667rem;
|
||||
height: 1.1466666667rem;
|
||||
border-radius: 0.2133333333rem;
|
||||
margin-left: 0.2666666667rem;
|
||||
margin-right: 0.1333333333rem;
|
||||
}
|
||||
|
||||
.bottom p {
|
||||
flex: 1;
|
||||
font-size: 0.4rem;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.bottom a {
|
||||
width: 2.13333rem;
|
||||
height: 0.69333rem;
|
||||
line-height: 0.69333rem;
|
||||
border-radius: 0.34667rem;
|
||||
width: 2.1333333333rem;
|
||||
height: 0.6933333333rem;
|
||||
line-height: 0.6933333333rem;
|
||||
border-radius: 0.3466666667rem;
|
||||
background: white;
|
||||
margin-right: 0.26667rem;
|
||||
margin-right: 0.2666666667rem;
|
||||
text-align: center;
|
||||
font-size: 0.34667rem;
|
||||
font-size: 0.3733333333rem;
|
||||
font-weight: bold;
|
||||
color: #752AE4;
|
||||
color: #141949;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=register.css.map */
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
@function px2rem($px, $rem:75){
|
||||
@function px2rem($px, $rem:75) {
|
||||
@return $px/$rem+rem;
|
||||
}
|
||||
|
||||
@font-face{
|
||||
@font-face {
|
||||
font-family: 'pingfang-medium';
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf');
|
||||
src: url('../../../common/fonts/PingFang-Medium.ttf') format('woff'),
|
||||
@@ -10,30 +10,35 @@
|
||||
url('../../../common/fonts/PingFang-Medium.ttf') format('svg');
|
||||
}
|
||||
|
||||
body{
|
||||
html {
|
||||
background: #E7F5F8;
|
||||
}
|
||||
|
||||
body {
|
||||
display: none;
|
||||
font-family: 'pingfang-medium';
|
||||
width: 100%;
|
||||
height: px2rem(1334);
|
||||
background: url('../images/register.png') #080709 no-repeat 0 0/100% 100%;
|
||||
background: url('../images/register.png') #E7F5F8 no-repeat 0 0/100% 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.avatar{
|
||||
.avatar {
|
||||
position: absolute;
|
||||
top: px2rem(454);
|
||||
left: 50%;
|
||||
top: 5.3rem;
|
||||
left: 49.6%;
|
||||
transform: translateX(-50%);
|
||||
width: px2rem(160);
|
||||
height: px2rem(160);
|
||||
img{
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.tip{
|
||||
.tip {
|
||||
position: absolute;
|
||||
top: px2rem(754);
|
||||
left: 50%;
|
||||
@@ -43,72 +48,85 @@ body{
|
||||
color: white;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.form-wrap{
|
||||
.form-wrap {
|
||||
position: absolute;
|
||||
top: px2rem(820);
|
||||
top: 8.933333rem;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
.mobile-number, .verify-ipt{
|
||||
width: px2rem(630);
|
||||
height: px2rem(70);
|
||||
|
||||
.mobile-number,
|
||||
.verify-ipt {
|
||||
width: px2rem(621);
|
||||
height: px2rem(92);
|
||||
outline: none;
|
||||
border-radius: px2rem(30);
|
||||
border-radius: px2rem(92);
|
||||
padding-left: px2rem(30);
|
||||
background-color: rgba($color: #fff, $alpha: .1);
|
||||
background: #fff;
|
||||
margin-bottom: px2rem(30);
|
||||
font-size: px2rem(30);
|
||||
color: white;
|
||||
&::placeholder{
|
||||
color: white;
|
||||
font-weight: 200;
|
||||
color: #141949;
|
||||
border: 1px solid #C8C9FF;
|
||||
box-sizing: border-box;
|
||||
font-weight: bold;
|
||||
|
||||
&::placeholder {
|
||||
color: #141949;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.verify-wrap{
|
||||
|
||||
.verify-wrap {
|
||||
position: relative;
|
||||
height: px2rem(70);
|
||||
.verify-btn{
|
||||
|
||||
.verify-btn {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: px2rem(138);
|
||||
height: px2rem(70);
|
||||
background-image: linear-gradient(to right, #256DC2, #5E2AB0);
|
||||
border-radius: px2rem(35);
|
||||
right: px2rem(24, );
|
||||
top: px2rem(19, );
|
||||
width: px2rem(140);
|
||||
height: px2rem(55);
|
||||
background: #FF6BEF;
|
||||
border-radius: px2rem(55);
|
||||
color: white;
|
||||
font-size: px2rem(30);
|
||||
text-align: center;
|
||||
line-height: px2rem(70);
|
||||
line-height: px2rem(55);
|
||||
}
|
||||
.invite-code{
|
||||
|
||||
.invite-code {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
top: 63%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
color: white;
|
||||
color: #141949;
|
||||
font-size: px2rem(36, );
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.register-btn{
|
||||
|
||||
.register-btn {
|
||||
display: block;
|
||||
// width: px2rem(630);
|
||||
height: px2rem(70);
|
||||
background-image: linear-gradient(to right, #218EFF, #7727E4);
|
||||
border-radius: px2rem(35);
|
||||
width: px2rem(621);
|
||||
height: px2rem(92);
|
||||
background: linear-gradient(-90deg, #BBFFFF 0%, #A9AAFF 52%, #ECD0FF 100%);
|
||||
border-radius: px2rem(92);
|
||||
margin: px2rem(60) auto 0;
|
||||
color: white;
|
||||
color: #141949;
|
||||
font-size: px2rem(36);
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
line-height: px2rem(70);
|
||||
line-height: px2rem(92);
|
||||
}
|
||||
.form-tip{
|
||||
|
||||
.form-tip {
|
||||
color: #999;
|
||||
font-size: px2rem(26);
|
||||
text-align: center;
|
||||
a{
|
||||
|
||||
a {
|
||||
color: white;
|
||||
text-decoration: underline;
|
||||
}
|
||||
@@ -118,7 +136,7 @@ body{
|
||||
|
||||
|
||||
|
||||
.bottom{
|
||||
.bottom {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
@@ -126,22 +144,25 @@ body{
|
||||
z-index: 999;
|
||||
width: px2rem(750);
|
||||
height: px2rem(126);
|
||||
background-color: rgba($color: #653DE9, $alpha: .4);
|
||||
background: linear-gradient(-90deg, #A493FC 0%, #40D3F8 100%);;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
img{
|
||||
|
||||
img {
|
||||
width: px2rem(86);
|
||||
height: px2rem(86);
|
||||
border-radius: px2rem(16);
|
||||
margin-left: px2rem(20);
|
||||
margin-right: px2rem(10);
|
||||
}
|
||||
p{
|
||||
|
||||
p {
|
||||
flex: 1;
|
||||
font-size: px2rem(30);
|
||||
color: white;
|
||||
}
|
||||
a{
|
||||
|
||||
a {
|
||||
width: px2rem(160);
|
||||
height: px2rem(52);
|
||||
line-height: px2rem(52);
|
||||
@@ -149,8 +170,8 @@ body{
|
||||
background: white;
|
||||
margin-right: px2rem(20);
|
||||
text-align: center;
|
||||
font-size: px2rem(26);
|
||||
font-size: px2rem(28);
|
||||
font-weight: bold;
|
||||
color: #752AE4;
|
||||
color: #141949;
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 764 KiB After Width: | Height: | Size: 731 KiB |
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 244 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 440 B After Width: | Height: | Size: 382 B |
|
Before Width: | Height: | Size: 566 B After Width: | Height: | Size: 488 B |
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 102 KiB After Width: | Height: | Size: 97 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 9.5 KiB |
|
Before Width: | Height: | Size: 58 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 560 B After Width: | Height: | Size: 496 B |
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 73 KiB |
|
Before Width: | Height: | Size: 324 KiB After Width: | Height: | Size: 713 KiB |
|
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 6.7 KiB |
BIN
view/peko/modules/game/images/ruleBg.png
Normal file
|
After Width: | Height: | Size: 47 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 16 KiB |
@@ -1,12 +1,15 @@
|
||||
<!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">
|
||||
<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="banner"><img src="./images/banner.png" alt=""></div>
|
||||
<div class="personal-info-wrap">
|
||||
@@ -21,13 +24,26 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="share-btn">立即分享</div>
|
||||
<!-- 立即分享 -->
|
||||
<div class="share-btn"></div>
|
||||
<div class="rule-wrap">
|
||||
<p>1.分享后好友注册并下载<span class="appName">peko</span>，自动填写您的邀请码；</p>
|
||||
<p>2.同一台手机设备注册的用户，视为同一用户；</p>
|
||||
<p>3.每位新用户仅能填写一次邀请码，填写后不可修改<span class="punctuation">。</span></p>
|
||||
<div>分享規則</div>
|
||||
<p>1.分享後好友註冊並下載Peko，填寫您的邀請碼:</p>
|
||||
<p>2.同一臺手機設備註冊的用戶，視為同一用戶;</p>
|
||||
<p>3.每位新用戶僅能填寫一次邀請碼， 填寫後不可修改。</p>
|
||||
</div>
|
||||
<ul class="invite-record-wrap">
|
||||
<div class="text">邀請記錄</div>
|
||||
<!-- <li>
|
||||
<div class="item-avatar"><img src="./images/default.png" alt=""></div>
|
||||
<div class="item-info">
|
||||
<p class="item-nickname">
|
||||
我是名字<img src="./images/female.png" alt="">
|
||||
</p>
|
||||
<div class="item-date"><span>年月日时分秒</span> 注册</div>
|
||||
</div>
|
||||
<div class="isActive">未登录激活</div>
|
||||
</li> -->
|
||||
</ul>
|
||||
|
||||
|
||||
@@ -40,4 +56,5 @@
|
||||
<script src="./js/jquery.qrcode.min.js"></script>
|
||||
<script src="./js/index.js?v=3.1"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -5,10 +5,10 @@ if (env == 'test') {
|
||||
new VConsole();
|
||||
}
|
||||
|
||||
const productUrlNew = 'https://api.99park.cn'; // 正式环境
|
||||
const testUrlNew = 'http://beta.99park.cn'; // 测试环境
|
||||
const productUrlNew = 'https://api.pekolive.com'; // 正式环境
|
||||
const testUrlNew = 'https://beta.api.pekolive.com'; // 测试环境
|
||||
//获取新域名前缀
|
||||
function getUrlPrefixNew() {
|
||||
function getUrlPrefixNew () {
|
||||
if (!EnvCheck()) return undefined;
|
||||
return EnvCheck() === 'live' ? productUrlNew : testUrlNew;
|
||||
}
|
||||
@@ -22,7 +22,7 @@ const showLoading = (content = '加載中...') => {
|
||||
type: 2,
|
||||
shadeClose: false,
|
||||
content,
|
||||
success(e) {
|
||||
success (e) {
|
||||
layerIndex = $(e).attr('index')
|
||||
}
|
||||
})
|
||||
@@ -44,14 +44,15 @@ const getUserInfo = () => {
|
||||
networkRequest({
|
||||
type: 'GET',
|
||||
url: urlPrefix + `/user/get?uid=${queryObj.shareUid}`,
|
||||
success(res) {
|
||||
if(res.code === 200){
|
||||
success (res) {
|
||||
if (res.code === 200) {
|
||||
// $('.avatar').find('img').attr('src', res.data.avatar)
|
||||
}else{
|
||||
$('.avatar img').attr('src',res.data.avatar)
|
||||
} else {
|
||||
toastMsg(res.message)
|
||||
}
|
||||
},
|
||||
error(){
|
||||
error () {
|
||||
toastMsg('網絡錯誤')
|
||||
}
|
||||
})
|
||||
@@ -59,66 +60,95 @@ const getUserInfo = () => {
|
||||
|
||||
|
||||
|
||||
$(function(){
|
||||
$(function () {
|
||||
getInfoFromClient()
|
||||
setTimeout(() => {
|
||||
getUserInfo()
|
||||
}, 50)
|
||||
|
||||
if (browser.app) {
|
||||
if (browser.android) {
|
||||
let channel = JSON.parse(pubInfo.deviceInfo).channel
|
||||
if (channel.indexOf('toutiao') != -1 || channel.indexOf('kuaishou') != -1) {
|
||||
$('.avatar img').attr('src', './images/logo-yy.png')
|
||||
$('.bottom img').attr('src', './images/logo-yy.png')
|
||||
$('.appName').html('peko')
|
||||
}
|
||||
}
|
||||
}
|
||||
// if (browser.app) {
|
||||
// if (browser.android) {
|
||||
// let channel = JSON.parse(pubInfo.deviceInfo).channel
|
||||
// if (channel.indexOf('toutiao') != -1 || channel.indexOf('kuaishou') != -1) {
|
||||
// $('.avatar img').attr('src', './images/logo-yy.png')
|
||||
// $('.bottom img').attr('src', './images/logo-yy.png')
|
||||
// $('.appName').html('peko')
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
setTimeout(() => {
|
||||
$('body').show()
|
||||
}, 0)
|
||||
|
||||
$('.invite-code').html(`${queryObj.inviteCode}`)
|
||||
$('.verify-btn').on('click', function(){
|
||||
$('.verify-btn').on('click', function () {
|
||||
$('#int').val(`${queryObj.inviteCode}`)
|
||||
let clipboard = new Clipboard('.verify-btn')
|
||||
clipboard.on('success', function(e){
|
||||
clipboard.on('success', function (e) {
|
||||
toastMsg('已复制邀请码')
|
||||
e.clearSelection();
|
||||
})
|
||||
})
|
||||
|
||||
// 创建深度链接
|
||||
let linkedKey = '6ba9e9d9760b8acc50b2b499cfd557da'
|
||||
let paramsObj = {
|
||||
inviteCode: queryObj.inviteCode
|
||||
}
|
||||
let jsonStr = JSON.stringify(paramsObj)
|
||||
let linkedObj = {
|
||||
type: EnvCheck(),
|
||||
params: jsonStr
|
||||
}
|
||||
if(queryObj.enterprise){
|
||||
linkedKey = 'af4f58541a86d5f6c4193349f675419a'
|
||||
}
|
||||
linkedme.init(linkedKey, { type: EnvCheck() }, null)
|
||||
linkedme.link(linkedObj, function(err, response){
|
||||
if(err){
|
||||
// 生成深度链接失败，返回错误对象err
|
||||
console.log('err:', err);
|
||||
}else{
|
||||
$('.register-btn').on('click', function(){
|
||||
linkedme.trigger_deeplink(response.url);
|
||||
})
|
||||
$('.register-btn').attr('href', response.url)
|
||||
// // 创建深度链接
|
||||
// let linkedKey = '6ba9e9d9760b8acc50b2b499cfd557da'
|
||||
// let paramsObj = {
|
||||
// inviteCode: queryObj.inviteCode
|
||||
// }
|
||||
// let jsonStr = JSON.stringify(paramsObj)
|
||||
// let linkedObj = {
|
||||
// type: EnvCheck(),
|
||||
// params: jsonStr
|
||||
// }
|
||||
// if(queryObj.enterprise){
|
||||
// linkedKey = 'af4f58541a86d5f6c4193349f675419a'
|
||||
// }
|
||||
// linkedme.init(linkedKey, { type: EnvCheck() }, null)
|
||||
// linkedme.link(linkedObj, function(err, response){
|
||||
// if(err){
|
||||
// // 生成深度链接失败，返回错误对象err
|
||||
// console.log('err:', err);
|
||||
// }else{
|
||||
// $('.register-btn').on('click', function(){
|
||||
// linkedme.trigger_deeplink(response.url);
|
||||
// })
|
||||
// $('.register-btn').attr('href', response.url)
|
||||
|
||||
|
||||
$('.download').on('click', function(){
|
||||
linkedme.trigger_deeplink(response.url);
|
||||
})
|
||||
$('.download').attr('href', response.url)
|
||||
// $('.download').on('click', function(){
|
||||
// linkedme.trigger_deeplink(response.url);
|
||||
// })
|
||||
// $('.download').attr('href', response.url)
|
||||
|
||||
// }
|
||||
// }, false)
|
||||
function get_param (param) {
|
||||
var query = location.search.substring(1).split('&');
|
||||
for (var i = 0; i < query.length; i++) {
|
||||
var kv = query[i].split('=');
|
||||
if (kv[0] == param) {
|
||||
return kv[1];
|
||||
}
|
||||
}, false)
|
||||
}
|
||||
return null;
|
||||
}
|
||||
uid = get_param('uid');
|
||||
mobid = get_param('mobid');
|
||||
ROOM_UID = get_param('ROOM_UID')
|
||||
fromType = get_param('fromType')
|
||||
enterType = get_param('enterType')
|
||||
workAuthor = get_param('workAuthor')
|
||||
workAuthorId = get_param('workAuthorId')
|
||||
roomuid = get_param('uid')
|
||||
MobLink([{
|
||||
el: '#bomlinkdomload',
|
||||
path: '',
|
||||
params: { mobLinkType: 1, inviteCode: queryObj.inviteCode, roomuid, uid, mobid, ROOM_UID, fromType, enterType, workAuthor, workAuthorId }
|
||||
},
|
||||
{
|
||||
el: '#bomlinkdomload1',
|
||||
path: '',
|
||||
params: { mobLinkType: 2, inviteCode: queryObj.inviteCode, roomuid, uid, mobid, ROOM_UID, fromType, enterType, workAuthor, workAuthorId }
|
||||
}
|
||||
]);
|
||||
})
|
||||
@@ -1,12 +1,15 @@
|
||||
<!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">
|
||||
<meta name="viewport"
|
||||
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||||
<title class="appName">邀请好友</title>
|
||||
<link rel="stylesheet" href="../../common/css/reset.css">
|
||||
<link rel="stylesheet" href="./css/register.css?v=3.0">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="avatar"><img src="./images/logo.png" alt=""></div>
|
||||
<p class="tip">邀你来<span class="appName">peko</span>一起聊天打游戏</p>
|
||||
@@ -17,22 +20,24 @@
|
||||
<div class="invite-code"></div>
|
||||
<p class="verify-btn" data-clipboard-target="#int">复制</p>
|
||||
</div>
|
||||
<a class="register-btn">立即下载</a>
|
||||
<a class="register-btn" id="bomlinkdomload">立即下载</a>
|
||||
</div>
|
||||
|
||||
<div class="bottom">
|
||||
<img src="./images/logo.png" alt="">
|
||||
<p>来<span class="appName">peko</span>打游戏，争夺更多赏金！</p>
|
||||
<a class="download">下载APP</a>
|
||||
<p>来<span class="appName">peko</span>，邂逅你的專屬聲音~</p>
|
||||
<a class="download" id="bomlinkdomload1">下载APP</a>
|
||||
</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="https://static.lkme.cc/linkedme.min.js"></script>
|
||||
<!-- <script src="https://static.lkme.cc/linkedme.min.js"></script> -->
|
||||
<script src="../../common/js/layer.js"></script>
|
||||
<script src="../../common/js/vconsole.min.js"></script>
|
||||
<script src="../../common/js/clipboard.min.js"></script>
|
||||
<script type="text/javascript" src="//cebg.t4m.cn/applink.js"></script>
|
||||
<script src="./js/register.js?v=3.0"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 58 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 707 B After Width: | Height: | Size: 322 B |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 5.0 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 5.1 KiB |
@@ -11,7 +11,8 @@ let openId;
|
||||
let payChannel;//付款方式
|
||||
let paymentType;//付款码
|
||||
var host = window.location.host;
|
||||
let successUrl = `${window.location.protocol}//${host}/peko/modules/pay/index.html`;//支付成功回调路径
|
||||
// let successUrl = `${window.location.protocol}//${host}/peko/modules/pay/index.html`;//支付成功回调路径
|
||||
let successUrl = window.location.href;//支付成功回调路径
|
||||
let uid;
|
||||
let modeOfPayment = false;//判断是否有选择支付方式
|
||||
let paymentAmount = false;//判断是否有选择付款金额
|
||||
@@ -122,7 +123,7 @@ $(function () {
|
||||
console.log(res)
|
||||
$('.logingActive').text("請稍等");//""
|
||||
$('.logingActive').show();
|
||||
window.location.href = res.data.mweb_url
|
||||
window.location.replace(res.data.payInfo.mweb_url);
|
||||
} else {
|
||||
logingFun(res.message)
|
||||
}
|
||||
|
||||
BIN
view/peko/modules/share_room/images/logo.png
Normal file
|
After Width: | Height: | Size: 58 KiB |