重新打包

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

@@ -11,7 +11,7 @@
 html,
 body {
   font-family: "din-medium";
-  background: #C8864C;
+  background: #531800;
   overflow-x: hidden;
 }
 
@@ -22,6 +22,14 @@ body {
 }
 .wrap .banner {
   width: 100%;
+  position: relative;
+}
+.wrap .banner .subtitle {
+  position: absolute;
+  top: 0.12rem;
+  right: 1.12rem;
+  width: 1.8666666667rem;
+  height: 1.12rem;
 }
 .wrap .rule,
 .wrap .record {
@@ -39,46 +47,75 @@ 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 {
-  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;
+.wrap .previous_Round_Result span {
+  position: absolute;
+  left: 0rem;
+  bottom: 1.65rem;
+  width: 1.7066666667rem;
+  height: 0.5066666667rem;
 }
-.wrap .previous-result .result-list {
+.wrap .previous_Round_Result span img {
+  width: 100%;
+  height: 100%;
+}
+.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,13 +134,13 @@ 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;
   color: #701800;
   position: absolute;
-  top: 0.16rem;
+  top: 0.4rem;
   left: 0.4666666667rem;
 }
 .wrap .game-area .select-time {
@@ -116,10 +153,10 @@ body {
   top: -0.5333333333rem;
   left: 50%;
   transform: translateX(-50%);
-  width: 5.45rem;
+  width: 6.8rem;
   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;
@@ -127,10 +164,16 @@ body {
 }
 .wrap .game-area .select-time .current-tip {
   top: 0.6666666667rem;
-  width: 4.9066666667rem;
+  width: 5.3333333333rem;
   height: 0.9066666667rem;
-  line-height: 0.9066666667rem;
-  background: url("https://img.pekolive.com/cf-tip.png") no-repeat 0 0/100% 100%;
+  line-height: 0.38rem;
+  background: url("../images/tip.png") no-repeat 0 0/100% 100%;
+  text-align: center;
+  font-weight: bold;
+}
+.wrap .game-area .select-time .current-tip span {
+  width: 4.2666666667rem;
+  margin: 0 auto;
   font-size: 0.2933333333rem;
   color: #F0C799;
 }
@@ -146,7 +189,7 @@ body {
   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 +207,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 +222,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 +232,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;
@@ -197,28 +240,32 @@ body {
 }
 .wrap .game-area .select-time ul li .bubble-2s {
   display: none;
-  width: 1.76rem;
-  height: 0.9866666667rem;
+  width: 2.1rem;
+  height: 1.3rem;
   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;
 }
 .wrap .game-area .select-time ul li .bubble-2s p {
-  font-size: 0.24rem;
+  width: 2rem;
+  font-size: 0.1866666667rem;
   color: white;
   font-weight: bold;
   text-align: center;
-  margin-left: -0.2666666667rem;
+  margin-left: -0.0666666667rem;
 }
 .wrap .game-area .select-time ul li .bubble-2s p.first-line {
-  padding-top: 0.1333333333rem;
+  padding-top: 0.2666666667rem;
 }
 .wrap .game-area .select-time ul li .bubble-2s p.second-line {
   padding-top: 0.0533333333rem;
 }
+.wrap .game-area .select-time ul li .bubble-2s .pzh {
+  font-size: 0.24rem;
+}
 .wrap .game-area .select-time ul li .select-num {
   position: absolute;
   top: -0.08rem;
@@ -234,20 +281,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 {
@@ -284,10 +331,10 @@ body {
   top: -0.5333333333rem;
   left: 50%;
   transform: translateX(-50%);
-  width: 4.2933333333rem;
+  width: 6rem;
   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 +345,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);
   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 {
@@ -319,10 +387,10 @@ body {
   top: -0.5333333333rem;
   left: 50%;
   transform: translateX(-50%);
-  width: 4.2933333333rem;
+  width: 6rem;
   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 +401,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 +409,7 @@ body {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
-  bottom: 3.1rem;
+  bottom: 2.3rem;
   width: 100%;
   height: 4rem;
 }
@@ -391,13 +459,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 +516,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 +574,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 +604,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 +625,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 {
@@ -557,24 +645,25 @@ body {
   font-size: 0.3733333333rem;
 }
 .wrap .game-area .draw-time .put-wrap {
-  width: 8rem;
+  width: 9rem;
   height: 2.44rem;
   box-sizing: border-box;
   position: absolute;
-  left: 50%;
+  left: 55%;
   transform: translateX(-50%);
-  top: 3.8rem;
+  top: 4.5rem;
   display: flex;
 }
 .wrap .game-area .draw-time .put-wrap .put {
-  font-size: 0.3733333333rem;
+  width: 1.4rem;
+  font-size: 0.32rem;
   color: #FFFFFF;
   font-weight: 600;
   margin-right: 0.4rem;
   margin-top: 0.3rem;
 }
 .wrap .game-area .draw-time .put-wrap .list {
-  width: 6.72rem;
+  width: 6.4rem;
   height: 2.7733333333rem;
   display: flex;
   flex-wrap: wrap;
@@ -582,7 +671,7 @@ body {
 .wrap .game-area .draw-time .put-wrap .list .item {
   width: 0.9866666667rem;
   height: 1.2rem;
-  margin-right: 0.92rem;
+  margin-right: 0.7rem;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
@@ -594,7 +683,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 +715,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 +775,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 +798,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 +832,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 +885,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 +894,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 +919,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 +965,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;
@@ -880,15 +977,17 @@ body {
   bottom: 0;
   z-index: 999;
   width: 100%;
-  height: 1.3333333333rem;
-  background-color: rgba(0, 0, 0, 0.8);
+  height: 1.2rem;
+  background: url(../images/mineBg.png) no-repeat;
+  background-size: 100% 100%;
   padding: 0 0.2rem;
   box-sizing: border-box;
   display: flex;
   align-items: center;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-rank {
-  font-size: 0.3466666667rem;
+  width: 3.8rem;
+  font-size: 0.2933333333rem;
   font-weight: bold;
   color: white;
 }
@@ -896,6 +995,7 @@ body {
   flex: 1;
   display: flex;
   align-items: center;
+  white-space: nowrap;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-info img {
   width: 1.0666666667rem;
@@ -905,14 +1005,22 @@ body {
   margin-right: 0.5333333333rem;
 }
 .wrap .shade-mask-rank .shade-content-rank .mine .mine-info .mine-nick {
-  font-size: 0.3733333333rem;
-  font-weight: bold;
-  color: white;
-}
-.wrap .shade-mask-rank .shade-content-rank .mine .mine-diamond-num {
   font-size: 0.3466666667rem;
   font-weight: bold;
-  color: #ED7B50;
+  color: white;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  width: 3.2rem;
+}
+.wrap .shade-mask-rank .shade-content-rank .mine .mine-diamond-num {
+  font-size: 0.2933333333rem;
+  font-weight: bold;
+  color: #fff;
+}
+.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 +1105,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,9 +25,10 @@
 html,
 body {
     font-family: 'din-medium';
-    background: #C8864C;
+    background: #531800;
     // 海浪svga过长
     overflow-x: hidden;
+    // height: 19rem;
 }
 
 .wrap {
@@ -37,7 +39,15 @@ body {
 
     .banner {
         width: 100%;
+        position: relative;
 
+        .subtitle {
+            position: absolute;
+            top: px2rem(9, );
+            right: px2rem(84, );
+            width: px2rem(140, );
+            height: px2rem(84, );
+        }
     }
 
     .rule,
@@ -60,67 +70,150 @@ 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 {
-            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;
+            position: absolute;
+            left: px2rem(0, );
+            bottom: 1.65rem;
+            // background: url(../images/wljg.png) no-repeat;
+            // background-size: 100% 100%;
+            width: px2rem(128, );
+            height: px2rem(38, );
+            img{
+                width: 100%;
+                height: 100%;
+            }
         }
 
-        .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,13 +234,14 @@ 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, );
             color: #701800;
             position: absolute;
-            top: px2rem(12, );
+            // top: px2rem(12, );
+            top: 0.4rem;
             left: px2rem(35, );
         }
 
@@ -163,10 +257,11 @@ body {
                 left: 50%;
                 transform: translateX(-50%);
                 // width: px2rem(322);
-                width: 5.45rem;
+                // width: 5.45rem;
+                width: 6.8rem;
                 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;
@@ -175,12 +270,19 @@ body {
 
             .current-tip {
                 top: px2rem(50);
-                width: px2rem(368);
+                // width: px2rem(368);
+                width: px2rem(400, );
                 height: px2rem(68);
-                line-height: px2rem(68);
-                background: url(prefixurl()+'cf-tip.png') no-repeat 0 0/100% 100%;
-                font-size: px2rem(22);
-                color: #F0C799;
+                line-height: 0.38rem;
+                background: url('../images/tip.png') no-repeat 0 0/100% 100%;
+                text-align: center;
+                font-weight: bold;
+                span {
+                    width: px2rem(320);
+                    margin: 0 auto;
+                    font-size: px2rem(22);
+                    color: #F0C799;
+                }
             }
 
             // 海鲜列表
@@ -197,7 +299,7 @@ body {
                     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 +319,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 +335,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 +345,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 {
@@ -256,32 +358,39 @@ body {
                         display: none;
                         // width: px2rem(92);
                         // height: px2rem(56);
-                        width: px2rem(132);
-                        height: px2rem(74);
+                        // width: px2rem(132);
+                        // height: px2rem(74);
+                        width: 2.1rem;
+                        height: 1.3rem;
                         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);
 
                         p {
-                            font-size: px2rem(18);
+                            width: 2rem;
+                            font-size: px2rem(14);
                             color: white;
                             font-weight: bold;
                             text-align: center;
-                            margin-left: px2rem(-20);
+                            margin-left: px2rem(-5);
 
                             &.first-line {
-                                padding-top: px2rem(10);
+                                padding-top: px2rem(20);
                             }
 
                             &.second-line {
                                 padding-top: px2rem(4);
                             }
                         }
+                        .pzh {
+                            font-size: px2rem(18);
+                        }
                     }
 
+
                     .select-num {
                         // display: none;
                         position: absolute;
@@ -309,20 +418,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;
                     }
 
@@ -370,10 +479,11 @@ body {
                 top: px2rem(-40);
                 left: 50%;
                 transform: translateX(-50%);
-                width: px2rem(322);
+                // width: px2rem(322);
+                width: 6rem;
                 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 +495,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 +504,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 {
@@ -412,10 +549,11 @@ body {
                 top: px2rem(-40);
                 left: 50%;
                 transform: translateX(-50%);
-                width: px2rem(322);
+                // width: px2rem(322);
+                width: 6rem;
                 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 +565,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 +574,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                bottom: 3.1rem;
+                bottom: 2.3rem;
                 width: 100%;
                 height: 4rem;
 
@@ -495,13 +633,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 +701,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 +767,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 +804,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 +847,7 @@ body {
                 position: absolute;
                 left: 50%;
                 transform: translateX(-50%);
-                top: 6.5rem;
+                top: 7.2rem;
                 display: flex;
 
                 .desc {
@@ -700,18 +874,21 @@ body {
             }
 
             .put-wrap {
-                width: px2rem(600, );
+                // width: px2rem(600, );
+                width: 9rem;
                 height: px2rem(183, );
                 // line-height: px2rem(183, );
                 box-sizing: border-box;
                 position: absolute;
-                left: 50%;
+                left: 55%;
                 transform: translateX(-50%);
-                top: 3.8rem;
+                // top: 3.8rem;
+                top: 4.5rem;
                 display: flex;
 
                 .put {
-                    font-size: px2rem(28, );
+                    width: 1.4rem;
+                    font-size: px2rem(24, );
                     color: #FFFFFF;
                     font-weight: 600;
                     margin-right: 0.4rem;
@@ -719,7 +896,7 @@ body {
                 }
 
                 .list {
-                    width: px2rem(504, );
+                    width: 6.4rem;
                     height: px2rem(208, );
                     display: flex;
                     flex-wrap: wrap;
@@ -727,7 +904,7 @@ body {
                     .item {
                         width: px2rem(74, );
                         height: px2rem(90, );
-                        margin-right: 0.92rem;
+                        margin-right: 0.7rem;
                         // position: relative;
                         display: flex;
                         flex-direction: column;
@@ -741,7 +918,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 +962,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 +1032,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 +1057,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 +1101,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 +1167,8 @@ body {
                         }
 
                         .avatar {
-                            width: px2rem(132);
-                            height: px2rem(175);
+                            width: px2rem(194);
+                            height: px2rem(188);
                             margin-bottom: px2rem(20);
 
                             p {
@@ -992,14 +1176,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 +1206,7 @@ body {
                             margin: 0;
                             margin-top: px2rem(-20);
                             margin-bottom: px2rem(4);
-                            color: #ED7B50;
+                            color: #fff;
                             font-size: px2rem(24);
                         }
                     }
@@ -1031,15 +1217,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 +1239,7 @@ body {
                         width: px2rem(30);
                         font-size: px2rem(30);
                         font-weight: bold;
-                        color: #333333;
+                        color: #333;
                         text-align: center;
                     }
 
@@ -1077,7 +1266,12 @@ body {
                     .others-diamond-num {
                         font-size: px2rem(26);
                         font-weight: bold;
-                        color: #ED7B50;
+                        color: #FF7700;
+
+                        b {
+                            color: #FF5110;
+                            font-weight: bold;
+                        }
                     }
                 }
             }
@@ -1088,23 +1282,29 @@ body {
                 bottom: 0;
                 z-index: 999;
                 width: 100%;
-                height: px2rem(100);
-                background-color: rgba($color: #000000, $alpha: .8);
-                padding: 0 px2rem(15);
+                height: px2rem(90);
+                // 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;
+                padding: 0 0.2rem;
                 box-sizing: border-box;
                 display: flex;
                 align-items: center;
 
                 .mine-rank {
-                    font-size: px2rem(26);
+                    width: 3.8rem;
+                    font-size: px2rem(22);
                     font-weight: bold;
                     color: white;
+                    // white-space:nowrap;
                 }
 
                 .mine-info {
                     flex: 1;
                     display: flex;
                     align-items: center;
+                    white-space:nowrap;
 
                     img {
                         width: px2rem(80);
@@ -1115,16 +1315,26 @@ body {
                     }
 
                     .mine-nick {
-                        font-size: px2rem(28);
+                        font-size: px2rem(26);
                         font-weight: bold;
                         color: white;
+                        overflow: hidden; //超出隐藏
+                        white-space: nowrap; //不折行
+                        text-overflow: ellipsis;
+                        width: 3.2rem;
                     }
                 }
 
                 .mine-diamond-num {
-                    font-size: px2rem(26);
+                    font-size: px2rem(22);
                     font-weight: bold;
-                    color: #ED7B50;
+                    color: #fff;
+                    // white-space:nowrap;
+
+                    b {
+                        color: #fff;
+                        font-weight: bold;
+                    }
                 }
             }
         }
@@ -1223,7 +1433,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

@@ -1,240 +1,238 @@
-@font-face {
-  font-family: "pingfang-bold";
-  src: url("../../../common/fonts/PingFang Bold.ttf");
-  src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg");
-}
-@font-face {
-  font-family: "din-medium";
-  src: url("../../../common/fonts/DINCond-Medium.ttf");
-  src: url("../../../common/fonts/DINCond-Medium.ttf") format("woff"), url("../../../common/fonts/DINCond-Medium.ttf") format("truetype"), url("../../../common/fonts/DINCond-Medium.ttf") format("svg");
-}
-@font-face {
-  font-family: "pingfang-medium";
-  src: url("../../../common/fonts/PingFang-Medium.ttf");
-  src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg");
-}
-html,
-body {
-  width: 100%;
-  background: linear-gradient(0deg, #E6AD6A 0%, #F9CA92 100%);
-}
-
-.img {
-  position: fixed;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: 6rem;
-  height: 4.1333333333rem;
-  background: url(../images/null.png) no-repeat;
-  background-size: 100% 100%;
-}
-.img p {
-  text-align: center;
-  width: 1.3333333333%rem;
-  position: absolute;
-  bottom: -1rem;
-  left: 50%;
-  transform: translate(-50%);
-  color: #fff;
-  font-size: 0.2666666667rem;
-}
-
-.record-list {
-  width: 10rem;
-  margin: 0.4rem auto;
-}
-.record-list li {
-  width: 100%;
-  height: 6.9733333333rem;
-  background: url("https://img.pekolive.com/cf-record-bg.png") no-repeat;
-  background-size: 100% 100%;
-  border-radius: 0.2666666667rem;
-  overflow: hidden;
-}
-.record-list li h3 {
-  width: 100%;
-  height: 0.7rem;
-  line-height: 0.7rem;
-  text-align: center;
-  color: #fff;
-  margin: 0.3rem auto -0.3rem;
-}
-.record-list li .goldBox {
-  width: 90%;
-  height: 0.5866666667rem;
-  line-height: 0.5866666667rem;
-  background: #F46331;
-  display: flex;
-  box-sizing: border-box;
-  padding: 0 0.2666666667rem;
-  margin: 0.2rem auto 0;
-}
-.record-list li .goldBox p {
-  color: #fff;
-  width: 50%;
-  text-align: center;
-  display: none;
-}
-.record-list li .goldBox span {
-  color: #FFF773;
-  font-size: 0.2666666667rem;
-}
-.record-list li .result-wrap {
-  width: 84%;
-  height: 1.2133333333rem;
-  line-height: 1.2133333333rem;
-  box-sizing: border-box;
-  margin: 0.0666666667rem auto 0.3333333333rem;
-  display: flex;
-  justify-content: space-between;
-}
-.record-list li .result-wrap .result {
-  display: flex;
-  align-items: center;
-}
-.record-list li .result-wrap .result span {
-  font-size: 0.3733333333rem;
-  color: #FFFFFF;
-  padding-right: 0.1866666667rem;
-  font-weight: 600;
-}
-.record-list li .result-wrap .result .bg {
-  width: 1.2133333333rem;
-  height: 1.2133333333rem;
-  background: url("https://img.pekolive.com/cf-record_bubble_act.png") no-repeat;
-  background-size: 100% 100%;
-  text-align: center;
-}
-.record-list li .result-wrap .result .bg img {
-  width: 75%;
-  margin-top: 0.15rem;
-}
-.record-list li .result-wrap .award {
-  display: flex;
-  align-items: center;
-}
-.record-list li .result-wrap .award p,
-.record-list li .result-wrap .award b {
-  font-size: 0.3733333333rem;
-  color: #FFFFFF;
-  font-weight: 600;
-}
-.record-list li .result-wrap .award .diamond {
-  width: 0.3733333333rem;
-  height: 0.3733333333rem;
-}
-.record-list li .put-wrap {
-  width: 84%;
-  height: 1.2133333333rem;
-  line-height: 1.2133333333rem;
-  box-sizing: border-box;
-  margin: 0 auto;
-  display: flex;
-}
-.record-list li .put-wrap .put {
-  font-size: 0.3733333333rem;
-  color: #FFFFFF;
-  font-weight: 600;
-  margin-right: 0.9rem;
-}
-.record-list li .put-wrap .list {
-  width: 6.72rem;
-  height: 2.7733333333rem;
-  display: flex;
-  flex-wrap: wrap;
-}
-.record-list li .put-wrap .list .item {
-  width: 0.9866666667rem;
-  height: 1.2rem;
-  margin-right: 0.92rem;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
-}
-.record-list li .put-wrap .list .item:nth-child(4n) {
-  margin-right: 0;
-}
-.record-list li .put-wrap .list .item p {
-  width: 0.8266666667rem;
-  height: 0.8266666667rem;
-  background: url("https://img.pekolive.com/cf-record_bubble.png") no-repeat;
-  background-size: 100% 100%;
-}
-.record-list li .put-wrap .list .item p .gift {
-  width: 75%;
-  margin-top: 0.1rem;
-  margin-left: 0.1rem;
-}
-.record-list li .put-wrap .list .item div {
-  width: 100%;
-  height: 0.3333333333rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.record-list li .put-wrap .list .item div .diamond {
-  width: 0.3333333333rem;
-  height: 0.2666666667rem;
-}
-.record-list li .put-wrap .list .item div .in {
-  font-size: 0.2666666667rem;
-  color: #FFFFFF;
-  font-weight: 600;
-  white-space: nowrap;
-}
-.record-list li .marine_organism {
-  width: 78%;
-  height: 2.1333333333rem;
-  margin: 0 auto;
-  display: flex;
-  justify-content: space-between;
-  flex-wrap: wrap;
-}
-.record-list li .marine_organism span {
-  width: 1.6rem;
-  height: 1.6rem;
-  position: relative;
-  display: block;
-}
-.record-list li .marine_organism span img {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: 0.72rem;
-  height: 0.6266666667rem;
-  display: block;
-}
-.record-list li .marine_organism span b {
-  position: absolute;
-  right: -0.1rem;
-  top: 0.3rem;
-  color: #FFFFFF;
-  font-size: 0.2666666667rem;
-}
-.record-list li .marine_organism .active {
-  width: 1.6rem;
-  height: 1.6rem;
-  position: relative;
-}
-.record-list li .marine_organism .active img {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-  width: 0.96rem;
-  height: 0.8266666667rem;
-  display: block;
-}
-.record-list li .marine_organism .active b {
-  position: absolute;
-  right: -0.1rem;
-  top: 0.3rem;
-  color: #FEEF60;
-  font-weight: bold;
-  font-size: 0.32rem;
-}
-
-/*# sourceMappingURL=record.css.map */
+@font-face {
+  font-family: 'pingfang-bold';
+  src: url("../../../common/fonts/PingFang Bold.ttf");
+  src: url("../../../common/fonts/PingFang Bold.ttf") format("woff"), url("../../../common/fonts/PingFang Bold.ttf") format("truetype"), url("../../../common/fonts/PingFang Bold.ttf") format("svg"); }
+@font-face {
+  font-family: 'din-medium';
+  src: url("../../../common/fonts/DINCond-Medium.ttf");
+  src: url("../../../common/fonts/DINCond-Medium.ttf") format("woff"), url("../../../common/fonts/DINCond-Medium.ttf") format("truetype"), url("../../../common/fonts/DINCond-Medium.ttf") format("svg"); }
+@font-face {
+  font-family: 'pingfang-medium';
+  src: url("../../../common/fonts/PingFang-Medium.ttf");
+  src: url("../../../common/fonts/PingFang-Medium.ttf") format("woff"), url("../../../common/fonts/PingFang-Medium.ttf") format("truetype"), url("../../../common/fonts/PingFang-Medium.ttf") format("svg"); }
+html,
+body {
+  width: 100%;
+  background: linear-gradient(0deg, #E6AD6A 0%, #F9CA92 100%); }
+
+.img {
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 6rem;
+  height: 4.1333333333rem;
+  background: url(../images/null.png) no-repeat;
+  background-size: 100% 100%; }
+  .img p {
+    text-align: center;
+    width: 1.3333333333%rem;
+    position: absolute;
+    bottom: -1rem;
+    left: 50%;
+    transform: translate(-50%);
+    color: #fff;
+    font-size: 0.2666666667rem; }
+
+.record-list {
+  width: 10rem;
+  margin: 0.4rem auto; }
+  .record-list li {
+    width: 100%;
+    height: 8.48rem;
+    background: url("../images/record/record-bg.png") no-repeat;
+    background-size: 100% 100%;
+    border-radius: 0.2666666667rem;
+    overflow: hidden; }
+    .record-list li h3 {
+      width: 100%;
+      height: 0.7rem;
+      line-height: 0.7rem;
+      text-align: center;
+      color: #fff;
+      margin: 0.3rem auto -0.3rem; }
+    .record-list li .goldBox {
+      width: 90%;
+      height: 0.5866666667rem;
+      line-height: 0.5866666667rem;
+      background: #F46331;
+      display: flex;
+      box-sizing: border-box;
+      padding: 0 0.2666666667rem;
+      margin: 0.2rem auto 0; }
+      .record-list li .goldBox p {
+        color: #fff;
+        width: 50%;
+        text-align: center;
+        display: none; }
+      .record-list li .goldBox span {
+        color: #FFF773;
+        font-size: 0.2666666667rem; }
+    .record-list li .result-wrap {
+      width: 84%;
+      height: 1.2133333333rem;
+      line-height: 1.2133333333rem;
+      box-sizing: border-box;
+      margin: 0.0666666667rem auto 0.3333333333rem;
+      display: flex;
+      justify-content: space-between;
+      position: relative; }
+      .record-list li .result-wrap .result {
+        display: flex;
+        align-items: center; }
+        .record-list li .result-wrap .result span {
+          font-size: 0.3733333333rem;
+          color: #FFFFFF;
+          padding-right: 0.1866666667rem;
+          font-weight: 600;
+          position: absolute;
+          left: 50%;
+          transform: translateX(-50%);
+          width: 1.9066666667rem;
+          height: 0.6rem;
+          top: 0.2rem; }
+        .record-list li .result-wrap .result .resultImg {
+          position: absolute;
+          left: 50%;
+          transform: translateX(-50%);
+          width: 1.9066666667rem;
+          height: 0.6rem; }
+      .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 {
+          font-size: 0.3733333333rem;
+          color: #FFFFFF;
+          font-weight: 600; }
+        .record-list li .result-wrap .award .diamond {
+          width: 0.3733333333rem;
+          height: 0.3733333333rem; }
+      .record-list li .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: 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%);
+        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;
+          height: 1.2rem;
+          margin-right: 0.92rem;
+          display: flex;
+          flex-direction: column;
+          justify-content: space-between;
+          align-items: center; }
+          .record-list li .put-wrap .list .item:nth-child(4n) {
+            margin-right: 0; }
+          .record-list li .put-wrap .list .item p {
+            width: 0.8266666667rem;
+            height: 0.8266666667rem;
+            background: url("../images/record_bubble.png") no-repeat;
+            background-size: 100% 100%; }
+            .record-list li .put-wrap .list .item p .gift {
+              width: 75%;
+              margin-top: 0.1rem;
+              margin-left: 0.1rem; }
+          .record-list li .put-wrap .list .item div {
+            width: 100%;
+            height: 0.3333333333rem;
+            display: flex;
+            align-items: center;
+            justify-content: center; }
+            .record-list li .put-wrap .list .item div .diamond {
+              width: 0.3333333333rem;
+              height: 0.3333333333rem;
+              margin-top: -0.01rem; }
+            .record-list li .put-wrap .list .item div .in {
+              font-size: 0.2666666667rem;
+              color: #FFFFFF;
+              font-weight: 600;
+              white-space: nowrap; }
+    .record-list li .marine_organism {
+      width: 78%;
+      height: 2.1333333333rem;
+      margin: 0 auto;
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap; }
+      .record-list li .marine_organism span {
+        width: 1.6rem;
+        height: 1.6rem;
+        position: relative;
+        display: block; }
+        .record-list li .marine_organism span img {
+          position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%, -50%);
+          width: 0.72rem;
+          height: 0.6266666667rem;
+          display: block; }
+        .record-list li .marine_organism span b {
+          position: absolute;
+          right: -0.1rem;
+          top: 0.3rem;
+          color: #FFFFFF;
+          font-size: 0.2666666667rem; }
+      .record-list li .marine_organism .active {
+        width: 1.6rem;
+        height: 1.6rem;
+        position: relative; }
+        .record-list li .marine_organism .active img {
+          position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%, -50%);
+          width: 0.96rem;
+          height: 0.8266666667rem;
+          display: block; }
+        .record-list li .marine_organism .active b {
+          position: absolute;
+          right: -0.1rem;
+          top: 0.3rem;
+          color: #FEEF60;
+          font-weight: bold;
+          font-size: 0.32rem; }
+
+/*# sourceMappingURL=record.css.map */

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,47 @@ body {
                     color: #FFFFFF;
                     padding-right: px2rem(14, );
                     font-weight: 600;
+                    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%;
+                    top: 0.2rem;
                 }
-
-                .bg {
-                    width: px2rem(91, );
-                    height: px2rem(91, );
-                    background: url(prefixurl()+'cf-record_bubble_act.png') no-repeat;
-                    background-size: 100% 100%;
-                    text-align: center;
-
-                    img {
-                        width: 75%;
-                        margin-top: 0.15rem;
-                    }
+                .resultImg {
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    width: px2rem(143, );
+                    height: px2rem(45, );
                 }
+                
+
+                // .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 +183,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 +215,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 +239,7 @@ body {
                 height: px2rem(208, );
                 display: flex;
                 flex-wrap: wrap;
+                margin: 0.3rem auto 0;
 
                 .item {
                     width: px2rem(74, );
@@ -200,7 +258,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 +277,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

@@ -5,18 +5,21 @@
     <meta charset="UTF-8">
     <meta name="viewport"
         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-    <title>星级厨房</title>
+    <title></title>
 
     <link rel="stylesheet" href="../../common/css/reset.css">
-    <link rel="stylesheet" href="./css/index.css?v=2.1">
+    <link rel="stylesheet" href="./css/index.css?v=2.2">
 </head>
 
 <body>
     <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 id="bannerImg" src="" alt="">
+            <img id="subtitleImg" class="subtitle" src="" alt="">
+        </div>
+        <div class="rule"><img id="ruleImg" src="" alt=""></div>
+        <div class="record"><img id="recordImg" src="" alt=""></div>
 
         <!-- 特权商城 -->
         <div class="mall" style="display: none;">
@@ -33,13 +36,13 @@
             <div class="recharge"><img src="./images/mall/recharge.png" alt=""></div>
         </div>
         <!-- 游戏区域 -->
-        <div class="game-area">
+        <div class="game-area" style="display: none;">
             <!-- 本轮轮次 -->
             <div class="roundId"></div>
             <!-- 选择时间 -->
             <div class="select-time">
-                <div class="count-down">开奖倒计时：<span class="count-down-num"></span>秒</div>
-                <div class="current-tip">玩法：选择鉆石数量→选择食材</div>
+                <div class="count-down"><span id="count_down1">开奖倒计时：</span><span class="count-down-num"></span><span class="second">秒</span></div>
+                <div class="current-tip"><span id="current_tip1">玩法：选择鉆石数量→选择食材</span></div>
 
                 <div class="btn-wrap">
                     <div class="active">100</div>
@@ -50,30 +53,41 @@
 
                 </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">
-                <div class="count-down">开奖中：<span class="count-down-num"></span>秒</div>
-                <div class="current-tip">等待结果</div>
+                <div class="count-down">
+                    <span id="count_down2">开奖中：</span>
+                    <span class="count-down-num"></span>
+                    <span class="second">秒</span>
+                </div>
+                <div id="current_tip2" class="current-tip">等待结果</div>
             </div>
             <!-- 开奖展示动画时间 -->
             <div class="draw-time">
-                <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 class="count-down">
+                   <span id="count_down3"> 下一轮：</span>
+                    <span class="count-down-num"></span>
+                    <span class="second">秒</span>
                 </div>
+                <div class="current-tip">
+                    <span id="current_tip3">本轮结果：</span>
+                    <span class="current-result"></span>
+                </div>
+                <!-- 中奖物品展示 -->
+                <!-- <div class="draw-pic">
+                    <img src="http://beta.img.pekolive.com/FjWcbuxEpzZ8P3aS4A0n2llW9Jw9?imageslim" alt="">
+                </div> -->
                 <!-- 投入列表 -->
                 <div class="put-wrap">
-                    <div class="put">投入</div>
+                    <div id="put" class="put">投入</div>
                     <div class="list">
                         <!-- <div class="item">
                             <p><img src="" class="gift" alt=""></p>
                             <div>
-                                <img src="cf-diamond.png" class="diamond" alt="">
+                                <img src="diamond.png" class="diamond" alt="">
                                 <span class="in"></span>
                             </div>
                         </div> -->
@@ -81,8 +95,8 @@
                 </div>
                 <!-- 用户本轮中奖情况 -->
                 <div class="award-info">
-                    <div class="desc">奖励</div>
-                    <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
+                    <div id="desc" class="desc">奖励</div>
+                    <img src="./images/diamond.png" class="diamond" alt="">
                     <div class="award-wrap"></div>
                 </div>
                 <!-- 本轮前3名 -->
@@ -95,39 +109,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><img id="wljgImg" src="" alt=""></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,20 +164,21 @@
                 <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">
             <div class="avatar"><img src="./images/logo.png" alt=""></div>
             <div class="info-wrap">
-                <div class="diamond-num">我的鉆石：<span>0</span></div>
-                <div class="fragment-num">今日奖励：<span>0</span></div>
+
+                <div class="diamond-num"><b id="diamond_num">我的鉆石：</b><span>0</span></div>
+                <div class="fragment-num"><b id="fragment_num">今日奖励：</b><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 id="rankImg" src="" alt=""></div>
         </div>
 
         <!-- 规则弹窗 -->
@@ -160,35 +186,35 @@
             <div class="shade-content">
                 <main>
                     <div class="cyfs">
-                        <p class="title">参与方式</p>
-                        用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒
-                        <p class="jietu"><img src="https://img.pekolive.com/cf-t1.png" alt=""></p>
+                        <p id="cyfs_title" class="title">參與方式</p>
+                        <p id="cyfs">用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒</p>
+                        <p class="jietu"><img id="cyfsImg" 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 id="lwff_title" class="title">禮物發放</p>
+                        <p id="lwff3">每次參與遊戲後會獲得一次禮物開獎;</p>
+                        <p class="jietu t2"><img id="lwffImg1" src="./images/t2.png" alt=""></p>
+                        <p id="lwff1"> 每次隨機從8種食材中選取一個或多個作為中獎食材，中獎後獲得（中獎物品所花費的鉆石數*中獎食材對應倍數）的鉆石獎勵，當中獎多個食材時，獲得的鉆石會同時發放。鉆石將直接發放到賬戶中。</p>
+                        <p class="jietu t3"><img id="lwffImg2" src="./images/t3.png" alt=""></p>
+                        <p id="lwff2">例如購買1個5倍番茄花費100鉆，購買1個蘿蔔花費100鉆，中獎後將獲得100*5+100*5=1000鉆。</p>
                     </div>
                     <div class="qtsm">
-                        <p class="title">其他說明</p>
-                        如果以上說明未能解答您的疑問，請聯系客服，會有專人解答疑難
-                        <p>本活动与苹果公司无关</p>
+                        <p id="qtsm_title" class="title">其他說明</p>
+                        <p id="qtsm1">如果以上說明未能解答您的疑問，請聯繫客服，會有專人解答疑難</p>
+                        <p id="qtsm2">本活動與蘋果公司無關</p>
                     </div>
                 </main>
             </div>
         </div>
 
         <!-- 今日排名弹窗 -->
-        <div class="shade-mask-rank">
+        <div class="shade-mask-rank" >
             <div class="shade-content-rank">
                 <div class="rank-top">
 
                     <div class="tab-wrap">
-                        <span class="diamond-rank active">今日獎勵榜</span>
-                        <span class="num-rank">今日歐皇榜</span>
+                        <span id="diamond_rank" class="diamond-rank active">今日獎勵榜</span>
+                        <span id="num_rank" class="num-rank">今日歐皇榜</span>
                     </div>
 
                     <div class="topthree-wrap">
@@ -214,24 +240,30 @@
         <!-- 碎片不足提示弹窗 -->
         <div class="shade-mask-fragmentNum">
             <div class="shade-content-fragmentNum">
-                <div class="fragmentNum-title">鉆石余額不足</div>
+                <div id="fragmentNum_title" class="fragmentNum-title">鉆石余額不足</div>
                 <img src="./images/mall/no-money.png" alt="">
-                <p>当前鉆石不足</p>
+                <p id="fragmentNum_p">当前鉆石不足</p>
                 <div class="fragmentNum-btn-wrap">
-                    <div class="cancel-btn">取消</div>
-                    <div class="confirm-btn">获取鉆石</div>
+                    <div id="cancel_btn" class="cancel-btn">取消</div>
+                    <div id="confirm_btn" class="confirm-btn">获取鉆石</div>
                 </div>
             </div>
         </div>
     </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>
-    <script src="./js/index.js?v=2.1"></script>
+    <script src="./local/zh.js"></script>
+    <script src="./local/en.js"></script>
+    <script src="./local/ar.js"></script>
+    <script src="./local/id.js"></script>
+    <script src="./local/tr.js"></script>
+    <script src="../../common/local/langHandler.js"></script>
+    <script src="./js/index.js?v=2.2"></script>
 </body>
 
 </html>

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

@@ -16,8 +16,9 @@ const showLoading = (content = '加載中...') => {
         type: 2,
         shadeClose: false,
         content,
-        success (e) {
-            layerIndex = $(e).attr('index')
+        success(e) {
+            layerIndex = $(e).attr('index');
+            $('.layui-m-layer').css("z-index", '9999');
         }
     })
 }
@@ -31,21 +32,26 @@ 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) => {
     networkRequest({
         type: 'GET',
         url: urlPrefix + '/act/luckySea/getUserActInfo',
-        success (res) {
+        success(res) {
             if (res.code === 200) {
 
                 $('.info-bottom .info-wrap .fragment-num span').text(res.data.todayReward);
@@ -63,8 +69,9 @@ const getUserInfo = (param) => {
                 return toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            // toastMsg('網絡錯誤，請退出重進')
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -73,7 +80,7 @@ const getUserPieceNum = () => {
     networkRequest({
         type: 'GET',
         url: urlPrefix + '/act/luckySea/getUserActInfo',
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 $('.info-bottom').find('.fragment span').html(res.data.diamonds)
                 myFragment = res.data.diamonds;
@@ -82,8 +89,8 @@ const getUserPieceNum = () => {
             }
             lock = !lock
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -94,7 +101,7 @@ const getGameMode = () => {
     networkRequest({
         type: 'GET',
         url: urlPrefix + '/act/luckySea/getTimeConfig',
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 modelType = res.data.modelType
                 getNewestAct()
@@ -102,8 +109,8 @@ const getGameMode = () => {
                 return toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -120,25 +127,27 @@ const getNewestAct = () => {
         type: 'GET',
         url: urlPrefix + '/act/luckySea/getNewestAct',
         timeout: 8000,
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 if ($.isEmptyObject(res.data) || res.data.status === 4) {
-                    return showLoading('服務器正在維護中...')
+                    // return showLoading('服務器正在維護中...')
+                    return showLoading(translateArr.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()
+                        // showLoading(translateArr.loading)
                         timer2 = setTimeout(() => {
                             getNewestAct()
                         }, 600);
                     } 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,20 +170,21 @@ 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 {
                 return toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         },
         complete: function (XMLHttpRequest, status) {
             if (status == 'timeout') {
                 XMLHttpRequest.abort()// 超时后中断请求
-                toastMsg('网络开小差，请退出重进，开奖结果可通过【游戏记录】/【往轮结果】查看～')
+                // toastMsg('网络开小差，请退出重进，开奖结果可通过【游戏记录】/【往轮结果】查看～')
+                toastMsg(translateArr.complete_toast)
             }
         }
     })
@@ -195,7 +205,7 @@ let mySelect
 let fragmentNum
 let reg = /^[0-9]*$/
 
-const showView = () => {
+const showView = (drawItemList) => {
     if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) {
         // 第一階段
         console.log('進入第一階段');
@@ -217,11 +227,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 +246,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 +272,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();
 }
 
 // 顯示倒計時
@@ -341,7 +370,7 @@ const showCountDown = (timestamp, startTime, endTime) => {
                     }, delayTime * 1000)
                     isStatus2 = false
                 } else {
-                    showLoading()
+                    showLoading(translateArr.loading)
                     // toastMsg('服務器繁忙，請稍等')
                     console.log('status的值-----------', status);
                     judgeStatus()
@@ -384,12 +413,13 @@ const judgeStatus = () => {
     networkRequest({
         type: 'GET',
         url: urlPrefix + '/act/luckySea/getNewestAct',
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 console.log('res.data的值------------', res.data);
                 if ($.isEmptyObject(res.data) || res.data.status === 4) {
                     console.log('程序崩了！！！');
-                    return showLoading('服務器正在維護中...')
+                    // return showLoading('服務器正在維護中...')
+                    return showLoading(translateArr.showLoading)
                 } else if (res.data.status === 3) {
                     clearTimeout(timer4)
                     status = true
@@ -401,7 +431,7 @@ const judgeStatus = () => {
                     drawInfo = res.data
                     img = res.data.drawImageUrl
                     if (isStatus3) {
-                        getPreviousResults(10, roundId)
+                        getPreviousResults(20, roundId)
                     }
                     renderDrawInfo()
                 } else {
@@ -415,8 +445,8 @@ const judgeStatus = () => {
                 toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -425,8 +455,40 @@ const judgeStatus = () => {
 let topThreeArr = []
 const renderDrawInfo = () => {
     $('.draw-time .current-tip .current-result').html(drawInfo.drawName)
-    $('.draw-pic img').attr('src', drawInfo.drawImageUrl)
-
+    // $('.draw-pic img').attr('src', drawInfo.drawImageUrl)
+    $('.wrap .game-area .draw-time .draw-pic').remove();
+    var lenght = drawInfo.drawItemList.length;
+    var drawStr = '';
+    drawInfo.drawItemList.forEach(res => {
+        drawStr += `
+        <div class="draw-pic">
+            <img src="${res.drawImageUrl}" alt="">
+        </div>
+        `
+    })
+    $('.wrap .game-area .draw-time').append(drawStr);
+    if (lenght == 1) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "50%", "height": "100%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "45%" });
+    } else if (lenght == 2) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "50%", "height": "100%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "45%" });
+    } else if (lenght == 3) {
+        $('.wrap .game-area .draw-time').css({ "width": "70%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "33.3333%", "height": "75%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "40%" });
+    } else if (lenght == 4) {
+        $('.wrap .game-area .draw-time').css({ "width": "80%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "25%", "height": "65%", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "38%" });
+    } else if (lenght > 4) {
+        $('.wrap .game-area .draw-time').css({ "width": "55%", })
+        $('.wrap .game-area .draw-time .draw-pic').css({ "width": "1.3466666667rem", "height": "1.3466666667rem", });
+        $('.wrap .game-area .draw-time .draw-pic img').css({ "width": "0.8rem" });
+    }
+    // if()
     // if (isStatus3) {
     //     if (drawInfo.userDrawResult.drawStatus === 1) {
     //         $('.award-info .desc').html('恭喜你，猜中了！')
@@ -451,7 +513,7 @@ const renderDrawInfo = () => {
             <div class="item">
                 <p><img src="${res.imgUrl}" class="gift" alt=""></p>
                 <div>
-                    <img src="https://img.pekolive.com/cf-diamond.png" class="diamond" alt="">
+                    <img src="./images/diamond.png" class="diamond" alt="">
                     <span class="in">${res.costPieceNum}</span>
                 </div>
             </div>
@@ -464,18 +526,20 @@ const renderDrawInfo = () => {
     topThreeArr = drawInfo.rankUserList
     let str = ''
     if (topThreeArr.length === 0) {
-        $('.topthree-desc').html('本輪無人猜中')
+        // $('.topthree-desc').html('本輪無人猜中')
+        $('.topthree-desc').html(translateArr.topthree_desc1)
         $('.top-three-list').css('display', 'none')
         $('.top-three').css('line-height', '4rem')
         // $('.top-three-list p img').attr('src', './images/default-hui.png')
     } else {
-        $('.topthree-desc').html('本輪MVP')
+        // $('.topthree-desc').html('本輪MVP')
+        $('.topthree-desc').html(translateArr.topthree_desc2)
         $('.top-three-list').css('display', 'block')
         $('.top-three').css('line-height', '0rem')
         if (topThreeArr.length < 3) {
             let arr = new Array(3 - topThreeArr.length).fill({
                 avatar: './images/default-hui.png',
-                nick: '虚位以待',
+                nick: translateArr.top_wait,
                 uid: null,
                 num: 0
             })
@@ -484,8 +548,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 : '')
         })
     }
 
@@ -501,7 +565,7 @@ const getListItem = (roundId, type) => {
             roundId,
             type
         },
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 listItem = res.data
                 renderListItem()
@@ -509,8 +573,8 @@ const getListItem = (roundId, type) => {
                 toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -534,8 +598,10 @@ const setTimeout2s = () => {
 
 // 渲染每一輪抽獎的選項
 const renderListItem = () => {
+
     let str = ''
     if (modelType === 1) {
+
         listItem.map((item) => {
             str += `
                 <li data-total-num={"number":"${item.costPieceNum}","id":"${item.id}"}>
@@ -543,23 +609,25 @@ const renderListItem = () => {
                     <div class="multiple">x${item.multiple}</div>
                     <div class="name general">${item.name}</div>
                     <div class="bubble-2s">
-                        <p class="first-line">點擊選取</p>
-                        <p class="second-line">賺 <span>${item.multiple}</span> 倍獎勵</p>
+                        <p class="first-line">${translateArr.first_line}</p>
+                        <p class="second-line">${translateArr.earn}<span>${item.multiple}</span> ${translateArr.reward}</p>
                     </div>
                     <div class="select-num">${item.costPieceNum === 0 ? '' : '+ ' + item.costPieceNum}</div>
                 </li>
             `
         })
+
     } else {
+
         listItem.map((item) => {
             str += `
                 <li data-total-num={"number":"${item.costPieceNum}","id":"${item.id}"}>
                     <img src="${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="name">${item.name} <p class="gift-price">${item.price ? `(${item.price}${translateArr.diamond})` : ''}</p></div>
                     <div class="bubble-2s">
-                        <p class="first-line">點擊選取</p>
-                        <p class="second-line">賺 <span>${item.multiple}</span> 倍獎勵</p>
+                        <p class="first-line">${translateArr.first_line}</p>
+                        <p class="second-line">${translateArr.earn} <span>${item.multiple}</span> ${translateArr.reward}</p>
                     </div>
                     <div class="select-num">${item.costPieceNum === 0 ? '' : '+ ' + item.costPieceNum}</div>
                 </li>
@@ -567,11 +635,15 @@ const renderListItem = () => {
         })
     }
     $('.game-area').find('ul').html(str)
+    // 中文提示字体大小修改
+    const localLang = window.lang;
+    if (localLang.code == 'zh') {
+        $('.select-time ul li .bubble-2s p').addClass('pzh')
+    }
     setTimeout2s()
 }
 
-// 獲取往輪遊戲結果
-let previousResults = []
+// 獲取往輪遊戲結果 
 const getPreviousResults = (count, roundId) => {
     networkRequest({
         type: 'GET',
@@ -580,58 +652,69 @@ const getPreviousResults = (count, roundId) => {
             count,
             roundId
         },
-        success (res) {
+        success(res) {
             if (res.code === 200) {
-                previousResults = res.data
-                renderPreviousResults()
+                // previousResults = res.data
+                renderPreviousResults(res.data)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
 
 // 渲染往輪遊戲結果
-const renderPreviousResults = () => {
-
+const renderPreviousResults = (val) => {
     let str = ''
-    if (previousResults.length < 5) {
-        let len = 5 - previousResults.length
+    if (val.length < 5) {
+        let len = 5 - val.length
         let arr = new Array(len).fill(1)
-        previousResults.push(...arr)
+        val.push(...arr)
     }
     if (isStatus3) {
         if (img) {
-            previousResults.pop()
-            previousResults.unshift({
+            val.pop()
+            val.unshift({
                 drawImageUrl: img
             })
-            console.log(previousResults);
         }
-
     }
-    previousResults.map((item) => {
+    val.forEach(res => {
         str += `
-            <p><img src="${item.drawImageUrl}" alt=""></p>
+            <li>
+                ${res.drawItemList.map(item => {
+            if (res.drawItemList.length == 1) {
+                return `<p style="width:0.8rem;height:0.8rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 2) {
+                return `<p style="width:0.6rem;height:0.6rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else if (res.drawItemList.length == 3) {
+                return `<p style="width:0.45rem;height:0.45rem"><img  src="${item.drawImageUrl}" alt=""></p>`;
+            } else {
+                return `<p><img style="width:0.3333333333rem;height:0.3333333333rem" src="${item.drawImageUrl}" alt=""></p>`;
+            }
+
+        }).join('')
+            }
+            </li>
         `
     })
-    $('.result-list').html(str)
+    $('.wrap .previous_Round_Result .box ul').html(str)
 }
 
 // 發送用戶抽獎數量
 const sendUserDrawInfo = (itemId, num, tais) => {
-    showLoading();
+    // showLoading();
     networkRequest({
         type: 'POST',
         url: urlPrefix + '/act/luckySea/draw',
         // contentType: 'application/json',
-        // data: `[ {
+        // data: `[{
         //     "itemId":${itemId},
         //     "num":${num}
         //   }]`,
         data: { itemId, num },
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 tais.data('total-num').number = parseInt(tais.data('total-num').number) + fragmentNum
                 tais
@@ -649,16 +732,19 @@ const sendUserDrawInfo = (itemId, num, tais) => {
                     })
                 hideLoading(layerIndex)
             } else if (31005) {
+                lock = !lock
                 toastMsg(res.message)
                 hideLoading(layerIndex)
             }
             else {
+                lock = !lock
                 toastMsg(res.message)
                 hideLoading(layerIndex)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤，請退出重進')
+        error(err) {
+            lock = !lock
+            toastMsg(translateArr.network)
             hideLoading(layerIndex)
         }
     })
@@ -698,7 +784,7 @@ const getListRank = (type, page) => {
             page,
             pageSize
         },
-        success (res) {
+        success(res) {
             if (res.code === 200) {
                 if (type === 1) {
                     // 鉆石榜單
@@ -732,8 +818,8 @@ const getListRank = (type, page) => {
                 toastMsg(res.message)
             }
         },
-        error (err) {
-            toastMsg('網絡錯誤')
+        error(err) {
+            toastMsg(translateArr.network)
         }
     })
 }
@@ -747,17 +833,21 @@ const renderMyInfo = () => {
             return item.erbanNo === erbanNo
         })
         if (myIndex === -1) {
-            $('.mine-rank').html('未上榜')
+            // $('.mine-rank').html('未上榜')
+            $('.mine-rank').html(translateArr.on_list)
         } else {
             $('.mine-rank').html(myIndex + 1)
         }
         $('.mine-info').find('img').attr('src', myInfoD.avatar)
         if (myInfoD.nick) {
-            myInfoD.nick.length > 5 ? myInfoD.nick.slice(0, 5) + '...' : myInfoD.nick
+            
+            $('.mine-info').find('.mine-nick').html(myInfoD.nick.length > 8 ? myInfoD.nick.slice(0, 8) + '...' : myInfoD.nick)
         } else {
-            myInfoD.nick = '未知'
+            // myInfoD.nick = '未知'
+            // myInfoD.nick = translateArr.no_nick
+            $('.mine-info').find('.mine-nick').html(translateArr.no_nick)
         }
-        $('.mine-info').find('.mine-nick').html(myInfoD.nick)
+        
         let tostr = myInfoD.num.toString()
         let num
         if (tostr.length >= 5) {
@@ -766,25 +856,29 @@ 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) => {
             return item.erbanNo === erbanNo
         })
         if (myIndex === -1) {
-            $('.mine-rank').html('未上榜')
+            // $('.mine-rank').html('未上榜')
+            $('.mine-rank').html(translateArr.on_list)
         } else {
             $('.mine-rank').html(myIndex + 1)
         }
         $('.mine-info').find('img').attr('src', myInfoN.avatar)
         if (myInfoN.nick) {
-            myInfoN.nick.length > 5 ? myInfoN.nick.slice(0, 5) + '...' : myInfoN.nick
+            $('.mine-info').find('.mine-nick').html(myInfoN.nick.length > 8 ? myInfoN.nick.slice(0, 8) + '...' : myInfoN.nick)
         } else {
-            myInfoN.nick = '未知'
+            // myInfoD.nick = '未知'
+            // myInfoD.nick = translateArr.no_nick
+            $('.mine-info').find('.mine-nick').html(translateArr.no_nick)
+
         }
-        $('.mine-info').find('.mine-nick').html(myInfoN.nick)
-        $('.mine-diamond-num').html('猜中' + myInfoN.num + '次')
+        // $('.mine-diamond-num').html('猜中<b> ' + myInfoN.num + ' </b>次')
+        $('.mine-diamond-num').html(`${translateArr.mine_diamond_num}<b> ` + myInfoN.num + ` </b>${translateArr.mine_diamond_time}`)
     }
 }
 
@@ -797,7 +891,7 @@ const renderRankList = () => {
         if (rankListD.length === 0) {
             let len = 1 - rankListD.length
             let arr = new Array(len).fill({
-                nick: '虛位以待',
+                nick: translateArr.top_wait,
                 avatar: './images/default.png',
                 num: ''
             })
@@ -865,7 +959,7 @@ const renderRankList = () => {
         if (rankListN.length === 0) {
             let len = 1 - rankListN.length
             let arr = new Array(len).fill({
-                nick: '虛位以待',
+                nick: translateArr.top_wait,
                 avatar: './images/default.png'
             })
             topThreeArr.push(...arr)
@@ -874,7 +968,7 @@ const renderRankList = () => {
         topThreeArr.map((item) => {
             let num = ''
             if (item.erbanNo) {
-                num = '猜中' + item.num + '次'
+                num = translateArr.mine_diamond_num + item.num + translateArr.mine_diamond_time
             }
             topThreeStr = `
                 <div class="info-wrap" uid="${item.uid}">
@@ -900,7 +994,7 @@ const renderRankList = () => {
         othersArr.map((item, index) => {
             let num
             if (item.erbanNo) {
-                num = '猜中' + item.num + '次'
+                num = translateArr.mine_diamond_num + '<b> ' + item.num + ' </b>' + translateArr.mine_diamond_time
             }
             others += `
                 <li uid="${item.uid}">
@@ -923,7 +1017,7 @@ const renderRankList = () => {
 }
 
 //跳转个人主页
-function openPerson (uid) {
+function openPerson(uid) {
     console.log('跳转个人主页方法');
     if (!browser.app) return
     if (browser.ios) {
@@ -935,14 +1029,38 @@ function openPerson (uid) {
     }
 }
 
+var translateArr = {
+    loading: '加載中',
+    network: '網絡錯誤，請退出重進',
+    open_app: '請在app內打開',
+    showLoading: '服務器正在維護中...',
+    complete_toast: '網絡開小差，請退出重進，開獎結果可通過【遊戲記錄】/【往輪結果】查看～',
+    topthree_desc1: '本輪無人猜中',
+    topthree_desc2: '本輪MVP',
+    top_wait: '虛位以待',
+    first_line: '點擊選取',
+    earn: '賺',
+    reward: '倍獎勵',
+    on_list: '未上榜',
+    no_nick: '未知',
+    mine_diamond_num: '猜中',
+    mine_diamond_time: '次',
+    select_time: '請先選擇碎片數量',
+    diamond: '鉆石',
+}
 
 $(function () {
     getInfoFromClient()
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+
     setTimeout(function () {
+        // 初始化国际化
+        initLocalLang();
         // getUserInfo()
         getGameMode()
         // getNewestAct()
         // getListItem()
+        translateFun();
         $('.recharge').click(function () {
             // if (browser.app) {
             //     if (browser.ios) {
@@ -968,7 +1086,70 @@ $(function () {
                 }
             }
         })
-    }, 50)
+        // getPreviousResults(20, roundId)
+    }, 100)
+
+    // 进行文本替换
+    function translateFun() {
+        const langReplace = window.lang.replace;
+        const localLang = window.lang;
+        $('title').text(langReplace(localLang.demoModule.index_title));
+        $('.second').html(langReplace(localLang.demoModule.second));
+        $('#diamond_num').html(langReplace(localLang.demoModule.diamond_num));
+        $('#fragment_num').html(langReplace(localLang.demoModule.fragment_num));
+        $('#current_tip1').html(langReplace(localLang.demoModule.current_tip1));
+        $('#count_down1').html(langReplace(localLang.demoModule.count_down1));
+        $('#count_down2').html(langReplace(localLang.demoModule.count_down2));
+        $('#current_tip2').html(langReplace(localLang.demoModule.current_tip2));
+        $('#count_down3').html(langReplace(localLang.demoModule.count_down3));
+        $('#current_tip3').html(langReplace(localLang.demoModule.current_tip3));
+        $('#put').html(langReplace(localLang.demoModule.put));
+        $('#desc').html(langReplace(localLang.demoModule.desc));
+        $('#cyfs_title').html(langReplace(localLang.demoModule.cyfs_title));
+        $('#diamond_num').html(langReplace(localLang.demoModule.diamond_num));
+        $('#cyfs').html(langReplace(localLang.demoModule.cyfs));
+        $('#lwff_title').html(langReplace(localLang.demoModule.lwff_title));
+        $('#lwff1').html(langReplace(localLang.demoModule.lwff1));
+        $('#lwff2').html(langReplace(localLang.demoModule.lwff2));
+        $('#lwff3').html(langReplace(localLang.demoModule.lwff3));
+        $('#qtsm_title').html(langReplace(localLang.demoModule.qtsm_title));
+        $('#qtsm1').html(langReplace(localLang.demoModule.qtsm1));
+        $('#qtsm2').html(langReplace(localLang.demoModule.qtsm2));
+        $('#wljgImg').attr('src', langReplace(localLang.demoModule.wljgImg));
+        $('#bannerImg').attr('src', langReplace(localLang.demoModule.bannerImg));
+        $('#subtitleImg').attr('src', langReplace(localLang.demoModule.subtitleImg));
+        $('#ruleImg').attr('src', langReplace(localLang.demoModule.ruleImg));
+        $('#recordImg').attr('src', langReplace(localLang.demoModule.recordImg));
+        $('#rankImg').attr('src', langReplace(localLang.demoModule.rankImg));
+        $('#cyfsImg').attr('src', langReplace(localLang.demoModule.cyfsImg));
+        $('#lwffImg1').attr('src', langReplace(localLang.demoModule.lwffImg1));
+        $('#lwffImg2').attr('src', langReplace(localLang.demoModule.lwffImg2));
+        $('#diamond_rank').html(langReplace(localLang.demoModule.diamond_rank));
+        $('#num_rank').html(langReplace(localLang.demoModule.num_rank));
+        $('#fragmentNum_title').html(langReplace(localLang.demoModule.fragmentNum_title));
+        $('#fragmentNum_p').html(langReplace(localLang.demoModule.fragmentNum_p));
+        $('#cancel_btn').html(langReplace(localLang.demoModule.cancel_btn));
+        $('#confirm_btn').html(langReplace(localLang.demoModule.confirm_btn));
+
+        translateArr.loading = langReplace(localLang.demoModule.loading)
+        translateArr.network = langReplace(localLang.demoModule.network)
+        translateArr.open_app = langReplace(localLang.demoModule.open_app)
+        translateArr.showLoading = langReplace(localLang.demoModule.showLoading)
+        translateArr.complete_toast = langReplace(localLang.demoModule.complete_toast)
+        translateArr.topthree_desc1 = langReplace(localLang.demoModule.topthree_desc1)
+        translateArr.topthree_desc2 = langReplace(localLang.demoModule.topthree_desc2)
+        translateArr.top_wait = langReplace(localLang.demoModule.top_wait)
+        translateArr.first_line = langReplace(localLang.demoModule.first_line)
+        translateArr.earn = langReplace(localLang.demoModule.earn)
+        translateArr.reward = langReplace(localLang.demoModule.reward)
+        translateArr.on_list = langReplace(localLang.demoModule.on_list)
+        translateArr.no_nick = langReplace(localLang.demoModule.no_nick)
+        translateArr.mine_diamond_num = langReplace(localLang.demoModule.mine_diamond_num)
+        translateArr.mine_diamond_time = langReplace(localLang.demoModule.mine_diamond_time)
+        translateArr.select_time = langReplace(localLang.demoModule.select_time)
+        translateArr.diamond = langReplace(localLang.demoModule.diamond)
+
+    }
 
     // 監聽按鈕點擊事件
     // let fragmentNum
@@ -1223,4 +1404,16 @@ $(function () {
             $countDown.html(countDownTime)
         }
     })
-})  
+})
+//返回页面 重新请求接口
+var hiddenProperty = 'hidden' in document ? 'hidden' :
+    'webkitHidden' in document ? 'webkitHidden' :
+        'mozHidden' in document ? 'mozHidden' : null;
+
+var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange');
+var onVisibilityChange = function () {
+    if (!document[hiddenProperty]) {
+        location.reload()
+    }
+}
+document.addEventListener(visibilityChangeEvent, onVisibilityChange);

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

@@ -18,13 +18,19 @@ const toastMsg = (content = '', time = 2) => {
 
 $(function () {
     getInfoFromClient()
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
     if (EnvCheck() === 'test') { new VConsole }
     setTimeout(function () {
+          // 初始化国际化
+        initLocalLang();
         getUserRecord()
     }, 100)
 
-    function getUserRecord() {
+    function getUserRecord () {
         canNext = false
+        const langReplace = window.lang.replace;
+        const localLang = window.lang;
+        $('title').text(langReplace(localLang.demoModule.record));
         networkRequest({
             type: 'GET',
             url: urlPrefix + '/act/luckySea/listDrawRecord',
@@ -32,7 +38,7 @@ $(function () {
                 page,
                 pageSize
             },
-            success(res) {
+            success (res) {
                 if (res.code === 200) {
                     if (res.data.length != 0) {
                         // 能够继续请求下一页
@@ -41,26 +47,36 @@ $(function () {
                         renderRecord(res.data)
                     } else {
                         canNext = false
-                        toastMsg('沒有更多啦~')
+                        // toastMsg('沒有更多啦~')
+                        toastMsg(langReplace(localLang.demoModule.no_more))
                     }
-                    
+
                 } else {
                     canNext = true
                     toastMsg(res.message)
                 }
             },
-            error(err) {
+            error (err) {
                 canNext = true
-                toastMsg('網絡錯誤，請退出重進')
+                // toastMsg('網絡錯誤，請退出重進')
+                toastMsg(langReplace(localLang.demoModule.network))
+
             }
         })
     }
 
     // 渲染游戏记录
     const renderRecord = (recordList) => {
+        const langReplace = window.lang.replace;
+        const localLang = window.lang;
+        let drawStatus1 = langReplace(localLang.demoModule.drawStatus1);
+        let drawStatus2 = langReplace(localLang.demoModule.drawStatus2);
+        let award = langReplace(localLang.demoModule.award);
+        let resultImg = langReplace(localLang.demoModule.resultImg);
+        let putImg = langReplace(localLang.demoModule.putImg);
         if (recordList.length === 0) {
             $('.record-list').hide();
-            $('.img').show();
+            // $('.img').show();
         } else {
             // $('.record-list li').remove();
             $('.record-list').show();
@@ -69,7 +85,7 @@ $(function () {
             var drawId;
             var itemUrl;
             var results = [];
-            
+
 
             let str = '';
             recordList.forEach((res, index) => {
@@ -87,45 +103,47 @@ $(function () {
                     <h3>${dateFormat(res.drawTime, 'yy-MM-dd hh:mm:ss')}</h3>
                     <div class="goldBox">
                         <span>NO.${res.roundId}</span>
-                        <p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">哎呀~猜錯了 o(╥﹏╥)o</p>
-                        <p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">厲害~猜對了 ୧(๑•̀◡•́๑)૭</p>
+                        <p style="display: ${res.drawStatus == 1 ? 'none' : 'block'};" class="fasle">${drawStatus1}</p>
+                        <p style="display: ${res.drawStatus == 1 ? 'block' : 'none'};" class="true">${drawStatus2}</p>
                     </div>
                     <div class="result-wrap">
                         <div class="result">
-                            <span>本輪結果</span>
-                            <div class="bg"><img src="${itemUrl}" alt=""></div>
+                            <img class="resultImg" src="${resultImg}" alt="">
                         </div>
                         <div class="award">
-                            <p>獎勵:</p>
+                            <p>${award}:</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>
+                        <img class="put" src="${putImg}" alt="">
                         <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/local/ar.js

@@ -0,0 +1,69 @@
+// 阿拉伯
+langAr = {
+    // 模塊
+    demoModule: {
+        loading: 'تحميل',
+        network: 'خطأ في الشبكة ، يرجى الخروج وإعادة الدخول',
+        open_app: 'يرجى فتحه في التطبيق',
+        // ===============index============
+        index_title: 'نجمة المطبخ',
+        diamond_num:'بلدي الماس:',
+        fragment_num:'جائزة اليوم:',
+        count_down1:'العد التنازلي للرسم:',
+        second:'ثانية',
+        current_tip1:'طريقة اللعب: <br>اختر عدد الماسات ← اختر المكونات',
+        count_down2:'في اليانصيب:',
+        current_tip2:'في انتظار النتائج',
+        count_down3:'الجولة التالية:',
+        current_tip3:'نتائج هذه الجولة:',
+        put:'ضعه في',
+        desc:'جائزة',
+        top_wait:'منتظر',
+        cyfs_title:'طريقة المشاركة',
+        cyfs:'يمكن للمستخدمين المشاركة في لعبة "مطبخ النجوم" عن طريق إنفاق الماس ، 100 ماسة على الأقل في كل مرة ، وتستغرق كل جولة 30 ثانية',
+        wljgImg:'./images/ar/wljg-ay.png',
+        bannerImg:'./images/ar/banner-ay.png',
+        subtitleImg:'./images/ar/subtitle-ay.png',
+        ruleImg:'./images/ar/rule-ay.png',
+        recordImg:'./images/ar/record-ay.png',
+        rankImg:'./images/ar/rank-ay.png',
+        cyfsImg:'./images/ar/t1-ay.png',
+        lwffImg1:'./images/t2.png',
+        lwffImg2:'./images/ar/t3-ay.png',
+        lwff_title:'توزيع الهدايا',
+        lwff1:'في كل مرة ، يتم اختيار واحد أو أكثر من المكونات الثمانية بشكل عشوائي كمكونات فائزة. بعد الفوز بالجائزة ، ستحصل على مكافأة ماسية (عدد الماسات التي يتم إنفاقها على العنصر الفائز * المضاعف المقابل للمكون الفائز). . سيتم إصدار الماس مباشرة في الحساب.',
+        lwff2:'على سبيل المثال ، يكلفك شراء حبة طماطم 5 أضعاف 100 ماسة ، و 100 ماسة لشراء جزرة. بعد الفوز بالجائزة ، ستحصل على 100 *5+100*5 =1000 ماسة.',
+        lwff3:' ستحصل على يانصيب هدية بعد المشاركة في اللعبة كل مرة',
+        qtsm_title:'تعليمات أخرى',
+        qtsm1:'إذا لم تستطع الإرشادات المذكورة أعلاه الإجابة على أسئلتك ، فيرجى الاتصال بخدمة العملاء ، وسيكون هناك شخص ما للإجابة على الأسئلة',
+        qtsm2:'هذا الحدث لا علاقة له بشركة Apple',
+        diamond_rank:'قائمة جوائز اليوم',
+        num_rank:'قائمة الحظ اليوم',
+        fragmentNum_title:'رصيد ماسي غير كافٍ',
+        fragmentNum_p:'الماس غير كاف حاليا',
+        cancel_btn:'يلغي',
+        confirm_btn:'الحصول على الماس',
+        showLoading:'السيرفر تحت الصيانة ...',
+        complete_toast:'توجد فجوة في الشبكة ، يرجى تسجيل الخروج وإعادة الدخول ، ويمكن الاطلاع على نتائج اليانصيب من خلال 【سجل اللعبة】/【 النتائج】 ～',
+        topthree_desc1:'لا أحد يخمن هذه الجولة',
+        topthree_desc2:'هذه الجولة من MVP',
+        top_wait:'منتظر',
+        first_line:'انقر لتحديد',
+        earn:'يكسب',
+        reward:'مكافأة مضاعفة',
+        on_list:'ليس في القائمة',
+        no_nick:'مجهول',
+        mine_diamond_num:'خمن صحيح',
+        mine_diamond_time:'من الدرجة الثانية',
+        select_time:'الرجاء تحديد عدد الأجزاء أولاً',
+        diamond:'الماس',
+         // ===============recprd============
+        no_more:'لا أكثر ~',
+        record:'سجل اللعبة',
+        drawStatus1:'عفوًا ، لقد خمنت خطأ',
+        drawStatus2:'رائع ~ لقد فهمت الأمر بشكل صحيح',
+        award:'جائزة',      
+        resultImg:'./images/record/result-ar.png',
+        putImg:'./images/record/touru-ar.png',  
+    }
+}

view/peko/activity/act-ocean/local/en.js

@@ -0,0 +1,69 @@
+// 英文
+langEn = {
+    // 模塊
+    demoModule: {
+        loading: 'Loading',
+        network: 'Network error, please exit and re-enter',
+        open_app: 'Please open it in the app',
+        // ===============index============
+        index_title: 'star kitchen',
+        diamond_num:'my diamond:',
+        fragment_num:`Today's reward:`,
+        count_down1:'Countdown to draw:',
+        second:'Second',
+        current_tip1:'How to play: choose the number of diamonds → choose ingredients',
+        count_down2:'In the lottery:',
+        current_tip2:'Waiting for results',
+        count_down3:'next round:',
+        current_tip3:'Results of this round:',
+        put:'put in',
+        desc:'award',
+        top_wait:'waiting',
+        cyfs_title:'way of participation',
+        cyfs:'Users can participate in the "Star Kitchen" game by spending diamonds, at least 100 diamonds each time, and each round takes 30 seconds',
+        wljgImg:'./images/en/wljg.png',
+        bannerImg:'./images/en/banner.png',
+        subtitleImg:'./images/en/subtitle.png',
+        ruleImg:'./images/en/rule.png',
+        recordImg:'./images/en/record.png',
+        rankImg:'./images/en/rank.png',
+        cyfsImg:'./images/en/t1.png',
+        lwffImg1:'./images/t2.png',
+        lwffImg2:'./images/en/t3.png',
+        lwff_title:'gift distribution',
+        lwff1:'Each time, one or more of the 8 ingredients are randomly selected as the winning ingredients. After winning the prize, you will get a diamond reward (the number of diamonds spent on the winning item * the corresponding multiple of the winning ingredient). issued. Diamonds will be issued directly into the account.',
+        lwff2:'For example, it costs 100 diamonds to buy a 5 times tomato, and 100 diamonds to buy a carrot. After winning the prize, you will get 100*5+100*5=1000 diamonds.',
+        lwff3:' Every time you participate in the game, you will get a gift lottery',
+        qtsm_title:'other instructions',
+        qtsm1:'If the above instructions can not answer your questions, please contact customer service, there will be someone to answer the questions',
+        qtsm2:'This event has nothing to do with Apple',
+        diamond_rank:`Today's reward list`,
+        num_rank:`Today's lucky list`,
+        fragmentNum_title:'Insufficient diamond balance',
+        fragmentNum_p:'Currently insufficient diamonds',
+        cancel_btn:'Cancel',
+        confirm_btn:'get diamonds',
+        showLoading:'The server is under maintenance...',
+        complete_toast:'There is a gap in the network, please log out and re-enter, the results of the lottery can be viewed through 【Game Records】/【Results】～',
+        topthree_desc1:'No one guesses this round',
+        topthree_desc2:'This round of MVP',
+        top_wait:'waiting',
+        first_line:'Click to select',
+        earn:'earn',
+        reward:'double reward',
+        on_list:'not on the list',
+        no_nick:'unknown',
+        mine_diamond_num:'guess right',
+        mine_diamond_time:'Second-rate',
+        select_time:'Please select the number of fragments first',
+        diamond:'diamond',
+         // ===============recprd============
+        no_more:'no more~',
+        record:'game record',
+        drawStatus1:'Oops~ I guessed wrong',
+        drawStatus2:'Awesome~ I got it right',
+        award:'award',
+        resultImg:'./images/record/result-en.png',
+        putImg:'./images/record/touru-en.png',
+    }
+}

view/peko/activity/act-ocean/local/id.js

@@ -0,0 +1,69 @@
+// 印尼语
+langId = {
+    // 模塊
+    demoModule: {
+        loading: 'Memuat',
+        network: 'Kesalahan jaringan, silakan keluar dan masuk kembali',
+        open_app: 'Silakan buka di aplikasi',
+        // ===============index============
+        index_title: 'dapur bintang',
+        diamond_num:'berlian saya:',
+        fragment_num:'Hadiah hari ini:',
+        count_down1:'Kiraan mundur ke loteri:',
+        second:'Detik',
+        current_tip1:'Cara bermain: <br> pilih jumlah berlian → pilih bahan',
+        count_down2:'Dalam lotere:',
+        current_tip2:'Menunggu hasil',
+        count_down3:'ronde selanjutnya:',
+        current_tip3:'Hasil babak ini:',
+        put:'masukkan',
+        desc:'menghadiahkan',
+        top_wait:'menunggu',
+        cyfs_title:'cara partisipasi',
+        cyfs:'Pengguna dapat berpartisipasi dalam game "Star Kitchen" dengan membelanjakan berlian, setidaknya 100 berlian setiap kali, dan setiap putaran membutuhkan waktu 30 detik',
+        wljgImg:'./images/id/wljg-yn.png',
+        bannerImg:'./images/id/banner-yn.png',
+        subtitleImg:'./images/id/subtitle-yn.png',
+        ruleImg:'./images/id/rule-yn.png',
+        recordImg:'./images/id/record-yn.png',
+        rankImg:'./images/id/rank-yn.png',
+        cyfsImg:'./images/id/t1-yn.png',
+        lwffImg1:'./images/t2.png',
+        lwffImg2:'./images/id/t3-yn.png',
+        lwff_title:'distribusi hadiah',
+        lwff1:'Setiap kali, satu atau lebih dari 8 bahan dipilih secara acak sebagai bahan pemenang. Setelah memenangkan hadiah, Anda akan mendapatkan hadiah berlian (jumlah berlian yang dihabiskan untuk item pemenang * kelipatan yang sesuai dari bahan pemenang). . Berlian akan dikeluarkan langsung ke akun.',
+        lwff2:'Misal beli tomat 5 kali beli 100 diamond, beli wortel 100 diamond, setelah menang hadiahnya 100*5+100*5=1000 diamond.',
+        lwff3:'Setiap kali berpartisipasi permainan, Anda akan mendapatkan hadiah lotre',
+        qtsm_title:'instruksi lainnya',
+        qtsm1:'Jika petunjuk di atas tidak dapat menjawab pertanyaan Anda, silakan hubungi layanan pelanggan, akan ada seseorang yang menjawab pertanyaan tersebut',
+        qtsm2:'Acara ini tidak ada hubungannya dengan Apple',
+        diamond_rank:'Daftar hadiah hari ini',
+        num_rank:'Daftar keberuntungan hari ini',
+        fragmentNum_title:'Saldo berlian tidak mencukupi',
+        fragmentNum_p:'Saat ini berlian tidak mencukupi',
+        cancel_btn:'Membatalkan',
+        confirm_btn:'mendapatkan berlian',
+        showLoading:'Server sedang dalam perbaikan...',
+        complete_toast:'Ada celah di jaringan, harap logout dan masuk kembali, hasil undian dapat dilihat melalui 【Catatan Game】/【Hasil】～',
+        topthree_desc1:'Tidak ada yang menebak babak ini',
+        topthree_desc2:'MVP babak ini',
+        top_wait:'menunggu',
+        first_line:'Klik untuk memilih',
+        earn:'menghasilkan',
+        reward:'kali hadiah',
+        on_list:'tidak ada dalam daftar',
+        no_nick:'tidak dikenal',
+        mine_diamond_num:'tebak benar',
+        mine_diamond_time:'kali',
+        select_time:'Harap pilih jumlah fragmen terlebih dahulu',
+        diamond:'berlian',
+         // ===============recprd============
+        no_more:'tidak ada lagih~',
+        record:'rekor permainan',
+        drawStatus1:'Ups~ tebakan salah',
+        drawStatus2:'Luar biasa~ Saya benar',
+        award:'hadiah',
+        resultImg:'./images/record/result-id.png',
+        putImg:'./images/record/touru-id.png',
+    }
+}

view/peko/activity/act-ocean/local/tr.js

@@ -0,0 +1,69 @@
+// 土耳其语
+langTr = {
+    // 模塊
+    demoModule: {
+        loading: 'Yükleniyor',
+        network: 'Ağ hatası, lütfen çıkın ve tekrar girin',
+        open_app: 'Lütfen uygulamada açın',
+        // ===============index============
+        index_title: 'yıldız mutfak',
+        diamond_num:'elmasım:',
+        fragment_num:'Bugünün ödülü:',
+        count_down1:'Çizmek için geri sayım:',
+        second:'Saniye',
+        current_tip1:'Nasıl oynanır: elmas sayısını seçin <br> → malzemeleri seçin',
+        count_down2:'Piyangoda:',
+        current_tip2:'Sonuçlar bekleniyor',
+        count_down3:'sonraki tur:',
+        current_tip3:'Bu turun sonuçları:',
+        put:'koymak',
+        desc:'ödül',
+        top_wait:'beklemek',
+        cyfs_title:'katılım yolu',
+        cyfs:'Kullanıcılar elmas harcayarak, her seferinde en az 100 elmas harcayarak "Yıldız Mutfağı" oyununa katılabilirler ve her tur 30 saniye sürer.',
+        wljgImg:'./images/tr/wljg-tr.png',
+        bannerImg:'./images/tr/banner-tr.png',
+        subtitleImg:'./images/tr/subtitle-tr.png',
+        ruleImg:'./images/tr/rule-tr.png',
+        recordImg:'./images/tr/record-tr.png',
+        rankImg:'./images/tr/rank-tr.png',
+        cyfsImg:'./images/tr/t1-tr.png',
+        lwffImg1:'./images/t2.png',
+        lwffImg2:'./images/tr/t3-tr.png',
+        lwff_title:'hediye dağıtımı',
+        lwff1:'Her seferinde, 8 malzemeden biri veya daha fazlası kazanan malzemeler olarak rastgele seçilir.Ödülü kazandıktan sonra, bir elmas ödülü alırsınız (kazanan öğe için harcanan elmas sayısı * kazanan bileşenin ilgili katı). . Elmaslar doğrudan hesaba verilecektir.',
+        lwff2:'Örneğin 5 kat domates almak 100 elmas, havuç almak 100 elmas, ödülü kazandıktan sonra 100*5+100*5=1000 elmas alacaksınız.',
+        lwff3:'Oyuna her katıldığınızda, bir hediye çekilişi alacaksınız',
+        qtsm_title:'diğer talimatlar',
+        qtsm1:'Yukarıdaki talimatlar sorularınızı cevaplayamıyorsa, lütfen müşteri hizmetleri ile iletişime geçin, soruları cevaplayacak biri olacaktır.',
+        qtsm2:'Bu olayın Apple ile alakası yok.',
+        diamond_rank:'Bugünün ödül listesi',
+        num_rank:'Bugünün şanslı listesi',
+        fragmentNum_title:'Yetersiz elmas dengesi',
+        fragmentNum_p:'Şu anda yetersiz elmaslar',
+        cancel_btn:'İptal etmek',
+        confirm_btn:'elmas al',
+        showLoading:'Sunucu bakımda...',
+        complete_toast:'Ağda bir boşluk var, lütfen oturumu kapatın ve tekrar girin, çekilişin sonuçları 【Oyun Kayıtları】/【Sonuçlar】 aracılığıyla görüntülenebilir～',
+        topthree_desc1:'Bu raundu kimse tahmin edemez',
+        topthree_desc2:'Bu MVP turu',
+        top_wait:'beklemek',
+        first_line:'Seçmek için tıkla',
+        earn:'para kazanmak',
+        reward:'çifte ödül',
+        on_list:'listede yok',
+        no_nick:'Bilinmeyen',
+        mine_diamond_num:'doğru tahmin et',
+        mine_diamond_time:'ikinci sınıf',
+        select_time:'Lütfen önce parça sayısını seçin',
+        diamond:'delmek',
+         // ===============recprd============
+        no_more:'artık yok~',
+        record:'oyun rekoru',
+        drawStatus1:'Ayy~ Yanlış tahmin ettim',
+        drawStatus2:'Müthiş~ Doğru anladım',
+        award:'ödül',   
+        resultImg:'./images/record/result-tr.png',
+        putImg:'./images/record/touru-tr.png',
+    }
+}

view/peko/activity/act-ocean/local/zh.js

@@ -0,0 +1,69 @@
+// 繁体中文
+langZh = {
+    // 模塊
+    demoModule: {
+        loading: '加載中',
+        network: '網絡錯誤，請退出重進',
+        open_app: '請在app內打開',
+        // ===============index============
+        index_title: '星級廚房',
+        diamond_num:'我的鉆石：',
+        fragment_num:'今日獎勵：',
+        count_down1:'開獎倒計時：',
+        second:'秒',
+        current_tip1:'玩法：<br>選擇鉆石數量→選擇食材',
+        count_down2:'開獎中：',
+        current_tip2:'等待結果',
+        count_down3:'下一輪：',
+        current_tip3:'本輪結果：',
+        put:'投入',
+        desc:'獎勵',
+        top_wait:'虛位以待',
+        cyfs_title:'參與方式',
+        cyfs:'用戶可通過花費鉆石參與《星級廚房》遊戲，每次最少消耗100鉆石，每回合時間30秒',
+        wljgImg:'./images/wljg.png',
+        bannerImg:'./images/banner.png',
+        subtitleImg:'./images/subtitle.png',
+        ruleImg:'./images/rule.png',
+        recordImg:'./images/record.png',
+        rankImg:'./images/rank.png',
+        cyfsImg:'./images/t1.png',
+        lwffImg1:'./images/t2.png',
+        lwffImg2:'./images/t3.png',
+        lwff_title:'禮物發放',
+        lwff1:'每次隨機從8種食材中選取一個或多個作為中獎食材，中獎後獲得（中獎物品所花費的鉆石數*中獎食材對應倍數）的鉆石獎勵，當中獎多個食材時，獲得的鉆石會同時發放。鉆石將直接發放到賬戶中。',
+        lwff2:'例如購買1個5倍番茄花費100鉆，購買1個蘿蔔花費100鉆，中獎後將獲得100*5+100*5=1000鉆。',
+        lwff3:'每次參與遊戲後會獲得一次禮物開獎;',
+        qtsm_title:'其他說明',
+        qtsm1:'如果以上說明未能解答您的疑問，請聯繫客服，會有專人解答疑難',
+        qtsm2:'本活動與蘋果公司無關',
+        diamond_rank:'今日獎勵榜',
+        num_rank:'今日歐皇榜',
+        fragmentNum_title:'鉆石余額不足',
+        fragmentNum_p:'當前鉆石不足',
+        cancel_btn:'取消',
+        confirm_btn:'獲取鉆石',
+        showLoading:'服務器正在維護中...',
+        complete_toast:'網絡開小差，請退出重進，開獎結果可通過【遊戲記錄】/【往輪結果】查看～',
+        topthree_desc1:'本輪無人猜中',
+        topthree_desc2:'本輪MVP',
+        top_wait:'虛位以待',
+        first_line:'點擊選取',
+        earn:'賺',
+        reward:'倍獎勵',
+        on_list:'未上榜',
+        no_nick:'未知',
+        mine_diamond_num:'猜中',
+        mine_diamond_time:'次',
+        select_time:'請先選擇碎片數量',
+        diamond:'鉆石',
+        // ===============recprd============
+        no_more:'沒有更多啦~',
+        record:'遊戲記錄',
+        drawStatus1:'哎呀~猜錯了 o(╥﹏╥)o',
+        drawStatus2:'厲害~猜對了 ୧(๑•̀◡•́๑)૭',
+        award:'獎勵',
+        resultImg:'./images/record/result.png',
+        putImg:'./images/record/touru.png',
+    }
+}

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

@@ -5,7 +5,7 @@
     <meta charset="UTF-8">
     <meta name="viewport"
         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-    <title>游戏记录</title>
+    <title></title>
 
     <link rel="stylesheet" href="../../common/css/reset.css">
     <link rel="stylesheet" href="./css/record.css">
@@ -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> -->
@@ -45,6 +140,12 @@
     <script src="../../common/js/common2.js"></script>
     <script src="../../common/js/layer.js"></script>
     <script src="../../common/js/vconsole.min.js"></script>
+    <script src="./local/zh.js"></script>
+    <script src="./local/en.js"></script>
+    <script src="./local/ar.js"></script>
+    <script src="./local/id.js"></script>
+    <script src="./local/tr.js"></script>
+    <script src="../../common/local/langHandler.js"></script>
     <script src="./js/record.js"></script>
 </body>
 

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

@@ -2,13 +2,13 @@ const productUrl = 'https://api.pekolive.com'; // 正式环境
 const testUrl = 'https://beta.api.pekolive.com'; // 测试环境
 
 
-function render (templateId, templateData, target) {
+function render(templateId, templateData, target) {
     var html = template(templateId, templateData);
     target.innerHTML += html;
 }
 var tranUrl = 'https://api.pekolive.com';
 
-function dateFormat (date, fmt) {
+function dateFormat(date, fmt) {
     date = new Date(date);
     var o = {
         'M+': date.getMonth() + 1,
@@ -19,7 +19,7 @@ function dateFormat (date, fmt) {
     };
 
     // 补全0
-    function padLeftZero (str) {
+    function padLeftZero(str) {
         return ('00' + str).substr(str.length);
     }
 
@@ -40,7 +40,7 @@ function dateFormat (date, fmt) {
     return fmt;
 }
 
-function convert (_url) {
+function convert(_url) {
     var patt = /\d+/;
     var num = _url.match(patt);
     var rs = {};
@@ -65,7 +65,7 @@ function convert (_url) {
 // }
 
 // 根据域名适配环境
-function EnvCheck () {
+function EnvCheck() {
     if (window.location.href) {
         var _url = window.location.href;
         var res = _url.match(/uat/);
@@ -84,7 +84,7 @@ function EnvCheck () {
 
 // 根据域名判断 正式环境(含www)/测试环境(含beta), 并返回所需url前缀
 // written by zxfxiong
-function getUrlPrefix () {
+function getUrlPrefix() {
     if (!EnvCheck()) return undefined;
     return EnvCheck() === 'live' ? productUrl : testUrl;
 }
@@ -92,7 +92,7 @@ function getUrlPrefix () {
 
 
 // 根据域名判断是本地打开还是服务器打开
-function locateJudge () {
+function locateJudge() {
     if (window.location.href) {
         var _url = window.location.href;
         var res = _url.match(/test|localhost/);
@@ -105,7 +105,7 @@ function locateJudge () {
 }
 
 // 获取地址栏参数
-function getQueryString () {
+function getQueryString() {
     var _url = location.search;
     var theRequest = new Object();
     if (_url.indexOf('?') != -1) {
@@ -119,7 +119,7 @@ function getQueryString () {
 }
 
 // 判断浏览器内核，手机类型
-function checkVersion () {
+function checkVersion() {
     var u = navigator.userAgent,
         app = navigator.appVersion;
     return {
@@ -141,7 +141,7 @@ function checkVersion () {
 }
 
 // 图片预加载
-function preloadImage (obj) {
+function preloadImage(obj) {
     console.log(obj)
     var loadLength = 0,
         newImages = [];
@@ -159,7 +159,7 @@ function preloadImage (obj) {
 }
 
 // 判断是否在App内
-function isApp () {
+function isApp() {
     var androidBol = false;
     var osBol = false;
     if (window.androidJsObj && typeof window.androidJsObj === 'object') {
@@ -173,7 +173,7 @@ function isApp () {
 
 }
 
-function UrlSearch () {
+function UrlSearch() {
     var name, value;
     var str = location.href;
     var num = str.indexOf("?")
@@ -190,7 +190,7 @@ function UrlSearch () {
     return value;
 }
 
-function erbanMask (channel, tags, params) {
+function erbanMask(channel, tags, params) {
     //此函数用于一般的轻寻底层面罩
     var browser = checkVersion();
     var env = EnvCheck();
@@ -236,7 +236,7 @@ function erbanMask (channel, tags, params) {
     }
 }
 
-function wxConfig () {
+function wxConfig() {
     var wxurl = encodeURIComponent(location.href.split('#')[0]);
     var data = "url=" + wxurl;
     console.log(data);
@@ -266,11 +266,11 @@ function wxConfig () {
     })
 }
 
-function refreshWeb () {
+function refreshWeb() {
     window.location.href = window.location.href;
 }
 
-function shareInfo (urlMsg) {
+function shareInfo(urlMsg) {
     if (urlMsg) {
         var env = EnvCheck();
         if (env == 'test') {
@@ -281,7 +281,7 @@ function shareInfo (urlMsg) {
     }
 }
 
-function initNav (obj) {
+function initNav(obj) {
     if ($.isEmptyObject(obj)) {
         return;
     }
@@ -442,7 +442,7 @@ var $Loading = {
 };
 var requestBaseUrl = locateJudge();
 // ajax
-function request (type, option) {
+function request(type, option) {
     return $.ajax({
         type: type,
         url: requestBaseUrl + option.url,
@@ -462,11 +462,11 @@ function request (type, option) {
     })
 }
 // ajax get
-function getJSON (option) {
+function getJSON(option) {
     request('get', option)
 }
 // ajax post
-function postJSON (option) {
+function postJSON(option) {
     request('post', option);
 }
 
@@ -523,7 +523,7 @@ const methodsFromClient = {
 // 全局获取并配置公共参数
 // written by zxfxiong
 const pubInfo = {};
-function getInfoFromClient () {
+function getInfoFromClient() {
     const browser = checkVersion();
     if (browser.app) {
         console.log('从客户端获取了用户信息（设备信息），此信息来源：common2.js');
@@ -541,8 +541,8 @@ function getInfoFromClient () {
 
     } else {
         // 非app环境调试参数
-        pubInfo.uid = 2346;
-        pubInfo.ticket = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ0aWNrZXRfdHlwZSI6bnVsbCwidWlkIjoyMzQ2LCJ0aWNrZXRfaWQiOiJhOTY1YzkyYi1hZDM2LTRhZWItODk5OC1iN2UzODEyZjU2ZGYiLCJleHAiOjM2MDAsImNsaWVudF9pZCI6ImVyYmFuLWNsaWVudCJ9.AA-x5FwodxS9zimfJv4CTBXgD5-CPgVeoS-L6EU8VTI";
+        pubInfo.uid = 0;
+        pubInfo.ticket = "";
         // pubInfo.uid = "";
         // pubInfo.ticket = "";
 
@@ -557,18 +557,82 @@ function getInfoFromClient () {
         };
     }
 };
+
+// 设定语言 fuzzy模糊查询客户端返回的语言
+const languageMap = [
+    { name: '简体中文', code: 'zh', fuzzy: ['zh', 'zh-Hans', 'zh-'] },
+    { name: '繁体中文', code: 'zh', fuzzy: ['zh', 'zh-Hant', 'zh-'] },
+    { name: '英语', code: 'en', fuzzy: ['en'] },
+    { name: '阿拉伯语', code: 'ar', fuzzy: ['ar','ar-'] },
+    { name: '印尼语', code: 'id', fuzzy: ['id', 'in', 'id-', 'in-'] },
+    { name: '土耳其语', code: 'tr', fuzzy: ['tr','tr-'] },
+];
+// 判断当前语言环境
+function getLanguageCode(language) {
+    if (language) {
+        // language = language.toLowerCase();
+        for (const item of languageMap) {
+            // if (item.fuzzy.indexOf(language) !=-1) {
+            //     return item.code;
+            // }
+            for (const list of item.fuzzy) {
+                if (language.indexOf(list) != -1) {
+                    return item.code;
+                }
+            }
+        }
+    } else {
+        return 'zh'; // 旧版本返回默认语言
+    }
+}
+// 判断国际化参数路径
+function fuzzyMatchUpdateQueryStringParameterFun() {
+    const browser = checkVersion();
+    if (browser.app) {
+        if (browser.android) {
+            console.log('and deviceInfo', JSON.parse(pubInfo.deviceInfo));
+            let langCode = getLanguageCode(JSON.parse(pubInfo.deviceInfo)["Accept-Language"]);
+            history.replaceState(null, null, updateQueryStringParameter(window.location.href, 'lang', langCode));
+
+        } else {
+            setTimeout(function () {
+                console.log('ios deviceInfo', pubInfo.deviceInfo);
+                let langCode = getLanguageCode(pubInfo.deviceInfo["Accept-Language"]);
+                history.replaceState(null, null, updateQueryStringParameter(window.location.href, 'lang', langCode));
+            }, 40)
+        }
+    } else {
+        let langCode = getLanguageCode();
+        history.replaceState(null, null, updateQueryStringParameter(window.location.href, 'lang', langCode));
+    }
+}
+// 获取整条url
+function updateQueryStringParameter(uri, key, value) {
+    if (!value) {
+        return uri;
+    }
+    var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
+    var separator = uri.indexOf('?') !== -1 ? "&" : "?";
+    if (uri.match(re)) {
+        return uri.replace(re, '$1' + key + "=" + value + '$2');
+    }
+    else {
+        return uri + separator + key + "=" + value;
+    }
+}
+
 // 繁体字转换方法
 // fontConvert(true);//调用字体转换函数
 // setTimeout(function () {
-fontConvert(true);//调用字体转换函数
+// fontConvert(true);//调用字体转换函数
 // }, 1000)
-function fontConvert (fontConvertBool) {
-    function SconvertT () {//简体转换繁体
+function fontConvert(fontConvertBool) {
+    function SconvertT() {//简体转换繁体
         document.head.innerHTML = s2t(document.head.innerHTML);
         document.body.innerHTML = s2t(document.body.innerHTML);
         // document.body.innerHTML
     }
-    function TconvertS () {//繁体转换简体
+    function TconvertS() {//繁体转换简体
         document.head.innerHTML = t2s(document.head.innerHTML);
         document.body.innerHTML = t2s(document.body.innerHTML);
     }
@@ -579,7 +643,7 @@ function fontConvert (fontConvertBool) {
     }
 
     //功能：转换对象，使用递归，逐层剥到文本；
-    function transformContent (switcherId, fobj) {
+    function transformContent(switcherId, fobj) {
         if (typeof (fobj) == "object") {
             var obj = fobj.childNodes
         } else {
@@ -613,12 +677,12 @@ function fontConvert (fontConvertBool) {
         }
     }
     //功能：转换指定字符串；
-    function transformText (txt, isFt) {
+    function transformText(txt, isFt) {
         if (txt == null || txt == "") return ""
         if (parseInt(isFt)) { return s2t(txt) } else { return t2s(txt) }
     }
     //功能：简体字符转为繁体字符；
-    function s2t (cc) {
+    function s2t(cc) {
         var str = '', ss = jtpy(), tt = ftpy();
         for (var i = 0; i < cc.length; i++) {
             var c = cc.charAt(i);
@@ -628,7 +692,7 @@ function fontConvert (fontConvertBool) {
         return str;
     }
     //功能：繁体字符转为简体字符；
-    function t2s (cc) {
+    function t2s(cc) {
         var str = '', ss = jtpy(), tt = ftpy();
         for (var i = 0; i < cc.length; i++) {
             var c = cc.charAt(i);
@@ -637,14 +701,14 @@ function fontConvert (fontConvertBool) {
         }
         return str;
     }
-    function jtpy () {
+    function jtpy() {
         return '号隐爱的魔力之旅週金币榜皑蔼碍翱袄奥坝罢摆败颁办绊帮绑镑谤剥饱宝报鲍辈贝钡狈备惫绷笔毕毙闭边编贬变辩辫鼈瘪濒滨宾摈饼拨钵铂驳卜补参蚕残惭惨灿苍舱仓沧厕侧册测层诧搀掺蝉馋谗缠铲産阐颤场尝长偿肠厂畅钞车彻尘陈衬撑称惩诚骋痴迟驰耻齿炽冲虫宠畴踌筹绸丑橱厨锄雏础储触处传疮闯创锤纯绰辞词赐聪葱囱从丛凑窜错达带贷担单郸掸胆惮诞弹当挡党荡档捣岛祷导盗灯邓敌涤递缔点垫电淀钓调迭谍迭钉顶锭订东动栋冻斗犊独读赌镀锻断缎兑队对吨顿钝夺鹅额讹恶饿儿尔饵贰发罚阀珐矾钒烦范贩饭访纺飞废费纷坟奋愤粪丰枫锋风疯冯缝讽凤肤辐抚辅赋複负讣妇缚该钙盖干赶秆赣冈刚钢纲岗皋镐搁鸽阁铬个给龚宫巩贡鈎沟构购够蛊顾剐关观馆惯贯广规硅归龟闺轨诡柜贵刽辊滚锅国过骇韩汉阂鹤贺横轰鸿红后壶护沪户哗华画划话怀坏欢环还缓换唤痪焕涣黄谎挥辉毁贿秽会烩彙讳诲绘荤浑伙获货祸击机积饥讥鸡绩缉极辑级挤几蓟剂济计记际继纪夹荚颊贾钾价驾歼监坚笺间艰缄茧检碱硷拣捡简俭减荐槛鉴践贱见键舰剑饯渐溅涧浆蒋桨奖讲酱胶浇骄娇搅铰矫侥脚饺缴绞轿较秸阶节茎惊经颈静镜径痉竞淨纠厩旧驹举据锯惧剧鹃绢杰洁结诫届紧锦仅谨进晋烬尽劲荆觉决诀绝钧军骏开凯颗壳课垦恳抠库裤夸块侩宽矿旷况亏岿窥馈溃扩阔蜡腊莱来赖蓝栏拦篮阑兰澜谰揽览懒缆烂滥捞劳涝乐镭垒类泪篱离里鲤礼丽厉励砾曆沥隶俩联莲连镰怜涟帘敛脸链恋炼练粮凉两辆谅疗辽镣猎临邻鳞凛赁龄铃凌灵岭领馏刘龙聋咙笼垄拢陇楼娄搂篓芦卢颅庐炉掳卤虏鲁赂禄录陆驴吕铝侣屡缕虑滤绿峦挛孪滦乱抡轮伦仑沦纶论萝罗逻锣箩骡骆络妈玛码蚂马骂吗买麦卖迈脉瞒馒蛮满谩猫锚铆贸么霉没镁门闷们锰梦谜弥觅绵缅庙灭悯闽鸣铭谬谋亩钠纳难挠脑恼闹馁腻撵捻酿鸟聂齧镊镍柠狞甯拧泞钮纽脓浓农疟诺欧鸥殴呕沤盘庞国爱赔喷鹏骗飘频贫苹凭评泼颇扑铺朴谱脐齐骑岂啓气弃讫牵扦釺铅迁签谦钱钳潜浅谴堑枪呛牆蔷强抢锹桥乔侨翘窍窃钦亲轻氢倾顷请庆琼穷趋区躯驱龋颧权劝却鹊让饶扰绕热韧认纫荣绒软锐闰润洒萨鳃赛伞丧骚扫涩杀纱筛晒闪陝赡缮伤赏烧绍赊摄慑设绅审婶肾渗声绳胜圣师狮湿诗尸时蚀实识驶势释饰视试寿兽枢输书赎属术树竖数帅双谁税顺说硕烁丝饲耸怂颂讼诵擞苏诉肃虽绥岁孙损笋缩琐锁獭挞抬摊贪瘫滩坛谭谈歎汤烫涛縧腾誊锑题体屉条贴铁厅听烃铜统头图涂团颓蜕脱鸵驮驼椭洼袜弯湾顽万网韦违围爲潍维苇伟僞纬谓卫温闻纹稳问瓮挝蜗涡窝呜钨乌诬无芜吴坞雾务误锡牺袭习铣戏细虾辖峡侠狭厦锨鲜纤咸贤衔闲显险现献县馅羡宪线厢镶乡详响项萧销晓啸蝎协挟携胁谐写泻谢锌衅兴汹鏽绣虚嘘须许绪续轩悬选癣绚学勳询寻驯训讯逊压鸦鸭哑亚讶阉烟盐严顔阎豔厌砚彦谚验鸯杨扬疡阳痒养样瑶摇尧遥窑谣药爷页业叶医铱颐遗仪彝蚁艺亿忆义诣议谊译异绎荫阴银饮樱婴鹰应缨莹萤营荧蝇颖哟拥佣痈踊咏涌优忧邮铀犹游诱舆鱼渔娱与屿语吁御狱誉预驭鸳渊辕园员圆缘远愿约跃钥岳粤悦阅云郧匀陨运蕴酝晕韵杂灾载攒暂赞赃髒凿枣灶责择则泽贼赠扎札轧铡闸诈斋债毡盏斩辗崭栈战绽张涨帐账胀赵蛰辙锗这贞针侦诊镇阵挣睁狰帧郑证织职执纸挚掷帜质锺终种肿衆诌轴皱昼骤猪诸诛烛瞩嘱贮铸筑驻专砖转赚桩庄装妆壮状锥赘坠缀谆浊兹资渍踪综总纵邹诅组鑽緻钟么为隻凶准启闆裡雳馀鍊洩并';
     }
-    function ftpy () {
+    function ftpy() {
         return '號隱愛的魔力之旅週金幣榜皚藹礙翺襖奧壩罷擺敗頒辦絆幫綁鎊謗剝飽寶報鮑輩貝鋇狽備憊繃筆畢斃閉邊編貶變辯辮鼈癟瀕濱賓擯餅撥缽鉑駁蔔補參蠶殘慚慘燦蒼艙倉滄廁側冊測層詫攙摻蟬饞讒纏鏟産闡顫場嘗長償腸廠暢鈔車徹塵陳襯撐稱懲誠騁癡遲馳恥齒熾沖蟲寵疇躊籌綢醜櫥廚鋤雛礎儲觸處傳瘡闖創錘純綽辭詞賜聰蔥囪從叢湊竄錯達帶貸擔單鄲撣膽憚誕彈當擋黨蕩檔搗島禱導盜燈鄧敵滌遞締點墊電澱釣調疊諜疊釘頂錠訂東動棟凍鬥犢獨讀賭鍍鍛斷緞兌隊對噸頓鈍奪鵝額訛惡餓兒爾餌貳發罰閥琺礬釩煩範販飯訪紡飛廢費紛墳奮憤糞豐楓鋒風瘋馮縫諷鳳膚輻撫輔賦複負訃婦縛該鈣蓋幹趕稈贛岡剛鋼綱崗臯鎬擱鴿閣鉻個給龔宮鞏貢鈎溝構購夠蠱顧剮關觀館慣貫廣規矽歸龜閨軌詭櫃貴劊輥滾鍋國過駭韓漢閡鶴賀橫轟鴻紅後壺護滬戶嘩華畫劃話懷壞歡環還緩換喚瘓煥渙黃謊揮輝毀賄穢會燴彙諱誨繪葷渾夥獲貨禍擊機積饑譏雞績緝極輯級擠幾薊劑濟計記際繼紀夾莢頰賈鉀價駕殲監堅箋間艱緘繭檢堿鹼揀撿簡儉減薦檻鑒踐賤見鍵艦劍餞漸濺澗漿蔣槳獎講醬膠澆驕嬌攪鉸矯僥腳餃繳絞轎較稭階節莖驚經頸靜鏡徑痙競淨糾廄舊駒舉據鋸懼劇鵑絹傑潔結誡屆緊錦僅謹進晉燼盡勁荊覺決訣絕鈞軍駿開凱顆殼課墾懇摳庫褲誇塊儈寬礦曠況虧巋窺饋潰擴闊蠟臘萊來賴藍欄攔籃闌蘭瀾讕攬覽懶纜爛濫撈勞澇樂鐳壘類淚籬離裏鯉禮麗厲勵礫曆瀝隸倆聯蓮連鐮憐漣簾斂臉鏈戀煉練糧涼兩輛諒療遼鐐獵臨鄰鱗凜賃齡鈴淩靈嶺領餾劉龍聾嚨籠壟攏隴樓婁摟簍蘆盧顱廬爐擄鹵虜魯賂祿錄陸驢呂鋁侶屢縷慮濾綠巒攣孿灤亂掄輪倫侖淪綸論蘿羅邏鑼籮騾駱絡媽瑪碼螞馬罵嗎買麥賣邁脈瞞饅蠻滿謾貓錨鉚貿麼黴沒鎂門悶們錳夢謎彌覓綿緬廟滅憫閩鳴銘謬謀畝鈉納難撓腦惱鬧餒膩攆撚釀鳥聶齧鑷鎳檸獰寧擰濘鈕紐膿濃農瘧諾歐鷗毆嘔漚盤龐國愛賠噴鵬騙飄頻貧蘋憑評潑頗撲鋪樸譜臍齊騎豈啓氣棄訖牽扡釺鉛遷簽謙錢鉗潛淺譴塹槍嗆牆薔強搶鍬橋喬僑翹竅竊欽親輕氫傾頃請慶瓊窮趨區軀驅齲顴權勸卻鵲讓饒擾繞熱韌認紉榮絨軟銳閏潤灑薩鰓賽傘喪騷掃澀殺紗篩曬閃陝贍繕傷賞燒紹賒攝懾設紳審嬸腎滲聲繩勝聖師獅濕詩屍時蝕實識駛勢釋飾視試壽獸樞輸書贖屬術樹豎數帥雙誰稅順說碩爍絲飼聳慫頌訟誦擻蘇訴肅雖綏歲孫損筍縮瑣鎖獺撻擡攤貪癱灘壇譚談歎湯燙濤縧騰謄銻題體屜條貼鐵廳聽烴銅統頭圖塗團頹蛻脫鴕馱駝橢窪襪彎灣頑萬網韋違圍爲濰維葦偉僞緯謂衛溫聞紋穩問甕撾蝸渦窩嗚鎢烏誣無蕪吳塢霧務誤錫犧襲習銑戲細蝦轄峽俠狹廈鍁鮮纖鹹賢銜閑顯險現獻縣餡羨憲線廂鑲鄉詳響項蕭銷曉嘯蠍協挾攜脅諧寫瀉謝鋅釁興洶鏽繡虛噓須許緒續軒懸選癬絢學勳詢尋馴訓訊遜壓鴉鴨啞亞訝閹煙鹽嚴顔閻豔厭硯彥諺驗鴦楊揚瘍陽癢養樣瑤搖堯遙窯謠藥爺頁業葉醫銥頤遺儀彜蟻藝億憶義詣議誼譯異繹蔭陰銀飲櫻嬰鷹應纓瑩螢營熒蠅穎喲擁傭癰踴詠湧優憂郵鈾猶遊誘輿魚漁娛與嶼語籲禦獄譽預馭鴛淵轅園員圓緣遠願約躍鑰嶽粵悅閱雲鄖勻隕運蘊醞暈韻雜災載攢暫贊贓髒鑿棗竈責擇則澤賊贈紮劄軋鍘閘詐齋債氈盞斬輾嶄棧戰綻張漲帳賬脹趙蟄轍鍺這貞針偵診鎮陣掙睜猙幀鄭證織職執紙摯擲幟質鍾終種腫衆謅軸皺晝驟豬諸誅燭矚囑貯鑄築駐專磚轉賺樁莊裝妝壯狀錐贅墜綴諄濁茲資漬蹤綜總縱鄒詛組鑽緻鐘麼為隻兇準啟闆裡靂餘鍊洩並';
     }
     //功能：获取指定名称的 Cookie 值；
-    function readCookie (name) {
+    function readCookie(name) {
         var value = "";
         if (document.cookie.length > 0) {
             var prefix = name + "=";
@@ -659,7 +723,7 @@ function fontConvert (fontConvertBool) {
         return value;
     }
     //功能：设置指定名称的 Cookie 值；
-    function writeCookie (name, value, days) {
+    function writeCookie(name, value, days) {
         var argv = writeCookie.arguments;
         var argc = writeCookie.arguments.length;
         var days = (argc > 2) ? argv[2] : null;
@@ -676,7 +740,7 @@ function fontConvert (fontConvertBool) {
     //    isDefaultFt 当前文档默认是否为繁体中文；
     //    delay 页面加载后的转换延迟时间，单位毫秒；
     //    使用的 Cookie 变量名称：isCurrentFt
-    function initPageLanguage (switcherId, isDefaultFt, delay) {
+    function initPageLanguage(switcherId, isDefaultFt, delay) {
         isDefaultFt = isDefaultFt ? "1" : "0";
         var switcherObj = document.getElementById(switcherId)
         isCurrentFt = readCookie("isCurrentFt")
@@ -702,17 +766,17 @@ function fontConvert (fontConvertBool) {
     //initPageLanguage("switcher_link", false, 50);
 }
 // 封装数值超过最大数位处理单位
-function unitProcessing (val, num, toFixeds, text) { //值 以什么为单位 保留几位小数 单位后最w
+function unitProcessing(val, num, toFixeds, text) { //值 以什么为单位 保留几位小数 单位后最w
     return val > num ? (Math.floor(val / 1000) / 10).toFixed(toFixeds) + text : val;
 }
 // 封装 在ios环境中 配置公共参数的回调函数
 // 配合 methodsFromClient[infoName].ios 方法
 // written by zxfxiong
-function getMessage (key, value) {
+function getMessage(key, value) {
     pubInfo[key] = value;
 }
 
-function objToParam (a) {
+function objToParam(a) {
     var s = [],
         rbracket = /\[\]$/,
         isArray = function (obj) {
@@ -758,7 +822,8 @@ function objToParam (a) {
 
 // 封装 jquery 请求
 // written by zxfxiong
-function networkRequest (reqObj = {}, type) {
+function networkRequest(reqObj = {}, type) {
+    
     // 关于reqObj内部参数：与 调用原生$.ajax()时传参一致
     // 调用该函数前：须保证事先调用了 getInfoFromClient()
     if (typeof pubInfo.deviceInfo === 'string') {
@@ -774,9 +839,16 @@ function networkRequest (reqObj = {}, type) {
         channel: pubInfo.deviceInfo.channel || '',
         client: 'h5',
         pub_uid: pubInfo.uid,
-        pub_ticket: pubInfo.ticket
+        pub_ticket: pubInfo.ticket,
     };
 
+    const browser = checkVersion();
+    if (browser.app) {
+        pubHeader["Accept-Language"] = pubInfo.deviceInfo["Accept-Language"];
+    } else {
+        pubHeader["Accept-Language"] = getQueryString().lang;
+    }
+
     const url = reqObj.url;
     const commParams = objToParam(pubHeader);
     if (url.indexOf('?') >= 0) {

view/peko/common/local/langHandler.js

@@ -0,0 +1,55 @@
+/**
+ * 初始化当前语言 
+ */
+function initLocalLang () {
+    const lang = localStorage.getItem('lang')
+    // if (lang === 'zh' || window.location.href.match('=zh-CN')) {
+    //     console.log("langHandler" + '简体')
+    //     // 将 zh-CN.js中的对象langZhCN设置到window.lang中
+    //     window.lang = langZh-CN
+    //     window.lang.code = 'zh-CN'
+    //     window.lang.defaults = false
+    // } else
+     if (lang === 'zh' || window.location.href.match('=zh')) {
+        console.log("langHandler" + '繁体')
+        window.lang = langZh
+        window.lang.code = 'zh'
+        window.lang.defaults = false
+    } else if (lang === 'ar' || window.location.href.match('=ar')) {
+        // 阿拉伯
+        console.log("langHandler" + '阿拉伯')
+        window.lang = langAr
+        window.lang.code = 'ar'
+        window.lang.defaults = false
+    } else if (lang === 'en' || window.location.href.match('=en')) {
+        // 英语
+        console.log("langHandler" + '英语')
+        window.lang = langEn
+        window.lang.code = 'en'
+        window.lang.defaults = false
+    } else if (lang === 'id' || window.location.href.match('=id')) {
+        // 印度尼西亚
+        console.log("langHandler" + '印尼')
+        window.lang = langId
+        window.lang.code = 'id'
+        window.lang.defaults = false
+    }else if (lang === 'tr' || window.location.href.match('=tr')) {
+        // 土耳其
+        console.log("langHandler" + '土耳其')
+        window.lang = langTr
+        window.lang.code = 'tr'
+        window.lang.defaults = false
+    } else {
+        console.log("langHandler" + '默认')
+        window.lang = langZh
+        window.lang.code = null
+        window.lang.defaults = true
+    }
+
+    window.lang.replace = (Lang, defaultText) => {
+        if (Lang) {
+            return Lang
+        }
+        return defaultText
+    }
+}