peko商店包时间修改

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

@@ -11,7 +11,7 @@
 html,
 body {
   font-family: "din-medium";
-  background: #C8864C;
+  background: #531800;
   overflow-x: hidden;
 }
 
@@ -22,6 +22,14 @@ body {
 }
 .wrap .banner {
   width: 100%;
+  position: relative;
+}
+.wrap .banner .subtitle {
+  position: absolute;
+  top: 0.12rem;
+  right: 1.12rem;
+  width: 1.8666666667rem;
+  height: 1.12rem;
 }
 .wrap .rule,
 .wrap .record {
@@ -39,46 +47,79 @@ body {
 .wrap .record {
   top: 2.8533333333rem;
 }
-.wrap .previous-result {
+.wrap .previous_Round_Result {
+  width: 9.4266666667rem;
+  height: 1.52rem;
   position: absolute;
-  top: 14.9333333333rem;
+  top: 16.1rem;
   left: 50%;
   transform: translateX(-50%);
-  width: 9.4666666667rem;
-  height: 0.9066666667rem;
-  font-family: "pingfang-bold";
-  font-size: 0.4rem;
-  font-weight: bold;
-  color: white;
-  display: flex;
-  align-items: center;
-  background: url("../images/previous-result-bg.png") no-repeat 0 0/100% 100%;
+  background: url(../images/previous_Round_Result.png) no-repeat;
+  background-size: 100% 100%;
   z-index: 9;
 }
-.wrap .previous-result span {
+.wrap .previous_Round_Result span {
+  color: #fff;
+  position: absolute;
   font-weight: bold;
   margin-left: 0.36rem;
   text-shadow: 1px 1px 0px #fc8321, -1px -1px 0px #fc8321, 1px 1px 0px #fc8321, -1px -1px 0px #fc8321, 1px 1px 0px #fc8321, -1px -1px 0px #fc8321;
+  font-size: 0.48rem;
+  left: 0rem;
+  bottom: 1.65rem;
+  background: url(../images/wljg.png) no-repeat;
+  background-size: 100% 100%;
+  width: 1.7066666667rem;
+  height: 0.5066666667rem;
+  position: absolute;
 }
-.wrap .previous-result .result-list {
+.wrap .previous_Round_Result .box {
+  width: 9.4266666667rem;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  box-sizing: border-box;
+  padding: 0.2533333333rem 0.1333333333rem 0 0.1333333333rem;
+  overflow-x: scroll;
+}
+.wrap .previous_Round_Result .box::-webkit-scrollbar {
+  height: 2px;
+  display: none;
+}
+.wrap .previous_Round_Result .box ul {
+  width: 35rem;
+  height: 100%;
+}
+.wrap .previous_Round_Result .box ul li {
+  float: left;
+  width: 1.6266666667rem;
+  height: 0.9733333333rem;
+  background: url(../images/previous_Round_Result_Li.png) no-repeat;
+  background-size: 100% 100%;
   display: flex;
+  justify-content: space-around;
+  flex-wrap: wrap;
+  box-sizing: border-box;
+  align-items: center;
+  margin-right: 0.1066666667rem;
 }
-.wrap .previous-result .result-list p {
-  width: 0.5333333333rem;
-  height: 0.5333333333rem;
-  margin-left: 0.1066666667rem;
-  background: url("../images/little-bubble.png") 0 0/100% 100%;
+.wrap .previous_Round_Result .box ul li p {
+  display: block;
+  width: 0.3333333333rem;
+  height: 0.3333333333rem;
+  background: url(../images/record_bubble.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  margin: 0 0.0266666667rem;
 }
-.wrap .previous-result .result-list p img {
-  width: 100%;
-}
-.wrap .previous-result .more-result {
-  width: 0.56rem;
-  height: 0.5866666667rem;
-  margin-left: 0.2rem;
-}
-.wrap .previous-result .more-result img {
-  width: 100%;
+.wrap .previous_Round_Result .box ul li p img {
+  display: block;
+  width: 80%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
 }
 .wrap .mall {
   position: absolute;
@@ -301,16 +342,37 @@ body {
   background: url("../images/tip.png") no-repeat 0 0/100% 100%;
   text-align: center;
   font-size: 0.2933333333rem;
-  color: rgba(255, 240, 199, 0.6);
+  color: #FFF0C799;
   font-weight: bold;
 }
+.wrap .game-area .wait-time-s {
+  width: 10rem;
+  height: 9.0666666667rem;
+  position: absolute;
+  top: 1.5rem;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 5;
+}
+.wrap .game-area .wait-time-x {
+  width: 10rem;
+  height: 9.0666666667rem;
+  position: absolute;
+  top: 1.4rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
 .wrap .game-area .draw-time {
   display: none;
-  width: 2.8rem;
+  width: 55%;
   height: 2.84rem;
-  margin: 1.2rem auto 0.2rem;
-  background: url("../images/drawBg.png");
+  margin: 1.8rem auto 0.2rem;
   background-size: 100% 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-flow: row wrap;
+  box-sizing: border-box;
 }
 .wrap .game-area .draw-time .count-down,
 .wrap .game-area .draw-time .current-tip {
@@ -341,7 +403,7 @@ body {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
-  bottom: 3.1rem;
+  bottom: 2.3rem;
   width: 100%;
   height: 4rem;
 }
@@ -391,13 +453,18 @@ body {
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no1 .nick {
   width: 100%;
+  height: 1rem;
+  line-height: 0.6rem;
   font-size: 0.2933333333rem;
   color: #fff;
   text-align: center;
   position: absolute;
-  top: 1.1733333333rem;
+  top: 1.1333333333rem;
   left: 50%;
   transform: translateX(-50%);
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no1 .num {
   width: 100%;
@@ -443,13 +510,18 @@ body {
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no2 .nick {
   width: 100%;
+  height: 1rem;
+  line-height: 0.6rem;
   font-size: 0.2933333333rem;
   color: #fff;
   text-align: center;
   position: absolute;
-  top: 1.0133333333rem;
+  top: 0.9333333333rem;
   left: 50%;
   transform: translateX(-50%);
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no2 .num {
   width: 100%;
@@ -496,13 +568,18 @@ body {
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no3 .nick {
   width: 100%;
+  height: 1rem;
+  line-height: 0.6rem;
   font-size: 0.2933333333rem;
   color: #fff;
   text-align: center;
   position: absolute;
-  top: 1.0133333333rem;
+  top: 0.9333333333rem;
   left: 50%;
   transform: translateX(-50%);
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 .wrap .game-area .draw-time .top-three .top-three-list .no3 .num {
   width: 100%;
@@ -521,15 +598,20 @@ body {
   color: #fff;
 }
 .wrap .game-area .draw-time .draw-pic {
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  top: 1.65rem;
   z-index: 1;
-  width: 1.3333333333rem;
+  width: 1.3466666667rem;
+  height: 1.3466666667rem;
+  margin: 0 auto 0;
+  background: url("../images/drawBg.png") no-repeat;
+  background-size: 100% 100%;
+  position: relative;
 }
 .wrap .game-area .draw-time .draw-pic img {
-  width: 100%;
+  width: 0.8rem;
+  position: absolute;
+  left: 50%;
+  top: 45%;
+  transform: translate(-50%, -50%);
 }
 .wrap .game-area .draw-time .award-info {
   width: 8rem;
@@ -537,7 +619,7 @@ body {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
-  top: 6.5rem;
+  top: 7.2rem;
   display: flex;
 }
 .wrap .game-area .draw-time .award-info .desc {
@@ -563,7 +645,7 @@ body {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
-  top: 3.8rem;
+  top: 4.5rem;
   display: flex;
 }
 .wrap .game-area .draw-time .put-wrap .put {
@@ -743,36 +825,38 @@ body {
   width: 8.8rem;
   height: 13.0666666667rem;
   background: white;
+  background: url(../images/myBoxBg.png) no-repeat;
+  background-size: 100% 100%;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top {
   height: 4.5333333333rem;
-  background-image: linear-gradient(#F49C35, #FFDD81);
   overflow: hidden;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .tab-wrap {
   font-family: "pingfang-regular";
-  width: 6.1333333333rem;
+  width: 5.8666666667rem;
   height: 0.9333333333rem;
   background-color: rgba(255, 255, 255, 0.3);
   border-radius: 0.48rem;
   margin: 0.2666666667rem auto 0.08rem;
+  display: flex;
+  overflow: hidden;
+  padding: 0.0666666667rem;
+  box-sizing: border-box;
+  justify-content: space-between;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .tab-wrap span {
   display: inline-block;
-  width: 2.8rem;
+  width: 50%;
   height: 0.8rem;
   line-height: 0.8rem;
   text-align: center;
   font-size: 0.4rem;
   color: white;
-  margin-top: 0.0666666667rem;
-}
-.wrap .shade-mask-rank .shade-content-rank .rank-top .tab-wrap span:first-child {
-  margin-left: 0.1866666667rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .tab-wrap .active {
   background-color: white;
-  color: #F5A03A;
+  color: #F56801;
   border-radius: 0.4rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap {
@@ -794,8 +878,8 @@ body {
   display: none;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar {
-  width: 1.76rem;
-  height: 2.3333333333rem;
+  width: 2.5866666667rem;
+  height: 2.5066666667rem;
   margin-bottom: 0.2666666667rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar p {
@@ -808,8 +892,9 @@ body {
 .wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar img {
   position: relative;
   z-index: 9;
-  top: -1.8133333333rem;
-  left: 0.0266666667rem;
+  top: -2.1333333333rem;
+  left: 50%;
+  transform: translateX(-50%);
   width: 1.7066666667rem;
   height: 1.7066666667rem;
   border-radius: 50%;
@@ -827,29 +912,30 @@ body {
   margin: 0;
   margin-top: -0.2666666667rem;
   margin-bottom: 0.0533333333rem;
-  color: #ED7B50;
+  color: #fff;
   font-size: 0.32rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .other-rank {
   overflow: auto;
   position: absolute;
   width: 100%;
-  height: 7.2rem;
-  background-color: white;
+  height: 7rem;
   padding: 0.4rem 0.2666666667rem 0;
   box-sizing: border-box;
+  margin-top: 0.25rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .other-rank li {
+  width: 90%;
   display: flex;
   align-items: center;
-  margin-bottom: 0.5333333333rem;
+  margin: 0 auto 0.5333333333rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .other-rank li .index {
   display: inline-block;
   width: 0.4rem;
   font-size: 0.4rem;
   font-weight: bold;
-  color: #333333;
+  color: #333;
   text-align: center;
 }
 .wrap .shade-mask-rank .shade-content-rank .other-rank li .others-info {
@@ -872,7 +958,11 @@ body {
 .wrap .shade-mask-rank .shade-content-rank .other-rank li .others-diamond-num {
   font-size: 0.3466666667rem;
   font-weight: bold;
-  color: #ED7B50;
+  color: #FF7700;
+}
+.wrap .shade-mask-rank .shade-content-rank .other-rank li .others-diamond-num b {
+  color: #FF5110;
+  font-weight: bold;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine {
   position: fixed;
@@ -881,8 +971,9 @@ body {
   z-index: 999;
   width: 100%;
   height: 1.3333333333rem;
-  background-color: rgba(0, 0, 0, 0.8);
-  padding: 0 0.2rem;
+  background: url(../images/mineBg.png) no-repeat;
+  background-size: 100% 100%;
+  padding: 0 0.7rem 0 0.2rem;
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -891,11 +982,13 @@ body {
   font-size: 0.3466666667rem;
   font-weight: bold;
   color: white;
+  white-space: nowrap;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-info {
   flex: 1;
   display: flex;
   align-items: center;
+  white-space: nowrap;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-info img {
   width: 1.0666666667rem;
@@ -908,11 +1001,20 @@ body {
   font-size: 0.3733333333rem;
   font-weight: bold;
   color: white;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  width: 3.5rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-diamond-num {
   font-size: 0.3466666667rem;
   font-weight: bold;
-  color: #ED7B50;
+  color: #fff;
+  white-space: nowrap;
+}
+.wrap .shade-mask-rank .shade-content-rank .mine .mine-diamond-num b {
+  color: #fff;
+  font-weight: bold;
 }
 .wrap .shade-mask-fragmentNum {
   display: none;

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

@@ -1,9 +1,10 @@
 @function px2rem($px, $rem: 75) {
     @return $px / $rem+rem;
 }
-@function prefixurl() {
-    @return 'https://img.pekolive.com/'
-}
+
+// @function prefixurl() {
+//     @return 'https://img.pekolive.com/'
+// }
 
 @font-face {
     font-family: 'pingfang-bold';
@@ -24,9 +25,10 @@
 html,
 body {
     font-family: 'din-medium';
-    background: #C8864C;
+    background: #531800;
     // 海浪svga过长
     overflow-x: hidden;
+    // height: 19rem;
 }
 
 .wrap {
@@ -37,7 +39,15 @@ body {
 
     .banner {
         width: 100%;
+        position: relative;
 
+        .subtitle {
+            position: absolute;
+            top: px2rem(9, );
+            right: px2rem(84, );
+            width: px2rem(140, );
+            height: px2rem(84, );
+        }
     }
 
     .rule,
@@ -60,24 +70,21 @@ body {
         // bottom: px2rem(1040);
     }
 
-    .previous-result {
+    // 往轮结果
+    .previous_Round_Result {
+        width: px2rem(707, );
+        height: px2rem(114, );
         position: absolute;
-        // bottom: px2rem(200);
-        top: px2rem(1120);
+        top: 16.1rem;
         left: 50%;
         transform: translateX(-50%);
-        width: px2rem(710);
-        height: px2rem(68);
-        font-family: 'pingfang-bold';
-        font-size: px2rem(30);
-        font-weight: bold;
-        color: white;
-        display: flex;
-        align-items: center;
-        background: url('../images/previous-result-bg.png') no-repeat 0 0/100% 100%;
+        background: url(../images/previous_Round_Result.png) no-repeat;
+        background-size: 100% 100%;
         z-index: 9;
 
         span {
+            color: #fff;
+            position: absolute;
             font-weight: bold;
             margin-left: px2rem(27);
             text-shadow: 1px 1px 0px#fc8321,
@@ -86,41 +93,134 @@ body {
                 -1px -1px 0px#fc8321,
                 1px 1px 0px#fc8321,
                 -1px -1px 0px#fc8321;
+            font-size: px2rem(36, );
+            left: px2rem(0, );
+            bottom: 1.65rem;
+            background: url(../images/wljg.png) no-repeat;
+            background-size: 100% 100%;
+            width: px2rem(128, );
+            height: px2rem(38, );
+            position: absolute;
         }
 
-        .result-list {
-            display: flex;
+        .box {
+            width: px2rem(707, );
+            height: 100%;
+            position: absolute;
+            left: 0;
+            top: 0;
+            box-sizing: border-box;
+            padding: px2rem(19, ) px2rem(10, ) 0 px2rem(10, );
+            overflow-x: scroll;
 
-            p {
-                width: px2rem(40);
-                height: px2rem(40);
-                margin-left: px2rem(8);
-                background: url('../images/little-bubble.png') 0 0/100% 100%;
-
-                // &:nth-child(11){
-                //     width: px2rem(40, );
-                //     height: px2rem(42, );
-                //     margin-left: 0.25rem;
-                //     background: url('../images/btn_result.png') 0 0/100% 100%;
-                // }
-                img {
-                    width: 100%;
-                }
+            &::-webkit-scrollbar {
+                // width: 0;
+                height: 2px;
+                display: none;
             }
 
-        }
+            ul {
+                width: 35rem;
+                height: 100%;
 
-        .more-result {
-            width: px2rem(42);
-            height: px2rem(44);
-            margin-left: 0.2rem;
+                li {
+                    float: left;
+                    width: px2rem(122, );
+                    height: px2rem(73, );
+                    background: url(../images/previous_Round_Result_Li.png) no-repeat;
+                    background-size: 100% 100%;
+                    display: flex;
+                    justify-content: space-around;
+                    flex-wrap: wrap;
+                    box-sizing: border-box;
+                    align-items: center;
+                    margin-right: px2rem(8, );
+                    // padding: 0 px2rem(4, );
 
-            img {
-                width: 100%;
+                    p {
+                        display: block;
+                        width: px2rem(25, );
+                        height: px2rem(25, );
+                        background: url(../images/record_bubble.png) no-repeat;
+                        background-size: 100% 100%;
+                        position: relative;
+                        margin: 0 px2rem(2, );
+
+                        img {
+                            display: block;
+                            width: 80%;
+                            position: absolute;
+                            left: 50%;
+                            top: 50%;
+                            transform: translate(-50%, -50%);
+                        }
+                    }
+                }
             }
         }
     }
 
+    // .previous-result {
+    //     position: absolute;
+    //     // bottom: px2rem(200);
+    //     top: px2rem(1120);
+    //     left: 50%;
+    //     transform: translateX(-50%);
+    //     width: px2rem(710);
+    //     height: px2rem(68);
+    //     font-family: 'pingfang-bold';
+    //     font-size: px2rem(30);
+    //     font-weight: bold;
+    //     color: white;
+    //     display: flex;
+    //     align-items: center;
+    //     background: url('../images/previous-result-bg.png') no-repeat 0 0/100% 100%;
+    //     z-index: 9;
+
+    //     span {
+    //         font-weight: bold;
+    //         margin-left: px2rem(27);
+    //         text-shadow: 1px 1px 0px#fc8321,
+    //             -1px -1px 0px#fc8321,
+    //             1px 1px 0px#fc8321,
+    //             -1px -1px 0px#fc8321,
+    //             1px 1px 0px#fc8321,
+    //             -1px -1px 0px#fc8321;
+    //     }
+
+    //     .result-list {
+    //         display: flex;
+
+    //         p {
+    //             width: px2rem(40);
+    //             height: px2rem(40);
+    //             margin-left: px2rem(8);
+    //             background: url('../images/little-bubble.png') 0 0/100% 100%;
+
+    //             // &:nth-child(11){
+    //             //     width: px2rem(40, );
+    //             //     height: px2rem(42, );
+    //             //     margin-left: 0.25rem;
+    //             //     background: url('../images/btn_result.png') 0 0/100% 100%;
+    //             // }
+    //             img {
+    //                 width: 100%;
+    //             }
+    //         }
+
+    //     }
+
+    //     .more-result {
+    //         width: px2rem(42);
+    //         height: px2rem(44);
+    //         margin-left: 0.2rem;
+
+    //         img {
+    //             width: 100%;
+    //         }
+    //     }
+    // }
+
     .mall {
         position: absolute;
         top: px2rem(184);
@@ -394,16 +494,43 @@ body {
 
         }
 
+        // 动画上
+        .wait-time-s {
+            width: px2rem(750, );
+            height: px2rem(680, );
+            position: absolute;
+            top: 1.5rem;
+            left: 50%;
+            transform: translateX(-50%);
+            z-index: 5;
+        }
+
+        // 动画下
+        .wait-time-x {
+            width: px2rem(750, );
+            height: px2rem(680, );
+            position: absolute;
+            top: 1.4rem;
+            left: 50%;
+            transform: translateX(-50%);
+        }
+
         // 开奖时间
         .draw-time {
             display: none;
             // width: px2rem(750);
             // height: px2rem(600);
-            width: px2rem(210, );
+            // width: px2rem(210, );
+            width: 55%;
             height: px2rem(213, );
-            margin: 1.2rem auto 0.2rem;
-            background: url('../images/drawBg.png');
+            margin: 1.8rem auto 0.2rem;
+            // background: url('../images/drawBg.png');
             background-size: 100% 100%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            flex-flow: row wrap;
+            box-sizing: border-box;
 
             .count-down,
             .current-tip {
@@ -436,7 +563,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                bottom: 3.1rem;
+                bottom: 2.3rem;
                 width: 100%;
                 height: 4rem;
 
@@ -495,13 +622,18 @@ body {
 
                         .nick {
                             width: 100%;
+                            height: 1rem;
+                            line-height: 0.6rem;
                             font-size: px2rem(22, );
                             color: #fff;
                             text-align: center;
                             position: absolute;
-                            top: px2rem(88, );
+                            top: px2rem(85, );
                             left: 50%;
                             transform: translateX(-50%);
+                            overflow: hidden;
+                            white-space: nowrap;
+                            text-overflow: ellipsis; //溢出显示省略号
                         }
 
                         .num {
@@ -558,13 +690,18 @@ body {
 
                         .nick {
                             width: 100%;
+                            height: 1rem;
+                            line-height: 0.6rem;
                             font-size: px2rem(22, );
                             color: #fff;
                             text-align: center;
                             position: absolute;
-                            top: px2rem(76, );
+                            top: px2rem(70, );
                             left: 50%;
                             transform: translateX(-50%);
+                            overflow: hidden;
+                            white-space: nowrap;
+                            text-overflow: ellipsis; //溢出显示省略号
                         }
 
                         .num {
@@ -619,13 +756,18 @@ body {
 
                         .nick {
                             width: 100%;
+                            height: 1rem;
+                            line-height: 0.6rem;
                             font-size: px2rem(22, );
                             color: #fff;
                             text-align: center;
                             position: absolute;
-                            top: px2rem(76, );
+                            top: px2rem(70, );
                             left: 50%;
                             transform: translateX(-50%);
+                            overflow: hidden;
+                            white-space: nowrap;
+                            text-overflow: ellipsis; //溢出显示省略号
                         }
 
                         .num {
@@ -651,21 +793,42 @@ body {
             }
 
             .draw-pic {
-                position: absolute;
-                left: 50%;
-                transform: translateX(-50%);
-                top: 1.65rem;
                 z-index: 1;
-                width: px2rem(100);
-                // height: px2rem(91);
+                width: px2rem(101, );
+                // width: 25%; 
+                height: px2rem(101, );
+                margin: 0 auto 0;
+                background: url('../images/drawBg.png') no-repeat;
+                background-size: 100% 100%;
+                position: relative;
 
                 img {
-                    width: 100%;
-                    // height: 100%;
+                    width: px2rem(60, );
                     // margin: -0.3rem 0 0 1.18rem;
+                    position: absolute;
+                    left: 50%;
+                    top: 45%;
+                    transform: translate(-50%, -50%);
                 }
             }
 
+            // .draw-pic {
+            //     position: absolute;
+            //     left: 50%;
+            //     transform: translateX(-50%);
+            //     top: 1.65rem;
+            //     z-index: 1;
+            //     width: px2rem(100);
+            //     background: url('../images/drawBg.png');
+            //     // height: px2rem(91);
+
+            //     img {
+            //         width: 100%;
+            //         // height: 100%;
+            //         // margin: -0.3rem 0 0 1.18rem;
+            //     }
+            // }
+
             .award-info {
                 width: px2rem(600, );
                 // height: px2rem(183, );
@@ -673,7 +836,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                top: 6.5rem;
+                top: 7.2rem;
                 display: flex;
 
                 .desc {
@@ -707,7 +870,8 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                top: 3.8rem;
+                // top: 3.8rem;
+                top: 4.5rem;
                 display: flex;
 
                 .put {
@@ -924,38 +1088,45 @@ body {
             width: px2rem(660);
             height: px2rem(980);
             background: white;
+            background: url(../images/myBoxBg.png) no-repeat;
+            background-size: 100% 100%;
 
             .rank-top {
                 height: px2rem(340);
-                background-image: linear-gradient(#F49C35, #FFDD81);
+                // background-image: linear-gradient(#F49C35, #FFDD81);
                 overflow: hidden;
 
                 .tab-wrap {
                     font-family: 'pingfang-regular';
-                    width: px2rem(460);
+                    width: px2rem(440);
                     height: px2rem(70);
                     background-color: rgba($color: #fff, $alpha: .3);
                     border-radius: px2rem(36);
                     margin: px2rem(20) auto px2rem(6);
+                    display: flex;
+                    overflow: hidden;
+                    padding: px2rem(5, );
+                    box-sizing: border-box;
+                    justify-content: space-between;
 
                     span {
                         display: inline-block;
-                        width: px2rem(210);
+                        // width: px2rem(210, );
+                        width: 50%;
                         height: px2rem(60);
                         line-height: px2rem(60);
                         text-align: center;
                         font-size: px2rem(30);
                         color: white;
-                        margin-top: px2rem(5);
 
-                        &:first-child {
-                            margin-left: px2rem(14);
-                        }
+                        // &:first-child {
+                        //     margin-left: px2rem(14);
+                        // }
                     }
 
                     .active {
                         background-color: white;
-                        color: #F5A03A;
+                        color: #F56801;
                         border-radius: px2rem(30);
                     }
                 }
@@ -983,8 +1154,8 @@ body {
                         }
 
                         .avatar {
-                            width: px2rem(132);
-                            height: px2rem(175);
+                            width: px2rem(194);
+                            height: px2rem(188);
                             margin-bottom: px2rem(20);
 
                             p {
@@ -998,8 +1169,10 @@ body {
                             img {
                                 position: relative;
                                 z-index: 9;
-                                top: px2rem(-136);
-                                left: px2rem(2);
+                                top: px2rem(-160);
+                                // left: px2rem(2);
+                                left: 50%;
+                                transform: translateX(-50%);
                                 width: px2rem(128);
                                 height: px2rem(128);
                                 border-radius: 50%;
@@ -1020,7 +1193,7 @@ body {
                             margin: 0;
                             margin-top: px2rem(-20);
                             margin-bottom: px2rem(4);
-                            color: #ED7B50;
+                            color: #fff;
                             font-size: px2rem(24);
                         }
                     }
@@ -1031,15 +1204,18 @@ body {
                 overflow: auto;
                 position: absolute;
                 width: 100%;
-                height: px2rem(540);
-                background-color: white;
+                height: 7rem;
+                // background-color: white;
                 padding: px2rem(30) px2rem(20) 0;
                 box-sizing: border-box;
+                margin-top: 0.25rem;
 
                 li {
+                    width: 90%;
                     display: flex;
                     align-items: center;
-                    margin-bottom: px2rem(40);
+                    // margin-bottom: px2rem(40);
+                    margin: 0 auto px2rem(40, );
 
                     &:last-child {
                         // margin-bottom: px2rem(140);
@@ -1050,7 +1226,7 @@ body {
                         width: px2rem(30);
                         font-size: px2rem(30);
                         font-weight: bold;
-                        color: #333333;
+                        color: #333;
                         text-align: center;
                     }
 
@@ -1077,7 +1253,12 @@ body {
                     .others-diamond-num {
                         font-size: px2rem(26);
                         font-weight: bold;
-                        color: #ED7B50;
+                        color: #FF7700;
+
+                        b {
+                            color: #FF5110;
+                            font-weight: bold;
+                        }
                     }
                 }
             }
@@ -1089,8 +1270,10 @@ body {
                 z-index: 999;
                 width: 100%;
                 height: px2rem(100);
-                background-color: rgba($color: #000000, $alpha: .8);
-                padding: 0 px2rem(15);
+                // background-color: rgba($color: #000000, $alpha: .8);
+                background: url(../images/mineBg.png) no-repeat;
+                background-size: 100% 100%;
+                padding: 0 0.7rem 0 0.2rem;
                 box-sizing: border-box;
                 display: flex;
                 align-items: center;
@@ -1099,12 +1282,14 @@ body {
                     font-size: px2rem(26);
                     font-weight: bold;
                     color: white;
+                    white-space:nowrap;
                 }
 
                 .mine-info {
                     flex: 1;
                     display: flex;
                     align-items: center;
+                    white-space:nowrap;
 
                     img {
                         width: px2rem(80);
@@ -1118,13 +1303,23 @@ body {
                         font-size: px2rem(28);
                         font-weight: bold;
                         color: white;
+                        overflow: hidden; //超出隐藏
+                        white-space: nowrap; //不折行
+                        text-overflow: ellipsis;
+                        width: 3.5rem;
                     }
                 }
 
                 .mine-diamond-num {
                     font-size: px2rem(26);
                     font-weight: bold;
-                    color: #ED7B50;
+                    color: #fff;
+                    white-space:nowrap;
+
+                    b {
+                        color: #fff;
+                        font-weight: bold;
+                    }
                 }
             }
         }

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

@@ -46,7 +46,7 @@ body {
 }
 .record-list li {
   width: 100%;
-  height: 6.9733333333rem;
+  height: 8.48rem;
   background: url("../images/record/record-bg.png") no-repeat;
   background-size: 100% 100%;
   border-radius: 0.2666666667rem;
@@ -88,6 +88,7 @@ body {
   margin: 0.0666666667rem auto 0.3333333333rem;
   display: flex;
   justify-content: space-between;
+  position: relative;
 }
 .record-list li .result-wrap .result {
   display: flex;
@@ -98,21 +99,21 @@ body {
   color: #FFFFFF;
   padding-right: 0.1866666667rem;
   font-weight: 600;
-}
-.record-list li .result-wrap .result .bg {
-  width: 1.2133333333rem;
-  height: 1.2133333333rem;
-  background: url("../images/record_bubble_act.png") no-repeat;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 1.9066666667rem;
+  height: 0.6rem;
+  background: url(../images/record/result.png) no-repeat;
   background-size: 100% 100%;
-  text-align: center;
-}
-.record-list li .result-wrap .result .bg img {
-  width: 75%;
-  margin-top: 0.15rem;
+  top: 0.2rem;
 }
 .record-list li .result-wrap .award {
   display: flex;
   align-items: center;
+  position: absolute;
+  right: 0rem;
+  top: -0.1rem;
 }
 .record-list li .result-wrap .award p,
 .record-list li .result-wrap .award b {
@@ -124,25 +125,57 @@ body {
   width: 0.3733333333rem;
   height: 0.3733333333rem;
 }
+.record-list li .result-wrap .result_sBox {
+  width: 8.8rem;
+  height: 1.1466666667rem;
+  margin: 1rem auto 0;
+  display: flex;
+  justify-content: center;
+  position: relative;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.record-list li .result-wrap .result_sBox .bg {
+  width: 1.1466666667rem;
+  height: 1.1466666667rem;
+  background: url("../images/record_bubble_act.png") no-repeat;
+  background-size: 100% 100%;
+  text-align: center;
+}
+.record-list li .result-wrap .result_sBox .bg img {
+  width: 75%;
+  display: block;
+  margin: 0.1333333333rem auto 0;
+}
 .record-list li .put-wrap {
   width: 84%;
   height: 1.2133333333rem;
   line-height: 1.2133333333rem;
   box-sizing: border-box;
-  margin: 0 auto;
+  margin: 2rem auto 0;
   display: flex;
+  position: relative;
 }
 .record-list li .put-wrap .put {
   font-size: 0.3733333333rem;
   color: #FFFFFF;
   font-weight: 600;
   margin-right: 0.9rem;
+  position: absolute;
+  width: 1.0266666667rem;
+  height: 0.6rem;
+  left: 50%;
+  transform: translateX(-50%);
+  background: url(../images/record/touru.png) no-repeat;
+  background-size: 100% 100%;
+  top: -0.6rem;
 }
 .record-list li .put-wrap .list {
   width: 6.72rem;
   height: 2.7733333333rem;
   display: flex;
   flex-wrap: wrap;
+  margin: 0.3rem auto 0;
 }
 .record-list li .put-wrap .list .item {
   width: 0.9866666667rem;
@@ -176,7 +209,8 @@ body {
 }
 .record-list li .put-wrap .list .item div .diamond {
   width: 0.3333333333rem;
-  height: 0.2666666667rem;
+  height: 0.3333333333rem;
+  margin-top: -0.01rem;
 }
 .record-list li .put-wrap .list .item div .in {
   font-size: 0.2666666667rem;

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

@@ -1,9 +1,10 @@
 @function px2rem($px, $rem: 75) {
     @return $px / $rem+rem;
 }
-@function prefixurl() {
-    @return 'https://img.pekolive.com/'
-}
+
+// @function prefixurl() {
+//     @return 'https://img.pekolive.com/'
+// }
 
 @font-face {
     font-family: 'pingfang-bold';
@@ -63,7 +64,7 @@ body {
 
     li {
         width: 100%;
-        height: px2rem(523, );
+        height: px2rem(636, );
         // background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
         background: url('../images/record/record-bg.png') no-repeat;
         background-size: 100% 100%;
@@ -117,6 +118,7 @@ body {
             margin: px2rem(5, ) auto px2rem(25, );
             display: flex;
             justify-content: space-between;
+            position: relative;
 
             .result {
                 display: flex;
@@ -127,26 +129,39 @@ body {
                     color: #FFFFFF;
                     padding-right: px2rem(14, );
                     font-weight: 600;
-                }
-
-                .bg {
-                    width: px2rem(91, );
-                    height: px2rem(91, );
-                    background: url('../images/record_bubble_act.png') no-repeat;
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    width: px2rem(143, );
+                    height: px2rem(45, );
+                    background: url(../images/record/result.png) no-repeat;
                     background-size: 100% 100%;
-                    text-align: center;
-
-                    img {
-                        width: 75%;
-                        margin-top: 0.15rem;
-                    }
+                    top: 0.2rem;
                 }
 
+                // .bg {
+                //     width: px2rem(91, );
+                //     height: px2rem(91, );
+                //     background: url('../images/record_bubble_act.png') no-repeat;
+                //     background-size: 100% 100%;
+                //     text-align: center;
+
+                //     img {
+                //         width: 75%;
+                //         margin-top: 0.15rem;
+                //     }
+                // }
+
             }
 
             .award {
                 display: flex;
                 align-items: center;
+                position: absolute;
+                // right: 0.8rem;
+                // top: 1.8rem;
+                right: 0rem;
+                top: -0.1rem;
 
                 p,
                 b {
@@ -160,6 +175,31 @@ body {
                     height: px2rem(28, );
                 }
             }
+
+            .result_sBox {
+                width: px2rem(660, );
+                height: px2rem(86, );
+                margin: 1rem auto 0;
+                display: flex;
+                justify-content: center;
+                position: relative;
+                left: 50%;
+                transform: translateX(-50%);
+
+                .bg {
+                    width: px2rem(86, );
+                    height: px2rem(86, );
+                    background: url('../images/record_bubble_act.png') no-repeat;
+                    background-size: 100% 100%;
+                    text-align: center;
+
+                    img {
+                        width: 75%;
+                        display: block;
+                        margin: px2rem(10, ) auto 0;
+                    }
+                }
+            }
         }
 
         .put-wrap {
@@ -167,14 +207,23 @@ body {
             height: px2rem(91, );
             line-height: px2rem(91, );
             box-sizing: border-box;
-            margin: 0 auto;
+            margin: 2rem auto 0;
             display: flex;
+            position: relative;
 
             .put {
                 font-size: px2rem(28, );
                 color: #FFFFFF;
                 font-weight: 600;
                 margin-right: 0.9rem;
+                position: absolute;
+                width: px2rem(77, );
+                height: px2rem(45, );
+                left: 50%;
+                transform: translateX(-50%);
+                background: url(../images/record/touru.png) no-repeat;
+                background-size: 100% 100%;
+                top: -0.6rem;
             }
 
             .list {
@@ -182,6 +231,7 @@ body {
                 height: px2rem(208, );
                 display: flex;
                 flex-wrap: wrap;
+                margin: 0.3rem auto 0;
 
                 .item {
                     width: px2rem(74, );
@@ -219,7 +269,8 @@ body {
 
                         .diamond {
                             width: px2rem(25, );
-                            height: px2rem(20, );
+                            height: px2rem(25, );
+                            margin-top: -0.01rem;
                         }
 
                         .in {

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

@@ -14,7 +14,10 @@
 <body>
     <div class="wrap no-in-app">
         <!-- <div class="wrap "> -->
-        <div class="banner"><img src="./images/banner.png" alt=""></div>
+        <div class="banner">
+            <img src="./images/banner.png" alt="">
+            <img class="subtitle" src="./images/subtitle.png" alt="">
+        </div>
         <div class="rule"><img src="./images/rule.png" alt=""></div>
         <div class="record"><img src="./images/record.png" alt=""></div>
 
@@ -33,7 +36,7 @@
             <div class="recharge"><img src="./images/mall/recharge.png" alt=""></div>
         </div>
         <!-- 游戏区域 -->
-        <div class="game-area">
+        <div class="game-area" style="display: none;">
             <!-- 本轮轮次 -->
             <div class="roundId"></div>
             <!-- 选择时间 -->
@@ -63,9 +66,9 @@
                 <div class="count-down">下一轮：<span class="count-down-num"></span>秒</div>
                 <div class="current-tip">本轮结果：<span class="current-result"></span></div>
                 <!-- 中奖物品展示 -->
-                <div class="draw-pic">
-                    <img src="" alt="">
-                </div>
+                <!-- <div class="draw-pic">
+                    <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                </div> -->
                 <!-- 投入列表 -->
                 <div class="put-wrap">
                     <div class="put">投入</div>
@@ -99,7 +102,7 @@
                             <div class="nick">虚位以待</div>
                             <div class="num">
                                 <img src="./images/diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <span>0</span>
                             </div>
                         </div>
                         <div class="no no2">
@@ -108,7 +111,7 @@
                             <div class="nick">虚位以待</div>
                             <div class="num">
                                 <img src="./images/diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <span>0</span>
                             </div>
                         </div>
                         <div class="no no3">
@@ -117,17 +120,28 @@
                             <div class="nick">虚位以待</div>
                             <div class="num">
                                 <img src="./images/diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <span>0</span>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
+            <!-- 动画上 -->
+            <div class="wait-time-s"></div>
+            <!-- 动画下 -->
+            <div class="wait-time-x"></div>
         </div>
 
         <!-- 往轮结果 -->
-        <div class="previous-result">
-            <span>往轮结果</span>
+        <div class="previous_Round_Result">
+            <span></span>
+            <div class="box">
+                <ul>
+                </ul>
+            </div>
+        </div>
+        <!-- <div class="previous-result">
+            <span>往輪結果</span>
             <div class="result-list">
                 <p><img src="" alt=""></p>
                 <p><img src="" alt=""></p>
@@ -139,10 +153,10 @@
                 <p><img src="" alt=""></p>
                 <p><img src="" alt=""></p>
                 <p><img src="" alt=""></p>
-                <!-- <p><img src="" alt=""></p> -->
+                <p><img src="" alt=""></p>
             </div>
             <span class="more-result"><img src="./images/btn_result.png" alt=""></span>
-        </div>
+        </div> -->
 
         <!-- 个人信息 -->
         <div class="info-bottom">
@@ -160,29 +174,29 @@
             <div class="shade-content">
                 <main>
                     <div class="cyfs">
-                        <p class="title">参与方式</p>
+                        <p class="title">參與方式</p>
                         用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒
                         <p class="jietu"><img src="./images/t1.png" alt=""></p>
                     </div>
                     <div class="lwff">
-                        <p class="title">礼物发放</p>
-                        每次參與遊戲後會獲得一次禮物開獎機會
+                        <p class="title">禮物發放</p>
+                        每次參與遊戲後會獲得一次禮物開獎;
                         <p class="jietu t2"><img src="./images/t2.png" alt=""></p>
-                        每次隨機從8種食材中選取一個作為中獎物品，中獎後獲得【中獎物品購買碎片數*中獎物品對應倍數*100】的鉆石獎勵，鉆石將直接發放到錢包
+                        每次隨機從8種食材中選取一個或多個作為中獎食材，中獎後獲得（中獎物品所花費的鉆石數*中獎食材對應倍數）的鉆石獎勵，當中獎多個食材時，獲得的鉆石會同時發放。鉆石將直接發放到賬戶中。
                         <p class="jietu t3"><img src="./images/t3.png" alt=""></p>
-                        例如購買1個5倍的番茄，中獎後獲得1*5*100的鉆石
+                        例如購買1個5倍番茄花費100鉆，購買1個蘿蔔花費100鉆，中獎後將獲得100*5+100*5=1000鉆。
                     </div>
                     <div class="qtsm">
                         <p class="title">其他說明</p>
-                        如果以上說明未能解答您的疑問，請聯系客服，會有專人解答疑難
-                        <p>本活动与苹果公司无关</p>
+                        如果以上說明未能解答您的疑問，請聯繫客服，會有專人解答疑難
+                        <p>本活動與蘋果公司無關</p>
                     </div>
                 </main>
             </div>
         </div>
 
         <!-- 今日排名弹窗 -->
-        <div class="shade-mask-rank">
+        <div class="shade-mask-rank" >
             <div class="shade-content-rank">
                 <div class="rank-top">
 
@@ -226,8 +240,8 @@
     </div>
     <script src="../../common/js/flexible.js"></script>
     <script src="../../common/js/jquery-3.2.1.min.js"></script>
-    <script src="./js/jquery-animate-css-rotate-scale.js"></script>
     <script src="../../common/js/common2.js"></script>
+    <script src="./js/jquery-animate-css-rotate-scale.js"></script>
     <script src="../../common/js/layer.js"></script>
     <script src="../../common/js/vconsole.min.js"></script>
     <script src="../../common/js/svga.min.js"></script>

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

@@ -17,7 +17,8 @@ const showLoading = (content = '加載中...') => {
         shadeClose: false,
         content,
         success (e) {
-            layerIndex = $(e).attr('index')
+            layerIndex = $(e).attr('index');
+            $('.layui-m-layer').css("z-index", '9999');
         }
     })
 }
@@ -31,14 +32,19 @@ const toastMsg = (content = '操作完成', time = 2) => {
         skin: 'msg'
     })
 }
-
 if (false) { //!browser.app
     toastMsg('請在app內打開！');
 } else {
     $('.wrap').removeClass('no-in-app')
 }
-
-
+console.log(document.body.clientWidth);
+console.log(document.body.clientHeight);
+if (document.body.clientHeight <= 700) {
+    $('body,html').css({ "height": '19.2rem' });
+}
+if (document.body.clientWidth >= 365) {
+    $('body,html').css({ "height": '19.2rem' });
+}
 // 獲取用戶相關信息
 let myFragment
 const getUserInfo = (param) => {
@@ -135,10 +141,10 @@ const getNewestAct = () => {
                     } else {
                         clearTimeout(timer2)
                         hideLoading(layerIndex)
-
                         roundId = res.data.roundId
                         $('.game-area .roundId').html(roundId)
                         getListItem(roundId, modelType)
+                        getPreviousResults(20, roundId)
 
                         // 進行下一輪時，arrTime重新置為空數組，不然在下一輪開始的時候也會執行location.reload()
                         if (roundIdArr.length < 2) {
@@ -161,7 +167,7 @@ const getNewestAct = () => {
                         showResultStageStartTime = res.data.showResultStageStartTime
                         endTime = res.data.endTime
                         console.log('獲取5個時間戳的值-----', 'timestamp:', userComeinTime, 'startTime:', startTime, 'drawStageStartTime:', drawStageStartTime, 'showResultStageStartTime:', showResultStageStartTime, 'endTime:', endTime);
-                        showView()
+                        showView(res.data.drawItemList)
                     }
                 }
             } else {
@@ -195,7 +201,7 @@ let mySelect
 let fragmentNum
 let reg = /^[0-9]*$/
 
-const showView = () => {
+const showView = (drawItemList) => {
     if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) {
         // 第一階段
         console.log('進入第一階段');
@@ -217,11 +223,8 @@ const showView = () => {
 
         $('.award-wrap').html('').show()
         // $('.award-info .desc').html('')
-
-        getPreviousResults(10, roundId)
         showCountDown(userComeinTime, startTime, drawStageStartTime)
         getUserInfo()
-
     } else if (drawStageStartTime <= userComeinTime && userComeinTime < showResultStageStartTime) {
         // 第二階段
         console.log('進入第二階段');
@@ -239,16 +242,13 @@ const showView = () => {
         console.log('isStatus2的值------------', isStatus2);
 
         // $('.btn-wrap').find('div').removeClass('active')
-
-        getPreviousResults(10, roundId)
         showCountDown(userComeinTime, drawStageStartTime, showResultStageStartTime)
         judgeStatus()
         getUserInfo()
-
         // 播放5s動畫
         let player = new SVGA.Player('.wait-time');
         let parser = new SVGA.Parser('.wait-time');
-        parser.load('./images/wait.svga', function (videoItem) {
+        parser.load('./images/wait1.svga', function (videoItem) {
             // player.loops = 2;
             player.clearsAfterStop = false;
             player.setVideoItem(videoItem);
@@ -268,8 +268,33 @@ const showView = () => {
         showCountDown(userComeinTime, showResultStageStartTime, endTime)
         judgeStatus()
         getUserInfo()
-        // getPreviousResults(10, roundId)
+        // 动画上
+        let player = new SVGA.Player('.wait-time-s');
+        let parser = new SVGA.Parser('.wait-time-s');
+        parser.load('./images/s.svga', function (videoItem) {
+            // player.loops = 2;
+            player.clearsAfterStop = false;
+            player.setVideoItem(videoItem);
+            player.startAnimation();
+        })
+        // 动画下
+        let player2 = new SVGA.Player('.wait-time-x');
+        let parser2 = new SVGA.Parser('.wait-time-x');
+        parser2.load('./images/x.svga', function (videoItem) {
+            // player.loops = 2;
+            player2.clearsAfterStop = false;
+            player2.setVideoItem(videoItem);
+            player2.startAnimation();
+        })
+        if (drawItemList.length > 1) {
+            $('.wait-time-s').show();
+            $('.wait-time-x').show();
+        } else {
+            $('.wait-time-s').hide();
+            $('.wait-time-x').hide();
+        }
     }
+    $('.game-area').show();
 }
 
 // 顯示倒計時
@@ -401,7 +426,7 @@ const judgeStatus = () => {
                     drawInfo = res.data
                     img = res.data.drawImageUrl
                     if (isStatus3) {
-                        getPreviousResults(10, roundId)
+                        getPreviousResults(20, roundId)
                     }
                     renderDrawInfo()
                 } else {
@@ -425,8 +450,40 @@ const judgeStatus = () => {
 let topThreeArr = []
 const renderDrawInfo = () => {
     $('.draw-time .current-tip .current-result').html(drawInfo.drawName)
-    $('.draw-pic img').attr('src', drawInfo.drawImageUrl)
-
+    // $('.draw-pic img').attr('src', drawInfo.drawImageUrl)
+    $('.wrap .game-area .draw-time .draw-pic').remove();
+    var lenght = drawInfo.drawItemList.length;
+    var drawStr = '';
+    drawInfo.drawItemList.forEach(res => {
+        drawStr += `
+        <div class="draw-pic">
+            <img src="${res.drawImageUrl}" alt="">
+        </div>
+        `
+    })
+    $('.wrap .game-area .draw-time').append(drawStr);
+    if (lenght == 1) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "50%", "height": "100%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "45%" });
+    } else if (lenght == 2) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "50%", "height": "100%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "45%" });
+    } else if (lenght == 3) {
+        $('.wrap .game-area .draw-time').css({ "width": "70%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "33.3333%", "height": "75%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "40%" });
+    } else if (lenght == 4) {
+        $('.wrap .game-area .draw-time').css({ "width": "80%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "25%", "height": "65%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "38%" });
+    } else if (lenght > 4) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "1.3466666667rem", "height": "1.3466666667rem", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "0.8rem" });
+    }
+    // if()
     // if (isStatus3) {
     //     if (drawInfo.userDrawResult.drawStatus === 1) {
     //         $('.award-info .desc').html('恭喜你，猜中了！')
@@ -484,8 +541,8 @@ const renderDrawInfo = () => {
         topThreeArr.map((item, index) => {
             $(`.top-three-list .no${index + 1} .tx`).attr('uid', item.uid)
             $(`.top-three-list .no${index + 1} .tx`).attr('src', item.avatar)
-            $(`.top-three-list .no${index + 1} .nick`).html(item.nick)
-            $(`.top-three-list .no${index + 1} .num span`).html(item.prizeDiamonds)
+            $(`.top-three-list .no${index + 1} .nick`).text(item.nick)
+            $(`.top-three-list .no${index + 1} .num span`).text(item.prizeDiamonds ? item.prizeDiamonds : '')
         })
     }
 
@@ -570,8 +627,7 @@ const renderListItem = () => {
     setTimeout2s()
 }
 
-// 獲取往輪遊戲結果
-let previousResults = []
+// 獲取往輪遊戲結果 
 const getPreviousResults = (count, roundId) => {
     networkRequest({
         type: 'GET',
@@ -582,8 +638,8 @@ const getPreviousResults = (count, roundId) => {
         },
         success (res) {
             if (res.code === 200) {
-                previousResults = res.data
-                renderPreviousResults()
+                // previousResults = res.data
+                renderPreviousResults(res.data)
             }
         },
         error (err) {
@@ -593,40 +649,51 @@ const getPreviousResults = (count, roundId) => {
 }
 
 // 渲染往輪遊戲結果
-const renderPreviousResults = () => {
-
+const renderPreviousResults = (val) => {
     let str = ''
-    if (previousResults.length < 5) {
-        let len = 5 - previousResults.length
+    if (val.length < 5) {
+        let len = 5 - val.length
         let arr = new Array(len).fill(1)
-        previousResults.push(...arr)
+        val.push(...arr)
     }
     if (isStatus3) {
         if (img) {
-            previousResults.pop()
-            previousResults.unshift({
+            val.pop()
+            val.unshift({
                 drawImageUrl: img
             })
-            console.log(previousResults);
         }
-
     }
-    previousResults.map((item) => {
+    val.forEach(res => {
         str += `
-            <p><img src="${item.drawImageUrl}" alt=""></p>
+            <li>
+                ${res.drawItemList.map(item => {
+            if (res.drawItemList.length == 1) {
+                return `<p style="width:0.8rem;height:0.8rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 2) {
+                return `<p style="width:0.6rem;height:0.6rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 3) {
+                return `<p style="width:0.45rem;height:0.45rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else {
+                return `<p><img style="width:0.3333333333rem;height:0.3333333333rem" src="${item.drawImageUrl}" alt=""></p>`;
+            }
+
+        }).join('')
+            }
+            </li>
         `
     })
-    $('.result-list').html(str)
+    $('.wrap .previous_Round_Result .box ul').html(str)
 }
 
 // 發送用戶抽獎數量
 const sendUserDrawInfo = (itemId, num, tais) => {
-    showLoading();
+    // showLoading();
     networkRequest({
         type: 'POST',
         url: urlPrefix + '/act/luckySea/draw',
         // contentType: 'application/json',
-        // data: `[ {
+        // data: `[{
         //     "itemId":${itemId},
         //     "num":${num}
         //   }]`,
@@ -769,7 +836,7 @@ const renderMyInfo = () => {
             num = myInfoD.num
         }
         // $('.mine-diamond-num').html('今日獎勵' + num)
-        $('.mine-diamond-num').html(num)
+        $('.mine-diamond-num').html(num == 0 ? '—— ——' : num)
     } else {
         let erbanNo = myInfoN.erbanNo
         let myIndex = rankListN.findIndex((item, index) => {
@@ -787,7 +854,7 @@ const renderMyInfo = () => {
             myInfoN.nick = '未知'
         }
         $('.mine-info').find('.mine-nick').html(myInfoN.nick)
-        $('.mine-diamond-num').html('猜中' + myInfoN.num + '次')
+        $('.mine-diamond-num').html('猜中<b> ' + myInfoN.num + ' </b>次')
     }
 }
 
@@ -903,7 +970,7 @@ const renderRankList = () => {
         othersArr.map((item, index) => {
             let num
             if (item.erbanNo) {
-                num = '猜中' + item.num + '次'
+                num = '猜中<b> ' + item.num + ' </b>次'
             }
             others += `
                 <li uid="${item.uid}">
@@ -971,7 +1038,8 @@ $(function () {
                 }
             }
         })
-    }, 50)
+        // getPreviousResults(20, roundId)
+    }, 100)
 
     // 監聽按鈕點擊事件
     // let fragmentNum
@@ -1226,4 +1294,16 @@ $(function () {
             $countDown.html(countDownTime)
         }
     })
-})  
+})  
+//返回页面 重新请求接口
+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]) {
+        location.reload()
+    }
+}
+document.addEventListener(visibilityChangeEvent, onVisibilityChange);

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

@@ -23,7 +23,7 @@ $(function () {
         getUserRecord()
     }, 100)
 
-    function getUserRecord() {
+    function getUserRecord () {
         canNext = false
         networkRequest({
             type: 'GET',
@@ -32,7 +32,7 @@ $(function () {
                 page,
                 pageSize
             },
-            success(res) {
+            success (res) {
                 if (res.code === 200) {
                     if (res.data.length != 0) {
                         // 能够继续请求下一页
@@ -43,13 +43,13 @@ $(function () {
                         canNext = false
                         toastMsg('沒有更多啦~')
                     }
-                    
+
                 } else {
                     canNext = true
                     toastMsg(res.message)
                 }
             },
-            error(err) {
+            error (err) {
                 canNext = true
                 toastMsg('網絡錯誤，請退出重進')
             }
@@ -60,7 +60,7 @@ $(function () {
     const renderRecord = (recordList) => {
         if (recordList.length === 0) {
             $('.record-list').hide();
-            $('.img').show();
+            // $('.img').show();
         } else {
             // $('.record-list li').remove();
             $('.record-list').show();
@@ -69,7 +69,7 @@ $(function () {
             var drawId;
             var itemUrl;
             var results = [];
-            
+
 
             let str = '';
             recordList.forEach((res, index) => {
@@ -92,40 +92,42 @@ $(function () {
                     </div>
                     <div class="result-wrap">
                         <div class="result">
-                            <span>本輪結果</span>
-                            <div class="bg"><img src="${itemUrl}" alt=""></div>
+                            <span></span>
                         </div>
                         <div class="award">
                             <p>獎勵:</p>
                             <img src="./images/diamond.png" class="diamond" alt="">
                             <b>${res.reward}</b>
                         </div>
+                        <div class="result_sBox">
+                            ${res.drawItemList.map(item => {
+                    return `<div class="bg"><img src="${item.drawImageUrl}" alt=""></div>`
+                }).join('')}
+                        </div>
                     </div>
                     <div class="put-wrap">
-                        <div class="put">投入</div>
+                        <div class="put"></div>
                         <div class="list">
-    
+
                         </div>
                     </div>
                 </li>
-                `
-
+    `
             })
             $('.record-list').append(str)
 
 
             results.forEach((res, index) => {
                 res.forEach(val => {
-
                     $('.record-list li').eq(lisIndexId).find('.list').append(`
-                    <div class="item">
+                    <div class= "item">
                         <p><img src="${val.itemUrl}" class="gift" alt=""></p>
                         <div>
                             <img src="./images/diamond.png" class="diamond" alt="">
                             <span class="in">${val.costPiece}</span>
                         </div>
                     </div>
-                    `)
+    `)
                 })
                 lisIndex = lisIndex + 1;
                 lisIndexId = lisIndexId + 1;

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

@@ -14,27 +14,122 @@
 <body>
     <ul class="record-list">
         <!-- <li style="margin-bottom: 0.8rem;">
-            <h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
+            <h3>23-02-25 19:13:24</h3>
             <div class="goldBox">
-                <span>NO.2212092000</span>
-                <p class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
-                <p class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
+                <span>NO.230225191242</span>
+                <p style="display: block;" class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
+                <p style="display: none;" class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
             </div>
             <div class="result-wrap">
                 <div class="result">
-                    <span>本輪結果</span>
-                    <div class="bg"><img src="" alt=""></div>
+                    <span></span>
                 </div>
                 <div class="award">
                     <p>獎勵:</p>
                     <img src="./images/diamond.png" class="diamond" alt="">
-                    <b></b>
+                    <b>0</b>
+                </div>
+                <div class="result_sBox">
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
+                    <div class="bg">
+                        <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                    </div>
                 </div>
             </div>
             <div class="put-wrap">
-                <div class="put">投入</div>
+                <div class="put"></div>
                 <div class="list">
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/FmLQyTfMaHlwkvj568vpV0uk7aSc?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
 
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/Fm94cJfxF1Eqm0U04nG476JvFLaF?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">0</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/Ftlck3geTvQvvjBkyCwxuv7tHR_a?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/Fnnd7i5L8BPI95DF_ZvhdGkk8cqI?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">0</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/FoIKvxfBJiUUGNcL8ouKQKENQ2eb?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/Fv3U6kNuCovsRljPb_an73W0U0lZ?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
+
+                    <div class="item">
+                        <p><img src="http://beta.img.pekolive.com/FuEuGPGHcyGExK_nJhvx08S4KeJ9?imageslim" class="gift"
+                                alt=""></p>
+                        <div>
+                            <img src="./images/diamond.png" class="diamond" alt="">
+                            <span class="in">100</span>
+                        </div>
+                    </div>
                 </div>
             </div>
         </li> -->

view/peko/common/js/common2.js

@@ -541,8 +541,8 @@ function getInfoFromClient () {
 
     } else {
         // 非app环境调试参数
-        pubInfo.uid = 2346;
-        pubInfo.ticket = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjoyMzQ2LCJ0aWNrZXRfaWQiOiJhOTY1YzkyYi1hZDM2LTRhZWItODk5OC1iN2UzODEyZjU2ZGYiLCJleHAiOjM2MDAsImNsaWVudF9pZCI6ImVyYmFuLWNsaWVudCJ9.AA-x5FwodxS9zimfJv4CTBXgD5-CPgVeoS-L6EU8VTI";
+        pubInfo.uid = 0;
+        pubInfo.ticket = "0";
         // pubInfo.uid = "";
         // pubInfo.ticket = "";
 

view/peko/homeCheck/css/index.css

@@ -0,0 +1,221 @@
+@charset "UTF-8";
+body,
+html {
+  width: 100%;
+  height: 100%;
+  font-family: "Heiti SC", "Microsoft Sans Serif"; }
+
+.container {
+  position: relative; }
+
+.homePc {
+  width: 100%;
+  height: 10.8rem;
+  background: url(../images/homePc.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  overflow: hidden; }
+  .homePc .logo {
+    width: 2.35rem;
+    height: 0.8rem;
+    position: absolute;
+    top: 0.36rem;
+    left: 2.4rem; }
+  .homePc .name {
+    font-size: 0.3rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    top: 0.55rem;
+    left: 3.22rem; }
+  .homePc .charge {
+    font-size: 0.32rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 4.24rem;
+    top: 0.5rem; }
+  .homePc p {
+    font-size: 0.32rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 3.95rem;
+    top: 0.5rem; }
+  .homePc .zhichi {
+    font-size: 0.3rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 2.4rem;
+    top: 0.5rem; }
+  .homePc .swiper {
+    width: 12.6rem;
+    height: 9.55rem;
+    margin: 1.25rem 0 0 4.1rem;
+    position: relative;
+    overflow-y: hidden; }
+    .homePc .swiper .swiper-wrapper {
+      width: 10.8rem;
+      height: 100%;
+      /*先去掉前进后退按钮默认样式*/
+      --swiper-navigation-size:0; }
+      .homePc .swiper .swiper-wrapper .swiper-slide img {
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        top: 0;
+        left: 50%;
+        transform: translateX(-50%); }
+    .homePc .swiper .swiper-pagination {
+      width: 0.63rem;
+      height: 2.07rem;
+      background-color: rgba(0, 0, 0, 0.4);
+      border-radius: 0.4rem;
+      position: absolute;
+      top: 3.5rem;
+      right: 0rem; }
+      .homePc .swiper .swiper-pagination .swiper-pagination-bullet {
+        width: 0.22rem !important;
+        height: 0.22rem !important;
+        background: none !important;
+        background-image: url(../images/li.png) !important;
+        background-size: 100% 100% !important;
+        opacity: 1 !important;
+        margin: 0.35rem auto; }
+      .homePc .swiper .swiper-pagination .swiper-pagination-bullet-active {
+        background: none !important;
+        background-image: url(../images/li_active.png) !important;
+        background-size: 100% 100% !important;
+        opacity: 1 !important; }
+
+.eori {
+  width: 100%;
+  background: #30312C;
+  color: white;
+  padding: 0.2rem 0;
+  vertical-align: top; }
+  .eori .recordfoot {
+    color: #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0.1rem; }
+    .eori .recordfoot .record {
+      display: inline-block;
+      padding-right: 0.0533333333rem;
+      height: 0.16rem;
+      width: 0.15rem; }
+    .eori .recordfoot a {
+      font-size: 0.2rem;
+      color: #fff; }
+  .eori .gongsi {
+    display: flex;
+    justify-content: center;
+    text-align: center; }
+    .eori .gongsi p {
+      font-size: 0.2rem; }
+      .eori .gongsi p:nth-child(2) {
+        margin: 0 0.2rem; }
+
+.service {
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  top: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.8);
+  z-index: 9999;
+  display: none; }
+  .service .service_in {
+    width: 8.23rem;
+    height: 4.9rem;
+    background: #FFFFFF;
+    border-radius: 0.5rem;
+    position: relative;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    overflow: hidden; }
+    .service .service_in .close {
+      width: 0.5rem;
+      height: 0.5rem;
+      position: absolute;
+      top: 0.35rem;
+      right: 0.4rem; }
+    .service .service_in .title {
+      width: 100%;
+      font-size: 0.48rem;
+      color: #2D2727;
+      font-weight: 600;
+      text-align: center;
+      margin: 0.35rem 0; }
+    .service .service_in .subhead {
+      width: 100%;
+      font-size: 0.24rem;
+      color: #2D2727;
+      font-weight: 600;
+      text-align: center;
+      margin-bottom: 0.5rem; }
+    .service .service_in .con {
+      width: 100%;
+      height: 2.6rem;
+      display: flex;
+      justify-content: space-evenly;
+      align-items: center; }
+      .service .service_in .con div {
+        flex: 1;
+        font-size: 0.2rem;
+        text-align: center; }
+      .service .service_in .con .left {
+        border-right: 1px solid #F0F0F0; }
+        .service .service_in .con .left p e {
+          display: inline-block;
+          width: 0.25rem;
+          height: 0.25rem;
+          line-height: 0.25rem;
+          text-align: center;
+          border-radius: 50%;
+          background-color: #ffe710; }
+        .service .service_in .con .left img {
+          width: 3rem;
+          height: 1.7rem;
+          margin-top: 0.38rem; }
+      .service .service_in .con .right p e {
+        display: inline-block;
+        width: 0.25rem;
+        height: 0.25rem;
+        line-height: 0.25rem;
+        text-align: center;
+        border-radius: 50%;
+        background-color: #ffe710; }
+      .service .service_in .con .right img {
+        width: 1.68rem;
+        height: 1.68rem;
+        margin-top: 0.38rem; }
+
+.toast {
+  background: rgba(0, 0, 0, 0.9);
+  border-radius: 10px;
+  width: 100px;
+  font-size: 16px;
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  color: #fff;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  display: none;
+  z-index: 9; }
+
+.tips {
+  display: none;
+  position: fixed;
+  top: 0;
+  right: 0.2666666667rem;
+  width: 6.1333333333rem;
+  z-index: 9; }
+
+/*# sourceMappingURL=index.css.map */

view/peko/homeCheck/css/index.scss

@@ -0,0 +1,494 @@
+@function px2rem($px, $rem: 75) {
+  @return $px / $rem+rem;
+}
+
+body,
+html {
+  width: 100%;
+  height: 100%;
+  font-family: "Heiti SC", "Microsoft Sans Serif";
+  //overflow: hidden;
+}
+
+.container {
+  position: relative;
+}
+
+// pc端
+// @media screen and (min-width:769px) {
+//   .m-bg {
+//     display: none;
+
+//     img {
+//       display: block;
+//     }
+//   }
+// }
+
+.homePc {
+  width: 100%;
+  height: 10.8rem;
+  background: url(../images/homePc.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  overflow: hidden;
+
+  .logo {
+    width: 2.35rem;
+    height: 0.8rem;
+    position: absolute;
+    top: 0.36rem;
+    left: 2.4rem;
+  }
+
+  .name {
+    font-size: 0.3rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    top: 0.55rem;
+    left: 3.22rem;
+  }
+
+  .charge {
+    font-size: 0.32rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 4.24rem;
+    top: 0.5rem;
+  }
+
+  p {
+    font-size: 0.32rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 3.95rem;
+    top: 0.5rem;
+  }
+
+  .zhichi {
+    font-size: 0.3rem;
+    color: #282828;
+    font-weight: 600;
+    position: absolute;
+    right: 2.4rem;
+    top: 0.5rem;
+  }
+
+  .swiper {
+    width: 12.6rem;
+    height: 9.55rem;
+    margin: 1.25rem 0 0 4.1rem;
+    position: relative;
+    // top: 0.81rem;
+    // left: 50%;
+    // transform: translateX(-50%);
+    // overflow: hidden;
+    overflow-y: hidden;
+
+    .swiper-wrapper {
+      width: 10.8rem;
+      height: 100%;
+
+      .swiper-slide {
+        // width: 100%;
+        // height: 100%;
+
+        img {
+          width: 100%;
+          height: 100%;
+          position: absolute;
+          top: 0;
+          left: 50%;
+          transform: translateX(-50%);
+        }
+      }
+
+
+      /*先去掉前进后退按钮默认样式*/
+      --swiper-navigation-size:0;
+
+    }
+
+
+    .swiper-pagination {
+      width: 0.63rem;
+      height: 2.07rem;
+      background-color: rgba(0, 0, 0, 0.4);
+      border-radius: 0.4rem;
+      position: absolute;
+      top: 3.5rem;
+      right: 0rem;
+
+      .swiper-pagination-bullet {
+        width: 0.22rem !important;
+        height: 0.22rem !important;
+        background: none !important;
+        background-image: url(../images/li.png) !important;
+        background-size: 100% 100% !important;
+        opacity: 1 !important;
+        margin: 0.35rem auto;
+      }
+
+      .swiper-pagination-bullet-active {
+        // width: 30px !important;
+        // height: 30px !important;
+        background: none !important;
+        background-image: url(../images/li_active.png) !important;
+        background-size: 100% 100% !important;
+        opacity: 1 !important;
+      }
+    }
+
+  }
+}
+
+.eori {
+  // height: 1.2rem;
+  width: 100%;
+  background: #30312C;
+  color: rgb(255, 255, 255);
+  padding: 0.2rem 0;
+  vertical-align: top;
+
+  .recordfoot {
+    color: #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0.1rem;
+
+    .record {
+      display: inline-block;
+      padding-right: px2rem(4);
+      height: 0.16rem;
+      width: 0.15rem;
+      // background: url(../images/icon_police.png) no-repeat;
+    }
+
+    a {
+      font-size: 0.2rem;
+      color: #fff;
+    }
+  }
+
+  .gongsi {
+    display: flex;
+    justify-content: center;
+    text-align: center;
+
+    p {
+      font-size: 0.2rem;
+
+      &:nth-child(2) {
+        margin: 0 0.2rem;
+      }
+    }
+  }
+
+}
+
+.service {
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  top: 0;
+  right: 0;
+  background: rgba(0, 0, 0, .8);
+  z-index: 9999;
+  display: none;
+
+  .service_in {
+    width: 8.23rem;
+    height: 4.9rem;
+    background: #FFFFFF;
+    border-radius: 0.5rem;
+    position: relative;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    overflow: hidden;
+
+    .close {
+      width: 0.5rem;
+      height: 0.5rem;
+      position: absolute;
+      top: 0.35rem;
+      right: 0.4rem;
+    }
+
+    .title {
+      width: 100%;
+      font-size: 0.48rem;
+      color: #2D2727;
+      font-weight: 600;
+      text-align: center;
+      margin: 0.35rem 0;
+    }
+
+    .subhead {
+      width: 100%;
+      font-size: 0.24rem;
+      color: #2D2727;
+      font-weight: 600;
+      text-align: center;
+      margin-bottom: 0.5rem;
+    }
+
+    .con {
+      width: 100%;
+      height: 2.6rem;
+      display: flex;
+      justify-content: space-evenly;
+      align-items: center;
+
+      div {
+        flex: 1;
+        font-size: 0.2rem;
+        text-align: center;
+      }
+
+      .left {
+        border-right: 1px solid #F0F0F0;
+
+        p {
+          e {
+            display: inline-block;
+            width: 0.25rem;
+            height: 0.25rem;
+            line-height: 0.25rem;
+            text-align: center;
+            border-radius: 50%;
+            background-color: #ffe710;
+          }
+        }
+
+        img {
+          width: 3rem;
+          height: 1.7rem;
+          margin-top: 0.38rem;
+        }
+      }
+
+      .right {
+        p {
+          e {
+            display: inline-block;
+            width: 0.25rem;
+            height: 0.25rem;
+            line-height: 0.25rem;
+            text-align: center;
+            border-radius: 50%;
+            background-color: #ffe710;
+          }
+        }
+
+        img {
+          width: 1.68rem;
+          height: 1.68rem;
+          margin-top: 0.38rem;
+        }
+      }
+    }
+  }
+}
+
+// 移动端
+// @media screen and (max-width:768px) {
+
+//   .pc-bg {
+//     display: none;
+//   }
+
+//   .m-bg {
+//     display: block;
+//   }
+
+//   .homeM {
+//     width: 100%;
+//     height: 14.3rem;
+//     background: url(../images/homeM.png) no-repeat;
+//     background-size: 100% 100%;
+//     position: relative;
+
+//     .logo {
+//       height: 0.5rem;
+//       padding: 0.1rem 0 0 0.34rem;
+//       display: flex;
+//       align-items: center;
+
+//       img {
+//         width: 0.5rem;
+//         height: 0.5rem;
+//         margin-right: 0.08rem;
+//       }
+
+//       p {
+//         font-size: 0.26rem;
+//         font-weight: 600;
+//       }
+//     }
+
+//     .charge {
+//       width: 0.6rem;
+//       height: 0.4rem;
+//       line-height: 0.4rem;
+//       text-align: center;
+//       border-radius: 0.1rem;
+//       font-size: 0.26rem;
+//       font-weight: 600;
+//       position: absolute;
+//       right: 0.34rem;
+//       top: 0.2rem;
+//       background-color: rgba(0, 0, 0, 0.2);
+//     }
+
+//     .download {
+//       width: 100%;
+//       height: 0.84rem;
+//       display: flex;
+//       justify-content: space-evenly;
+//       position: absolute;
+//       left: 0;
+//       bottom: 0.8rem;
+
+//       .iphone,
+//       .android {
+//         width: 2.78rem;
+//         height: 0.84rem;
+//       }
+//     }
+
+//     .swiper2 {
+//       width: 100%;
+//       height: 7.76rem;
+//       position: absolute;
+//       top: 4.5rem;
+//       overflow-x: hidden;
+
+//       .swiper-wrapper {
+//         width: 100%;
+//         height: 8rem;
+
+//         .swiper-slide {
+//           img {
+//             width: 100%;
+//             height: 100%;
+//           }
+//         }
+//       }
+
+//       .swiper-pagination {
+//         // width: 20%;
+//         // height: 50%;
+//         // transform: rotate(90deg);
+//         position: absolute;
+//         top: 6.8rem;
+//         left: 0;
+
+//         .swiper-pagination-bullet {
+//           width: 0.25rem !important;
+//           height: 0.25rem !important;
+//           background: none !important;
+//           background-image: url(../images/li.png) !important;
+//           background-size: 100% 100% !important;
+//           opacity: 1 !important;
+//           margin-right: 0.3rem;
+//         }
+
+//         .swiper-pagination-bullet-active {
+//           // width: 30px !important;
+//           // height: 30px !important;
+//           background: none !important;
+//           background-image: url(../images/li_active.png) !important;
+//           background-size: 100% 100% !important;
+//           opacity: 1 !important;
+//         }
+//       }
+//     }
+
+//   }
+
+//   .eori {
+//     // height: 1.2rem;
+//     width: 100%;
+//     background: #30312C;
+//     color: rgb(255, 255, 255);
+//     padding: 0.2rem 0;
+
+//     .recordfoot {
+//       color: #fff;
+//       display: flex;
+//       justify-content: center;
+//       align-items: center;
+
+//       .record {
+//         display: inline-block;
+//         padding-right: px2rem(4);
+//         height: 0.3rem;
+//         width: 0.3rem;
+//         background: url(../images/icon_police.png) no-repeat;
+//       }
+//     }
+
+//     .gongsi {
+//       display: block;
+//       text-align: center;
+
+//       p {
+//         line-height: 1.3;
+//         font-size: 0.2rem;
+
+//         &:nth-child(2) {
+//           margin: 0;
+//         }
+//       }
+//     }
+
+//     // div {
+//     //   // height: 30px;
+//     //   width: 100%;
+//     //   text-align: center;
+//     //   // line-height: 30px;
+//     //   font-size: 14px;
+//     // }
+
+//     .tit {
+//       height: px2rem(120);
+//       line-height: px2rem(120);
+//       text-align: center;
+//       font-size: 20px;
+//     }
+
+//   }
+
+// }
+
+
+.toast {
+  background: rgba(0, 0, 0, 0.9);
+  border-radius: 10px;
+  width: 100px;
+  font-size: 16px;
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  color: #fff;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  display: none;
+  z-index: 9;
+}
+
+.tips {
+  display: none;
+  position: fixed;
+  top: 0;
+  right: px2rem(20);
+  width: px2rem(460);
+  z-index: 9;
+}

view/peko/homeCheck/css/reset.css

@@ -0,0 +1,144 @@
+/**
+ * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
+ * http://cssreset.com
+ */
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video, input {
+    margin: 0;
+    padding: 0;
+    border: 0;
+    font-size: 100%;
+    font-weight: normal;
+    vertical-align: baseline;
+}
+
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, menu, nav, section {
+    display: block;
+}
+
+body {
+    line-height: 1;
+}
+
+blockquote, q {
+    quotes: none;
+}
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+    content: none;
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+/* custom */
+a {
+    color: #7e8c8d;
+    text-decoration: none;
+    -webkit-backface-visibility: hidden;
+}
+
+li {
+    list-style: none;
+}
+
+::-webkit-scrollbar {
+    width: 5px;
+    height: 5px;
+}
+
+::-webkit-scrollbar-track-piece {
+    background-color: rgba(0, 0, 0, 0.2);
+    -webkit-border-radius: 6px;
+}
+
+::-webkit-scrollbar-thumb:vertical {
+    height: 5px;
+    background-color: rgba(125, 125, 125, 0.7);
+    -webkit-border-radius: 6px;
+}
+
+::-webkit-scrollbar-thumb:horizontal {
+    width: 5px;
+    background-color: rgba(125, 125, 125, 0.7);
+    -webkit-border-radius: 6px;
+}
+
+html, body {
+    width: 100%;
+}
+
+body {
+    -webkit-text-size-adjust: none;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+img{
+  width: 100%;
+  vertical-align: top;
+}
+.mask,.share-mask {
+  position: fixed;
+  width: 100%;
+  left: 0;
+  bottom: 0;
+  display: flex;
+  height: 60px;
+  align-items: center;
+  background: rgba(0, 0, 0, 0.5);
+  justify-content: space-between;
+  padding: 0 8px;
+  box-sizing: border-box;
+  color:#fff;
+  display: none; }
+
+.mask .logo {
+  width: 40px;
+}
+
+.mask .slogan {
+  color: #fff;
+  margin: 0 8px;
+}
+
+#download {
+  border: 1px solid #fff;
+  color: #fff;
+  width: 80px;
+  text-align: center;
+  border-radius: 15px;
+  line-height: 30px; }
+
+#download a{
+  color: #fff; }
+
+.share-mask{
+  padding: 0 16px;
+}
+.share-mask .shareBtn{
+  border-radius: 6px;
+  background: linear-gradient(to right,#fe95c0,#ff83b5);
+  height: 30px;
+  line-height: 30px;
+  width: 80px;
+  text-align: center;
+}
+.singleTemplate{
+  display: none;
+}

view/peko/homeCheck/index.html

@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport"
+    content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
+
+  <meta name="keywords" content="" />
+  <meta name="description" content="" />
+
+  <meta http-equiv="Cache-Control" content="no-siteapp" />
+  <meta name="renderer" content="webkit">
+  <meta name="format-detection" content="telphone=no, email=no" />
+  <meta name="HandheldFriendly" content="true">
+  <meta name="MobileOptimized" content="375">
+
+  <meta name="screen-orientation" content="portrait">
+  <meta name="x5-orientation" content="portrait">
+  <meta name="full-screen" content="yes">
+  <meta name="x5-fullscreen" content="true">
+  <meta name="browsermode" content="application">
+  <meta name="x5-page-mode" content="app">
+  <meta name="msapplication-tap-highlight" content="no">
+  <meta name="apple-mobile-web-app-capable" content="no" />
+  <meta name="format-detection" content="telephone=no">
+  <title>peko</title>
+
+  <!-- <link rel="stylesheet" href="./home/css/reset.css"> -->
+  <link rel="stylesheet" href="./css/reset.css">
+  <link rel="stylesheet" href="./css/index.css">
+  <!-- <link rel="stylesheet" href="./home/css/index.css"> -->
+  <link rel="stylesheet" href="./css/swiper.min.css">
+  <!-- <script src="./js/flexible.js"></script> -->
+</head>
+
+<body>
+  <div class="container">
+    <div class="pc-bg">
+      <!-- <img src="./images/homePc.png" alt=""> -->
+      <div class="homePc">
+        <div class="logo">
+          <img src="./images/title.png" alt="">
+        </div>
+        <!-- <div class="name">音萌</div> -->
+        <!-- <div class="charge">官方充值</div> -->
+        <!-- <p>|</p> -->
+        <a href="./support.html" class="zhichi">技术支持>></a>
+
+        <!-- 轮播 -->
+        <div class="swiper-container swiper">
+          <div class="swiper-wrapper">
+            <div class="swiper-slide">
+              <img src="./images/pic1.png" alt="">
+            </div>
+            <div class="swiper-slide">
+              <img src="./images/pic2.png" alt="">
+            </div>
+            <div class="swiper-slide">
+              <img src="./images/pic3.png" alt="">
+            </div>
+          </div>
+          <div class="swiper-pagination"></div>
+          <!-- 如果需要导航按钮 -->
+          <!-- <div class="swiper-button-prev">
+            <img src="./images/btn_left.png" alt="">
+          </div>
+          <div class="swiper-button-next">
+            <img src="./images/btn_right.png" alt="">
+          </div> -->
+        </div>
+
+
+      </div>
+    </div>
+    <!-- <div class="m-bg">
+      <div class="homeM">
+        <div class="logo">
+          <img src="./images/logo.png" alt="">
+          <p>音萌</p>
+        </div>
+        <div class="swiper-container swiper2">
+          <div class="swiper-wrapper">
+            <div class="swiper-slide">
+              <img src="./images/mpic1.png" alt="">
+            </div>
+            <div class="swiper-slide">
+              <img src="./images/mpic2.png" alt="">
+            </div>
+          </div>
+          <div class="swiper-pagination swp"></div>
+        </div>
+
+        <div class="download">
+          <img src="./images/ios.png" class="iphone" alt="">
+          <img src="./images/android.png" class="android" alt="">
+        </div>
+
+      </div>
+    </div> -->
+
+    <!-- <div class="eori">
+      <div class="recordfoot">
+        <i class="record"></i>
+        <a href="https://beian.miit.gov.cn/#/Integrated/index">粤ICP备2020098441号</a>
+      </div>
+      <div class="gongsi">
+        <p>Hong Kong Li Zhi Technology Co., Limited</p>
+        <p>香港荔枝科技有限公司</p>
+        <p>CR No:3040005</p>
+        <p>地址：ROOM1803,18/F,TOWERONE,CHINAHONGKONGCIT</p>
+      </div>
+    </div> -->
+
+    <!-- 联系客服弹窗 -->
+    <div class="service">
+      <div class="service_in">
+        <img src="./images/close.png" class="close" alt="">
+        <div class="title">客服服务</div>
+        <div class="subhead">为能提供更好的服务，您可以通过一下方式联系我们</div>
+        <div class="con">
+          <div class="left">
+            <p>
+              <e>1</e>个人中心-联系客服
+            </p>
+            <img src="./images/kefu1.png" alt="">
+          </div>
+          <div class="right">
+            <p>
+              <e>2</e>扫码添加官方微信咨询
+            </p>
+            <img src="./images/kefu2.png" alt="">
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="toast">敬请期待</div>
+  <div class="tips">
+    <img src="./images/tips.png" alt="">
+  </div>
+  <script src="./js/jquery.min.js"></script>
+  <script src="./js/common.js"></script>
+  <script src="./js/jquery.qrcode.js"></script>
+  <script src="http://static.lkme.cc/linkedme.min.js"></script>
+  <script src="./js/utf.js"></script>
+  <script src="./js/swiper.min.js"></script>
+  <script src="./js/index.js?v=2.2"></script>
+</body>
+
+</html>

view/peko/homeCheck/js/common.js

@@ -0,0 +1,321 @@
+const productUrl = 'https://api.pekolive.com'; // 正式环境
+const testUrl = 'https://beta.api.pekolive.com'; // 测试环境
+
+function render (templateId, templateData, target) {
+  var html = template(templateId, templateData);
+  target.innerHTML += html;
+}
+
+// 根据域名判断 正式环境(含www)/测试环境(含beta), 并返回所需url前缀
+// written by zxfxiong
+function getUrlPrefix () {
+  if (!EnvCheck()) return undefined;
+  return EnvCheck() === 'live' ? productUrl : testUrl;
+}
+
+function dateFormat (date, fmt) {
+  date = new Date(date);
+  var o = {
+    'M+': date.getMonth() + 1,
+    'd+': date.getDate(),
+    'h+': date.getHours(),
+    'm+': date.getMinutes(),
+    's+': date.getSeconds()
+  };
+
+  // 补全0
+  function padLeftZero(str) {
+    return('00' + str).substr(str.length);
+  }
+
+  // 年份
+  if(/(y+)/.test(fmt)) {
+    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
+  }
+
+  // 月日时分秒
+  for(var k in o) {
+    if(new RegExp('(' + k + ')').test(fmt)) {
+      var str = o[k] + '';
+      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
+    }
+  }
+
+  date = o = padLeftZero = null;
+  return fmt;
+}
+
+function convert (_url) {
+	var patt=/\d+/;
+	var num=_url.match(patt);
+	var rs={};
+	rs.uid=num[0];
+	return rs;	
+}
+
+// 传递分享信息给客户端,showUrl为分享的页面链接,为空时表示不分享
+// function shareInfo () {
+//   var _url = 'http://www.erbanyy.com/modules/bonus/fight.html';
+//   var res = EnvCheck();
+//   if (res == 'test'){
+//     _url = 'http://beta.erbanyy.com/modules/bonus/fight.html';
+//   }
+//   var info = {
+//     title: '耳伴与你一起红',
+//     imgUrl: 'http://www.erbanyy.com/home/images/logo.png',
+//     desc: '登录即送20红包，每天还有分享红包，邀请红包，分成红包，四重红包大礼等你来拿',
+//     showUrl: _url
+//   };
+//   return JSON.stringify(info);
+// }
+
+// 根据域名适配环境
+function EnvCheck () {
+  if (window.location.href) {
+      var _url = window.location.href;
+      var res = _url.match(/uat/);
+      var res1 = _url.match(/120.79.211.243/);
+      var res2 = _url.match(/192.168./)
+      var res3 = _url.match(/127.0/)
+      var res4 = _url.match(/beta/)
+      if (res || res1 || res2 || res3 || res4) {
+          return 'test';
+      } else {
+          return 'live';
+      }
+  }
+}
+// 根据域名判断是本地打开还是服务器打开
+function locateJudge() {
+  if(window.location.href){
+    var _url = window.location.href;
+    var res = _url.match(/test/);
+    if(res){
+      return '/api';
+    }else{
+      return '';
+    }
+  }
+}
+
+// 获取地址栏参数
+function getQueryString(){
+  var _url = location.search;
+  var theRequest = new Object();
+  if(_url.indexOf('?') != -1){
+    var str = _url.substr(1);
+    strs = str.split('&');
+    for(var i in strs){
+      theRequest[strs[i].split('=')[0]] = decodeURI(strs[i].split('=')[1]);
+    }
+  }
+  return theRequest;
+}
+
+// 判断浏览器内核，手机类型
+function checkVersion(){
+  var u = navigator.userAgent, app = navigator.appVersion;
+  return {
+    trident: u.indexOf('Trident') > -1, //IE内核
+    presto: u.indexOf('Presto') > -1, //opera内核
+    webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
+    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,//火狐内核
+    mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
+    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
+    android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
+    iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器
+    iPad: u.indexOf('iPad') > -1, //是否iPad
+    webApp: u.indexOf('Safari') == -1, //是否web应该程序，没有头部与底部
+    weixin: u.indexOf('MicroMessenger') > -1, //是否微信
+    qq: u.match(/\sQQ/i) == " qq", //是否QQ
+    app: u.match('mengshengApp') == 'mengshengApp' //是否在app内
+  };
+}
+
+// 图片预加载
+function preloadImage(obj){
+  var loadLength = 0,newImages = [];
+  for(var i = 0;i < obj.imageArr.length;i++){
+    newImages[i] = new Image();
+    newImages[i].src = obj.imageArr[i];
+    newImages[i].onload = newImages[i].onerror = function(){
+      loadLength++;
+      typeof obj.preloadPreFunc === 'function' && obj.preloadPreFunc(loadLength);
+      if(loadLength == obj.imageArr.length){
+        typeof obj.doneFunc === 'function' && obj.doneFunc();
+      }
+    }
+  }
+}
+
+// 判断是否在App内
+function isApp() {
+  var androidBol = false;
+  var osBol = false;
+  if(window.androidJsObj && typeof window.androidJsObj === 'object'){
+    androidBol = true;
+  }
+  if(window.webkit){
+    console.log(window.webkit);
+    osBol = true;
+  }
+  return (androidBol || osBol);
+
+}
+
+function msMask(channel,tags,params) {
+  //此函数用于一般的耳伴底层面罩
+  var browser = checkVersion();
+  var env = EnvCheck();
+  // params = params? params:0;
+  var bol = $.isEmptyObject(params);
+  var jsonStr = '';
+  if(!bol) {
+    jsonStr = JSON.stringify(params);
+  }
+  if(!browser.app){
+    $('#mask').css('display','flex');
+    var linkData = {
+      type: env,
+      channel: channel,
+      tags: tags,
+      // ios_custom_url: "https://itunes.apple.com/cn/app/id1252542069?mt=8",
+      params: jsonStr
+      // '{"uid":"' + params + '"}'
+    };
+
+    linkedme.init("414571f0698afaa1c194f345f0dcc328", {type: env}, null);
+
+    linkedme.link(linkData, function(err, response){
+      if(err){
+        // 生成深度链接失败，返回错误对象err
+        console.log('err:',err);
+      } else {
+        console.log(response);
+        $('#download a').attr("href",response.url);
+        $('.download a').attr('href',response.url);
+      }
+    },false);
+  }else{
+    $('#share-mask').css('display','flex');
+  }
+}
+function wxConfig() {
+  var wxurl = encodeURIComponent(location.href.split('#')[0]);
+  var data ="url=" + wxurl;
+  console.log(data);
+  $.ajax({
+    type:'GET',
+    url: '/wx/config',
+    data: data,
+    asyc: true,
+    success: function (data) {
+      if(data.code = 200){
+        wx.config({
+          debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
+          appId: data.data.appId, // 必填，公众号的唯一标识
+          timestamp: data.data.timestamp, // 必填，生成签名的时间戳
+          nonceStr: data.data.nonceStr, // 必填，生成签名的随机串
+          signature: data.data.signature,// 必填，签名，见附录1
+          jsApiList: data.data.jsApiList // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
+        });
+        wx.error(function(res){
+          console.log('config error,msg:'+res);
+        });
+      }
+    },
+    error:function(res){
+      console.log('config error,msg:'+res);
+    }
+  })
+}
+
+// function refreshWeb() {
+//   window.location.href = window.location.href;
+// }
+
+
+$('#share-mask .shareBtn').on('click',function () {
+  var browser = checkVersion();
+  if (browser.app) {
+    if (browser.android) {
+      window.androidJsObj.openSharePage();
+    } else if (browser.ios) {
+      window.webkit.messageHandlers.openSharePage.postMessage(null);
+    }
+  }
+})
+
+/**
+ * 渲染列表组件
+ * @param templateId  组件的id
+ * @param $target     渲染目标dom
+ * @param attrParam   属性名，格式 {'.class':['dataAttr',type]}
+ * @param data        渲染数据的数组
+ */
+
+function templateList(templateId,$target,attrParam,data){
+  var $template = $(templateId);
+  var str = $template.html();
+
+  for(var i = 0;i < data.length;i++){
+    var $list = $(str);
+    $target.append($list);
+    for(var j in attrParam){
+      if(attrParam[j][1] == 1){
+        $list.find(j + ' img').attr('src',data[i][attrParam[j][0]]);
+      }else if(attrParam[j][1] == 2){
+        $list.find(j).html(data[i][attrParam[j][0]]);
+      }
+    }
+  }
+}
+
+function initNav(obj) {
+  if($.isEmptyObject(obj)){
+    return;
+  }
+  var browser = checkVersion();
+  if(browser.app){
+    if(browser.ios){
+      window.webkit.messageHandlers.initNav.postMessage(obj);
+    }else if(browser.android){
+      var json = JSON.stringify(obj);
+      window.androidJsObj.initNav(json);
+    }
+  }
+}
+
+var tranUrl = 'http://www.if66.cn';
+
+var tools = {
+  cookieUtils: {
+    set: function(key, val, time) {
+      var date = new Date();
+      var expiresDays = time;
+      date.setTime(date.getTime() + expiresDays * 24 * 3600 * 1000);
+      document.cookie = key + '=' + val + ';expires=' + date.toGMTString();
+    },
+
+    get: function(key) {
+      // 获取cookie参数
+      var getCookie = document.cookie.replace(/[ ]/g,'');
+      var arrCookie = getCookie.split(';');
+      var val;
+      for(var i = 0 ; i < arrCookie.length ; i++) {
+        var arr = arrCookie[i].split('=');
+        if(key === arr[0]) {
+          val = arr[1];
+          break;
+        }
+      }
+      return val;
+    },
+
+    delete: function(key) { //删除cookie方法
+      var date = new Date(); //获取当前时间
+      date.setTime(date.getTime() - 10000); //将date设置为过去的时间
+      document.cookie = key + '=v; expires =' + date.toGMTString(); //设置cookie
+    }
+  }
+}

view/peko/homeCheck/js/flexible.js

@@ -0,0 +1,109 @@
+;(function(win, lib) {
+  var doc = win.document;
+  var docEl = doc.documentElement;
+  var metaEl = doc.querySelector('meta[name="viewport"]');
+  var flexibleEl = doc.querySelector('meta[name="flexible"]');
+  var dpr = 0;
+  var scale = 0;
+  var tid;
+  var flexible = lib.flexible || (lib.flexible = {});
+
+  if (metaEl) {
+    console.warn('将根据已有的meta标签来设置缩放比例');
+    var match = metaEl.getAttribute('content').match(/initial\-scale=([\d\.]+)/);
+    if (match) {
+      scale = parseFloat(match[1]);
+      dpr = parseInt(1 / scale);
+    }
+  } else if (flexibleEl) {
+    var content = flexibleEl.getAttribute('content');
+    if (content) {
+      var initialDpr = content.match(/initial\-dpr=([\d\.]+)/);
+      var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/);
+      if (initialDpr) {
+        dpr = parseFloat(initialDpr[1]);
+        scale = parseFloat((1 / dpr).toFixed(2));
+      }
+      if (maximumDpr) {
+        dpr = parseFloat(maximumDpr[1]);
+        scale = parseFloat((1 / dpr).toFixed(2));
+      }
+    }
+  }
+  if (!dpr && !scale) {
+    var isAndroid = win.navigator.appVersion.match(/android/gi);
+    var isIPhone = win.navigator.appVersion.match(/iphone/gi);
+    var devicePixelRatio = win.devicePixelRatio;
+    if (isIPhone) {
+      // iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
+      if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
+        dpr = 3;
+      } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)){
+        dpr = 2;
+      } else {
+        dpr = 1;
+      }
+    } else {
+      // 其他设备下，仍旧使用1倍的方案
+      dpr = 1;
+    }
+    scale = 1 / dpr;
+  }
+  docEl.setAttribute('data-dpr', dpr);
+  if (!metaEl) {
+    metaEl = doc.createElement('meta');
+    metaEl.setAttribute('name', 'viewport');
+    metaEl.setAttribute('content', 'initial-scale=' + scale + ', maximum-scale=' + scale + ', minimum-scale=' + scale + ', user-scalable=no');
+    if (docEl.firstElementChild) {
+      docEl.firstElementChild.appendChild(metaEl);
+    } else {
+      var wrap = doc.createElement('div');
+      wrap.appendChild(metaEl);
+      doc.write(wrap.innerHTML);
+    }
+  }
+  function refreshRem(){
+    var width = docEl.getBoundingClientRect().width;
+    if (width / dpr > 730) {
+      width = 730 * dpr;
+    }
+    var rem = width / 10;
+    docEl.style.fontSize = rem + 'px';
+    flexible.rem = win.rem = rem;
+  }
+  win.addEventListener('resize', function() {
+    clearTimeout(tid);
+    tid = setTimeout(refreshRem, 300);
+  }, false);
+  win.addEventListener('pageshow', function(e) {
+    if (e.persisted) {
+      clearTimeout(tid);
+      tid = setTimeout(refreshRem, 300);
+    }
+  }, false);
+  if (doc.readyState === 'complete') {
+    doc.body.style.fontSize = 12 * dpr + 'px';
+  } else {
+    doc.addEventListener('DOMContentLoaded', function(e) {
+      doc.body.style.fontSize = 12 * dpr + 'px';
+    }, false);
+  }
+
+  refreshRem();
+  flexible.dpr = win.dpr = dpr;
+  flexible.refreshRem = refreshRem;
+  flexible.rem2px = function(d) {
+    var val = parseFloat(d) * this.rem;
+    if (typeof d === 'string' && d.match(/rem$/)) {
+      val += 'px';
+    }
+    return val;
+  }
+  flexible.px2rem = function(d) {
+    var val = parseFloat(d) / this.rem;
+    if (typeof d === 'string' && d.match(/px$/)) {
+      val += 'rem';
+    }
+    return val;
+  }
+})(window, window['lib'] || (window['lib'] = {}));

view/peko/homeCheck/js/html5shiv.min.js

@@ -0,0 +1,4 @@
+/**
+* @preserve HTML5 Shiv 3.7.3 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
+*/
+!function(a,b){function c(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x<style>"+b+"</style>",d.insertBefore(c.lastChild,d.firstChild)}function d(){var a=t.elements;return"string"==typeof a?a.split(" "):a}function e(a,b){var c=t.elements;"string"!=typeof c&&(c=c.join(" ")),"string"!=typeof a&&(a=a.join(" ")),t.elements=c+" "+a,j(b)}function f(a){var b=s[a[q]];return b||(b={},r++,a[q]=r,s[r]=b),b}function g(a,c,d){if(c||(c=b),l)return c.createElement(a);d||(d=f(c));var e;return e=d.cache[a]?d.cache[a].cloneNode():p.test(a)?(d.cache[a]=d.createElem(a)).cloneNode():d.createElem(a),!e.canHaveChildren||o.test(a)||e.tagUrn?e:d.frag.appendChild(e)}function h(a,c){if(a||(a=b),l)return a.createDocumentFragment();c=c||f(a);for(var e=c.frag.cloneNode(),g=0,h=d(),i=h.length;i>g;g++)e.createElement(h[g]);return e}function i(a,b){b.cache||(b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag()),a.createElement=function(c){return t.shivMethods?g(c,a,b):b.createElem(c)},a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+d().join().replace(/[\w\-:]+/g,function(a){return b.createElem(a),b.frag.createElement(a),'c("'+a+'")'})+");return n}")(t,b.frag)}function j(a){a||(a=b);var d=f(a);return!t.shivCSS||k||d.hasCSS||(d.hasCSS=!!c(a,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")),l||i(a,d),a}var k,l,m="3.7.3-pre",n=a.html5||{},o=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,p=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,q="_html5shiv",r=0,s={};!function(){try{var a=b.createElement("a");a.innerHTML="<xyz></xyz>",k="hidden"in a,l=1==a.childNodes.length||function(){b.createElement("a");var a=b.createDocumentFragment();return"undefined"==typeof a.cloneNode||"undefined"==typeof a.createDocumentFragment||"undefined"==typeof a.createElement}()}catch(c){k=!0,l=!0}}();var t={elements:n.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video",version:m,shivCSS:n.shivCSS!==!1,supportsUnknownElements:l,shivMethods:n.shivMethods!==!1,type:"default",shivDocument:j,createElement:g,createDocumentFragment:h,addElements:e};a.html5=t,j(b),"object"==typeof module&&module.exports&&(module.exports=t)}("undefined"!=typeof window?window:this,document);

view/peko/homeCheck/js/index.js

@@ -0,0 +1,133 @@
+/* eslint-disable semi */
+/* eslint-disable no-undef */
+let version = checkVersion()
+let urlData = getQueryString()
+const urlPrefix = getUrlPrefix()
+//获取url参数
+let channelData = urlData.channel
+//定义官方渠道包
+const channelDict = {
+  'peko0': 'https://image.lecheng163.com/peko_peko0.apk',
+  'peko1': 'https://image.lecheng163.com/peko_peko1.apk',
+  'peko2': 'https://image.lecheng163.com/peko_peko2.apk',
+  'peko3': 'https://image.lecheng163.com/peko_peko3.apk',
+  'peko4': 'https://image.lecheng163.com/peko_peko4.apk',
+  'peko5': 'https://image.lecheng163.com/peko_peko5.apk',
+  'peko6': 'https://image.lecheng163.com/peko_peko6.apk',
+  'peko7': 'https://image.lecheng163.com/peko_peko7.apk',
+  'peko8': 'https://image.lecheng163.com/peko_peko8.apk',
+  'peko9': 'https://image.lecheng163.com/peko_peko9.apk',
+  'peko10': 'https://image.lecheng163.com/peko_peko10.apk',
+  'gongzhonghao': 'https://image.lecheng163.com/peko_gongzhonghao.apk',
+  'zhaohui': 'https://image.lecheng163.com/zhaohui.apk'
+
+  // 'baomihua01': 'https://image.lecheng163.com/accompany_release_v_213_1_baomihua01_sign.apk'
+}
+
+function swiperFun() {
+  var swiper = new Swiper('.swiper', {
+    direction: 'vertical',
+    pagination: '.swiper-pagination',
+    paginationClickable: true,
+    loop: true,
+    autoplay: 4000,
+    // nextButton: ".swiper-button-next",
+    // prevButton: ".swiper-button-prev",
+
+  });
+}
+function swiperFun2() {
+  var swiper2 = new Swiper('.swiper2', {
+    direction: 'horizontal',
+    pagination: '.swiper-pagination',
+    paginationClickable: true,
+    loop: true,
+    autoplay: 4000,
+    // nextButton: ".swiper-button-next",
+    // prevButton: ".swiper-button-prev",
+
+  });
+}
+
+$(function () {
+
+  //判断url参数是否是与渠道包名一致
+  let androidUrl = null;
+  channelDict.hasOwnProperty(channelData) ? androidUrl = channelDict[channelData] : androidUrl = 'https://play.google.com/store/apps/details?id=com.vele.peko';
+  let iosUrl = 'http://doudouyue.com/8axv'   //ios企业包
+  //   let iosUrl = 'https://apps.apple.com/cn/app/id1571083482'   //ios商店包
+
+  if (version.ios) {
+    $('.button-wrapper').on('click', function () {
+      if (version.weixin) {
+        $('.tips').show()
+        return
+      }
+      window.location.href = iosUrl;
+    })
+
+  } else if (version.android) {
+    $('.button-wrapper').on('click', function () {
+      if (version.weixin) {
+        $('.tips').show()
+        return
+      }
+      window.location.href = androidUrl;
+    })
+  } else {
+    $('.button-wrapper').on('click', function () {
+      window.location.href = androidUrl;
+    })
+    $('.button2-wrapper').on('click', function () {
+      window.location.href = iosUrl;
+    })
+  }
+
+})
+
+$(function () {
+  $(document).ready(function () {
+    var deviceWidth = document.documentElement.clientWidth;
+    // if (deviceWidth > 768) {
+      document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+      swiperFun();
+    // } else {
+    //   document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
+    //   swiperFun2()
+    // }
+  });
+  window.onresize = function () {
+    var deviceWidth = document.documentElement.clientWidth;
+    // console.log('deviceWidth', deviceWidth);
+    // if (deviceWidth > 768) {
+      document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+      swiperFun();
+    // } else {
+    //   document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
+    //   swiperFun2()
+    // }
+  }
+  //跳转pc端充值 
+  $('.homePc .charge').click(function () {
+    window.location.href = urlPrefix + '/peko/modules/payPc/index.html?channelType=4';
+  })
+  // 跳转移动端h5充值
+  $('.homeM .charge').click(function () {
+    window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
+  })
+  // goglo跳转
+  $('.googlePlay').click(function () {
+    window.location.href = 'https://play.google.com/store/apps/details?id=com.vele.peko'
+  })
+  $('.appleStore').click(function () {
+    // console.log(version, 'version');
+    if (version.webKit && version.ios) {
+      window.location.href = 'itms-services:///?action=download-manifest&url=https://img.pekolive.com/distribute.plist'
+    } else {
+      window.location.href = 'http://doudouyue.com/h958'
+    }
+  })
+  $('.apk').click(function () {
+    window.location.href = 'https://img.pekolive.com/peko_official.apk'
+  })
+})

view/peko/homeCheck/js/respond.min.js

@@ -0,0 +1,6 @@
+/*! Respond.js v1.4.2: min/max-width media query polyfill
+ * Copyright 2014 Scott Jehl
+ * Licensed under MIT
+ * http://j.mp/respondjs */
+
+!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='&shy;<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){v(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},g=function(a){return a.replace(c.regex.minmaxwh,"").match(c.regex.other)};if(c.ajax=f,c.queue=d,c.unsupportedmq=g,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,comments:/\/\*[^*]*\*+([^/][^*]*\*+)*\//gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\(\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,maxw:/\(\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,minmaxwh:/\(\s*m(in|ax)\-(height|width)\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/gi,other:/\([^\)]*\)/g},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var h,i,j,k=a.document,l=k.documentElement,m=[],n=[],o=[],p={},q=30,r=k.getElementsByTagName("head")[0]||l,s=k.getElementsByTagName("base")[0],t=r.getElementsByTagName("link"),u=function(){var a,b=k.createElement("div"),c=k.body,d=l.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=k.createElement("body"),c.style.background="none"),l.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&l.insertBefore(c,l.firstChild),a=b.offsetWidth,f?l.removeChild(c):c.removeChild(b),l.style.fontSize=d,e&&(c.style.fontSize=e),a=j=parseFloat(a)},v=function(b){var c="clientWidth",d=l[c],e="CSS1Compat"===k.compatMode&&d||k.body[c]||d,f={},g=t[t.length-1],p=(new Date).getTime();if(b&&h&&q>p-h)return a.clearTimeout(i),i=a.setTimeout(v,q),void 0;h=p;for(var s in m)if(m.hasOwnProperty(s)){var w=m[s],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?j||u():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?j||u():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(n[w.rules]))}for(var C in o)o.hasOwnProperty(C)&&o[C]&&o[C].parentNode===r&&r.removeChild(o[C]);o.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=k.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,r.insertBefore(E,g.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(k.createTextNode(F)),o.push(E)}},w=function(a,b,d){var e=a.replace(c.regex.comments,"").replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},i=!f&&d;b.length&&(b+="/"),i&&(f=1);for(var j=0;f>j;j++){var k,l,o,p;i?(k=d,n.push(h(a))):(k=e[j].match(c.regex.findStyles)&&RegExp.$1,n.push(RegExp.$2&&h(RegExp.$2))),o=k.split(","),p=o.length;for(var q=0;p>q;q++)l=o[q],g(l)||m.push({media:l.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:n.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}v()},x=function(){if(d.length){var b=d.shift();f(b.href,function(c){w(c,b.href,b.media),p[b.href]=!0,a.setTimeout(function(){x()},0)})}},y=function(){for(var b=0;b<t.length;b++){var c=t[b],e=c.href,f=c.media,g=c.rel&&"stylesheet"===c.rel.toLowerCase();e&&g&&!p[e]&&(c.styleSheet&&c.styleSheet.rawCssText?(w(c.styleSheet.rawCssText,e,f),p[e]=!0):(!/^([a-zA-Z:]*\/\/)/.test(e)&&!s||e.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"===e.substring(0,2)&&(e=a.location.protocol+e),d.push({href:e,media:f})))}x()};y(),c.update=y,c.getEmValue=u,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);

view/peko/homeCheck/js/utf.js

@@ -0,0 +1,68 @@
+/* utf.js - UTF-8 <=> UTF-16 convertion
+ *
+ * Copyright (C) 1999 Masanao Izumo <iz@onicos.co.jp>
+ * Version: 1.0
+ * LastModified: Dec 25 1999
+ * This library is free.  You can redistribute it and/or modify it.
+ */
+
+/*
+ * Interfaces:
+ * utf8 = utf16to8(utf16);
+ * utf16 = utf16to8(utf8);
+ */
+
+function utf16to8(str) {
+    var out, i, len, c;
+
+    out = "";
+    len = str.length;
+    for(i = 0; i < len; i++) {
+	c = str.charCodeAt(i);
+	if ((c >= 0x0001) && (c <= 0x007F)) {
+	    out += str.charAt(i);
+	} else if (c > 0x07FF) {
+	    out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
+	    out += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));
+	    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
+	} else {
+	    out += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));
+	    out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));
+	}
+    }
+    return out;
+}
+
+function utf8to16(str) {
+    var out, i, len, c;
+    var char2, char3;
+
+    out = "";
+    len = str.length;
+    i = 0;
+    while(i < len) {
+	c = str.charCodeAt(i++);
+	switch(c >> 4)
+	{ 
+	  case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
+	    // 0xxxxxxx
+	    out += str.charAt(i-1);
+	    break;
+	  case 12: case 13:
+	    // 110x xxxx   10xx xxxx
+	    char2 = str.charCodeAt(i++);
+	    out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
+	    break;
+	  case 14:
+	    // 1110 xxxx  10xx xxxx  10xx xxxx
+	    char2 = str.charCodeAt(i++);
+	    char3 = str.charCodeAt(i++);
+	    out += String.fromCharCode(((c & 0x0F) << 12) |
+					   ((char2 & 0x3F) << 6) |
+					   ((char3 & 0x3F) << 0));
+	    break;
+	}
+    }
+
+    return out;
+}

view/peko/homeCheck/support.html

@@ -0,0 +1,20 @@
+<!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>peko技术服务支持</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+    <style>
+        *{
+            margin: 0;
+            padding: 0;
+        }
+    </style>
+</head>
+<body>
+    <img src="./images/support.png" alt="" style="width: 100%;">
+    <!-- <script src="../../common/js/flexible.js"></script> -->
+</body>
+</html>

view/peko/modules/act-treasureSnatching/css/index.css

@@ -0,0 +1,345 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 0.7333333333rem;
+}
+
+.back {
+  width: 0.7466666667rem;
+  height: 0.7466666667rem;
+  position: fixed;
+  z-index: 999;
+  left: 0.5333333333rem;
+  top: 0.6933333333rem;
+}
+
+.title {
+  width: 4.8rem;
+  height: 0.48rem;
+  display: block;
+  margin: 0 auto 0.6666666667rem;
+}
+
+.my {
+  width: 100%;
+  height: 2.4266666667rem;
+  background: url(../images/myBg.png) no-repeat;
+  background-size: 100% 100%;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  z-index: 9;
+  overflow: hidden;
+}
+.my .tx {
+  width: 1.1733333333rem;
+  height: 1.1733333333rem;
+  background: #005E15;
+  border: 0.0133333333rem solid #fff;
+  margin-top: 0.4133333333rem;
+  margin-left: 0.4133333333rem;
+  border-radius: 50%;
+  margin-right: 0.0666666667rem;
+  float: left;
+}
+.my .name {
+  float: left;
+  width: 2.4rem;
+  margin-top: 0.88rem;
+  color: #fff;
+  font-size: 0.3466666667rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.my .but {
+  width: 1.0666666667rem;
+  height: 0.4266666667rem;
+  line-height: 0.4266666667rem;
+  border-radius: 0.1066666667rem;
+  text-align: center;
+  color: #1F5764;
+  font-size: 0.32rem;
+  background: linear-gradient(0deg, #3AEAC7 0%, #FFFEBB 100%);
+  margin-top: 0.8533333333rem;
+  float: right;
+  margin-right: 0.2666666667rem;
+  margin-left: 0.12rem;
+}
+.my .num2 {
+  margin-top: 0.92rem;
+  color: #fff;
+  font-size: 0.32rem;
+  float: right;
+}
+.my .icon2 {
+  width: 0.64rem;
+  height: 0.64rem;
+  display: block;
+  margin-top: 0.7466666667rem;
+  margin-right: 0.12rem;
+  float: right;
+  margin-left: 0.3333333333rem;
+}
+.my .num1 {
+  margin-top: 0.92rem;
+  color: #fff;
+  font-size: 0.32rem;
+  float: right;
+}
+.my .icon1 {
+  width: 0.64rem;
+  height: 0.64rem;
+  display: block;
+  margin-top: 0.7466666667rem;
+  margin-right: 0.12rem;
+  float: right;
+}
+
+ul {
+  width: 9.3333333333rem;
+  margin: 0.6266666667rem auto 0;
+  height: 9.9333333333rem;
+  overflow-y: scroll;
+  display: flex;
+  justify-content: space-between;
+  flex-flow: row wrap;
+}
+ul::-webkit-scrollbar {
+  width: 0;
+}
+ul li {
+  width: 4.4rem;
+  height: 6.2133333333rem;
+  margin-bottom: 0.4533333333rem;
+  background: url(../images/prop.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+}
+ul li .title {
+  position: absolute;
+  width: 100%;
+  text-align: center;
+  left: 0;
+  top: 0.4933333333rem;
+  color: #1F5764;
+  font-size: 0.32rem;
+}
+ul li .giftImg {
+  width: 1.8666666667rem;
+  height: 1.8666666667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 1.4533333333rem;
+}
+ul li .name {
+  text-align: center;
+  color: #fff;
+  font-size: 0.32rem;
+  position: absolute;
+  left: 0;
+  width: 100%;
+  top: 3.72rem;
+}
+ul li .zs {
+  width: 100%;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+  display: flex;
+  justify-content: center;
+  position: absolute;
+  top: 4.12rem;
+  left: 0;
+}
+ul li .zs .icon {
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  display: block;
+}
+ul li .zs b {
+  display: block;
+  color: #fff;
+  font-size: 0.32rem;
+}
+ul li .but {
+  width: 2.1333333333rem;
+  height: 0.6666666667rem;
+  line-height: 0.6666666667rem;
+  position: absolute;
+  bottom: 0.7066666667rem;
+  left: 50%;
+  transform: translateX(-50%);
+  text-align: center;
+  color: #1F5764;
+  font-size: 0.32rem;
+  background: linear-gradient(0deg, #3AEAC7 0%, #FFFEBB 100%);
+  border-radius: 0.1066666667rem;
+}
+
+.buy {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.8);
+  z-index: 999;
+  display: none;
+}
+.buy .buy_in {
+  width: 7.4933333333rem;
+  height: 7.6rem;
+  background: url(../images/pub.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  left: 50%;
+  top: 40%;
+  transform: translate(-50%, -50%);
+}
+.buy .buy_in .title {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  top: 1.4266666667rem;
+  color: #fff;
+  font-size: 0.4rem;
+  text-align: center;
+}
+.buy .buy_in .num {
+  position: absolute;
+  left: 2.04rem;
+  top: 2.6666666667rem;
+  width: 3.4666666667rem;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+}
+.buy .buy_in .num b {
+  display: inline-block;
+  font-size: 0.3466666667rem;
+  color: #fff;
+  margin-right: 0.2266666667rem;
+  float: left;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+}
+.buy .buy_in .num .box {
+  float: left;
+  display: inline-block;
+  width: 2.4rem;
+  height: 0.5866666667rem;
+  border-radius: 0.5866666667rem;
+  background: #007F6C;
+  position: relative;
+}
+.buy .buy_in .num .box input {
+  background: none;
+  outline: none;
+  border: none;
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  height: 100%;
+  width: 0.9rem;
+  color: #FEF8A8;
+  font-size: 0.3466666667rem;
+  font-weight: bold;
+  text-align: center;
+}
+.buy .buy_in .num .box .subtraction {
+  position: absolute;
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  left: 0;
+  top: 0;
+  background: url(../images/subtraction.png) no-repeat;
+  background-size: 100% 100%;
+}
+.buy .buy_in .num .box .add {
+  position: absolute;
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  right: 0;
+  top: 0;
+  background: url(../images/add.png) no-repeat;
+  background-size: 100% 100%;
+}
+.buy .buy_in .day {
+  position: absolute;
+  width: 6rem;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+  left: 2.04rem;
+  top: 3.8133333333rem;
+}
+.buy .buy_in .day b {
+  font-size: 0.3466666667rem;
+  color: #fff;
+  margin-right: 0.2266666667rem;
+  float: left;
+  display: block;
+}
+.buy .buy_in .day span {
+  color: #FEF8A8;
+  font-size: 0.3466666667rem;
+}
+.buy .buy_in .day i {
+  color: #FEF8A8;
+  font-size: 0.3466666667rem;
+  font-style: normal;
+}
+.buy .buy_in .zs {
+  position: absolute;
+  width: 6rem;
+  height: 0.5866666667rem;
+  line-height: 0.5866666667rem;
+  left: 2.04rem;
+  top: 4.8533333333rem;
+}
+.buy .buy_in .zs b {
+  font-size: 0.3466666667rem;
+  color: #fff;
+  margin-right: 0.2266666667rem;
+  float: left;
+  display: block;
+}
+.buy .buy_in .zs span {
+  color: #FEF8A8;
+  font-size: 0.3466666667rem;
+}
+.buy .buy_in .zs i {
+  color: #FEF8A8;
+  font-size: 0.3466666667rem;
+  font-style: normal;
+}
+.buy .buy_in .close {
+  width: 2.7733333333rem;
+  height: 0.8533333333rem;
+  line-height: 0.8533333333rem;
+  text-align: center;
+  color: #008573;
+  font-size: 0.3466666667rem;
+  position: absolute;
+  left: 0.6533333333rem;
+  bottom: 1.12rem;
+  background: url(../images/close.png) no-repeat;
+  background-size: 100% 100%;
+}
+.buy .buy_in .ok {
+  width: 2.7733333333rem;
+  height: 0.8533333333rem;
+  line-height: 0.8533333333rem;
+  text-align: center;
+  color: #8A4801;
+  font-size: 0.3466666667rem;
+  position: absolute;
+  right: 0.6533333333rem;
+  bottom: 1.12rem;
+  background: url(../images/close.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+/*# sourceMappingURL=index.css.map */

view/peko/modules/act-treasureSnatching/css/index.scss

@@ -0,0 +1,386 @@
+@function px2rem($px, $rem:75) {
+    @return $px / $rem+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    // overflow-y: none;
+    box-sizing: border-box;
+    padding-top: px2rem(55, );
+    // background: #00B7A3;
+}
+
+.back {
+    width: px2rem(56, );
+    height: px2rem(56, );
+    position: fixed;
+    z-index: 999;
+    left: px2rem(40, );
+    top: px2rem(52, );
+}
+
+.title {
+    width: px2rem(360, );
+    height: px2rem(36, );
+    display: block;
+    margin: 0 auto px2rem(50, );
+}
+
+.my {
+    width: 100%;
+    height: px2rem(182, );
+    background: url(../images/myBg.png) no-repeat;
+    background-size: 100% 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 9;
+    overflow: hidden;
+
+    .tx {
+        width: px2rem(88, );
+        height: px2rem(88, );
+        background: #005E15;
+        border: px2rem(1, ) solid #fff;
+        margin-top: px2rem(31, );
+        margin-left: px2rem(31, );
+        border-radius: 50%;
+        margin-right: px2rem(5, );
+        float: left;
+    }
+
+    .name {
+        float: left;
+        width: 2.4rem;
+        margin-top: px2rem(66, );
+        color: #fff;
+        font-size: px2rem(26, );
+        overflow: hidden; //超出隐藏
+        white-space: nowrap; //不折行
+        text-overflow: ellipsis; //溢出显示省略号
+    }
+
+    .but {
+        width: px2rem(80, );
+        height: px2rem(32, );
+        line-height: px2rem(32, );
+        border-radius: px2rem(8, );
+        text-align: center;
+        color: #1F5764;
+        font-size: px2rem(24, );
+        background: linear-gradient(0deg, #3AEAC7 0%, #FFFEBB 100%);
+        margin-top: px2rem(64, );
+        float: right;
+        margin-right: px2rem(20, );
+        margin-left: px2rem(9, );
+    }
+
+    .num2 {
+        margin-top: px2rem(69, );
+        color: #fff;
+        font-size: px2rem(24, );
+        float: right;
+    }
+
+    .icon2 {
+        width: px2rem(48, );
+        height: px2rem(48, );
+        display: block;
+        margin-top: px2rem(56, );
+        // background: #FFF3AE;
+        margin-right: px2rem(9, );
+        float: right;
+        margin-left: px2rem(25, );
+    }
+
+    .num1 {
+        margin-top: px2rem(69, );
+        color: #fff;
+        font-size: px2rem(24, );
+        float: right;
+    }
+
+    .icon1 {
+        width: px2rem(48, );
+        height: px2rem(48, );
+        display: block;
+        margin-top: px2rem(56, );
+        // background: #FFF3AE;
+        margin-right: px2rem(9, );
+        float: right;
+    }
+}
+
+ul {
+    width: px2rem(700, );
+    margin: px2rem(47, ) auto 0;
+    height: px2rem(745, );
+    // background: pink;
+    overflow-y: scroll;
+    display: flex;
+    justify-content: space-between;
+    flex-flow: row wrap;
+
+    &::-webkit-scrollbar {
+        width: 0;
+    }
+
+    li {
+        width: px2rem(330, );
+        height: px2rem(466, );
+        margin-bottom: px2rem(34, );
+        background: url(../images/prop.png) no-repeat;
+        background-size: 100% 100%;
+        position: relative;
+
+        .title {
+            position: absolute;
+            width: 100%;
+            text-align: center;
+            left: 0;
+            top: px2rem(37, );
+            color: #1F5764;
+            font-size: px2rem(24, );
+        }
+
+        .giftImg {
+            width: px2rem(140, );
+            height: px2rem(140, );
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: px2rem(109, );
+        }
+
+        .name {
+            text-align: center;
+            color: #fff;
+            font-size: px2rem(24, );
+            position: absolute;
+            left: 0;
+            width: 100%;
+            top: px2rem(279, );
+        }
+
+        .zs {
+            width: 100%;
+            height: px2rem(44, );
+            line-height: px2rem(44, );
+            display: flex;
+            justify-content: center;
+            position: absolute;
+            top: px2rem(309, );
+            left: 0;
+
+            .icon {
+                width: px2rem(44, );
+                height: px2rem(44, );
+                display: block;
+            }
+
+            b {
+                display: block;
+                color: #fff;
+                font-size: px2rem(24, );
+            }
+        }
+
+        .but {
+            width: px2rem(160, );
+            height: px2rem(50, );
+            line-height: px2rem(50, );
+            position: absolute;
+            bottom: px2rem(53, );
+            left: 50%;
+            transform: translateX(-50%);
+            text-align: center;
+            color: #1F5764;
+            font-size: px2rem(24, );
+            background: linear-gradient(0deg, #3AEAC7 0%, #FFFEBB 100%);
+            border-radius: px2rem(8, );
+        }
+    }
+}
+
+.buy {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0, 0, 0, .8);
+    z-index: 999;
+    display: none;
+
+    .buy_in {
+        width: px2rem(562, );
+        height: px2rem(570, );
+        background: url(../images/pub.png) no-repeat;
+        background-size: 100% 100%;
+        position: relative;
+        left: 50%;
+        top: 40%;
+        transform: translate(-50%, -50%);
+
+        .title {
+            width: 100%;
+            position: absolute;
+            left: 0;
+            top: px2rem(107, );
+            color: #fff;
+            font-size: px2rem(30, );
+            text-align: center;
+        }
+
+        .num {
+            position: absolute;
+            left: px2rem(153, );
+            top: px2rem(200, );
+            width: px2rem(260, );
+            height: px2rem(44, );
+            line-height: px2rem(44, );
+
+            b {
+                display: inline-block;
+                font-size: px2rem(26, );
+                color: #fff;
+                margin-right: px2rem(17, );
+                float: left;
+                height: px2rem(44, );
+                line-height: px2rem(44, );
+            }
+
+            .box {
+                float: left;
+                display: inline-block;
+                width: px2rem(180, );
+                height: px2rem(44, );
+                border-radius: px2rem(44, );
+                background: #007F6C;
+                position: relative;
+
+                input {
+                    background: none;
+                    outline: none;
+                    border: none;
+                    position: absolute;
+                    top: 0;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    height: 100%;
+                    width: 0.9rem;
+                    color: #FEF8A8;
+                    font-size: px2rem(26, );
+                    font-weight: bold;
+                    text-align: center;
+                }
+
+                .subtraction {
+                    position: absolute;
+                    width: px2rem(44, );
+                    height: px2rem(44, );
+                    left: 0;
+                    top: 0;
+                    background: url(../images/subtraction.png) no-repeat;
+                    background-size: 100% 100%;
+                }
+
+                .add {
+                    position: absolute;
+                    width: px2rem(44, );
+                    height: px2rem(44, );
+                    right: 0;
+                    top: 0;
+                    background: url(../images/add.png) no-repeat;
+                    background-size: 100% 100%;
+                }
+            }
+        }
+
+        .day {
+            position: absolute;
+            width: px2rem(450, );
+            height: px2rem(44, );
+            line-height: px2rem(44, );
+            left: px2rem(153, );
+            top: px2rem(286, );
+
+            b {
+                font-size: px2rem(26, );
+                color: #fff;
+                margin-right: px2rem(17, );
+                float: left;
+                display: block;
+            }
+
+            span {
+                color: #FEF8A8;
+                font-size: px2rem(26, );
+            }
+
+            i {
+                color: #FEF8A8;
+                font-size: px2rem(26, );
+                font-style: normal;
+            }
+        }
+
+        .zs {
+            position: absolute;
+            width: px2rem(450, );
+            height: px2rem(44, );
+            line-height: px2rem(44, );
+            left: px2rem(153, );
+            top: px2rem(364, );
+
+            b {
+                font-size: px2rem(26, );
+                color: #fff;
+                margin-right: px2rem(17, );
+                float: left;
+                display: block;
+            }
+
+            span {
+                color: #FEF8A8;
+                font-size: px2rem(26, );
+            }
+
+            i {
+                color: #FEF8A8;
+                font-size: px2rem(26, );
+                font-style: normal;
+            }
+        }
+
+        .close {
+            width: px2rem(208, );
+            height: px2rem(64, );
+            line-height: px2rem(64, );
+            text-align: center;
+            color: #008573;
+            font-size: px2rem(26, );
+            position: absolute;
+            left: px2rem(49, );
+            bottom: px2rem(84, );
+            background: url(../images/close.png) no-repeat;
+            background-size: 100% 100%;
+        }
+
+        .ok {
+            width: px2rem(208, );
+            height: px2rem(64, );
+            line-height: px2rem(64, );
+            text-align: center;
+            color: #8A4801;
+            font-size: px2rem(26, );
+            position: absolute;
+            right: px2rem(49, );
+            bottom: px2rem(84, );
+            background: url(../images/close.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+}

view/peko/modules/act-treasureSnatching/css/list.css

@@ -0,0 +1,140 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 0.7333333333rem;
+}
+
+.back {
+  width: 0.7466666667rem;
+  height: 0.7466666667rem;
+  position: fixed;
+  z-index: 999;
+  left: 0.5333333333rem;
+  top: 0.6933333333rem;
+}
+
+.title {
+  width: 4.8rem;
+  height: 0.48rem;
+  display: block;
+  margin: 0 auto 0.6666666667rem;
+}
+
+.tab {
+  width: 5.7333333333rem;
+  height: 0.3866666667rem;
+  margin: 0.68rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+.tab div {
+  width: 2.4rem;
+  color: #fff;
+  font-size: 0.4rem;
+  position: relative;
+  white-space: nowrap;
+}
+.tab div span {
+  position: absolute;
+  width: 1.6rem;
+  height: 0.1066666667rem;
+  border-radius: 0.1066666667rem;
+  background: linear-gradient(90deg, #69FFEB 0%, #EAFF89 100%);
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -0.1466666667rem;
+  display: none;
+}
+.tab .active {
+  font-weight: bold;
+}
+.tab .active span {
+  display: block;
+}
+
+p {
+  width: 100%;
+  text-align: center;
+  margin: 0.36rem auto 0.3066666667rem;
+  color: #59FDFF;
+  font-size: 0.2666666667rem;
+}
+
+ul {
+  width: 9.2rem;
+  height: 10.1333333333rem;
+  margin: 0 auto;
+  overflow-y: scroll;
+}
+ul::-webkit-scrollbar {
+  width: 0;
+}
+ul li {
+  width: 100%;
+  height: 1.4666666667rem;
+  background: #00A69D;
+  border-radius: 0.1066666667rem;
+  margin-bottom: 0.2266666667rem;
+}
+ul li .num {
+  float: left;
+  height: 100%;
+  line-height: 1.4666666667rem;
+  font-size: 0.4266666667rem;
+  color: #fff;
+  font-weight: bold;
+  margin-left: 0.5333333333rem;
+  margin-right: 0.56rem;
+}
+ul li .tx {
+  display: block;
+  float: left;
+  width: 1.3066666667rem;
+  height: 1.3066666667rem;
+  border-radius: 50%;
+  border: 0.0133333333rem solid #FFE8AA;
+  background: #00332C;
+  margin-top: 0.08rem;
+  margin-right: 0.2133333333rem;
+}
+ul li .name {
+  width: 2.76rem;
+  height: 100%;
+  line-height: 1.4666666667rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #fff;
+  font-size: 0.3466666667rem;
+  float: left;
+}
+ul li .icon {
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  margin-top: 0.4rem;
+  float: right;
+}
+ul li .score {
+  float: right;
+  margin-right: 0.4rem;
+  color: #FFE8AA;
+  font-size: 0.3466666667rem;
+  height: 100%;
+  line-height: 1.4666666667rem;
+  margin-left: 0.1rem;
+}
+ul .active .num {
+  width: 0.8266666667rem;
+  height: 1.0666666667rem;
+  line-height: 0.8rem;
+  text-align: center;
+  background: url(../images/No.png) no-repeat;
+  background-size: 100% 100%;
+  float: left;
+  margin-right: 0.3066666667rem;
+  margin-left: 0.2133333333rem;
+}
+
+/*# sourceMappingURL=list.css.map */

view/peko/modules/act-treasureSnatching/css/list.scss

@@ -0,0 +1,160 @@
+@function px2rem($px, $rem:75) {
+    @return $px / $rem+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    // overflow-y: none;
+    box-sizing: border-box;
+    padding-top: px2rem(55, );
+}
+
+.back {
+    width: px2rem(56, );
+    height: px2rem(56, );
+    position: fixed;
+    z-index: 999;
+    left: px2rem(40, );
+    top: px2rem(52, );
+}
+
+.title {
+    width: px2rem(360, );
+    height: px2rem(36, );
+    display: block;
+    margin: 0 auto px2rem(50, );
+}
+
+.tab {
+    width: px2rem(430, );
+    height: px2rem(29, );
+    margin: px2rem(51, ) auto 0;
+    display: flex;
+    justify-content: space-between;
+
+    div {
+        width: px2rem(180, );
+        color: #fff;
+        font-size: px2rem(30, );
+        position: relative;
+        white-space: nowrap;
+
+        span {
+            position: absolute;
+            width: px2rem(120, );
+            height: px2rem(8, );
+            border-radius: px2rem(8, );
+            background: linear-gradient(90deg, #69FFEB 0%, #EAFF89 100%);
+            left: 50%;
+            transform: translateX(-50%);
+            bottom: px2rem(-11, );
+            display: none;
+        }
+    }
+
+    .active {
+        font-weight: bold;
+
+        span {
+            display: block;
+        }
+    }
+}
+
+p {
+    width: 100%;
+    text-align: center;
+    margin: px2rem(27, ) auto px2rem(23, );
+    color: #59FDFF;
+    font-size: px2rem(20, );
+}
+
+ul {
+    width: px2rem(690, );
+    height: px2rem(760, );
+    // background: pink;
+    margin: 0 auto;
+    overflow-y: scroll;
+
+    &::-webkit-scrollbar {
+        width: 0;
+    }
+
+    li {
+        width: 100%;
+        height: px2rem(110, );
+        background: #00A69D;
+        border-radius: px2rem(8, );
+        margin-bottom: px2rem(17, );
+
+        .num {
+            float: left;
+            height: 100%;
+            line-height: px2rem(110, );
+            font-size: px2rem(32, );
+            color: #fff;
+            font-weight: bold;
+            margin-left: px2rem(40, );
+            margin-right: px2rem(42, );
+        }
+
+        .tx {
+            display: block;
+            float: left;
+            width: px2rem(98, );
+            height: px2rem(98, );
+            border-radius: 50%;
+            border: px2rem(1, ) solid #FFE8AA;
+            background: #00332C;
+            margin-top: px2rem(6, );
+            margin-right: px2rem(16, );
+        }
+
+        .name {
+            width: px2rem(207, );
+            height: 100%;
+            line-height: px2rem(110, );
+            overflow: hidden; //超出隐藏
+            white-space: nowrap; //不折行
+            text-overflow: ellipsis; //溢出显示省略号
+            color: #fff;
+            font-size: px2rem(26, );
+            float: left;
+            // margin-right: px2rem(90, );
+        }
+
+        .icon {
+            width: px2rem(44, );
+            height: px2rem(44, );
+            // background: #2D4319;
+            margin-top: 0.4rem;
+            float: right;
+        }
+
+        .score {
+            float: right;
+            margin-right: px2rem(30, );
+            color: #FFE8AA;
+            font-size: px2rem(26, );
+            height: 100%;
+            line-height: px2rem(110, );
+            margin-left: 0.1rem;
+        }
+    }
+
+    .active {
+        .num {
+            width: px2rem(62, );
+            height: px2rem(80, );
+            line-height: px2rem(60, );
+            text-align: center;
+            background: url(../images/No.png) no-repeat;
+            background-size: 100% 100%;
+            float: left;
+            margin-right: px2rem(23, );
+            margin-left: px2rem(16, );
+        }
+    }
+}

view/peko/modules/act-treasureSnatching/css/record.css

@@ -0,0 +1,92 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 0.7333333333rem;
+}
+
+.back {
+  width: 0.7466666667rem;
+  height: 0.7466666667rem;
+  position: fixed;
+  z-index: 999;
+  left: 0.5333333333rem;
+  top: 0.6933333333rem;
+}
+
+.title {
+  width: 4.8rem;
+  height: 0.48rem;
+  display: block;
+  margin: 0 auto 0.6666666667rem;
+}
+
+.ul {
+  width: 9.2rem;
+  height: 11.3333333333rem;
+  overflow-y: scroll;
+  margin: 0.6rem auto 0;
+  box-sizing: border-box;
+  padding-top: 0.4533333333rem;
+}
+.ul::-webkit-scrollbar {
+  width: 0;
+}
+.ul li {
+  width: 100%;
+  margin-bottom: 0.6133333333rem;
+  box-sizing: border-box;
+  background: #00A69D;
+  border-radius: 0.1066666667rem;
+  position: relative;
+  height: 1.4666666667rem;
+  line-height: 1.4666666667rem;
+}
+.ul li .txBox {
+  width: 1.8666666667rem;
+  height: 1.8666666667rem;
+  border-radius: 0.16rem;
+  border: 0.0133333333rem solid #FFE8AA;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  background: #007983;
+}
+.ul li .txBox img {
+  position: absolute;
+  width: 1.4533333333rem;
+  height: 1.4533333333rem;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+.ul li .giftName {
+  width: 2.6666666667rem;
+  margin: 0 0.6rem 0 2.08rem;
+  color: #fff;
+  font-size: 0.3466666667rem;
+  float: left;
+}
+.ul li .score {
+  color: #FFE8AA;
+  font-size: 0.3466666667rem;
+  float: left;
+}
+.ul li .probability {
+  color: #FFE8AA;
+  font-size: 0.3466666667rem;
+  float: right;
+  margin-right: 0.3333333333rem;
+}
+.ul .active {
+  width: 100%;
+  height: 8.9333333333rem;
+  background: url(../images/record_not.png) no-repeat;
+  background-size: 100% 100%;
+}
+.ul .active div {
+  display: none;
+}
+
+/*# sourceMappingURL=record.css.map */

view/peko/modules/act-treasureSnatching/css/record.scss

@@ -0,0 +1,106 @@
+@function px2rem($px, $rem:75) {
+    @return $px / $rem+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    // overflow-y: none;
+    box-sizing: border-box;
+    padding-top: px2rem(55, );
+}
+
+.back {
+    width: px2rem(56, );
+    height: px2rem(56, );
+    position: fixed;
+    z-index: 999;
+    left: px2rem(40, );
+    top: px2rem(52, );
+}
+
+.title {
+    width: px2rem(360, );
+    height: px2rem(36, );
+    display: block;
+    margin: 0 auto px2rem(50, );
+}
+
+.ul {
+    width: px2rem(690, );
+    height: px2rem(850, );
+    overflow-y: scroll;
+    margin: px2rem(45, ) auto 0;
+    box-sizing: border-box;
+    padding-top: px2rem(34, );
+    // background: pink;
+
+    &::-webkit-scrollbar {
+        width: 0;
+    }
+
+    li {
+        width: 100%;
+        margin-bottom: px2rem(46, );
+        box-sizing: border-box;
+        background: #00A69D;
+        border-radius: px2rem(8, );
+        position: relative;
+        height: px2rem(110, );
+        line-height: px2rem(110, );
+
+        .txBox {
+            width: px2rem(140, );
+            height: px2rem(140, );
+            border-radius: px2rem(12, );
+            border: px2rem(1, ) solid #FFE8AA;
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            background: #007983;
+
+            img {
+                position: absolute;
+                width: px2rem(109, );
+                height: px2rem(109, );
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%, -50%);
+            }
+        }
+
+        .giftName {
+            width: px2rem(200, );
+            margin: 0 0.6rem 0 2.08rem;
+            color: #fff;
+            font-size: px2rem(26, );
+            float: left;
+        }
+
+        .score {
+            color: #FFE8AA;
+            font-size: px2rem(26, );
+            float: left;
+        }
+
+        .probability {
+            color: #FFE8AA;
+            font-size: px2rem(26, );
+            float: right;
+            margin-right: px2rem(25, );
+        }
+    }
+
+    .active {
+        width: 100%;
+        height: px2rem(670, );
+        background: url(../images/record_not.png) no-repeat;
+        background-size: 100% 100%;
+
+        // display: none;
+        div {
+            display: none;
+        }
+    }
+}

view/peko/modules/act-treasureSnatching/css/rule.css

@@ -0,0 +1,141 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  padding-top: 0.7333333333rem;
+}
+
+.back {
+  width: 0.7466666667rem;
+  height: 0.7466666667rem;
+  position: fixed;
+  z-index: 999;
+  left: 0.5333333333rem;
+  top: 0.6933333333rem;
+}
+
+.title {
+  width: 4.8rem;
+  height: 0.48rem;
+  display: block;
+  margin: 0 auto 0.6666666667rem;
+}
+
+.tab {
+  width: 4.6666666667rem;
+  height: 0.3866666667rem;
+  display: flex;
+  justify-content: space-between;
+  margin: 0 auto 0;
+}
+.tab div {
+  width: 1.6rem;
+  color: #fff;
+  font-size: 0.4rem;
+  position: relative;
+  text-align: center;
+  white-space: nowrap;
+}
+.tab div span {
+  width: 1.6rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -0.16rem;
+  height: 0.1066666667rem;
+  border-radius: 0.1066666667rem;
+  background: linear-gradient(90deg, #69FFEB 0%, #EAFF89 100%);
+  display: none;
+}
+.tab .active {
+  font-weight: bold;
+  font-size: 0.4rem;
+}
+.tab .active span {
+  display: block;
+}
+
+.tab1 {
+  width: 9.2rem;
+  height: 10.2666666667rem;
+  overflow-y: scroll;
+  margin: 0.6rem auto 0;
+  box-sizing: border-box;
+  padding-top: 0.4533333333rem;
+}
+.tab1::-webkit-scrollbar {
+  width: 0;
+}
+.tab1 li {
+  width: 100%;
+  margin-bottom: 0.6133333333rem;
+  box-sizing: border-box;
+  background: #00A69D;
+  border-radius: 0.1066666667rem;
+  position: relative;
+  height: 1.4666666667rem;
+  line-height: 1.4666666667rem;
+}
+.tab1 li .txBox {
+  width: 1.8666666667rem;
+  height: 1.8666666667rem;
+  border-radius: 0.16rem;
+  border: 0.0133333333rem solid #FFE8AA;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  background: #007983;
+}
+.tab1 li .txBox img {
+  position: absolute;
+  width: 1.4533333333rem;
+  height: 1.4533333333rem;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+.tab1 li .giftName {
+  width: 2.6666666667rem;
+  margin: 0 0.2666666667rem 0 2.08rem;
+  color: #fff;
+  font-size: 0.3466666667rem;
+  float: left;
+}
+.tab1 li .icon {
+  display: block;
+  float: left;
+  width: 0.5866666667rem;
+  height: 0.5866666667rem;
+  margin-top: 0.4rem;
+  margin-right: 0.1733333333rem;
+}
+.tab1 li .score {
+  color: #FFE8AA;
+  font-size: 0.3466666667rem;
+  float: left;
+}
+.tab1 li .probability {
+  color: #FFE8AA;
+  font-size: 0.3466666667rem;
+  float: right;
+  margin-right: 0.32rem;
+}
+
+.tab2 {
+  width: 9.2rem;
+  height: 10.6666666667rem;
+  margin: 0.4666666667rem auto 0;
+  background: #00A69D;
+  border-radius: 0.2133333333rem;
+  overflow: hidden;
+  display: none;
+}
+.tab2 img {
+  width: 8.32rem;
+  height: 10.3866666667rem;
+  margin: 0.32rem auto 0;
+  display: block;
+}
+
+/*# sourceMappingURL=rule.css.map */

view/peko/modules/act-treasureSnatching/css/rule.scss

@@ -0,0 +1,160 @@
+@function px2rem($px, $rem:75) {
+    @return $px / $rem+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    // overflow-y: none;
+    box-sizing: border-box;
+    padding-top: px2rem(55, );
+}
+
+.back {
+    width: px2rem(56, );
+    height: px2rem(56, );
+    position: fixed;
+    z-index: 999;
+    left: px2rem(40, );
+    top: px2rem(52, );
+}
+
+// 活动规则
+.title {
+    width: px2rem(360, );
+    height: px2rem(36, );
+    display: block;
+    margin: 0 auto px2rem(50, );
+}
+
+.tab {
+    width: px2rem(350, );
+    height: px2rem(29, );
+    display: flex;
+    justify-content: space-between;
+    margin: 0 auto 0;
+
+    div {
+        width: px2rem(120, );
+        color: #fff;
+        font-size: px2rem(30, );
+        position: relative;
+        text-align: center;
+        white-space: nowrap;
+
+        span {
+            width: px2rem(120, );
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            bottom: px2rem(-12, );
+            height: px2rem(8, );
+            border-radius: px2rem(8, );
+            background: linear-gradient(90deg, #69FFEB 0%, #EAFF89 100%);
+            display: none;
+        }
+    }
+
+    .active {
+        font-weight: bold;
+        font-size: px2rem(30, );
+
+        span {
+            display: block;
+        }
+    }
+}
+
+.tab1 {
+    width: px2rem(690, );
+    height: px2rem(770, );
+    overflow-y: scroll;
+    margin: px2rem(45, ) auto 0;
+    box-sizing: border-box;
+    padding-top: px2rem(34, );
+    // background: pink;
+
+    &::-webkit-scrollbar {
+        width: 0;
+    }
+
+    li {
+        width: 100%;
+        margin-bottom: px2rem(46, );
+        box-sizing: border-box;
+        background: #00A69D;
+        border-radius: px2rem(8, );
+        position: relative;
+        height: px2rem(110, );
+        line-height: px2rem(110, );
+
+        .txBox {
+            width: px2rem(140, );
+            height: px2rem(140, );
+            border-radius: px2rem(12, );
+            border: px2rem(1, ) solid #FFE8AA;
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            background: #007983;
+
+            img {
+                position: absolute;
+                width: px2rem(109, );
+                height: px2rem(109, );
+                left: 50%;
+                top: 50%;
+                transform: translate(-50%, -50%);
+            }
+        }
+
+        .giftName {
+            width: px2rem(200, );
+            margin: 0 px2rem(20, ) 0 px2rem(156, );
+            color: #fff;
+            font-size: px2rem(26, );
+            float: left;
+        }
+
+        .icon {
+            display: block;
+            float: left;
+            width: px2rem(44, );
+            height: px2rem(44, );
+            // background: #BFFF87;
+            margin-top: 0.4rem;
+            margin-right: px2rem(13, );
+        }
+
+        .score {
+            color: #FFE8AA;
+            font-size: px2rem(26, );
+            float: left;
+        }
+
+        .probability {
+            color: #FFE8AA;
+            font-size: px2rem(26, );
+            float: right;
+            margin-right: px2rem(24, );
+        }
+    }
+}
+
+.tab2 {
+    width: px2rem(690, );
+    height: px2rem(800, );
+    margin: px2rem(35, ) auto 0;
+    background: #00A69D;
+    border-radius: px2rem(16, );
+    overflow: hidden;
+    display: none;
+
+    img {
+        width: px2rem(624, );
+        height: px2rem(779, );
+        margin: px2rem(24, ) auto 0;
+        display: block;
+    }
+}

view/peko/modules/act-treasureSnatching/index.html

@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>夺宝达人</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="../../common/css/swiper.min.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 返回 -->
+    <img src="./images/back.png" alt="" class="back">
+    <!-- 标题 -->
+    <img src="./images/index_title.png" alt="" class="title">
+    <!-- 自己 -->
+    <div class="my">
+        <img src="" alt="" class="tx">
+        <div class="name">用户昵称用户昵称</div>
+        <div class="but">充值</div>
+        <div class="num2">100000</div>
+        <img src="./images/zs.png" alt="" class="icon2">
+        <div class="num1">10000</div>
+        <img src="./images/dbq.png" alt="" class="icon1">
+    </div>
+    <!-- 内容 -->
+    <ul>
+        <li>
+            <div class="title">赠送夺宝券1张</div>
+            <img src="" alt="" class="giftImg">
+            <div class="name">我的可爱头饰(1天)</div>
+            <div class="zs">
+                <img src="./images/zs.png" alt="" class="icon">
+                <b>10</b>
+            </div>
+            <div class="but" packId='1' day=1 diamonds=10 name='圣光迪迦'>购买</div>
+        </li>
+    </ul>
+    <!-- 购买弹窗 -->
+    <div class="buy">
+        <div class="buy_in">
+            <div class="title">购买我是四个头饰</div>
+            <div class="num">
+                <b>数量:</b>
+                <div class="box">
+                    <input type="number" value="1" name='content' maxlength="4" oninput = "value=value.replace(/[^\d]/g,'')">
+                    <div class="subtraction"></div>
+                    <div class="add"></div>
+                </div>
+            </div>
+            <div class="day">
+                <b>天数:</b> <span>10</span><i>天</i>
+            </div>
+            <div class="zs">
+                <b>金额:</b> <span>10</span><i>钻石</i>
+            </div>
+            <div class="close">取消</div>
+            <div class="ok">购买</div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="../../common/js/svga.min.js"></script>
+<script src="../../common/js/swiper.min.js"></script>
+<script src="./js/index.js"></script>

view/peko/modules/act-treasureSnatching/js/index.js

@@ -0,0 +1,227 @@
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+let urlPrefix = getUrlPrefix();
+let browser = checkVersion();
+var diamondsAll = 0;
+var packIds;
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 返回事件
+        $('.back').click(() => {
+            if (browser.app) {
+                if (browser.android) {
+                    window.androidJsObj.closeWebView();
+                } else {
+                    window.webkit.messageHandlers.closeWebView.postMessage(null);
+                }
+            } else {
+                toastMsg('请在APP内打开')
+            }
+        })
+        getList();
+        getUserInfo();
+    }, 100)
+    $('body,html').css('padding-top', `${(document.documentElement.clientWidth / 750 * 120) / 75}rem`);
+})
+// 用户信息接口
+function getUserInfo () {
+    // showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/seize-treasure/user/info',
+        success (res) {
+            if (res.code === 200) {
+                $('.my .num2').text(unitProcessing(res.data.diamonds, 100000, 1, 'W'));
+                $('.my .num1').text(res.data.drawTicketNum);
+                $('.my .name').text(res.data.nick);
+                $('.my .tx').attr('src', res.data.avatar);
+                hideLoading(layerIndex)
+            } else {
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 礼物列表接口
+function getList () {
+    $('ul li').remove();
+    showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/seize-treasure/pack/list',
+        success (res) {
+            if (res.code === 200) {
+                var str = '';
+                res.data.forEach(res => {
+                    str += `
+                    <li>
+                        <div class="title">贈送奪寶券${res.ticketNum}張</div>
+                        <img src="${res.imgUrl}" alt="" class="giftImg">
+                        <div class="name">${res.name}(1天)</div>
+                        <div class="zs">
+                            <img src="./images/zs.png" alt="" class="icon">
+                            <b>${res.sellingPrice}</b>
+                        </div>
+                        <div class="but" packId='${res.id}' day=1 diamonds=${res.sellingPrice} name='${res.name}'>購買</div>
+                    </li>
+                    `
+                });
+                $('ul').append(str);
+                // 购买头饰按钮
+                $('ul li .but').bind('on click', function () {
+                    var diamonds = Number($(this).attr('diamonds'));
+                    var day = Number($(this).attr('day'));
+                    var name = $(this).attr('name');
+                    packIds = $(this).attr('packId');
+                    $('.buy .buy_in .day span').text(day);
+                    $('.buy .buy_in .zs span').text(diamonds);
+                    $('.buy .buy_in .title').text(`购买${name}`);
+                    $(".buy .buy_in .num .box input").val(1);
+                    diamondsAll = diamonds;
+                    $('.buy').show();
+                })
+                hideLoading(layerIndex)
+            } else {
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+setInterval(function () {
+    getUserInfo();
+}, 1000)
+// 购买接口
+function buy (packId, packNum) {
+    showLoading()
+    networkRequest({
+        type: 'POST',
+        url: urlPrefix + '/activity/pack/buy',
+        data: { packId, packNum, uid: pubInfo.uid },
+        success (res) {
+            if (res.code === 200) {
+                diamondsAll = 0;
+                $('.buy').hide();
+                getUserInfo();
+                hideLoading(layerIndex)
+                toastMsg('购买成功')
+            } else {
+                diamondsAll = 0;
+                $('.buy').hide();
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            diamondsAll = 0;
+            $('.buy').hide();
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// 充值按钮
+$('.my .but').click(function () {
+    if (browser.app) {
+        if (browser.android) {
+            let channel = pubInfo.deviceInfo.channel;
+            console.log(pubInfo.deviceInfo);
+            if (channel == "google") {
+                window.androidJsObj.openChargePage(0);
+            } else {
+                window.androidJsObj.openChargePage(9);
+            }
+        } else if (browser.ios) {
+            window.webkit.messageHandlers.openChargePage.postMessage(null)
+        }
+    } else {
+        toastMsg('請在app內打開')
+    }
+})
+// 取消购买
+$('.buy .buy_in .close').click(function () {
+    diamondsAll = 0;
+    $('.buy').hide();
+})
+// 确认购买按钮
+$('.buy .buy_in .ok').click(function () {
+    var num = Number($('.buy .buy_in .num .box input').val());
+    buy(packIds, num);
+})
+// 减少天数
+$('.buy .buy_in .num .box .subtraction').click(function () {
+    var val = Number($(".buy .buy_in .num .box input").val());
+    val--;
+    if (val < 1) {
+        toastMsg('购买不能小于1');
+        val = 1;
+    }
+    $('.buy .buy_in .day span').text(val);
+    $('.buy .buy_in .zs span').text(val * diamondsAll);
+    $(".buy .buy_in .num .box input").val(val);
+})
+// 增加天数
+$('.buy .buy_in .num .box .add').click(function () {
+    var val = Number($(".buy .buy_in .num .box input").val());
+    val++;
+    if (val > 200) {
+        toastMsg('购买最大200');
+        val = 200;
+    }
+    $('.buy .buy_in .day span').text(val);
+    $('.buy .buy_in .zs span').text(val * diamondsAll);
+    $(".buy .buy_in .num .box input").val(val);
+})
+// 监听input
+$("input[name='content']").bind('input propertychange', function () {
+    var val = Number($(this).val());
+    if (val > 200) {
+        $(this).val(200);
+        val = 200;
+        toastMsg('购买最大200');
+    } else if (val < 1) {
+        $(this).val(1);
+        val = 1;
+        toastMsg('购买不能小于1');
+    } else {
+        $(this).val(val);
+        val = val;
+    }
+    $('.buy .buy_in .day span').text(val);
+    $('.buy .buy_in .zs span').text(val * diamondsAll);
+});

view/peko/modules/act-treasureSnatching/js/list.js

@@ -0,0 +1,95 @@
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+let urlPrefix = getUrlPrefix();
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+var timestamp = dateFormat(new Date().getTime(), 'yyyy-MM-dd');
+var timestampOut = dateFormat(new Date().getTime() - (24 * 60 * 60 * 1000), 'yyyy-MM-dd');
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 返回事件
+        $('.back').click(() => {
+            if (browser.app) {
+                if (browser.android) {
+                    window.androidJsObj.closeWebView();
+                } else {
+                    window.webkit.messageHandlers.closeWebView.postMessage(null);
+                }
+            } else {
+                toastMsg('请在APP内打开')
+            }
+        })
+        getRankValue(timestamp);
+    }, 100)
+    $('body,html').css('padding-top', `${(document.documentElement.clientWidth / 750 * 120) / 75}rem`);
+})
+// 榜单接口
+function getRankValue (rankDateStr) {
+    showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/seize-treasure/rank/value',
+        data: { showOrder: 50, rankNum: 50, rankDateStr },
+        success (res) {
+            if (res.code === 200) {
+                var str = '';
+                res.data.rankList.forEach((res, i) => {
+                    str += `
+                        <li class="${i <= 2 ? 'active' : ''}">
+                            <div class="num">${res.order}</div>
+                            <img src="${res.avatar}" alt="" class="tx">
+                            <div class="name">${res.nick}</div>
+                            <div class="score">${res.score}</div>
+                            <img src="./images/zs.png" alt="" class="icon">
+                        </li>
+                    `
+                });
+                $('ul').append(str);
+                hideLoading(layerIndex)
+            } else {
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// tab切换
+$('.tab div').click(function () {
+    var i = $(this).index() + 1;
+    $(this).addClass('active').siblings().removeClass('active');
+    $('ul li').remove();
+    if (i == 1) {
+        getRankValue(timestamp)
+    } else {
+        getRankValue(timestampOut)
+    }
+})

view/peko/modules/act-treasureSnatching/js/record.js

@@ -0,0 +1,134 @@
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+let urlPrefix = getUrlPrefix();
+let browser = checkVersion()
+let env = EnvCheck();
+var page = 1;
+var page1Locak1 = true;
+if (env == 'test') {
+    new VConsole();
+}
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 返回事件
+        $('.back').click(() => {
+            if (browser.app) {
+                if (browser.android) {
+                    window.androidJsObj.closeWebView();
+                } else {
+                    window.webkit.messageHandlers.closeWebView.postMessage(null);
+                }
+            } else {
+                toastMsg('请在APP内打开')
+            }
+        })
+        getDrawReward(page);
+    }, 100)
+    $('body,html').css('padding-top', `${(document.documentElement.clientWidth / 750 * 120) / 75}rem`);
+})
+// 获取夺宝记录接口
+function getDrawReward (page) {
+    showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/seize-treasure/draw/record',
+        data: { uid: pubInfo.uid, pageSize: 10, page },
+        success (res) {
+            if (res.code === 200) {
+                var str = '';
+                if (page == 1 && res.data.length == 0) {
+                    str = `<li class="active"></li>`;
+                } else {
+                    res.data.forEach((res, i) => {
+                        str += `
+                        <li>
+                            <div class="txBox">
+                                <img class="txBoxImg${i + 1}" src="${res.rewardPicUrl}" alt="">
+                            </div>
+                            <div class="giftName">${res.rewardName}</div>
+                            <div class="score">${dateFormat(res.drawTime, 'yyyy.MM.dd')}</div>
+                            <div class="probability">${dateFormat(res.drawTime, 'hh:mm:ss')}</div>
+                        </li>
+                    `;
+                    });
+                }
+                $('.ul').append(str);
+                res.data.forEach((res, i) => {
+                    if (res.rewardType == "activityProps") {
+                        //活动道具
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "gift") {
+                        //礼物
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "namePlate") {
+                        //铭牌
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.6rem", "height": "0.5rem", "top": "1rem" });
+                    } else if (res.rewardType == "car") {
+                        //座驾
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.8rem", "height": "1.3rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "headwear") {
+                        //头饰
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "chatBubble") {
+                        //气泡
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "infoCard") {
+                        //资料卡
+                        $(`.ul li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4rem", "height": "1rem", "top": "1.1rem" });
+                    }
+                })
+                if (res.data.length == 0) {
+                    page1Locak1 = false;
+                } else {
+                    page1Locak1 = true;
+                }
+                hideLoading(layerIndex)
+            } else {
+                page1Locak1 = true;
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            page1Locak1 = true;
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+//检测是否到达底部
+$(".ul").scroll(function () {
+    var divHeight = $(this).height();
+    var nScrollHeight = $(this)[0].scrollHeight;
+    var nScrollTop = $(this)[0].scrollTop;
+    if (nScrollTop + divHeight + 50 >= nScrollHeight) {
+        if (page1Locak1) {
+            page++;
+            console.log("到达底部了");
+            page1Locak1 = false;
+            getDrawReward(page)
+        }
+    }
+});

view/peko/modules/act-treasureSnatching/js/rule.js

@@ -0,0 +1,122 @@
+// 封装layer消息提醒框
+let layerIndex
+const showLoading = (content = '加载中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success (e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+let urlPrefix = getUrlPrefix();
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 初始化函数
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 返回事件
+        $('.back').click(() => {
+            if (browser.app) {
+                if (browser.android) {
+                    window.androidJsObj.closeWebView();
+                } else {
+                    window.webkit.messageHandlers.closeWebView.postMessage(null);
+                }
+            } else {
+                toastMsg('请在APP内打开')
+            }
+        })
+        getPoolList();
+    }, 100)
+    $('body,html').css('padding-top', `${(document.documentElement.clientWidth / 750 * 120) / 75}rem`);
+})
+// 奖池列表接口
+function getPoolList () {
+    $('.tab1 li').remove();
+    showLoading()
+    networkRequest({
+        type: 'GET',
+        url: urlPrefix + '/act/seize-treasure/draw/pool/list',//item
+        data: { orderType: 2 },
+        success (res) {
+            if (res.code === 200) {
+                var str = '';
+                res.data.forEach((res, i) => {
+                    str += `
+                        <li  style="display: ${res.rewardShowValue <= 0 ? 'none' : 'block'}">
+                            <div class="txBox">
+                                <img class='txBoxImg${i + 1}' src="${res.rewardPicUrl}" alt="">
+                            </div>
+                            <div class="giftName">${res.rewardName}</div>
+                            <img src="./images/zs.png" alt="" class="icon">
+                            <div class="score">${res.rewardShowValue}</div>
+                            <div class="probability">${res.showRatio / 1000}%</div>
+                        </li>
+                    `
+
+                });
+                $('.tab1').append(str);
+                res.data.forEach((res, i) => {
+                    if (res.rewardType == "activityProps") {
+                        //活动道具
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "gift") {
+                        //礼物
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "namePlate") {
+                        //铭牌
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.6rem", "height": "0.5rem", "top": "1rem" });
+                    } else if (res.rewardType == "car") {
+                        //座驾
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.8rem", "height": "1.3rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "headwear") {
+                        //头饰
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "chatBubble") {
+                        //气泡
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4666666667rem", "height": "1.4666666667rem", "top": "0.9066666667rem" });
+                    } else if (res.rewardType == "infoCard") {
+                        //资料卡
+                        $(`.tab1 li .txBox .txBoxImg${i + 1}`).css({ "width": "1.4rem", "height": "1rem", "top": "1.1rem" });
+                    }
+                })
+                hideLoading(layerIndex)
+            } else {
+                toastMsg(res.message)
+                hideLoading(layerIndex)
+            }
+        },
+        error (err) {
+            hideLoading(layerIndex)
+            toastMsg('网络错误，请退出重进')
+        }
+    })
+}
+// =======================规则页=======================
+$('.tab div').click(function () {
+    var i = $(this).index() + 1;
+    $(this).addClass('active').siblings().removeClass('active');
+    if (i == 1) {
+        $('.tab1').show();
+        $('.tab2').hide();
+    } else {
+        $('.tab2').show();
+        $('.tab1').hide();
+    }
+})