修复不选择充值档位的情况下 仍然可以发起支付问题

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

@@ -11,9 +11,26 @@
 html,
 body {
   font-family: "din-medium";
-  background: #C8864C;
+  background: #E17E3D;
   overflow-x: hidden;
 }
+html::-webkit-scrollbar,
+body::-webkit-scrollbar {
+  display: none;
+}
+
+.back {
+  position: fixed;
+  top: 0.9333333333rem;
+  left: 0.4533333333rem;
+  z-index: 9;
+  width: 0.8266666667rem;
+  height: 0.8266666667rem;
+}
+.back img {
+  width: 100%;
+  height: 100%;
+}
 
 .wrap {
   width: 100%;
@@ -22,6 +39,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 +64,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("https://img.pekolive.com/cf-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("https://img.pekolive.com/cf-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;
@@ -97,7 +155,7 @@ body {
   z-index: 9;
   width: 100%;
   height: 14.0533333333rem;
-  background: url("https://img.pekolive.com/cf-game-area.png") no-repeat 0 0/100% 100%;
+  background: url("../images/game-area.png") no-repeat 0 0/100% 100%;
 }
 .wrap .game-area .roundId {
   font-size: 0.2666666667rem;
@@ -119,7 +177,7 @@ body {
   width: 5.45rem;
   height: 0.96rem;
   line-height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
+  background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
   text-align: center;
   font-size: 0.32rem;
   font-weight: bold;
@@ -130,7 +188,7 @@ body {
   width: 4.9066666667rem;
   height: 0.9066666667rem;
   line-height: 0.9066666667rem;
-  background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
+  background: url("../images/tip.png") no-repeat 0 0/100% 100%;
   font-size: 0.2933333333rem;
   color: #F0C799;
 }
@@ -140,13 +198,14 @@ body {
   padding-left: 0.6266666667rem;
 }
 .wrap .game-area .select-time ul li {
+  transition: all, 0.2s;
   position: relative;
   z-index: 99;
   width: 1.84rem;
   height: 1.9733333333rem;
   margin-top: 1.7333333333rem;
   margin-right: 0.4266666667rem;
-  background: url("https://img.pekolive.com/cf-bubble-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/bubble-bg.png") no-repeat 0 0/100% 100%;
 }
 .wrap .game-area .select-time ul li:nth-child(-n+4) {
   margin-top: 1.0666666667rem;
@@ -164,7 +223,7 @@ body {
   height: 0.3733333333rem;
   line-height: 0.3733333333rem;
   text-align: center;
-  background: url("https://img.pekolive.com/cf-multiple-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/multiple-bg.png") no-repeat 0 0/100% 100%;
   font-size: 0.2666666667rem;
   font-weight: bold;
   color: white;
@@ -179,7 +238,7 @@ body {
   box-sizing: border-box;
   width: 1.8133333333rem;
   height: 0.7733333333rem;
-  background: url("https://img.pekolive.com/cf-name-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/name-bg.png") no-repeat 0 0/100% 100%;
   text-align: center;
   font-size: 0.3333333333rem;
   font-weight: bold;
@@ -189,7 +248,7 @@ body {
 .wrap .game-area .select-time ul li .name.general {
   height: 0.6133333333rem;
   line-height: 0.4rem;
-  background: url("https://img.pekolive.com/cf-name-general-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/name-general-bg.png") no-repeat 0 0/100% 100%;
 }
 .wrap .game-area .select-time ul li .name .gift-price {
   font-size: 0.24rem;
@@ -202,7 +261,7 @@ body {
   position: absolute;
   top: -0.96rem;
   left: -0.3733333333rem;
-  background: url("https://img.pekolive.com/cf-qipao-2s.png") no-repeat 0 0/100% 100%;
+  background: url("../images/qipao-2s.png") no-repeat 0 0/100% 100%;
   transform: rotate(343deg);
   text-indent: 0.2133333333rem;
 }
@@ -234,20 +293,20 @@ body {
   width: 9.4666666667rem;
   height: 1.68rem;
   margin: 1.8666666667rem auto 0;
-  background: url("https://img.pekolive.com/cf-btn-wrap-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/btn-wrap-bg.png") no-repeat 0 0/100% 100%;
 }
 .wrap .game-area .select-time .btn-wrap div {
   display: flex;
   justify-content: center;
   width: 2.5333333333rem;
   height: 1.0666666667rem;
-  background: url("https://img.pekolive.com/cf-fragment-btn.png") no-repeat 0 0/100% 100%;
+  background: url("../images/fragment-btn.png") no-repeat 0 0/100% 100%;
   line-height: 1.0666666667rem;
   font-size: 0.4rem;
   color: #975B25;
 }
 .wrap .game-area .select-time .btn-wrap div.active {
-  background-image: url("https://img.pekolive.com/cf-fragment-btn-active.png");
+  background-image: url("../images/fragment-btn-active.png");
   color: #B33E17;
 }
 .wrap .game-area .select-time .btn-wrap div:first-child {
@@ -287,7 +346,7 @@ body {
   width: 4.2933333333rem;
   height: 0.96rem;
   line-height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
+  background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
   text-align: center;
   color: #B82F1A;
   font-size: 0.32rem;
@@ -298,19 +357,40 @@ body {
   width: 4.9066666667rem;
   height: 0.9066666667rem;
   line-height: 0.9066666667rem;
-  background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
+  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("https://img.pekolive.com/cf-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 {
@@ -322,7 +402,7 @@ body {
   width: 4.2933333333rem;
   height: 0.96rem;
   line-height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-count-down.png") no-repeat 0 0/100% 100%;
+  background: url("../images/count-down.png") no-repeat 0 0/100% 100%;
   text-align: center;
   font-size: 0.32rem;
   color: #B82F1A;
@@ -333,7 +413,7 @@ body {
   width: 4.9066666667rem;
   height: 0.9066666667rem;
   line-height: 0.9066666667rem;
-  background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
+  background: url("../images/tip.png") no-repeat 0 0/100% 100%;
   font-size: 0.2933333333rem;
   color: #F0C799;
 }
@@ -341,7 +421,7 @@ body {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
-  bottom: 3.1rem;
+  bottom: 2.3rem;
   width: 100%;
   height: 4rem;
 }
@@ -391,13 +471,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 +528,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 +586,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 +616,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 +637,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 +663,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 {
@@ -594,7 +694,7 @@ body {
 .wrap .game-area .draw-time .put-wrap .list .item p {
   width: 0.8266666667rem;
   height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
+  background: url("../images/record_bubble.png") no-repeat;
   background-size: 100% 100%;
 }
 .wrap .game-area .draw-time .put-wrap .list .item p .gift {
@@ -626,7 +726,7 @@ body {
   z-index: 99;
   width: 100%;
   height: 1.7333333333rem;
-  background: url("https://img.pekolive.com/cf-index-bottom.png") no-repeat 0 0/100% 100%;
+  background: url("../images/index-bottom.png") no-repeat 0 0/100% 100%;
   display: flex;
   align-items: center;
 }
@@ -686,7 +786,7 @@ body {
   transform: translate(-50%, -50%);
   width: 7.68rem;
   height: 8.88rem;
-  background: url("https://img.pekolive.com/cf-rule-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/rule-bg.png") no-repeat 0 0/100% 100%;
   font-size: 0.3466666667rem;
   color: #B58147;
   font-weight: 600;
@@ -709,7 +809,7 @@ body {
   width: 3.36rem;
   height: 0.6133333333rem;
   line-height: 0.6133333333rem;
-  background: url("https://img.pekolive.com/cf-title-bg.png") no-repeat 0 0/100% 100%;
+  background: url("../images/title-bg.png") no-repeat 0 0/100% 100%;
   margin: 0 auto 0.2933333333rem;
   text-align: center;
 }
@@ -743,36 +843,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 +896,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 {
@@ -803,13 +905,14 @@ body {
   z-index: 99;
   width: 100%;
   height: 100%;
-  background: url("https://img.pekolive.com/cf-first.png") no-repeat 0 0/100% 100%;
+  background: url("../images/first.png") no-repeat 0 0/100% 100%;
 }
 .wrap .shade-mask-rank .shade-content-rank .rank-top .topthree-wrap .info-wrap .avatar img {
   position: relative;
   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 +930,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 +976,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 +989,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 +1000,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 +1019,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;
@@ -997,7 +1117,7 @@ body {
   z-index: 99;
   width: 100%;
   height: 1.7333333333rem;
-  background: url("https://img.pekolive.com/cf-bottom.png") no-repeat 0 0/100% 100%;
+  background: url("../images/bottom.png") no-repeat 0 0/100% 100%;
   display: flex;
   align-items: center;
 }

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,11 +25,27 @@
 html,
 body {
     font-family: 'din-medium';
-    background: #C8864C;
+    background: #E17E3D;
     // 海浪svga过长
     overflow-x: hidden;
+    // height: 19rem;
+    &::-webkit-scrollbar{
+        display: none;
+    }
 }
+.back {
+    position: fixed;
+    top: px2rem(70, );
+    left: px2rem(34, );
+    z-index: 9;
+    width: px2rem(62, );
+    height: px2rem(62, );
 
+    img {
+        width: 100%;
+        height: 100%;
+    }
+}
 .wrap {
     width: 100%;
     height: 100vh;
@@ -37,7 +54,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 +85,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(prefixurl()+'cf-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 +108,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(prefixurl()+'cf-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);
@@ -141,7 +256,7 @@ body {
         z-index: 9;
         width: 100%;
         height: px2rem(1054);
-        background: url(prefixurl()+'cf-game-area.png') no-repeat 0 0/100% 100%;
+        background: url('../images/game-area.png') no-repeat 0 0/100% 100%;
 
         .roundId {
             font-size: px2rem(20, );
@@ -166,7 +281,7 @@ body {
                 width: 5.45rem;
                 height: px2rem(72);
                 line-height: px2rem(62);
-                background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
+                background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
                 text-align: center;
                 font-size: px2rem(24);
                 font-weight: bold;
@@ -178,7 +293,7 @@ body {
                 width: px2rem(368);
                 height: px2rem(68);
                 line-height: px2rem(68);
-                background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
+                background: url('../images/tip.png') no-repeat 0 0/100% 100%;
                 font-size: px2rem(22);
                 color: #F0C799;
             }
@@ -191,13 +306,14 @@ body {
                 padding-left: px2rem(47);
 
                 li {
+                    transition: all, 0.2s;
                     position: relative;
                     z-index: 99;
                     width: px2rem(138);
                     height: px2rem(148);
                     margin-top: px2rem(130);
                     margin-right: px2rem(32);
-                    background: url(prefixurl()+'cf-bubble-bg.png') no-repeat 0 0/100% 100%;
+                    background: url('../images/bubble-bg.png') no-repeat 0 0/100% 100%;
 
                     &:nth-child(-n+4) {
                         margin-top: px2rem(80);
@@ -217,7 +333,7 @@ body {
                         height: px2rem(28);
                         line-height: px2rem(28);
                         text-align: center;
-                        background: url(prefixurl()+'cf-multiple-bg.png') no-repeat 0 0/100% 100%;
+                        background: url('../images/multiple-bg.png') no-repeat 0 0/100% 100%;
                         font-size: px2rem(20);
                         font-weight: bold;
                         color: white;
@@ -233,7 +349,7 @@ body {
                         box-sizing: border-box;
                         width: px2rem(136);
                         height: px2rem(58);
-                        background: url(prefixurl()+'cf-name-bg.png') no-repeat 0 0/100% 100%;
+                        background: url('../images/name-bg.png') no-repeat 0 0/100% 100%;
                         text-align: center;
                         font-size: px2rem(25);
                         font-weight: bold;
@@ -243,7 +359,7 @@ body {
                         &.general {
                             height: px2rem(46);
                             line-height: px2rem(30);
-                            background: url(prefixurl()+'cf-name-general-bg.png') no-repeat 0 0/100% 100%;
+                            background: url('../images/name-general-bg.png') no-repeat 0 0/100% 100%;
                         }
 
                         .gift-price {
@@ -261,7 +377,7 @@ body {
                         position: absolute;
                         top: px2rem(-72);
                         left: px2rem(-28);
-                        background: url(prefixurl()+'cf-qipao-2s.png') no-repeat 0 0/100% 100%;
+                        background: url('../images/qipao-2s.png') no-repeat 0 0/100% 100%;
                         transform: rotate(343deg);
                         text-indent: px2rem(16);
 
@@ -309,20 +425,20 @@ body {
                 width: px2rem(710);
                 height: px2rem(126);
                 margin: px2rem(140) auto 0;
-                background: url(prefixurl()+'cf-btn-wrap-bg.png') no-repeat 0 0/100% 100%;
+                background: url('../images/btn-wrap-bg.png') no-repeat 0 0/100% 100%;
 
                 div {
                     display: flex;
                     justify-content: center;
                     width: px2rem(190);
                     height: px2rem(80);
-                    background: url(prefixurl()+'cf-fragment-btn.png') no-repeat 0 0/100% 100%;
+                    background: url('../images/fragment-btn.png') no-repeat 0 0/100% 100%;
                     line-height: px2rem(80);
                     font-size: px2rem(30);
                     color: #975B25;
 
                     &.active {
-                        background-image: url(prefixurl()+'cf-fragment-btn-active.png');
+                        background-image: url('../images/fragment-btn-active.png');
                         color: #B33E17;
                     }
 
@@ -373,7 +489,7 @@ body {
                 width: px2rem(322);
                 height: px2rem(72);
                 line-height: px2rem(62);
-                background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
+                background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
                 text-align: center;
                 color: #B82F1A;
                 font-size: px2rem(24);
@@ -385,7 +501,7 @@ body {
                 width: px2rem(368);
                 height: px2rem(68);
                 line-height: px2rem(68);
-                background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
+                background: url('../images/tip.png') no-repeat 0 0/100% 100%;
                 text-align: center;
                 font-size: px2rem(22);
                 color: #FFF0C799;
@@ -394,16 +510,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(prefixurl()+'cf-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 {
@@ -415,7 +558,7 @@ body {
                 width: px2rem(322);
                 height: px2rem(72);
                 line-height: px2rem(62);
-                background: url(prefixurl()+'cf-count-down.png') no-repeat 0 0/100% 100%;
+                background: url('../images/count-down.png') no-repeat 0 0/100% 100%;
                 text-align: center;
                 font-size: px2rem(24);
                 color: #B82F1A;
@@ -427,7 +570,7 @@ body {
                 width: px2rem(368);
                 height: px2rem(68);
                 line-height: px2rem(68);
-                background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
+                background: url('../images/tip.png') no-repeat 0 0/100% 100%;
                 font-size: px2rem(22);
                 color: #F0C799;
             }
@@ -436,7 +579,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                bottom: 3.1rem;
+                bottom: 2.3rem;
                 width: 100%;
                 height: 4rem;
 
@@ -495,13 +638,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 +706,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 +772,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 +809,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 +852,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                top: 6.5rem;
+                top: 7.2rem;
                 display: flex;
 
                 .desc {
@@ -707,7 +886,8 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                top: 3.8rem;
+                // top: 3.8rem;
+                top: 4.5rem;
                 display: flex;
 
                 .put {
@@ -741,7 +921,7 @@ body {
                         p {
                             width: px2rem(62, );
                             height: px2rem(62, );
-                            background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
+                            background: url('../images/record_bubble.png') no-repeat;
                             background-size: 100% 100%;
 
                             .gift {
@@ -785,7 +965,7 @@ body {
         z-index: 99;
         width: 100%;
         height: px2rem(130);
-        background: url(prefixurl()+'cf-index-bottom.png') no-repeat 0 0/100% 100%;
+        background: url('../images/index-bottom.png') no-repeat 0 0/100% 100%;
         display: flex;
         // justify-content: space-evenly;
         align-items: center;
@@ -855,7 +1035,7 @@ body {
             transform: translate(-50%, -50%);
             width: px2rem(576);
             height: px2rem(666);
-            background: url(prefixurl()+'cf-rule-bg.png') no-repeat 0 0/100% 100%;
+            background: url('../images/rule-bg.png') no-repeat 0 0/100% 100%;
             // padding: px2rem(56) px2rem(54) px2rem(42) px2rem(40);
             // box-sizing: border-box;
             font-size: px2rem(26);
@@ -880,7 +1060,7 @@ body {
                         width: px2rem(252);
                         height: px2rem(46);
                         line-height: px2rem(46);
-                        background: url(prefixurl()+'cf-title-bg.png') no-repeat 0 0/100% 100%;
+                        background: url('../images/title-bg.png') no-repeat 0 0/100% 100%;
                         margin: 0 auto px2rem(22);
                         text-align: center;
                     }
@@ -924,38 +1104,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 +1170,8 @@ body {
                         }
 
                         .avatar {
-                            width: px2rem(132);
-                            height: px2rem(175);
+                            width: px2rem(194);
+                            height: px2rem(188);
                             margin-bottom: px2rem(20);
 
                             p {
@@ -992,14 +1179,16 @@ body {
                                 z-index: 99;
                                 width: 100%;
                                 height: 100%;
-                                background: url(prefixurl()+'cf-first.png') no-repeat 0 0/100% 100%;
+                                background: url('../images/first.png') no-repeat 0 0/100% 100%;
                             }
 
                             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 +1209,7 @@ body {
                             margin: 0;
                             margin-top: px2rem(-20);
                             margin-bottom: px2rem(4);
-                            color: #ED7B50;
+                            color: #fff;
                             font-size: px2rem(24);
                         }
                     }
@@ -1031,15 +1220,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 +1242,7 @@ body {
                         width: px2rem(30);
                         font-size: px2rem(30);
                         font-weight: bold;
-                        color: #333333;
+                        color: #333;
                         text-align: center;
                     }
 
@@ -1077,7 +1269,12 @@ body {
                     .others-diamond-num {
                         font-size: px2rem(26);
                         font-weight: bold;
-                        color: #ED7B50;
+                        color: #FF7700;
+
+                        b {
+                            color: #FF5110;
+                            font-weight: bold;
+                        }
                     }
                 }
             }
@@ -1089,8 +1286,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 +1298,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 +1319,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;
+                    }
                 }
             }
         }
@@ -1223,7 +1434,7 @@ body {
     z-index: 99;
     width: 100%;
     height: px2rem(130);
-    background: url(prefixurl()+'cf-bottom.png') no-repeat 0 0/100% 100%;
+    background: url('../images/bottom.png') no-repeat 0 0/100% 100%;
     display: flex;
     align-items: center;
 

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

@@ -46,8 +46,8 @@ body {
 }
 .record-list li {
   width: 100%;
-  height: 6.9733333333rem;
-  background: url("https://img.pekolive.com/cf-record-bg.png") no-repeat;
+  height: 8.48rem;
+  background: url("../images/record/record-bg.png") no-repeat;
   background-size: 100% 100%;
   border-radius: 0.2666666667rem;
   overflow: hidden;
@@ -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("https://img.pekolive.com/cf-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;
@@ -159,7 +192,7 @@ body {
 .record-list li .put-wrap .list .item p {
   width: 0.8266666667rem;
   height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
+  background: url("../images/record_bubble.png") no-repeat;
   background-size: 100% 100%;
 }
 .record-list li .put-wrap .list .item p .gift {
@@ -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,9 +64,9 @@ body {
 
     li {
         width: 100%;
-        height: px2rem(523, );
+        height: px2rem(636, );
         // background: linear-gradient(0deg, #46BBC1 0%, #62DEE4 100%);
-        background: url(prefixurl()+'cf-record-bg.png') no-repeat;
+        background: url('../images/record/record-bg.png') no-repeat;
         background-size: 100% 100%;
         border-radius: px2rem(20, );
         overflow: hidden;
@@ -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(prefixurl()+'cf-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, );
@@ -200,7 +250,7 @@ body {
                     p {
                         width: px2rem(62, );
                         height: px2rem(62, );
-                        background: url(prefixurl()+'cf-record_bubble.png') no-repeat;
+                        background: url('../images/record_bubble.png') no-repeat;
                         background-size: 100% 100%;
 
                         .gift {
@@ -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/css/result.css

@@ -17,7 +17,7 @@ body {
 .header {
   width: 10rem;
   height: 4.2266666667rem;
-  background: url("https://img.pekolive.com/cf-result_main.png");
+  background: url("../images/result_main.png");
   background-size: 100% 100%;
   margin: 0 auto;
   position: relative;
@@ -45,7 +45,7 @@ body {
 .main {
   width: 10rem;
   height: 15.6rem;
-  background: url("https://img.pekolive.com/cf-game-area.png");
+  background: url("../images/game-area.png");
   background-size: 100% 100%;
   margin: -1.85rem auto 0;
   position: relative;
@@ -55,7 +55,7 @@ body {
   width: 9.4533333333rem;
   height: 1.1466666667rem;
   line-height: 1.1466666667rem;
-  background: url("https://img.pekolive.com/cf-result_list_bg.png");
+  background: url("../images/result_list_bg.png");
   background-size: 100% 100%;
   box-sizing: border-box;
   margin: 0 auto 0.24rem;
@@ -86,7 +86,7 @@ body {
   height: 0.8266666667rem;
   line-height: 1.1466666667rem;
   margin-left: 0.4666666667rem;
-  background: url("https://img.pekolive.com/cf-record_bubble.png");
+  background: url("../images/record_bubble.png");
   background-size: 100% 100%;
 }
 .main li .list p img {

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

@@ -31,7 +31,7 @@ body {
 .header {
     width: px2rem(750, );
     height: px2rem(317, );
-    background: url(prefixurl()+'cf-result_main.png');
+    background: url('../images/result_main.png');
     background-size: 100% 100%;
     margin: 0 auto;
     position: relative;
@@ -61,7 +61,7 @@ body {
 .main {
     width: px2rem(750, );
     height: px2rem(1170, );
-    background: url(prefixurl()+'cf-game-area.png');
+    background: url('../images/game-area.png');
     background-size: 100% 100%;
     margin: -1.85rem auto 0;
     position: relative;
@@ -71,7 +71,7 @@ body {
         width: px2rem(709, );
         height: px2rem(86, );
         line-height: px2rem(86, );
-        background: url(prefixurl()+'cf-result_list_bg.png');
+        background: url('../images/result_list_bg.png');
         background-size: 100% 100%;
         box-sizing: border-box;
         margin: 0 auto 0.24rem;
@@ -105,7 +105,7 @@ body {
                 height: px2rem(62, );
                 line-height: px2rem(86, );
                 margin-left: px2rem(35, );
-                background: url(prefixurl()+'cf-record_bubble.png');
+                background: url('../images/record_bubble.png');
                 background-size: 100% 100%;
 
                 img {

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

@@ -6,17 +6,21 @@
     <meta name="viewport"
         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
     <title>星级厨房</title>
-
     <link rel="stylesheet" href="../../common/css/reset.css">
-    <link rel="stylesheet" href="./css/index.css?v=2.1">
+    <link rel="stylesheet" href="./css/index.css?v=2.2">
 </head>
 
 <body>
+    <!-- 顶部返回 -->
+    <!-- <div class="back"><img src="./images/travel/back.png" alt=""></div> -->
     <div class="wrap no-in-app">
         <!-- <div class="wrap "> -->
-        <div class="banner"><img src="https://img.pekolive.com/cf-banner.png" alt=""></div>
-        <div class="rule"><img src="https://img.pekolive.com/cf-rule.png" alt=""></div>
-        <div class="record"><img src="https://img.pekolive.com/cf-record.png" alt=""></div>
+        <div class="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>
 
         <!-- 特权商城 -->
         <div class="mall" style="display: none;">
@@ -33,7 +37,7 @@
             <div class="recharge"><img src="./images/mall/recharge.png" alt=""></div>
         </div>
         <!-- 游戏区域 -->
-        <div class="game-area">
+        <div class="game-area" >
             <!-- 本轮轮次 -->
             <div class="roundId"></div>
             <!-- 选择时间 -->
@@ -47,11 +51,90 @@
                     <div>10000</div>
                 </div>
                 <ul>
-
+                    <!-- <li class="li0" data-total-num="">
+                        <img src="./images/1.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li1" data-total-num="">
+                        <img src="./images/2.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li2" data-total-num="">
+                        <img src="./images/3.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li3" data-total-num="">
+                        <img src="./images/4.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li4" data-total-num="">
+                        <img src="./images/5.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li5" data-total-num="">
+                        <img src="./images/6.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li6" data-total-num="">
+                        <img src="./images/7.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li>
+                    <li class="li7" data-total-num="">
+                        <img src="./images/8.png" alt="">
+                        <div class="multiple"></div>
+                        <div class="name general"></div>
+                        <div class="bubble-2s">
+                            <p class="first-line">點擊選取</p>
+                            <p class="second-line">賺 <span></span> 倍獎勵</p>
+                        </div>
+                        <div class="select-num"></div>
+                    </li> -->
                 </ul>
 
-                <div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
-                <div class="shelf"><img src="https://img.pekolive.com/cf-shelf.png" alt=""></div>
+                <div class="shelf"><img src="./images/shelf.png" alt=""></div>
+                <div class="shelf"><img src="./images/shelf.png" alt=""></div>
             </div>
             <!-- 等待结果 -->
             <div class="wait-time">
@@ -59,13 +142,13 @@
                 <div class="current-tip">等待结果</div>
             </div>
             <!-- 开奖展示动画时间 -->
-            <div class="draw-time">
+            <div class="draw-time" style="display: none;">
                 <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>
@@ -73,7 +156,7 @@
                         <!-- <div class="item">
                             <p><img src="" class="gift" alt=""></p>
                             <div>
-                                <img src="cf-diamond.png" class="diamond" alt="">
+                                <img src="diamond.png" class="diamond" alt="">
                                 <span class="in"></span>
                             </div>
                         </div> -->
@@ -82,7 +165,7 @@
                 <!-- 用户本轮中奖情况 -->
                 <div class="award-info">
                     <div class="desc">奖励</div>
-                    <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
+                    <img src="./images/diamond.png" class="diamond" alt="">
                     <div class="award-wrap"></div>
                 </div>
                 <!-- 本轮前3名 -->
@@ -95,39 +178,50 @@
                     <div class="top-three-list">
                         <div class="no no1">
                             <img src="./images/logo.png" class="tx" alt="">
-                            <img src="https://img.pekolive.com/cf-no1.png" class="txBox" alt="">
+                            <img src="./images/no1.png" class="txBox" alt="">
                             <div class="nick">虚位以待</div>
                             <div class="num">
-                                <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <img src="./images/diamond.png" class="diamond" alt="">
+                                <span>0</span>
                             </div>
                         </div>
                         <div class="no no2">
                             <img src="./images/logo.png" class="tx" alt="">
-                            <img src="https://img.pekolive.com/cf-no2.png" class="txBox" alt="">
+                            <img src="./images/no2.png" class="txBox" alt="">
                             <div class="nick">虚位以待</div>
                             <div class="num">
-                                <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <img src="./images/diamond.png" class="diamond" alt="">
+                                <span>0</span>
                             </div>
                         </div>
                         <div class="no no3">
                             <img src="./images/logo.png" class="tx" alt="">
-                            <img src="https://img.pekolive.com/cf-no3.png" class="txBox" alt="">
+                            <img src="./images/no3.png" class="txBox" alt="">
                             <div class="nick">虚位以待</div>
                             <div class="num">
-                                <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
-                                <span></span>
+                                <img src="./images/diamond.png" class="diamond" alt="">
+                                <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 +233,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="https://img.pekolive.com/cf-btn_result.png" alt=""></span>
-        </div>
+            <span class="more-result"><img src="./images/btn_result.png" alt=""></span>
+        </div> -->
 
         <!-- 个人信息 -->
         <div class="info-bottom">
@@ -151,8 +245,8 @@
                 <div class="diamond-num">我的鉆石：<span>0</span></div>
                 <div class="fragment-num">今日奖励：<span>0</span></div>
             </div>
-            <div class="add"><img src="https://img.pekolive.com/cf-add.png" alt=""></div>
-            <div class="rank"><img src="https://img.pekolive.com/cf-rank.png" alt=""></div>
+            <div class="add"><img src="./images/add.png" alt=""></div>
+            <div class="rank"><img src="./images/rank.png" alt=""></div>
         </div>
 
         <!-- 规则弹窗 -->
@@ -160,29 +254,29 @@
             <div class="shade-content">
                 <main>
                     <div class="cyfs">
-                        <p class="title">参与方式</p>
+                        <p class="title">參與方式</p>
                         用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒
-                        <p class="jietu"><img src="https://img.pekolive.com/cf-t1.png" alt=""></p>
+                        <p class="jietu"><img src="./images/t1.png" alt=""></p>
                     </div>
                     <div class="lwff">
-                        <p class="title">礼物发放</p>
-                        每次參與遊戲後會獲得一次禮物開獎機會
-                        <p class="jietu t2"><img src="https://img.pekolive.com/cf-t2.png" alt=""></p>
-                        每次隨機從8種食材中選取一個作為中獎物品，中獎後獲得【中獎物品購買碎片數*中獎物品對應倍數*100】的鉆石獎勵，鉆石將直接發放到錢包
-                        <p class="jietu t3"><img src="https://img.pekolive.com/cf-t3.png" alt=""></p>
-                        例如購買1個5倍的番茄，中獎後獲得1*5*100的鉆石
+                        <p class="title">禮物發放</p>
+                        每次參與遊戲後會獲得一次禮物開獎;
+                        <p class="jietu t2"><img src="./images/t2.png" alt=""></p>
+                        每次隨機從8種食材中選取一個或多個作為中獎食材，中獎後獲得（中獎物品所花費的鉆石數*中獎食材對應倍數）的鉆石獎勵，當中獎多個食材時，獲得的鉆石會同時發放。鉆石將直接發放到賬戶中。
+                        <p class="jietu t3"><img src="./images/t3.png" alt=""></p>
+                        例如購買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 +320,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 (!browser.app) { //false
+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) => {
@@ -76,6 +82,7 @@ const getUserPieceNum = () => {
         success (res) {
             if (res.code === 200) {
                 $('.info-bottom').find('.fragment span').html(res.data.diamonds)
+                $('.wrap .info-bottom .info-wrap .diamond-num span').text(res.data.diamonds)
                 myFragment = res.data.diamonds;
             } else {
                 return toastMsg(res.message)
@@ -126,6 +133,7 @@ const getNewestAct = () => {
                     return showLoading('服務器正在維護中...')
                 } else {
                     console.log(res.timestamp > res.data.endTime);
+                    if (res.data.endTime == null) res.data.endTime = undefined
                     if (res.timestamp >= res.data.endTime) { //請求的還是上一輪的數據，重新請求
                         console.log('請求的還是上一輪的數據，必須重新請求');
                         showLoading()
@@ -135,10 +143,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 +169,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 +203,7 @@ let mySelect
 let fragmentNum
 let reg = /^[0-9]*$/
 
-const showView = () => {
+const showView = (drawItemList) => {
     if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) {
         // 第一階段
         console.log('進入第一階段');
@@ -217,11 +225,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 +244,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('https://img.pekolive.com/cf-wait.svga', function (videoItem) {
+        parser.load('./images/wait1.svga', function (videoItem) {
             // player.loops = 2;
             player.clearsAfterStop = false;
             player.setVideoItem(videoItem);
@@ -268,8 +270,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 +428,7 @@ const judgeStatus = () => {
                     drawInfo = res.data
                     img = res.data.drawImageUrl
                     if (isStatus3) {
-                        getPreviousResults(10, roundId)
+                        getPreviousResults(20, roundId)
                     }
                     renderDrawInfo()
                 } else {
@@ -425,8 +452,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(item => {
+        drawStr += `
+        <div class="draw-pic">
+            <img src="${item.drawName == '洋蔥' ? './images/1.png' : item.drawName == '番茄' ? './images/2.png' : item.drawName == '蘑菇' ? './images/3.png' : item.drawName == '土豆' ? './images/4.png' : item.drawName == '大閘蟹' ? './images/5.png' : item.drawName == '魚' ? './images/6.png' : item.drawName == '雞肉' ? './images/7.png' : item.drawName == '龍蝦' ? './images/8.png' : item.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('恭喜你，猜中了！')
@@ -446,13 +505,13 @@ const renderDrawInfo = () => {
     $('.put-wrap .list .item').remove()
     // 渲染投入列表
     let list = ''
-    drawInfo.userDrawResult.drawRecords.map(res => {
+    drawInfo.userDrawResult.drawRecords.map(item => {
         list += `
             <div class="item">
-                <p><img src="${res.imgUrl}" class="gift" alt=""></p>
+                <p><img src="${item.name == '洋蔥' ? './images/1.png' : item.name == '番茄' ? './images/2.png' : item.name == '蘑菇' ? './images/3.png' : item.name == '土豆' ? './images/4.png' : item.name == '大閘蟹' ? './images/5.png' : item.name == '魚' ? './images/6.png' : item.name == '雞肉' ? './images/7.png' : item.name == '龍蝦' ? './images/8.png' : item.imgUrl}" class="gift" alt=""></p>
                 <div>
-                    <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
-                    <span class="in">${res.costPieceNum}</span>
+                    <img src="./images/diamond.png" class="diamond" alt="">
+                    <span class="in">${item.costPieceNum}</span>
                 </div>
             </div>
         `
@@ -484,8 +543,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 : '')
         })
     }
 
@@ -551,10 +610,10 @@ const renderListItem = () => {
             `
         })
     } else {
-        listItem.map((item) => {
+        listItem.forEach((item, i) => {
             str += `
                 <li data-total-num={"number":"${item.costPieceNum}","id":"${item.id}"}>
-                    <img src="${item.imgUrl}" alt="">
+                    <img src="${item.name == '洋蔥' ? './images/1.png' : item.name == '番茄' ? './images/2.png' : item.name == '蘑菇' ? './images/3.png' : item.name == '土豆' ? './images/4.png' : item.name == '大閘蟹' ? './images/5.png' : item.name == '魚' ? './images/6.png' : item.name == '雞肉' ? './images/7.png' : item.name == '龍蝦' ? './images/8.png' : item.imgUrl}" alt="">
                     <div class="multiple">x${item.multiple}</div>
                     <div class="name">${item.name} <p class="gift-price">${item.price ? `(${item.price}鉆石)` : ''}</p></div>
                     <div class="bubble-2s">
@@ -570,8 +629,7 @@ const renderListItem = () => {
     setTimeout2s()
 }
 
-// 獲取往輪遊戲結果
-let previousResults = []
+// 獲取往輪遊戲結果 
 const getPreviousResults = (count, roundId) => {
     networkRequest({
         type: 'GET',
@@ -582,8 +640,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 +651,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.drawName == '洋蔥' ? './images/1.png' : item.drawName == '番茄' ? './images/2.png' : item.drawName == '蘑菇' ? './images/3.png' : item.drawName == '土豆' ? './images/4.png' : item.drawName == '大閘蟹' ? './images/5.png' : item.drawName == '魚' ? './images/6.png' : item.drawName == '雞肉' ? './images/7.png' : item.drawName == '龍蝦' ? './images/8.png' : item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 2) {
+                return `<p style="width:0.6rem;height:0.6rem"><img  src="${item.drawName == '洋蔥' ? './images/1.png' : item.drawName == '番茄' ? './images/2.png' : item.drawName == '蘑菇' ? './images/3.png' : item.drawName == '土豆' ? './images/4.png' : item.drawName == '大閘蟹' ? './images/5.png' : item.drawName == '魚' ? './images/6.png' : item.drawName == '雞肉' ? './images/7.png' : item.drawName == '龍蝦' ? './images/8.png' : item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 3) {
+                return `<p style="width:0.45rem;height:0.45rem"><img  src="${item.drawName == '洋蔥' ? './images/1.png' : item.drawName == '番茄' ? './images/2.png' : item.drawName == '蘑菇' ? './images/3.png' : item.drawName == '土豆' ? './images/4.png' : item.drawName == '大閘蟹' ? './images/5.png' : item.drawName == '魚' ? './images/6.png' : item.drawName == '雞肉' ? './images/7.png' : item.drawName == '龍蝦' ? './images/8.png' : item.drawImageUrl}" alt=""></p>`;
+            } else {
+                return `<p><img style="width:0.3333333333rem;height:0.3333333333rem" src="${item.drawName == '洋蔥' ? './images/1.png' : item.drawName == '番茄' ? './images/2.png' : item.drawName == '蘑菇' ? './images/3.png' : item.drawName == '土豆' ? './images/4.png' : item.drawName == '大閘蟹' ? './images/5.png' : item.drawName == '魚' ? './images/6.png' : item.drawName == '雞肉' ? './images/7.png' : item.drawName == '龍蝦' ? './images/8.png' : 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}
         //   }]`,
@@ -636,28 +705,33 @@ const sendUserDrawInfo = (itemId, num, tais) => {
                 tais.data('total-num').number = parseInt(tais.data('total-num').number) + fragmentNum
                 tais
                     .stop(true, true)
-                    .animate({ scale: 1.1 }, 200)
-                    .animate({ scale: 1 }, 200, function () {
-                        if (lock) {
-                            tais.find('.select-num').html('+' + tais.data('total-num').number).hide().fadeIn(200)
-                        }
-                        setTimeout(() => {
-                            // getUserInfo()
-                            getUserPieceNum()
-                            // getListItem(roundId)
-                        }, 100)
-                    })
+                    .animate({ scale: 1.1, }, 50)//skew(10deg, 10deg)
+                    .animate({ scale: 1, }, 50)//skew(10deg, 10deg) rotate: 0,
+                // .animate({ scale: 1, rotate: 0 }, 50, function () {
+                // if (lock) {
+                // tais.find('.select-num').html('+' + tais.data('total-num').number).hide().fadeIn(200)
+                tais.find('.select-num').html('+' + tais.data('total-num').number).hide().fadeIn(50)
+                // }
+                // setTimeout(() => {
+                // getUserInfo()
+                getUserPieceNum()
+                // getListItem(roundId)
+                // }, 100)
+                // })
                 hideLoading(layerIndex)
             } else if (31005) {
+                lock = !lock
                 toastMsg(res.message)
                 hideLoading(layerIndex)
             }
             else {
+                lock = !lock
                 toastMsg(res.message)
                 hideLoading(layerIndex)
             }
         },
         error (err) {
+            lock = !lock
             toastMsg('網絡錯誤，請退出重進')
             hideLoading(layerIndex)
         }
@@ -766,7 +840,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) => {
@@ -784,7 +858,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>次')
     }
 }
 
@@ -900,7 +974,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}">
@@ -946,7 +1020,7 @@ $(function () {
         $('.recharge').click(function () {
             // if (browser.app) {
             //     if (browser.ios) {
-            //         window.location.href = 'https://api.pekolive.com/peko/modules/pay/index.html?channelType=4';
+            //         window.location.href = 'http://192.168.0.19:5502/view/peko/modules/pay/index.html?channelType=4';
             //     } else {
             //         if (browser.android) {
             //             let channel = pubInfo.deviceInfo.channel
@@ -968,7 +1042,8 @@ $(function () {
                 }
             }
         })
-    }, 50)
+        // getPreviousResults(20, roundId)
+    }, 100)
 
     // 監聽按鈕點擊事件
     // let fragmentNum
@@ -1007,8 +1082,13 @@ $(function () {
                     window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
                 }
             } else if (browser.ios) {
-                window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
-                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
+                let channel = pubInfo.deviceInfo.channel;
+                if (channel == "appstore") { 
+                    window.webkit.messageHandlers.openChargePage.postMessage(null);
+                } else {
+                    window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
+                    window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
+                }
             }
         } else {
             toastMsg('請在app內打開')
@@ -1067,68 +1147,7 @@ $(function () {
     $('.shade-content-rank').on('click', function (e) {
         e.stopPropagation()
     })
-    // 監聽滾動
-    // $('.other-rank').on('scroll', function () {
-    //     let scrollTop = $(this).scrollTop();//這是已經卷進去滾動條的的高度
-    //     let scrollHeight = $('.other-rank')[0].scrollHeight;//這個是other-rank包含滾動條的總高度
-    //     let ulHeight = $(this).innerHeight();//這個是other-rank的高度
 
-    //     //這樣距離到底還有一段距離就請求，但是會導致重復請求，所以要加鎖限製
-    //     if (scrollTop + ulHeight + 100 >= scrollHeight) {
-    //         if (type === 1) {
-    //             if (isLockD) {
-    //                 isLockD = false
-    //                 pageD++
-    //                 if (pageSize * pageD > 30) {
-    //                     toastMsg('沒有更多數據啦~')
-    //                 } else {
-    //                     if (canRequsetNextPageD) {
-    //                         getListRank(type, pageD);
-    //                     } else {
-    //                         toastMsg('沒有更多數據啦~')
-    //                     }
-    //                 }
-    //             } else {
-    //                 if (scrollTop + ulHeight >= scrollHeight) {
-    //                     if (pageSize * pageD > 30) {
-    //                         toastMsg('沒有更多數據啦~')
-    //                     }
-    //                 }
-    //             }
-
-    //         } else {
-    //             if (isLockN) {
-    //                 isLockN = false
-    //                 pageN++
-    //                 if (pageSize * pageN > 30) {
-    //                     toastMsg('沒有更多數據啦~')
-    //                 } else {
-    //                     if (canRequsetNextPageN) {
-    //                         getListRank(type, pageN);
-    //                     } else {
-    //                         toastMsg('沒有更多數據啦')
-    //                     }
-    //                 }
-    //             } else {
-    //                 if (scrollTop + ulHeight >= scrollHeight) {
-    //                     if (pageSize * pageN > 30) {
-    //                         toastMsg('沒有更多數據啦~')
-    //                     }
-    //                 }
-    //             }
-    //         }
-    //     }
-    // })
-
-    // 播放3s動畫
-    // let player1 = new SVGA.Player('.draw-time');
-    // let parser1 = new SVGA.Parser('.draw-time');
-    // parser1.load('./images/draw.svga', function (videoItem) {
-    //     // player.loops = 2;
-    //     player1.clearsAfterStop = false;
-    //     player1.setVideoItem(videoItem);
-    //     player1.startAnimation();
-    // })
     // 点击跳转个人主页
     // $('.draw-time .top-three .top-three-list .no').off()
     $('.draw-time .top-three .top-three-list .no').click(function () {
@@ -1160,8 +1179,13 @@ $(function () {
                     window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
                 }
             } else if (browser.ios) {
-                window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
-                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
+                let channel = pubInfo.deviceInfo.channel;
+                if (channel == "appstore") { 
+                    window.webkit.messageHandlers.openChargePage.postMessage(null);
+                } else {
+                    window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
+                    window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
+                }
             }
         } else {
             toastMsg('請在app內打開')
@@ -1181,27 +1205,27 @@ $(function () {
             return
         }
 
-        if (!lock) {
-            lock = !lock
-            // console.log($(this).data('total-num'));
-            // console.log($(this).data('total-num').number);
-            // console.log(fragmentNum);
-            // $(this).data('total-num').number = parseInt($(this).data('total-num').number) + fragmentNum
-            // $(this)
-            //     .stop(true, true)
-            //     .animate({ scale: 1.1 }, 200)
-            //     .animate({ scale: 1 }, 200, function () {
-            //         if (lock) {
-            //             $(this).find('.select-num').html('+' + $(this).data('total-num').number).hide().fadeIn(200)
-            //         }
-            //         setTimeout(() => {
-            //             // getUserInfo()
-            //             getUserPieceNum()
-            //             // getListItem(roundId)
-            //         }, 100)
-            //     })
-            sendUserDrawInfo($(this).data('total-num').id, fragmentNum, $(this))
-        }
+        // if (!lock) {
+        //     lock = !lock
+        // console.log($(this).data('total-num'));
+        // console.log($(this).data('total-num').number);
+        // console.log(fragmentNum);
+        // $(this).data('total-num').number = parseInt($(this).data('total-num').number) + fragmentNum
+        // $(this)
+        //     .stop(true, true)
+        //     .animate({ scale: 1.1 }, 200)
+        //     .animate({ scale: 1 }, 200, function () {
+        //         if (lock) {
+        //             $(this).find('.select-num').html('+' + $(this).data('total-num').number).hide().fadeIn(200)
+        //         }
+        //         setTimeout(() => {
+        //             // getUserInfo()
+        //             getUserPieceNum()
+        //             // getListItem(roundId)
+        //         }, 100)
+        //     })
+        sendUserDrawInfo($(this).data('total-num').id, fragmentNum, $(this))
+        // }
     })
 
     // ios去到後臺或者鎖屏後再回來倒計時不準確
@@ -1223,4 +1247,17 @@ $(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/activity/act-ocean/result.html

@@ -14,7 +14,7 @@
 <body>
     <div class="result">
         <div class="header">
-            <img src="https://img.pekolive.com/cf-count-down.png" class="title" alt="">
+            <img src="./images/count-down.png" class="title" alt="">
             <span>前50轮中奖结果</span>
         </div>
         <ul class="main">

view/peko/activity/explore/css/index.css

@@ -120,6 +120,7 @@ body {
 }
 .mine .avatar img {
   width: 100%;
+  height: 100%;
   border-radius: 50%;
 }
 .mine .info-wrap {

view/peko/activity/explore/css/index.scss

@@ -152,6 +152,7 @@ body {
 
         img {
             width: 100%;
+            height: 100%;
             border-radius: 50%;
         }
     }

view/peko/common/js/common2.js

@@ -529,11 +529,13 @@ function getInfoFromClient () {
         console.log('从客户端获取了用户信息（设备信息），此信息来源：common2.js');
         if (browser.android) {
             pubInfo.uid = methodsFromClient.uid.android();
+            pubInfo.roomUid = methodsFromClient.roomUid.android();
             pubInfo.ticket = methodsFromClient.ticket.android();
             pubInfo.deviceId = methodsFromClient.deviceId.android();
             pubInfo.deviceInfo = methodsFromClient.deviceInfo.android();
         } else {
             methodsFromClient.uid.ios();
+            methodsFromClient.roomUid.ios();
             methodsFromClient.ticket.ios();
             methodsFromClient.deviceId.ios();
             methodsFromClient.deviceInfo.ios();
@@ -541,15 +543,13 @@ function getInfoFromClient () {
 
     } else {
         // 非app环境调试参数
-        pubInfo.uid = 2346;
-        pubInfo.ticket = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjoyMzQ2LCJ0aWNrZXRfaWQiOiJhOTY1YzkyYi1hZDM2LTRhZWItODk5OC1iN2UzODEyZjU2ZGYiLCJleHAiOjM2MDAsImNsaWVudF9pZCI6ImVyYmFuLWNsaWVudCJ9.AA-x5FwodxS9zimfJv4CTBXgD5-CPgVeoS-L6EU8VTI";
-        // pubInfo.uid = "";
-        // pubInfo.ticket = "";
-
+        pubInfo.uid = sessionStorage.getItem("uid") ? sessionStorage.getItem("uid") : '';
+        // pubInfo.ticket = sessionStorage.getItem("ticket") ? sessionStorage.getItem("ticket") : '';
+        pubInfo.h5_token = sessionStorage.getItem("ticket") ? sessionStorage.getItem("ticket") : '';
         pubInfo.deviceId = "0";
         pubInfo.deviceInfo = {
             app: 'peko',
-            appVersion: '0.0.0',
+            appVersion: '9.9.9',
             os: '0.0.0',
             osVersion: '0.0.0',
             channel: 'browser',
@@ -764,19 +764,22 @@ function networkRequest (reqObj = {}, type) {
     if (typeof pubInfo.deviceInfo === 'string') {
         pubInfo.deviceInfo = JSON.parse(pubInfo.deviceInfo);
     };
-    const pubHeader = {
-        app: type != 'yinbaos' ? pubInfo.deviceInfo.app : 'yinbao',
-        // app: 'peko',
-        // app: pubInfo.deviceInfo.app.indexOf('peko') != -1 ? 'peko' : 'PlanetStar',
-        appVersion: pubInfo.deviceInfo.appVersion || '',
-        os: pubInfo.deviceInfo.os || '',
-        os_version: pubInfo.deviceInfo.osVersion || '',
-        channel: pubInfo.deviceInfo.channel || '',
-        client: 'h5',
-        pub_uid: pubInfo.uid,
-        pub_ticket: pubInfo.ticket
-    };
-
+    var browser = checkVersion();
+    const pubHeader = {};
+    pubHeader.app = type != 'yinbaos' ? pubInfo.deviceInfo.app : 'yinbao'
+    // app: 'peko',
+    // app: pubInfo.deviceInfo.app.indexOf('peko') != -1 ? 'peko' : 'PlanetStar',
+    pubHeader.appVersion = pubInfo.deviceInfo.appVersion || ''
+    pubHeader.os = pubInfo.deviceInfo.os || ''
+    pubHeader.os_version = pubInfo.deviceInfo.osVersion || ''
+    pubHeader.channel = pubInfo.deviceInfo.channel || ''
+    pubHeader.client = 'h5'
+    pubHeader.pub_uid = window.location.pathname.match(/login.html/) ? 0 : pubInfo.uid
+    if (browser.app) {
+        pubHeader.pub_ticket = pubInfo.ticket
+    } else {
+        pubHeader.h5_token =sessionStorage.getItem("ticket") ? sessionStorage.getItem("ticket") : '';
+    }
     const url = reqObj.url;
     const commParams = objToParam(pubHeader);
     if (url.indexOf('?') >= 0) {
@@ -792,4 +795,13 @@ function networkRequest (reqObj = {}, type) {
 
     const response = $.ajax(reqObj);
     return response;
+}
+// 控制body是否可以滑动
+function bodyScroolFun (bool) {
+    if (bool) {
+        $('body').css('overflow', 'hidden');
+    } else {
+        $('body').css('overflow', 'auto');
+
+    }
 }

view/peko/home/js/index.js

@@ -7,113 +7,114 @@ const urlPrefix = getUrlPrefix()
 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'
+    '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'
+    // 'baomihua01': 'https://image.lecheng163.com/accompany_release_v_213_1_baomihua01_sign.apk'
 }
 $(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商店包
+    //判断url参数是否是与渠道包名一致
+    let androidUrl = null;
+    channelDict.hasOwnProperty(channelData) ? androidUrl = channelDict[channelData] : androidUrl = 'https://play.google.com/store/apps/details?id=com.vele.pekolive';
+    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;
-    })
+    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;
-    })
-  }
+    } 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 swiperFun() {
-  var swiper = new Swiper('.swiper', {
-    direction: 'horizontal',
-    loop: true,
-    autoplay: 5000,
-    slidesPerView: "auto",
-    centeredSlides: true,
-    spaceBetween: 0,
-    initialSlide: 1,//默认第二个居中
+function swiperFun () {
+    var swiper = new Swiper('.swiper', {
+        direction: 'horizontal',
+        loop: true,
+        autoplay: 5000,
+        slidesPerView: "auto",
+        centeredSlides: true,
+        spaceBetween: 0,
+        initialSlide: 1,//默认第二个居中
 
-  });
+    });
 }
 
 $(function () {
-  $(document).ready(function () {
-    var deviceWidth = document.documentElement.clientWidth;
-    if (deviceWidth > 768) {
-      document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
-    } else {
-      document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
+    $(document).ready(function () {
+        var deviceWidth = document.documentElement.clientWidth;
+        if (deviceWidth > 768) {
+            document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+        } else {
+            document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
+        }
+    });
+    window.onresize = function () {
+        var deviceWidth = document.documentElement.clientWidth;
+        // console.log('deviceWidth', deviceWidth);
+        if (deviceWidth > 768) {
+            document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
+        } else {
+            document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
+        }
     }
-  });
-  window.onresize = function () {
-    var deviceWidth = document.documentElement.clientWidth;
-    // console.log('deviceWidth', deviceWidth);
-    if (deviceWidth > 768) {
-      document.documentElement.style.fontSize = deviceWidth / 19.20 + 'px';
-    } else {
-      document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
-    }
-  }
 
-  swiperFun();
+    swiperFun();
 
-  //跳转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';
-  })
-  // logo跳转
-  $('.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'
-  })
+    //跳转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';
+    })
+    // logo跳转
+    $('.googlePlay').click(function () {
+        window.location.href = 'https://play.google.com/store/apps/details?id=com.vele.pekolive'
+    })
+    $('.appleStore').click(function () {
+        // console.log(version, 'version');
+        if (version.webKit && version.ios) {
+            window.location.href = 'https://apps.apple.com/cn/app/id6446155565'
+        }
+        else {
+            window.location.href = 'http://doudouyue.com/3gh2'
+        }
+    })
+    $('.apk').click(function () {
+        window.location.href = 'https://img.pekolive.com/peko_official.apk'
+    })
 })

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;
+}