完成邀请好友页面，联调第三方充值，迁移星级厨房页面

view/peko/activity/act-ocean/css/rank.css

@@ -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";
+  font-family: 'pingfang-regular';
-  width: 5.3333333333rem;
+  width: 5.33333rem;
-  height: 0.9333333333rem;
+  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;
+  height: 3.73333rem;
-  margin-top: 1.1466666667rem;
+  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;
+  width: 1.86667rem;
-  height: 2.5333333333rem;
+  height: 2.53333rem;
-  margin-top: -1.1466666667rem;
+  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;
+  width: 1.86667rem;
-  height: 1.8666666667rem;
+  height: 1.86667rem;
-  top: -1.9733333333rem;
+  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;
+  width: 1.86667rem;
-  height: 2.5333333333rem;
+  height: 2.53333rem;
-  margin-top: -1.1466666667rem;
+  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;
+  width: 1.86667rem;
-  height: 1.8666666667rem;
+  height: 1.86667rem;
-  top: -1.9733333333rem;
+  top: -1.97333rem;
 }
+
 .rank-top .topthree-wrap .info-wrap .avatar {
-  width: 2.1333333333rem;
+  width: 2.13333rem;
-  height: 2.8533333333rem;
+  height: 2.85333rem;
-  margin-top: -0.9333333333rem;
+  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;
+  width: 2.13333rem;
-  height: 2.1333333333rem;
+  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;
+  width: 1.33333rem;
-  height: 1.3333333333rem;
+  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;
+  width: 1.33333rem;
-  height: 1.3333333333rem;
+  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 */

view/peko/activity/act-ocean/css/rank.scss

@@ -246,7 +246,7 @@ html,body{
 }
 
 .no-in-app{
-    // display: none;
+    display: none;
     position: fixed;
     top: 0;
     left: 0;

view/peko/activity/act-ocean/css/record.css

@@ -1,125 +1,155 @@
-html,
+@font-face {
-body {
+  font-family: 'pingfang-bold';
-  width: 100%;
+  src: url("../../../common/fonts/PingFang Bold.ttf");
-  background: #233346;
+  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 {
+@font-face {
-  position: fixed;
+  font-family: 'din-medium';
-  left: 50%;
+  src: url("../../../common/fonts/DINCond-Medium.ttf");
-  top: 50%;
+  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");
-  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;
 }
 
-.record-list {
+@font-face {
-  width: 9.2rem;
+  font-family: 'pingfang-medium';
-  margin: 0.4rem auto;
+  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%;
+.clearfix:after {
-  height: 4.8rem;
+  display: block;
-  background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
+  content: ' ';
-  border-radius: 0.2666666667rem;
+  clear: both;
 }
-.record-list li h3 {
+
-  width: 100%;
+.clearfix {
-  height: 0.7rem;
+  *zoom: 1;
-  line-height: 0.7rem;
+}
+
+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;
+ul.record-list li.record-item .award {
-  height: 0.5866666667rem;
-  line-height: 0.5866666667rem;
-  background: #1B9196;
   display: flex;
   justify-content: space-between;
-  box-sizing: border-box;
+  align-items: center;
-  padding: 0 0.2666666667rem;
+  width: 9.04rem;
+  height: 0.58667rem;
+  background-color: #F46331;
+  margin: auto;
 }
-.record-list li .goldBox span {
+
-  color: #fff;
+ul.record-list li.record-item .award .text {
-  font-size: 0.3733333333rem;
+  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;
+ul.record-list li.record-item ul.award-animal li.animal-item div {
-  height: 2.1333333333rem;
+  width: 0.8rem;
-  margin: 0 auto;
+  height: 0.8rem;
-  display: flex;
+  background: url("../images/little-bubble.png") no-repeat 0 0/100% 100%;
-  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;
 }
 
-/*# 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;
+}

view/peko/activity/act-ocean/css/record.scss

@@ -2,137 +2,149 @@
     @return $px / $rem+rem;
 }
 
-html,
+@font-face{
-body {
+    font-family: 'pingfang-bold';
-    width: 100%;
+    src: url('../../../common/fonts/PingFang\ Bold.ttf');
-    background: #233346;
+    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;
+@font-face{
-    left: 50%;
+    font-family: 'din-medium';
-    top: 50%;
+    src: url('../../../common/fonts/DINCond-Medium.ttf');
-    transform: translate(-50%,-50%);
+    src: url('../../../common/fonts/DINCond-Medium.ttf') format('woff'),
-    width: px2rem(450, );
+        url('../../../common/fonts/DINCond-Medium.ttf') format('truetype'),
-    height: px2rem(310, );
+        url('../../../common/fonts/DINCond-Medium.ttf') format('svg');
-    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, );
-    }
 }
-.record-list {
-    width: px2rem(690, );
-    margin: px2rem(30, ) auto;
 
-    li {
+@font-face{
-        width: 100%;
+    font-family: 'pingfang-medium';
-        height: px2rem(360, );
+    src: url('../../../common/fonts/PingFang-Medium.ttf');
-        background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
+    src: url('../../../common/fonts/PingFang-Medium.ttf') format('woff'),
-        border-radius: px2rem(20, );
+        url('../../../common/fonts/PingFang-Medium.ttf') format('truetype'),
-        h3 {
+        url('../../../common/fonts/PingFang-Medium.ttf') format('svg');
-            width: 100%;
+}
-            height: 0.7rem;
+
-            line-height: 0.7rem;
+.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);
         }
-
+        .award{
-        .goldBox {
-            width: px2rem(100%, );
-            height: px2rem(44, );
-            line-height: px2rem(44, );
-            background: #1B9196;
             display: flex;
             justify-content: space-between;
-            box-sizing: border-box;
+            align-items: center;
-            padding: 0 px2rem(20, );
+            width: px2rem(678);
-
+            height: px2rem(44);
-            span {
+            background-color: #F46331;
-                color: #fff;
+            margin: auto;
-                font-size: px2rem(28, );
+            .text{
+                font-size: px2rem(28);
+                color: white;
+                font-weight: bold;
+                margin-left: px2rem(24);
             }
-
+            .diamond-num{
-            .gold {
+                font-family: 'din-medium';
-                font-size: px2rem(26, );
+                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;
                     }
                 }
-
+                div{
-        .marine_organism {
+                    width: px2rem(60);
-            width: px2rem(560, );
+                    height: px2rem(60);
-            height: px2rem(160, );
+                    background: url('../images/little-bubble.png') no-repeat 0 0/100% 100%;
-            margin: 0 auto;
+                    img{
-            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;
                         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;
+    }
 }

view/peko/activity/act-ocean/index.html

@@ -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="count-down">开奖倒计时：<span class="count-down-num"></span>秒</div>
-                <!-- <div class="current-tip">玩法：选择碎片数量→选择食材</div> -->
+                <div class="current-tip">玩法：选择碎片数量→选择食材</div>
                 
                 <div class="btn-wrap">
-                    <div class="active">100钻石</div>
+                    <div class="active">1</div>
-                    <div>1000钻石</div>
+                    <div>10</div>
-                    <div>10000钻石</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="count-down">开奖中：<span class="count-down-num"></span>秒</div>
-                <!-- <div class="current-tip">等待結果</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="count-down">下一轮：<span class="count-down-num"></span>秒</div>
-                <div class="current-tip">本輪結果：<span class="current-result"></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="fragment">我的碎片：<span>0</span></div>
-                <div class="award">今日獎勵：<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 class="add"><img src="./images/add.png" alt=""></div> -->
-            
-        </div>
-        <!-- 今日排名 -->
             <div class="rank"><img src="./images/rank.png" alt=""></div>
+        </div>
+
         <!-- 规则弹窗 -->
         <div class="shade-mask">
             <div class="shade-content">
                 <main>
-                    <h3>遊戲規則</h3>
+                    <div class="cyfs">
-                    <div>
+                        <p class="title">参与方式</p>
-                        <p>1.每次至少選擇1種森林動物，可多次疊加選擇，中獎後可以獲得對應钻石獎勵（中獎森林動物選中數*中獎森林動物對應倍數）</p>
+                        用戶可通過花費「碎片」參與《星級廚房》遊戲，「碎片」為購買商店內頭飾的贈品，每次最少消耗1個碎片，每回合時間30秒
-                        <p>2.活動結束將關閉頁面，請留意活動關閉時間。</p>
+                        <p class="jietu"><img src="./images/t1.png" alt=""></p>
-                        <p>3.本活動與Apple Inc.無關，最終解釋權歸平臺所有。</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="diamond-rank active">今日礼物榜</span>
-                        <span class="num-rank">今日歐皇榜</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>

view/peko/activity/act-ocean/js/mall.js

@@ -5,14 +5,14 @@ if (env == 'test') {
     new VConsole();
 }
 
-// 封装layer消息提醒框
+// 封裝layer消息提醒框
 let layerIndex
 const showLoading = () => {
     layer.open({
         type: 2,
         shadeClose: false,
-        content: '加载中...',
+        content: '加載中...',
-        success(e) {
+        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){
+        success (res) {
-            if(res.code === 200){
+            if (res.code === 200) {
                 // console.log(res.data);
                 $('.bottom').find('.avatar img').attr('src', res.data.avatar)
-                if(res.data.nick.length > 10){
+                if (res.data.nick.length > 10) {
-                    res.data.nick = res.data.nick.slice(0,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){
+        error (err) {
-            toastMsg('网络错误')
+            toastMsg('網絡錯誤')
         }
     })
 }
-// 获取头饰礼包信息
+// 獲取頭飾禮包信息
 let listPack = []
 const getListPack = () => {
     networkRequest({
         type: 'GET',
         url: urlPrefix + '/act/luckySea/listPack',
-        success(res){
+        success (res) {
-            if(res.code === 200){
+            if (res.code === 200) {
                 // console.log(res.data);
                 listPack = res.data
                 renderList()
             }
         },
-        error(err){
+        error (err) {
-            toastMsg('网络错误')
+            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(){
+    $('.increase').on('click', function () {
-        if(giftObj['num']<9999){
+        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{
+        } else {
-            toastMsg('单次购买数量最多为9999')
+            toastMsg('單次購買數量最多為9999')
         }
     })
-    // 减少购买数量
+    // 減少購買數量
-    $('.decrease').on('click', function(){
+    $('.decrease').on('click', function () {
-        if($('.inputNum').val()>0){
+        if ($('.inputNum').val() > 0) {
             giftObj['num']--;
             giftObj['day']--;
             let allPrice = giftObj['num'] * giftObj['gold'];
             $('.inputNum').val(giftObj['num'])
             $('.buy-day span').html(giftObj['day'])
             $('.buy-price span').html(allPrice)
-        }else{
+        } else {
-            toastMsg('最少购买数量为1')
+            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())){
+        if (!exp.test($('.inputNum').val())) {
-            toastMsg('请输入数字')
+            toastMsg('請輸入數字')
             $('.inputNum').val(1)
             return
         }
-        if($('.inputNum').val() == 0){
+        if ($('.inputNum').val() == 0) {
-            return toastMsg('最少购买数量为1')
+            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){
+                success (res) {
-                    if(res.code === 200){
+                    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){
+                error (err) {
-                    toastMsg('网络错误')
+                    toastMsg('網絡錯誤')
                 }
             })
         }
 
     })
-    // 跳转充值
+    // 跳轉充值
     $('.recharge, .no-money-recharge').on('click', function () {
-        if(browser.app){
+        if (browser.app) {
-            if(browser.android){
+            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{
+        } else {
-            toastMsg('请在app内打开')
+            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()
         }

view/peko/activity/act-ocean/js/rank.js

@@ -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('沒有更多數據啦~')
-                        }
-                    }
-                }
-            }
-        }
-      })
-})

view/peko/activity/act-ocean/js/record.js

@@ -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();
+        $('.record-list').html('<li class="no-record">暫無遊戲記錄</li>')
-        $('.img').show();
     } else {
-        $('.record-list').show();
+        let str = ''
-        $('.img').hide();
+        recordList.map((item, index) => {
-        var str = '';
+            let drawId = item.drawId
-        let str2 = '';
+            let itemType = item.itemType
-        let drawId = [];;
+            // 渲染li裏面的ul
-        var results = [];
+            let str1 = ''
-        console.log(res.data)
+            let userCostPiece = ''  //用戶投註情況
-        res.data.forEach((res, index) => {
+            let userReward = ''     //用戶獎勵情況
-            drawId.push(res.drawId);
+            item.results.map((item1, index) => {
-            str += `
+                if (itemType === 1) {
-            <li style="margin-bottom: 0.8rem;">
+                    userCostPiece = '+' + item1.costPiece
-                <h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
+                } else {
-                <div class="goldBox">
+                    userCostPiece = item1.multiple * 10 + '*' + item1.costPiece
-                    <span>遊戲獎勵：</span>
+                }
-                    <span class="gold">${res.reward}钻石</span>
+
-                </div>
+                str1 += `
-                <div class="marine_organism"></div>
+                    <li class="animal-item">
-                <p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">哎呀~猜錯了o(╥﹏╥)o</p>
+                        <div><img src="${item1.itemUrl}" alt=""></div>
-                <p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">厲害~猜對了୧(๑•̀◡•́๑)૭</p>
+                        <span>${userCostPiece}</span>
                     </li>
                 `
-            results.push(res.results);
+
-        });
+                if (item1.itemId === drawId) {
-        $('.record-list').append(str)
+                    $('.none').html(str1)
-        results.forEach((res, index) => {
+                    $('.none').find('li').eq(index).addClass('active')
-            res.forEach(val => {
+                    str1 = $('.none').html()
-                $('.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 (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

view/peko/activity/act-ocean/rank.html

@@ -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>

view/peko/activity/act-ocean/record.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>

view/peko/modules/game/css/index.css

@@ -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;
+  width: 9.0666666667rem;
-  height: 3.02667rem;
+  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;
+  width: 1.3333333333rem;
-  height: 1.33333rem;
+  height: 1.3333333333rem;
-  margin-left: 0.86667rem;
+  margin-left: 0.8666666667rem;
-  margin-right: 0.26667rem;
+  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;
+  font-size: 0.2666666667rem;
-  color: white;
+  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 .platform-code, .personal-info-wrap .personal-info-content .personal-info .invite-code {
+.personal-info-wrap .personal-info-content .personal-info .invite-code {
-  font-family: 'pingfang-regular';
+  font-family: "pingfang-regular";
-  margin-bottom: 0.10667rem;
+  margin-bottom: 0.1066666667rem;
 }
-
 .personal-info-wrap .personal-info-content .qr {
-  width: 1.42667rem;
+  width: 1.4266666667rem;
-  height: 1.42667rem;
+  height: 1.4266666667rem;
-  margin-right: 0.93333rem;
+  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;
+  height: 0.9466666667rem;
-  line-height: 0.92rem;
+  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%;
+  background: url("../images/ruleBg.png") no-repeat 0 0/100% 100%;
-  margin: 0.56rem auto 0.66667rem;
+  margin: 2.2rem auto 0.6666666667rem;
-  padding: 0.96rem 0.4rem 0 0.4rem;
+  padding: 0.96rem 0.3333333333rem 0 0.4rem;
   box-sizing: border-box;
-  font-size: 0.34667rem;
+  position: relative;
-  color: white;
-  line-height: 1.5;
 }
-
+.rule-wrap P {
-.rule-wrap.rule-wrap-big {
+  color: #141949;
-  height: 3.89333rem;
+  font-size: 0.3466666667rem;
-  background: url("../images/rule-bg-big.png") no-repeat 0 0/100% 100%;
+  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;
+  width: 9.1333333333rem;
-  height: 4.25333rem;
+  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: '';
+  content: "";
-  border: 0.53333rem solid transparent;
+  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;
+  width: 1.3333333333rem;
-  height: 1.33333rem;
+  height: 1.3333333333rem;
-  margin-left: 0.42667rem;
+  margin-left: 0.4266666667rem;
-  margin-right: 0.25333rem;
+  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;
+  color: #141949;
-  margin-bottom: 0.45333rem;
+  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;
+  font-size: 0.2666666667rem;
-  color: #7A767C;
+  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 {
+/*# sourceMappingURL=index.css.map */
-  color: #4A7DFF;
-}

view/peko/modules/game/css/index.scss

@@ -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);
+    width: px2rem(680);
-    height: px2rem(227);
+    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;
+            color: #141949;
-            .nickname{
+
+            .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);
+    height: px2rem(71);
-    line-height: px2rem(69);
+    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%;
+    background: url('../images/ruleBg.png') no-repeat 0 0/100% 100%;
-    margin: px2rem(42) auto px2rem(50);
+    margin: 2.2rem auto px2rem(50);
-    padding: px2rem(72) px2rem(30) 0 px2rem(30);
+    padding: px2rem(72) px2rem(25) 0 px2rem(30);
     box-sizing: border-box;
-    font-size: px2rem(26);
+    position: relative;
-    color: white;
+
-    line-height: 1.5;
+    P {
-    &.rule-wrap-big{
+        color: #141949;
-        height: px2rem(292);
+        font-size: px2rem(26, );
-        background: url('../images/rule-bg-big.png') no-repeat 0 0/100% 100%;
+        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;
+            color: #141949;
-            &.inactive{
+            font-weight: bold;
-                color: #4A7DFF;
+
+            &.inactive {
+                color: #FF6BEF;
             }
         }
     }

view/peko/modules/game/css/register.css

@@ -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;
+  height: 17.7866666667rem;
-  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 {
   position: absolute;
-  top: 6.05333rem;
+  top: 5.3rem;
-  left: 50%;
+  left: 49.6%;
   transform: translateX(-50%);
-  width: 2.13333rem;
+  width: 2.2rem;
-  height: 2.13333rem;
+  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 .mobile-number, .form-wrap .verify-ipt {
+.form-wrap .verify-ipt {
-  width: 8.4rem;
+  width: 8.28rem;
-  height: 0.93333rem;
+  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 .mobile-number::placeholder, .form-wrap .verify-ipt::placeholder {
+.form-wrap .verify-ipt::placeholder {
-  color: white;
+  color: #141949;
-  font-weight: 200;
+  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;
+  right: 0.32rem;
-  top: 0;
+  top: 0.2533333333rem;
-  width: 1.84rem;
+  width: 1.8666666667rem;
-  height: 0.93333rem;
+  height: 0.7333333333rem;
-  background-image: linear-gradient(to right, #256DC2, #5E2AB0);
+  background: #FF6BEF;
-  border-radius: 0.46667rem;
+  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;
+  width: 8.28rem;
-  background-image: linear-gradient(to right, #218EFF, #7727E4);
+  height: 1.2266666667rem;
-  border-radius: 0.46667rem;
+  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;
+  width: 1.1466666667rem;
-  height: 1.14667rem;
+  height: 1.1466666667rem;
-  border-radius: 0.21333rem;
+  border-radius: 0.2133333333rem;
-  margin-left: 0.26667rem;
+  margin-left: 0.2666666667rem;
-  margin-right: 0.13333rem;
+  margin-right: 0.1333333333rem;
 }
-
 .bottom p {
   flex: 1;
   font-size: 0.4rem;
   color: white;
 }
-
 .bottom a {
-  width: 2.13333rem;
+  width: 2.1333333333rem;
-  height: 0.69333rem;
+  height: 0.6933333333rem;
-  line-height: 0.69333rem;
+  line-height: 0.6933333333rem;
-  border-radius: 0.34667rem;
+  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 */

view/peko/modules/game/css/register.scss

@@ -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);
+    top: 5.3rem;
-    left: 50%;
+    left: 49.6%;
     transform: translateX(-50%);
-    width: px2rem(160);
+    width: 2.2rem;
-    height: px2rem(160);
+    height: 2.2rem;
-    img{
+
+    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);
+    .mobile-number,
-        height: px2rem(70);
+    .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;
+        color: #141949;
-        &::placeholder{
+        border: 1px solid #C8C9FF;
-            color: white;
+        box-sizing: border-box;
-            font-weight: 200;
+        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;
+            right: px2rem(24, );
-            top: 0;
+            top: px2rem(19, );
-            width: px2rem(138);
+            width: px2rem(140);
-            height: px2rem(70);
+            height: px2rem(55);
-            background-image: linear-gradient(to right, #256DC2, #5E2AB0);
+            background: #FF6BEF;
-            border-radius: px2rem(35);
+            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);
+        width: px2rem(621);
-        height: px2rem(70);
+        height: px2rem(92);
-        background-image: linear-gradient(to right, #218EFF, #7727E4);
+        background: linear-gradient(-90deg, #BBFFFF 0%, #A9AAFF 52%, #ECD0FF 100%);
-        border-radius: px2rem(35);
+        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;
     }
 }

view/peko/modules/game/index.html

@@ -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>
+        <div>分享規則</div>
-        <p>2.同一台手机设备注册的用户，视为同一用户；</p>
+        <p>1.分享後好友註冊並下載Peko，填寫您的邀請碼:</p>
-        <p>3.每位新用户仅能填写一次邀请码，填写后不可修改<span class="punctuation">。</span></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>&nbsp;&nbsp;注册</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>

view/peko/modules/game/js/register.js

@@ -5,10 +5,10 @@ if (env == 'test') {
     new VConsole();
 }
 
-const productUrlNew = 'https://api.99park.cn'; // 正式环境
+const productUrlNew = 'https://api.pekolive.com'; // 正式环境
-const testUrlNew = 'http://beta.99park.cn'; // 测试环境
+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) {
+        success (res) {
-            if(res.code === 200){
+            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.app) {
-        if (browser.android) {
+    //     if (browser.android) {
-            let channel = JSON.parse(pubInfo.deviceInfo).channel
+    //         let channel = JSON.parse(pubInfo.deviceInfo).channel
-            if (channel.indexOf('toutiao') != -1 || channel.indexOf('kuaishou') != -1) {
+    //         if (channel.indexOf('toutiao') != -1 || channel.indexOf('kuaishou') != -1) {
-                $('.avatar img').attr('src', './images/logo-yy.png')
+    //             $('.avatar img').attr('src', './images/logo-yy.png')
-                $('.bottom img').attr('src', './images/logo-yy.png')
+    //             $('.bottom img').attr('src', './images/logo-yy.png')
-                $('.appName').html('peko')
+    //             $('.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 linkedKey = '6ba9e9d9760b8acc50b2b499cfd557da'
-    let paramsObj = {
+    // let paramsObj = {
-        inviteCode: queryObj.inviteCode
+    //     inviteCode: queryObj.inviteCode
-    }
+    // }
-    let jsonStr = JSON.stringify(paramsObj)
+    // let jsonStr = JSON.stringify(paramsObj)
-    let linkedObj = {
+    // let linkedObj = {
-        type: EnvCheck(),
+    //     type: EnvCheck(),
-        params: jsonStr
+    //     params: jsonStr
-    }
+    // }
-    if(queryObj.enterprise){
+    // if(queryObj.enterprise){
-        linkedKey = 'af4f58541a86d5f6c4193349f675419a'
+    //     linkedKey = 'af4f58541a86d5f6c4193349f675419a'
-    }
+    // }
-    linkedme.init(linkedKey, { type: EnvCheck() }, null)
+    // linkedme.init(linkedKey, { type: EnvCheck() }, null)
-    linkedme.link(linkedObj, function(err, response){
+    // linkedme.link(linkedObj, function(err, response){
-        if(err){
+    //     if(err){
-            // 生成深度链接失败，返回错误对象err
+    //         // 生成深度链接失败，返回错误对象err
-            console.log('err:', err);
+    //         console.log('err:', err);
-        }else{
+    //     }else{
-            $('.register-btn').on('click', function(){
+    //         $('.register-btn').on('click', function(){
-                linkedme.trigger_deeplink(response.url);
+    //             linkedme.trigger_deeplink(response.url);
-            })
+    //         })
-            $('.register-btn').attr('href', response.url)
+    //         $('.register-btn').attr('href', response.url)
 
 
-            $('.download').on('click', function(){
+    //         $('.download').on('click', function(){
-                linkedme.trigger_deeplink(response.url);
+    //             linkedme.trigger_deeplink(response.url);
-            })
+    //         })
-            $('.download').attr('href', 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 }
+    }
+    ]);
 })

view/peko/modules/game/register.html

@@ -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>
+        <p>来<span class="appName">peko</span>，邂逅你的專屬聲音~</p>
-        <a class="download">下载APP</a>
+        <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>

view/peko/modules/pay/js/index.js

@@ -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)
                                     }