修复支付后弹窗依旧存在的问题

view/molistar/activity/2024-cityLove/index.html

@@ -160,4 +160,4 @@
 <script src="../../common/js/layer.js"></script>
 <script src="../../common/js/vconsole.min.js"></script>
 <script src="../../common/js/route-constant.js"></script>
-<script src="./js/index.js"></script>
+<script src="./js/index.js?v=1.2"></script>

view/molistar/common/js/common2.js

@@ -1010,12 +1010,16 @@ function unitProcessing(val, num, toFixeds, text) { //值 以什么为单位 保
 }
 // 阿拉伯专用
 function unitProcessingAr(val, toFixeds) { //值 保留几位小数
-    if (val < 1000) {
+    if (getQueryString().lang && getQueryString().lang == 'zh') {
-        return val;
+        return val >= 10000 ? (Math.floor(val / 1000) / 10).toFixed(toFixeds) + 'w' : val;
-    } else if (val >= 1000 && val < 1000000) {
+    } else {
-        return (val / 1000).toFixed(toFixeds) + 'K'
+        if (val < 1000) {
-    } else if (val >= 1000000) {
+            return val;
-        return (val / 1000000).toFixed(toFixeds) + 'M'
+        } else if (val >= 1000 && val < 1000000) {
+            return (val / 1000).toFixed(toFixeds) + 'K'
+        } else if (val >= 1000000) {
+            return (val / 1000000).toFixed(toFixeds) + 'M'
+        }
     }
 }
 // 封装 在ios环境中 配置公共参数的回调函数

view/molistar/modules/h5Income/css/login.css

@@ -142,7 +142,7 @@ body {
   float: right;
   margin-top: 0.18667rem;
   margin-right: 0.21333rem;
-  background: #9168FA;
+  background: #14D2A6 100%;
 }
 
 .box .phone .codeBox .codeButTime {
@@ -158,12 +158,11 @@ body {
   color: #FFFFFF;
   font-size: 0.42667rem;
   margin: 0 auto 0.53333rem;
-  background: linear-gradient(180deg, rgba(249, 195, 234, 0.65) 0%, rgba(229, 142, 255, 0.65) 50%, rgba(205, 122, 233, 0.65) 100%) top;
+  background: linear-gradient(270deg, #A5EEC8, #ABF5E3);
 }
 
 .box .butok {
-  background: url(../images/login/butBg.png) no-repeat;
+  background: linear-gradient(270deg, #57E193, #14D2A6);
-  background-size: 100% 100%;
 }
 
 .box .hone {
@@ -175,8 +174,7 @@ body {
   color: #fff;
   font-size: 0.42667rem;
   margin: 0 auto 0.53333rem;
-  background: url(../images/login/butBg.png) no-repeat;
+  background: linear-gradient(270deg, #57E193, #14D2A6);
-  background-size: 100% 100%;
 }
 
 .area {

view/molistar/modules/h5Income/css/login.scss

@@ -146,7 +146,7 @@ body {
                 float: right;
                 margin-top: px2rem(14);
                 margin-right: px2rem(16);
-                background: #9168FA;
+                background: #14D2A6 100%;
             }
 
             .codeButTime {
@@ -167,13 +167,13 @@ body {
         font-size: px2rem(32);
         margin: 0 auto px2rem(40);
         // background: linear-gradient(90deg, #EEDCFF 0%, #DEE4FF 50%, #CCF8F9 100%);
-        background: linear-gradient(180deg, rgba(249,195,234,.65) 0%, rgba(229,142,255,.65) 50%, rgba(205, 122, 233, .65) 100%) top;
+        background: linear-gradient(270deg, #A5EEC8, #ABF5E3);
     }
 
     .butok {
-        // background: linear-gradient(180deg, #F9C3EA 0%, #E58EE1 50%, #CD7AE9 100%) top;
+        background: linear-gradient(270deg, #57E193, #14D2A6);
-        background: url(../images/login/butBg.png) no-repeat;
+        // background: url(../images/login/butBg.png) no-repeat;
-        background-size: 100% 100%;
+        // background-size: 100% 100%;
     }
 
     .hone {
@@ -185,10 +185,10 @@ body {
         color: #fff;
         font-size: px2rem(32);
         margin: 0 auto px2rem(40);
-        // background: linear-gradient(270deg, #FAEDFF 0%, #E6FDFF 100%);
+        background: linear-gradient(270deg, #57E193, #14D2A6);
         // border: 1px solid #D480FF;
-        background: url(../images/login/butBg.png) no-repeat;
+        // background: url(../images/login/butBg.png) no-repeat;
-        background-size: 100% 100%;
+        // background-size: 100% 100%;
     }
 }
 

view/molistar/modules/h5Income/login.html

@@ -9,7 +9,7 @@
     <meta name="apple-mobile-web-app-capable" content="yes">
     <title>登入</title>
     <link rel="stylesheet" href="../../common/css/reset.css">
-    <link rel="stylesheet" href="./css/login.css">
+    <link rel="stylesheet" href="./css/login.css?v=1.0">
 </head>
 
 <body>
@@ -17,7 +17,7 @@
     <img src="./images/back.png" alt="" class="back">
     <!-- 頭部 -->
     <div class="header">
-        <img src="./images/login/logo.png" alt="" class="logo">
+        <!-- <img src="./images/login/logo.png" alt="" class="logo"> -->
     </div>
     <!-- 底部登入 -->
     <div class="box">
@@ -63,4 +63,4 @@
 <script src="../../common/js/route-constant.js"></script>
 <script src="../../common/js/svga.min.js"></script>
 <script src="../../common/js/crypto-js.js"></script>
-<script src="./js/login.js?v=1.0"></script>
+<script src="./js/login.js?v=1.1"></script>

view/molistar/modules/newRank/css/index.css

@@ -0,0 +1,512 @@
+html,
+body {
+  width: 100%;
+  background: #fff;
+}
+
+.back {
+  width: 100%;
+  height: 0.58667rem;
+  line-height: 0.58667rem;
+  position: fixed;
+  left: 0;
+  top: 0.86667rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.50667rem;
+  font-weight: bold;
+  z-index: 10;
+}
+
+.back img {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 0rem;
+}
+
+.header {
+  width: 10rem;
+  height: 11.70667rem;
+  position: relative;
+  margin: 0 auto;
+}
+
+.header .tabBox {
+  width: 7.6rem;
+  height: 0.46667rem;
+  line-height: 0.46667rem;
+  display: flex;
+  justify-content: space-between;
+  position: absolute;
+  top: 1.52rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.header .tabBox div {
+  position: relative;
+  width: 1.32rem;
+  color: #C3BEBA;
+  font-size: 0.42667rem;
+  font-weight: 400;
+}
+
+.header .tabBox div span {
+  width: 0.49333rem;
+  height: 0.10667rem;
+  border-radius: 0.10667rem;
+  background: #fff;
+  position: absolute;
+  bottom: -0.29333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  display: none;
+}
+
+.header .tabBox .act {
+  color: #fff;
+  font-weight: bold;
+}
+
+.header .tabBox .act span {
+  display: block;
+}
+
+.header .sTab {
+  position: absolute;
+  width: 6.13333rem;
+  height: 0.74667rem;
+  top: 2.77333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  background: rgba(255, 255, 255, 0.4);
+  border-radius: 0.74667rem;
+  display: flex;
+  justify-content: space-between;
+  overflow: hidden;
+}
+
+.header .sTab div {
+  width: 3.06667rem;
+  height: 0.74667rem;
+  line-height: 0.74667rem;
+  border-radius: 0.74667rem;
+  color: #DBD6CF;
+  font-size: 0.4rem;
+  font-weight: 400;
+  text-align: center;
+}
+
+.header .sTab .act {
+  color: #6D6D6D;
+  background: #fff;
+}
+
+.header .top {
+  width: 9.61333rem;
+  height: 4.02667rem;
+  position: absolute;
+  top: 7.86667rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.header .top .top1 {
+  position: absolute;
+  top: -4rem;
+  width: 7.4rem;
+  height: 4.01333rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.header .top .top1 .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.header .top .top1 .tx {
+  width: 2.34667rem;
+  height: 2.58667rem;
+  position: absolute;
+  top: 0.93333rem;
+  left: 50%;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.header .top .top1 .nick {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #fff;
+  font-size: 0.37333rem;
+  text-align: center;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -1.46667rem;
+}
+
+.header .top .top1 .fist {
+  width: 1.02667rem;
+  height: 1.24rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -2.88rem;
+}
+
+.header .top .top2 {
+  position: absolute;
+  top: -1.52rem;
+  width: 2.82667rem;
+  height: 3.04rem;
+  left: 0.44rem;
+  z-index: 2;
+}
+
+.header .top .top2 .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.header .top .top2 .tx {
+  width: 1.78667rem;
+  height: 1.78667rem;
+  position: absolute;
+  top: 0.88rem;
+  left: 50%;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.header .top .top2 .nick {
+  width: 100%;
+  height: 0.5rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #fff;
+  font-size: 0.37333rem;
+  text-align: center;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -0.68rem;
+}
+
+.header .top .top2 .score {
+  width: 100%;
+  height: 0.42667rem;
+  line-height: 0.42667rem;
+  color: #fff;
+  font-size: 0.34667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -1.33333rem;
+  text-align: center;
+}
+
+.header .top .top2 .score img {
+  display: inline-block;
+  width: 0.45333rem;
+  height: 0.45333rem;
+  margin-top: -0.04rem;
+}
+
+.header .top .top3 {
+  position: absolute;
+  top: -1.52rem;
+  width: 2.82667rem;
+  height: 3.04rem;
+  right: 0.44rem;
+  z-index: 2;
+}
+
+.header .top .top3 .ts {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+}
+
+.header .top .top3 .tx {
+  width: 1.78667rem;
+  height: 1.78667rem;
+  position: absolute;
+  top: 0.88rem;
+  left: 50%;
+  transform: translateX(-50%);
+  border-radius: 50%;
+}
+
+.header .top .top3 .nick {
+  width: 100%;
+  height: 0.5rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #fff;
+  font-size: 0.37333rem;
+  text-align: center;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -0.68rem;
+}
+
+.header .top .top3 .score {
+  width: 100%;
+  height: 0.42667rem;
+  line-height: 0.42667rem;
+  color: #fff;
+  font-size: 0.34667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -1.33333rem;
+  text-align: center;
+}
+
+.header .top .top3 .score img {
+  display: inline-block;
+  width: 0.45333rem;
+  height: 0.45333rem;
+  margin-top: -0.04rem;
+}
+
+.header .tops1 {
+  background: url(../images/bg1.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .tops2 {
+  background: url(../images/bg2.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .tops3 {
+  background: url(../images/bg3.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .tops4 {
+  background: url(../images/bg4.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header1 {
+  background: url(../images/header1.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header2 {
+  background: url(../images/header2.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header3 {
+  background: url(../images/header3.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header4 {
+  background: url(../images/header4.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+ul {
+  width: 10rem;
+  height: 12.16rem;
+  position: relative;
+  z-index: 2;
+  margin: -0.6rem auto 2.04rem;
+  border-radius: 0.72rem 0.72rem 0px 0px;
+  box-sizing: border-box;
+  padding-top: 0.50667rem;
+  padding: 0.50667rem 0.45333rem 0 0.45333rem;
+  overflow-y: scroll;
+}
+
+ul::-webkit-scrollbar {
+  display: none;
+}
+
+ul li {
+  width: 100%;
+  height: 1.33333rem;
+  margin-bottom: 0.74667rem;
+}
+
+ul li .seqNo {
+  width: 0.66667rem;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  text-align: center;
+  color: #15132B;
+  margin-right: 0.49333rem;
+  font-weight: 500;
+  float: left;
+}
+
+ul li .tx {
+  display: block;
+  float: left;
+  width: 1.33333rem;
+  height: 1.33333rem;
+  border-radius: 50%;
+  margin-right: 0.28rem;
+}
+
+ul li .nick {
+  width: 2.5rem;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  float: left;
+}
+
+ul li .score {
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  float: right;
+  color: #333333;
+  font-size: 0.34667rem;
+  font-weight: 500;
+}
+
+ul li .score img {
+  display: inline-block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  vertical-align: middle;
+  margin-top: -0.1rem;
+}
+
+ul li .score span {
+  vertical-align: middle;
+}
+
+.ul1 {
+  background: linear-gradient(180deg, #FFF6BB -57%, #F9F7F8 90%);
+}
+
+.ul2 {
+  background: linear-gradient(180deg, #B6CDFF -57%, #FEFEFE 90%);
+}
+
+.ul3 {
+  background: linear-gradient(180deg, #FABBBB -57%, #FEF9F9 90%);
+}
+
+.ul4 {
+  background: linear-gradient(180deg, #FFC6F5 -57%, #F9F7F9 90%);
+  margin-bottom: 0;
+}
+
+.my {
+  width: 10rem;
+  height: 2.04rem;
+  position: fixed;
+  z-index: 9;
+  background: url(../images/myBg.png) no-repeat;
+  background-size: 100% 100%;
+  left: 0;
+  bottom: 0;
+}
+
+.my .box {
+  width: 100%;
+  height: 1.33333rem;
+  margin-top: 0.46667rem;
+  box-sizing: border-box;
+  padding: 0 0.4rem;
+}
+
+.my .box .seqNo {
+  width: 0.66667rem;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  text-align: center;
+  color: #15132B;
+  margin-right: 0.49333rem;
+  font-weight: 500;
+  float: left;
+}
+
+.my .box .tx {
+  display: block;
+  float: left;
+  width: 1.33333rem;
+  height: 1.33333rem;
+  border-radius: 50%;
+  margin-right: 0.28rem;
+}
+
+.my .box .nick {
+  width: 2.5rem;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  float: left;
+}
+
+.my .box .score {
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  float: right;
+  color: #333333;
+  font-size: 0.34667rem;
+  font-weight: 500;
+}
+
+.my .box .score img {
+  display: inline-block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  vertical-align: middle;
+  margin-top: -0.1rem;
+}
+
+.my .box .score span {
+  vertical-align: middle;
+}
+
+.arabic .header .tabBox {
+  width: 90%;
+}
+
+.arabic .header .tabBox div {
+  width: 1.9rem;
+  font-size: 0.33333rem;
+  white-space: nowrap;
+}
+
+.english .header .tabBox {
+  width: 90%;
+}
+
+.english .header .tabBox div {
+  font-size: 0.34667rem;
+  white-space: nowrap;
+  width: 1.7rem;
+}

view/molistar/modules/newRank/css/index.scss

@@ -0,0 +1,520 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: #fff;
+}
+
+.back {
+    width: 100%;
+    height: px2rem(44);
+    line-height: px2rem(44);
+    position: fixed;
+    left: 0;
+    top: px2rem(65);
+    text-align: center;
+    color: #FFFFFF;
+    font-size: px2rem(38);
+    font-weight: bold;
+    z-index: 10;
+
+    img {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: px2rem(0);
+    }
+}
+
+.header {
+    width: px2rem(750);
+    height: px2rem(878);
+    position: relative;
+    margin: 0 auto;
+
+    .tabBox {
+        width: px2rem(570);
+        height: px2rem(35);
+        line-height: px2rem(35);
+        display: flex;
+        justify-content: space-between;
+        position: absolute;
+        top: px2rem(114);
+        left: 50%;
+        transform: translateX(-50%);
+
+        div {
+            position: relative;
+            width: px2rem(99);
+            color: #C3BEBA;
+            font-size: px2rem(32);
+            font-weight: 400;
+
+            span {
+                width: px2rem(37);
+                height: px2rem(8);
+                border-radius: px2rem(8);
+                background: #fff;
+                position: absolute;
+                bottom: px2rem(-22);
+                left: 50%;
+                transform: translateX(-50%);
+                display: none;
+            }
+        }
+
+        .act {
+            color: #fff;
+            font-weight: bold;
+
+            span {
+                display: block;
+            }
+        }
+    }
+
+    .sTab {
+        position: absolute;
+        width: px2rem(460);
+        height: px2rem(56);
+        top: px2rem(208);
+        left: 50%;
+        transform: translateX(-50%);
+        background: rgba(255, 255, 255, .4);
+        border-radius: px2rem(56);
+        display: flex;
+        justify-content: space-between;
+        overflow: hidden;
+
+        div {
+            width: px2rem(230);
+            height: px2rem(56);
+            line-height: px2rem(56);
+            border-radius: px2rem(56);
+            color: #DBD6CF;
+            font-size: px2rem(30);
+            font-weight: 400;
+            text-align: center;
+        }
+
+        .act {
+            color: #6D6D6D;
+            background: #fff;
+        }
+    }
+
+    .top {
+        width: px2rem(721);
+        height: px2rem(302);
+        position: absolute;
+        top: px2rem(590);
+        left: 50%;
+        transform: translateX(-50%);
+
+        .top1 {
+            position: absolute;
+            top: px2rem(-300);
+            width: px2rem(555);
+            height: px2rem(301);
+            left: 50%;
+            transform: translateX(-50%);
+
+            .ts {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+                left: 0;
+                top: 0;
+                z-index: 2;
+            }
+
+            .tx {
+                width: px2rem(176);
+                height: px2rem(194);
+                position: absolute;
+                top: px2rem(70);
+                left: 50%;
+                transform: translateX(-50%);
+                border-radius: 50%;
+            }
+
+            .nick {
+                width: 100%;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+                color: #fff;
+                font-size: px2rem(28);
+                text-align: center;
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-110);
+            }
+
+            .fist {
+                width: px2rem(77);
+                height: px2rem(93);
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-216);
+            }
+        }
+
+        .top2 {
+            position: absolute;
+            top: px2rem(-114);
+            width: px2rem(212);
+            height: px2rem(228);
+            left: px2rem(33);
+            z-index: 2;
+
+            .ts {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+                left: 0;
+                top: 0;
+                z-index: 2;
+            }
+
+            .tx {
+                width: px2rem(134);
+                height: px2rem(134);
+                position: absolute;
+                top: px2rem(66);
+                left: 50%;
+                transform: translateX(-50%);
+                border-radius: 50%;
+            }
+
+            .nick {
+                width: 100%;
+                height: 0.5rem;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+                color: #fff;
+                font-size: px2rem(28);
+                text-align: center;
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-51);
+            }
+
+            .score {
+                width: 100%;
+                height: px2rem(32);
+                line-height: px2rem(32);
+                color: #fff;
+                font-size: px2rem(26);
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-100);
+                text-align: center;
+
+                img {
+                    display: inline-block;
+                    width: px2rem(34);
+                    height: px2rem(34);
+                    margin-top: -0.04rem;
+                }
+            }
+        }
+
+        .top3 {
+            position: absolute;
+            top: px2rem(-114);
+            width: px2rem(212);
+            height: px2rem(228);
+            right: px2rem(33);
+            z-index: 2;
+
+            .ts {
+                width: 100%;
+                height: 100%;
+                position: absolute;
+                left: 0;
+                top: 0;
+                z-index: 2;
+            }
+
+            .tx {
+                width: px2rem(134);
+                height: px2rem(134);
+                position: absolute;
+                top: px2rem(66);
+                left: 50%;
+                transform: translateX(-50%);
+                border-radius: 50%;
+            }
+
+            .nick {
+                width: 100%;
+                height: 0.5rem;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+                color: #fff;
+                font-size: px2rem(28);
+                text-align: center;
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-51);
+            }
+
+            .score {
+                width: 100%;
+                height: px2rem(32);
+                line-height: px2rem(32);
+                color: #fff;
+                font-size: px2rem(26);
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-100);
+                text-align: center;
+
+                img {
+                    display: inline-block;
+                    width: px2rem(34);
+                    height: px2rem(34);
+                    margin-top: -0.04rem;
+                }
+            }
+        }
+    }
+
+    .tops1 {
+        background: url(../images/bg1.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .tops2 {
+        background: url(../images/bg2.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .tops3 {
+        background: url(../images/bg3.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .tops4 {
+        background: url(../images/bg4.png) no-repeat;
+        background-size: 100% 100%;
+    }
+}
+
+.header1 {
+    background: url(../images/header1.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+.header2 {
+    background: url(../images/header2.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+.header3 {
+    background: url(../images/header3.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+.header4 {
+    background: url(../images/header4.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+ul {
+    width: px2rem(750);
+    height: px2rem(912);
+    position: relative;
+    z-index: 2;
+    margin: px2rem(-45) auto px2rem(153);
+    border-radius: px2rem(54) px2rem(54) 0px 0px;
+    box-sizing: border-box;
+    padding-top: px2rem(38);
+    padding: px2rem(38) px2rem(34) 0 px2rem(34);
+    overflow-y: scroll;
+
+    &::-webkit-scrollbar {
+        display: none;
+    }
+
+    li {
+        width: 100%;
+        height: px2rem(100);
+        margin-bottom: px2rem(56);
+
+        .seqNo {
+            width: px2rem(50);
+            height: px2rem(100);
+            line-height: px2rem(100);
+            text-align: center;
+            color: #15132B;
+            margin-right: px2rem(37);
+            font-weight: 500;
+            float: left;
+        }
+
+        .tx {
+            display: block;
+            float: left;
+            width: px2rem(100);
+            height: px2rem(100);
+            border-radius: 50%;
+            margin-right: px2rem(21);
+        }
+
+        .nick {
+            width: 2.5rem;
+            height: px2rem(100);
+            line-height: px2rem(100);
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            float: left;
+        }
+
+        .score {
+            height: px2rem(100);
+            line-height: px2rem(100);
+            float: right;
+            color: #333333;
+            font-size: px2rem(26);
+            font-weight: 500;
+
+            img {
+                display: inline-block;
+                width: px2rem(32);
+                height: px2rem(32);
+                vertical-align: middle;
+                margin-top: -0.1rem;
+            }
+
+            span {
+                vertical-align: middle;
+            }
+        }
+    }
+}
+
+.ul1 {
+    background: linear-gradient(180deg, #FFF6BB -57%, #F9F7F8 90%);
+}
+
+.ul2 {
+    background: linear-gradient(180deg, #B6CDFF -57%, #FEFEFE 90%);
+}
+
+.ul3 {
+    background: linear-gradient(180deg, #FABBBB -57%, #FEF9F9 90%);
+}
+
+.ul4 {
+    background: linear-gradient(180deg, #FFC6F5 -57%, #F9F7F9 90%);
+    margin-bottom: 0;
+}
+
+.my {
+    width: px2rem(750);
+    height: px2rem(153);
+    position: fixed;
+    z-index: 9;
+    background: url(../images/myBg.png) no-repeat;
+    background-size: 100% 100%;
+    left: 0;
+    bottom: 0;
+
+    .box {
+        width: 100%;
+        height: px2rem(100);
+        margin-top: px2rem(35);
+        box-sizing: border-box;
+        padding: 0 px2rem(30);
+
+        .seqNo {
+            width: px2rem(50);
+            height: px2rem(100);
+            line-height: px2rem(100);
+            text-align: center;
+            color: #15132B;
+            margin-right: px2rem(37);
+            font-weight: 500;
+            float: left;
+        }
+
+        .tx {
+            display: block;
+            float: left;
+            width: px2rem(100);
+            height: px2rem(100);
+            border-radius: 50%;
+            margin-right: px2rem(21);
+        }
+
+        .nick {
+            width: 2.5rem;
+            height: px2rem(100);
+            line-height: px2rem(100);
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            float: left;
+        }
+
+        .score {
+            height: px2rem(100);
+            line-height: px2rem(100);
+            float: right;
+            color: #333333;
+            font-size: px2rem(26);
+            font-weight: 500;
+
+            img {
+                display: inline-block;
+                width: px2rem(32);
+                height: px2rem(32);
+                vertical-align: middle;
+                margin-top: -0.1rem;
+            }
+
+            span {
+                vertical-align: middle;
+            }
+        }
+    }
+}
+
+.arabic {
+    .header .tabBox {
+        width: 90%;
+
+        div {
+            width: 1.9rem;
+            font-size: px2rem(25);
+            white-space: nowrap;
+        }
+    }
+}
+
+.english {
+
+    .header .tabBox {
+        width: 90%;
+        div {
+            font-size: px2rem(26);
+            white-space: nowrap;
+            width: 1.7rem;
+        }
+    }
+}

view/molistar/modules/newRank/index.html

@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>MoliStar</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div>
+    <!-- 头部 -->
+    <div class="header header1">
+        <div class="tabBox">
+            <div class="act text1"><span></span></div>
+            <div class="text2"><span></span></div>
+            <div class="text3"><span></span></div>
+            <div class="text4"><span></span></div>
+        </div>
+        <div class="sTab">
+            <div class="act text5"></div>
+            <div class="text6"></div>
+        </div>
+        <!-- 前三 -->
+        <div class="top tops1">
+            <div class="top1">
+                <img src="./images/no1.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <div class="nick"></div>
+                <img src="./images/fist.png" alt="" class="fist">
+                <!-- <div class="score">
+                    <img src="./images/gold.png" alt="">
+                    <span>0</span>
+                </div> -->
+            </div>
+            <div class="top2">
+                <img src="./images/no2.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <div class="nick"></div>
+                <img src="./images/fist.png" alt="" class="fist">
+                <div class="score">
+                    <img src="./images/gold.png" alt="">
+                    <span></span>
+                </div>
+            </div>
+            <div class="top3">
+                <img src="./images/no3.png" alt="" class="ts">
+                <img src="./images/logo.png" alt="" class="tx">
+                <div class="nick"></div>
+                <img src="./images/fist.png" alt="" class="fist">
+                <div class="score">
+                    <img src="./images/gold.png" alt="">
+                    <span></span>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 非前三列表 -->
+    <ul class="ul1">
+        <!-- <li>
+            <div class="seqNo">4</div>
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick">虚位以待</div>
+            <div class="score">
+                <img src="./images/gold.png" alt="">
+                <span>0</span>
+            </div>
+        </li> -->
+    </ul>
+    <!-- 自己排名 -->
+    <div class="my">
+        <div class="box">
+            <div class="seqNo"></div>
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick"></div>
+            <div class="score">
+                <!-- <img src="./images/gold.png" alt=""> -->
+                <span></span>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./js/index.js"></script>
+<script src="../../common/local/langHandler.js"></script>

view/molistar/modules/newRank/js/index.js

@@ -0,0 +1,253 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success(e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+var listType = 2;//2爱意榜 1魅力榜 3房间榜
+var timeType = 1;//1日 2周
+// 初始化函數
+$(function () {
+    getInfoFromClient();
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+    setTimeout(function () {
+        // 頁面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 頂部返回事件
+        $('.back img').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        showLoading()
+        geth5()
+    }, 100)
+})
+function translateFun() {
+    var langReplace = window.lang.replace;
+    var localLang = window.lang;
+    $('.text1').html(langReplace(localLang.demoModule.text1));
+    $('.text2').html(langReplace(localLang.demoModule.text2));
+    $('.text3').html(langReplace(localLang.demoModule.text3));
+    $('.text4').html(langReplace(localLang.demoModule.text4));
+    $('.text5').html(langReplace(localLang.demoModule.text5));
+    $('.text6').html(langReplace(localLang.demoModule.text6));
+
+}
+// 榜单接口
+function geth5() {
+    $('ul li').remove();
+    $('.header .sTab').show();
+    $('.my').show()
+    $('.header .top .top2 .score,.header .top .top3 .score').show();
+    $('.header .top .top1 .fist').show();
+    $('ul li .score').show();
+    // showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/allrank/geth5',
+        data: {
+            type: listType,
+            datetype: timeType,
+            uid: pubInfo.uid
+        },
+        success(res) {
+            if (res.code === 200) {
+                var my = res.data.me;
+                var listTo3 = res.data.rankVoList.slice(0, 3);
+                var notListTo3 = res.data.rankVoList.slice(3);
+                // 处理前三
+                if (listTo3.length < 3) {
+                    let arr = new Array(3 - listTo3.length).fill({
+                        avatar: './images/logo.png',
+                        nick: '',
+                        totalNum: "",
+                        uid: "0",
+                    })
+                    listTo3.push(...arr)
+                }
+                listTo3.forEach((res, i) => {
+                    $(`.header .top .top${i + 1} .ts`).attr('uid', res.uid);
+                    $(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.header .top .top${i + 1} .nick`).text(res.nick);
+                    if (i > 0) {
+                        $(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.totalNum, 1));
+                    }
+                });
+                // 非前三
+                var str = '';
+                notListTo3.forEach((res, i) => {
+                    str += `
+                        <li>
+                            <div class="seqNo">${res.seqNo}</div>
+                            <img src="${res.avatar}" uid="${res.uid}" alt="" class="tx">
+                            <div class="nick">${res.nick}</div>
+                            <div class="score">
+                                <img src="./images/gold.png" alt="">
+                                <span>${unitProcessingAr(res.totalNum, 1)}</span>
+                            </div>
+                        </li>
+                    `
+                })
+                $('ul').append(str);
+                // 处理自己
+                $('.my .box .tx').attr('src', my.avatar);
+                $('.my .box .nick').text(my.nick);
+                $('.my .box .score span').text(my.totalNum <= 0 ? langReplace(localLang.demoModule.text7) : unitProcessingAr(my.totalNum, 1));
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 公会接口
+function listRank() {
+    $('ul li').remove();
+    $('.header .sTab').hide();
+    $('.my').hide()
+    $('.header .top .top2 .score,.header .top .top3 .score').hide();
+    $('.header .top .top1 .fist').hide();
+    $('ul li .score').hide();
+    // showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/clan/listRank',
+        success(res) {
+            if (res.code === 200) {
+                var my = res.data.me;
+                var listTo3 = res.data.slice(0, 3);
+                var notListTo3 = res.data.slice(3);
+                // 处理前三
+                if (listTo3.length < 3) {
+                    let arr = new Array(3 - listTo3.length).fill({
+                        avatar: './images/logo.png',
+                        name: '',
+                        totalNum: "",
+                        uid: "0",
+                    })
+                    listTo3.push(...arr)
+                }
+                listTo3.forEach((res, i) => {
+                    $(`.header .top .top${i + 1} .ts`).attr('uid', res.clanElderUid);
+                    $(`.header .top .top${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.header .top .top${i + 1} .nick`).text(res.name);
+                    if (i > 0) {
+                        $(`.header .top .top${i + 1} .score span`).text(unitProcessingAr(res.totalNum, 1));
+                    }
+                });
+                // 非前三
+                var str = '';
+                notListTo3.forEach((res, i) => {
+                    str += `
+                        <li>
+                            <div class="seqNo">${i + 1}</div>
+                            <img src="${res.avatar}" uid="${res.clanElderUid}" alt="" class="tx">
+                            <div class="nick">${res.name}</div>
+                        </li>
+                    `
+                })
+                $('ul').append(str);
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 榜单切换tab
+$('.header .tabBox div').click(function () {
+    var i = $(this).index() + 1;
+    $(this).addClass('act').siblings().removeClass('act');
+    $('ul').removeClass('ul1').removeClass('ul2').removeClass('ul3').removeClass('ul4');
+    $(`ul`).addClass(`ul${i}`);
+    $('.header').removeClass('header1').removeClass('header2').removeClass('header3').removeClass('header4');
+    $(`.header`).addClass(`header${i}`);
+    $('.top').removeClass('tops1').removeClass('tops2').removeClass('tops3').removeClass('tops4');
+    $(`.top`).addClass(`tops${i}`);
+    timeType = 1;
+    $('.header .sTab div').removeClass('act');
+    $('.header .sTab div').eq(0).addClass('act');
+    if (i == 1) {
+        listType = 2;
+        geth5();
+    } else if (i == 2) {
+        listType = 1;
+        geth5();
+    } else if (i == 3) {
+        listType = 3;
+        geth5();
+    } else if (i == 4) {
+        listRank();
+    }
+})
+// 日榜周榜切换tab
+$('.header .sTab div').click(function () {
+    var i = $(this).index() + 1;
+    $(this).addClass('act').siblings().removeClass('act');
+    timeType = i;
+    geth5();
+})
+// 前三跳转个人页
+$('.header .top .ts').click(function () {
+    var uid = $(this).attr('uid');
+    if (browser.ios) {
+        window.webkit.messageHandlers.openPersonPage.postMessage(uid);
+    } else if (browser.android) {
+        if (androidJsObj && typeof androidJsObj === "object") {
+            window.androidJsObj.openPersonPage(uid);
+        }
+    }
+})
+// 非前三跳转个人页
+$('ul').on('click', 'li .tx', function () {
+    var uid = $(this).attr('uid');
+    if (browser.ios) {
+        window.webkit.messageHandlers.openPersonPage.postMessage(uid);
+    } else if (browser.android) {
+        if (androidJsObj && typeof androidJsObj === "object") {
+            window.androidJsObj.openPersonPage(uid);
+        }
+    }
+})

view/molistar/modules/newRank/local/ar.js

@@ -0,0 +1,16 @@
+// 阿拉伯
+langAr = {
+    // 模块
+    demoModule: {
+        layerIndex1: 'جار التحميل...',
+        layerIndex2: 'تمت العملية',
+        layerIndex3: 'خطأ في الشبكة، يرجى الخروج وإعادة الدخول',
+        text1: "قائمة الأغنياء<span></span>",
+        text2: "قائمة الجاذبية<span></span>",
+        text3: "قائمة الغرف<span></span>",
+        text4: "قائمة الوكالات<span></span>",
+        text5: "قائمة اليومية",
+        text6: "قائمة الأسبوعية",
+        text7: "غير مدرج",
+    }
+}

view/molistar/modules/newRank/local/en.js

@@ -0,0 +1,16 @@
+// 英文
+langEn = {
+    // 模块
+    demoModule: {
+        layerIndex1: 'Loading...',
+        layerIndex2: 'Operation completed',
+        layerIndex3: 'Network error, please exit and re-enter',
+        text1: "Wealth List<span></span>",
+        text2: "Charm List<span></span>",
+        text3: "Room List<span></span>",
+        text4: "Family List<span></span>",
+        text5: "Daily List",
+        text6: "Weekly List",
+        text7: "Not Listed",
+    }
+}

view/molistar/modules/newRank/local/zh.js

@@ -0,0 +1,16 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        layerIndex1: '加載中...',
+        layerIndex2: '操作完成',
+        layerIndex3: '網絡錯誤，請退出重進',
+        text1: '愛意榜<span></span>',
+        text2: '魅力榜<span></span>',
+        text3: '房間榜<span></span>',
+        text4: '公會榜<span></span>',
+        text5: '日榜',
+        text6: '周榜',
+        text7: '未上榜',
+    }
+}

view/molistar/modules/weeklyCard/css/index.css

@@ -0,0 +1,500 @@
+html,
+body {
+  width: 100%;
+  background: #741046;
+}
+
+.back {
+  width: 100%;
+  height: 0.58667rem;
+  line-height: 0.58667rem;
+  position: fixed;
+  left: 0;
+  top: 0.86667rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.50667rem;
+  font-weight: bold;
+  z-index: 10;
+}
+
+.back img {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 0rem;
+}
+
+.header {
+  width: 10rem;
+  height: 15.86667rem;
+  background: url(../images/header.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 auto 0;
+  overflow: hidden;
+}
+
+.header .tab {
+  width: 9.25333rem;
+  height: 1.28rem;
+  margin: 13.09333rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+
+.header .tab div {
+  width: 2.90667rem;
+  height: 100%;
+  line-height: 1.28rem;
+  text-align: center;
+  color: #CAA8B8;
+  font-size: 0.53333rem;
+  font-weight: bold;
+  background: url(../images/tab.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .tab .act {
+  background: url(../images/tabAct.png) no-repeat;
+  background-size: 100% 100%;
+  color: #fff;
+}
+
+.cardBox {
+  width: 9.81333rem;
+  height: 20.77333rem;
+  background: url(../images/box1.png) no-repeat;
+  background-size: 100% 100%;
+  margin: -1rem auto 0.64rem;
+  position: relative;
+}
+
+.cardBox .Box {
+  width: 9.81333rem;
+  height: 19.2rem;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  flex-wrap: wrap;
+  padding: 0.64rem 0.4rem;
+  position: relative;
+}
+
+.cardBox .Box .box {
+  width: 4.41333rem;
+  height: 4.18667rem;
+  background: url(../images/liBg.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  margin-bottom: 0.36rem;
+}
+
+.cardBox .Box .box .title {
+  color: #FED3AC;
+  font-size: 0.34667rem;
+  text-align: center;
+  position: absolute;
+  top: 0.64rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.cardBox .Box .box .leftLine,
+.cardBox .Box .box .rightLine {
+  width: 1.86667rem;
+  height: 0.02667rem;
+  position: absolute;
+  top: 0.81333rem;
+}
+
+.cardBox .Box .box .leftLine {
+  left: -0.4rem;
+}
+
+.cardBox .Box .box .rightLine {
+  right: -0.4rem;
+}
+
+.cardBox .Box .box .gold {
+  width: 1.61333rem;
+  height: 1.61333rem;
+  position: absolute;
+  left: 0.41333rem;
+  top: 1.46667rem;
+  background: #8C1137;
+  border: 0.02667rem solid #FF9DBB;
+  border-radius: 0.13333rem;
+}
+
+.cardBox .Box .box .gold .img {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.cardBox .Box .box .gold .ok,
+.cardBox .Box .box .gold .not {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  display: none;
+}
+
+.cardBox .Box .box .gold .giftName {
+  width: 100%;
+  position: absolute;
+  bottom: -0.5rem;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #FFFFFF;
+  font-size: 0.32rem;
+  text-align: center;
+}
+
+.cardBox .Box .box .gold .num {
+  width: 100%;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #FFB8B5;
+  font-size: 0.29333rem;
+  text-align: center;
+  bottom: -0.85rem;
+}
+
+.cardBox .Box .box .gold .num b {
+  color: #FFDCAE;
+}
+
+.cardBox .Box .box .gift {
+  width: 1.61333rem;
+  height: 1.61333rem;
+  position: absolute;
+  right: 0.41333rem;
+  top: 1.46667rem;
+  background: #8C1137;
+  border: 0.02667rem solid #FF9DBB;
+  border-radius: 0.13333rem;
+}
+
+.cardBox .Box .box .gift .img {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.cardBox .Box .box .gift .ok,
+.cardBox .Box .box .gift .not {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  display: none;
+}
+
+.cardBox .Box .box .gift .giftName {
+  width: 100%;
+  position: absolute;
+  bottom: -0.5rem;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #FFFFFF;
+  font-size: 0.32rem;
+  text-align: center;
+}
+
+.cardBox .Box .box .gift .num {
+  width: 100%;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #FFB8B5;
+  font-size: 0.29333rem;
+  text-align: center;
+  bottom: -0.85rem;
+}
+
+.cardBox .Box .box .gift .num b {
+  color: #FFDCAE;
+}
+
+.cardBox .Box .box .gift span {
+  position: absolute;
+  width: 0.82667rem;
+  height: 0.38667rem;
+  line-height: 0.38667rem;
+  background: #FFF5B0;
+  border-radius: 0.2rem 0.2rem 0.2rem 0rem;
+  right: -0.26667rem;
+  top: -0.2rem;
+  text-align: center;
+  color: #E34D3C;
+  font-size: 0.29333rem;
+}
+
+.cardBox .Box .boxBig {
+  width: 8.81333rem;
+  background: url(../images/liBigBg.png) no-repeat;
+  background-size: 100% 100%;
+  margin-bottom: 0;
+}
+
+.cardBox .Box .boxBig .leftLine {
+  left: 1.82667rem;
+}
+
+.cardBox .Box .boxBig .rightLine {
+  right: 1.82667rem;
+}
+
+.cardBox .Box .boxBig .gold {
+  left: 2.14667rem;
+}
+
+.cardBox .Box .boxBig .gift {
+  right: 2.14667rem;
+}
+
+.cardBox .but {
+  width: 3.28rem;
+  height: 1.01333rem;
+  border-radius: 1.01333rem;
+  margin: -0.55rem auto 0.1rem;
+  background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+  text-align: center;
+  overflow: hidden;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.cardBox .but p {
+  font-weight: bold;
+  font-size: 0.48rem;
+  color: #FFFFFF;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  margin-top: 0.10667rem;
+}
+
+.cardBox .but u {
+  color: #fff;
+  font-size: 0.32rem;
+  text-decoration: line-through;
+}
+
+.cardBox .but1 {
+  display: none;
+}
+
+.cardBox .but2 {
+  line-height: 1.01333rem;
+  font-weight: bold;
+  font-size: 0.48rem;
+  color: #FFFFFF;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  display: none;
+}
+
+.cardBox .but3 {
+  line-height: 1.01333rem;
+  font-weight: bold;
+  font-size: 0.48rem;
+  color: #F2D2C8;
+  background: #DE7F5D;
+  display: none;
+}
+
+.cardBox .tips {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 0 1rem;
+  color: #fff;
+  text-align: center;
+  font-size: 0.29333rem;
+  line-height: 0.4rem;
+  margin-top: 0.55rem;
+}
+
+.rule {
+  width: 9.81333rem;
+  height: 12.18667rem;
+  background: url(../images/ruleBg.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 auto 0.48rem;
+  overflow: hidden;
+}
+
+.rule .title {
+  width: 100%;
+  margin-top: 0.24rem;
+  text-align: center;
+  color: #fff;
+  font-size: 0.58667rem;
+}
+
+.rule .content {
+  width: 8.22667rem;
+  height: 9.94667rem;
+  margin: 0.74667rem auto 0;
+  overflow-y: scroll;
+  color: #FFA7C4;
+  font-size: 0.32rem;
+}
+
+.rule .content::-webkit-scrollbar {
+  display: none;
+}
+
+.rule .content p {
+  margin-bottom: 0.46667rem;
+  line-height: 0.46667rem;
+}
+
+.pub {
+  position: fixed;
+  z-index: 99;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.6);
+  display: none;
+}
+
+.pub .pub_in {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 7.26667rem;
+  height: 4.97333rem;
+  background: url(../images/pubBg.png) no-repeat;
+  background-size: 100% 100%;
+  overflow: hidden;
+}
+
+.pub .pub_in .box1 {
+  display: none;
+}
+
+.pub .pub_in .box1 .title {
+  width: 100%;
+  text-align: center;
+  margin-top: 0.82667rem;
+  color: #FFF724;
+  font-size: 0.45333rem;
+}
+
+.pub .pub_in .box1 .content {
+  margin-top: 0.72rem;
+  width: 100%;
+  text-align: center;
+  color: #FFA7C4;
+  font-size: 0.4rem;
+}
+
+.pub .pub_in .box1 .ok {
+  width: 2.34667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+  text-align: center;
+  color: #fff;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  float: left;
+  margin-left: 1.02667rem;
+  border-radius: 0.96rem;
+  margin-top: 0.82667rem;
+  font-size: 0.4rem;
+}
+
+.pub .pub_in .box1 .close {
+  width: 2.34667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  background: #EE57A9;
+  text-align: center;
+  color: #fff;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  float: right;
+  margin-right: 1.02667rem;
+  border-radius: 0.96rem;
+  margin-top: 0.82667rem;
+  font-size: 0.4rem;
+}
+
+.pub .pub_in .box2 {
+  display: none;
+}
+
+.pub .pub_in .box2 .title {
+  width: 100%;
+  text-align: center;
+  margin-top: 0.82667rem;
+  color: #FFF724;
+  font-size: 0.45333rem;
+}
+
+.pub .pub_in .box2 .content {
+  margin-top: 0.72rem;
+  width: 100%;
+  text-align: center;
+  color: #FFA7C4;
+  font-size: 0.4rem;
+}
+
+.pub .pub_in .box2 .ok {
+  width: 2.34667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+  text-align: center;
+  color: #fff;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  float: left;
+  margin-left: 1.02667rem;
+  border-radius: 0.96rem;
+  margin-top: 0.82667rem;
+  font-size: 0.4rem;
+}
+
+.pub .pub_in .box2 .close {
+  width: 2.34667rem;
+  height: 0.96rem;
+  line-height: 0.96rem;
+  background: #EE57A9;
+  text-align: center;
+  color: #fff;
+  text-shadow: 0px 0.04rem 0px #FF5A00;
+  float: right;
+  margin-right: 1.02667rem;
+  border-radius: 0.96rem;
+  margin-top: 0.82667rem;
+  font-size: 0.4rem;
+}
+
+.english .header .tab div {
+  font-size: 0.4rem;
+  line-height: 0.4rem;
+  box-sizing: border-box;
+  padding: 0.26667rem 0.06667rem 0rem;
+}
+
+.arabic .header .tab div {
+  font-size: 0.32rem;
+  line-height: 0.4rem;
+  box-sizing: border-box;
+  padding: 0.26667rem 0.06667rem 0rem;
+}

view/molistar/modules/weeklyCard/css/index.scss

@@ -0,0 +1,508 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: #741046;
+}
+
+.back {
+    width: 100%;
+    height: px2rem(44);
+    line-height: px2rem(44);
+    position: fixed;
+    left: 0;
+    top: px2rem(65);
+    text-align: center;
+    color: #FFFFFF;
+    font-size: px2rem(38);
+    font-weight: bold;
+    z-index: 10;
+
+    img {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: px2rem(0);
+    }
+}
+
+.header {
+    width: px2rem(750);
+    height: px2rem(1190);
+    background: url(../images/header.png) no-repeat;
+    background-size: 100% 100%;
+    margin: 0 auto 0;
+    overflow: hidden;
+
+    .tab {
+        width: px2rem(694);
+        height: px2rem(96);
+        margin: px2rem(982) auto 0;
+        display: flex;
+        justify-content: space-between;
+
+        div {
+            width: px2rem(218);
+            height: 100%;
+            line-height: px2rem(96);
+            text-align: center;
+            color: #CAA8B8;
+            font-size: px2rem(40);
+            font-weight: bold;
+            background: url(../images/tab.png) no-repeat;
+            background-size: 100% 100%;
+        }
+
+        .act {
+            background: url(../images/tabAct.png) no-repeat;
+            background-size: 100% 100%;
+            color: #fff;
+        }
+    }
+}
+
+.cardBox {
+    width: px2rem(736);
+    height: px2rem(1558);
+    background: url(../images/box1.png) no-repeat;
+    background-size: 100% 100%;
+    margin: -1rem auto px2rem(48);
+    position: relative;
+
+    .Box {
+        width: px2rem(736);
+        height: 19.2rem;
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        flex-wrap: wrap;
+        padding: 0.64rem 0.4rem;
+        position: relative;
+
+        .box {
+            width: px2rem(331);
+            height: px2rem(314);
+            background: url(../images/liBg.png) no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+            margin-bottom: px2rem(27);
+
+            .title {
+                color: #FED3AC;
+                font-size: px2rem(26);
+                text-align: center;
+                position: absolute;
+                top: px2rem(48);
+                left: 50%;
+                transform: translateX(-50%);
+            }
+
+            .leftLine,
+            .rightLine {
+                width: px2rem(140);
+                height: px2rem(2);
+                position: absolute;
+                top: px2rem(61);
+            }
+
+            .leftLine {
+                left: px2rem(-30);
+            }
+
+            .rightLine {
+                right: px2rem(-30);
+            }
+
+            .gold {
+                width: px2rem(121);
+                height: px2rem(121);
+                position: absolute;
+                left: px2rem(31);
+                top: px2rem(110);
+                background: #8C1137;
+                border: px2rem(2) solid #FF9DBB;
+                border-radius: px2rem(10);
+
+                .img {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 50%;
+                    top: 50%;
+                    transform: translate(-50%, -50%);
+                }
+
+                .ok,
+                .not {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 50%;
+                    top: 50%;
+                    transform: translate(-50%, -50%);
+                    display: none;
+                }
+
+                .giftName {
+                    width: 100%;
+                    position: absolute;
+                    bottom: -0.5rem;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    color: #FFFFFF;
+                    font-size: px2rem(24);
+                    text-align: center;
+                }
+
+                .num {
+                    width: 100%;
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    color: #FFB8B5;
+                    font-size: px2rem(22);
+                    text-align: center;
+                    bottom: -0.85rem;
+
+                    b {
+                        color: #FFDCAE;
+                    }
+                }
+            }
+
+            .gift {
+                width: px2rem(121);
+                height: px2rem(121);
+                position: absolute;
+                right: px2rem(31);
+                top: px2rem(110);
+                background: #8C1137;
+                border: px2rem(2) solid #FF9DBB;
+                border-radius: px2rem(10);
+
+                .img {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 50%;
+                    top: 50%;
+                    transform: translate(-50%, -50%);
+                }
+
+                .ok,
+                .not {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    left: 50%;
+                    top: 50%;
+                    transform: translate(-50%, -50%);
+                    display: none;
+                }
+
+                .giftName {
+                    width: 100%;
+                    position: absolute;
+                    bottom: -0.5rem;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    color: #FFFFFF;
+                    font-size: px2rem(24);
+                    text-align: center;
+                }
+
+                .num {
+                    width: 100%;
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    color: #FFB8B5;
+                    font-size: px2rem(22);
+                    text-align: center;
+                    bottom: -0.85rem;
+
+                    b {
+                        color: #FFDCAE;
+                    }
+                }
+
+                span {
+                    position: absolute;
+                    width: px2rem(62);
+                    height: px2rem(29);
+                    line-height: px2rem(29);
+                    background: #FFF5B0;
+                    border-radius: px2rem(15) px2rem(15) px2rem(15) px2rem(0);
+                    right: px2rem(-20);
+                    top: px2rem(-15);
+                    text-align: center;
+                    color: #E34D3C;
+                    font-size: px2rem(22);
+                }
+            }
+        }
+
+        .boxBig {
+            width: px2rem(661);
+            background: url(../images/liBigBg.png) no-repeat;
+            background-size: 100% 100%;
+            margin-bottom: 0;
+
+            .leftLine {
+                left: px2rem(137);
+            }
+
+            .rightLine {
+                right: px2rem(137);
+            }
+
+            .gold {
+                left: px2rem(161);
+            }
+
+            .gift {
+                right: px2rem(161);
+            }
+        }
+    }
+
+    .but {
+        width: px2rem(246);
+        height: px2rem(76);
+        border-radius: px2rem(76);
+        margin: -0.55rem auto 0.1rem;
+        background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+        text-align: center;
+        overflow: hidden;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+
+        p {
+            font-weight: bold;
+            font-size: px2rem(36);
+            color: #FFFFFF;
+            text-shadow: 0px px2rem(3) 0px #FF5A00;
+            margin-top: px2rem(8);
+        }
+
+        u {
+            color: #fff;
+            font-size: px2rem(24);
+            text-decoration: line-through;
+        }
+    }
+
+    .but1 {
+        display: none;
+    }
+
+    .but2 {
+        line-height: px2rem(76);
+        font-weight: bold;
+        font-size: px2rem(36);
+        color: #FFFFFF;
+        text-shadow: 0px px2rem(3) 0px #FF5A00;
+        display: none;
+    }
+
+    .but3 {
+        line-height: px2rem(76);
+        font-weight: bold;
+        font-size: px2rem(36);
+        color: #F2D2C8;
+        background: #DE7F5D;
+        display: none;
+    }
+
+    .tips {
+        width: 100%;
+        box-sizing: border-box;
+        padding: 0 1rem;
+        color: #fff;
+        text-align: center;
+        font-size: px2rem(22);
+        line-height: 0.4rem;
+        margin-top: 0.55rem;
+    }
+}
+
+.rule {
+    width: px2rem(736);
+    height: px2rem(914);
+    background: url(../images/ruleBg.png) no-repeat;
+    background-size: 100% 100%;
+    margin: 0 auto px2rem(36);
+    overflow: hidden;
+
+    .title {
+        width: 100%;
+        margin-top: px2rem(18);
+        text-align: center;
+        color: #fff;
+        font-size: px2rem(44);
+    }
+
+    .content {
+        width: px2rem(617);
+        height: px2rem(746);
+        margin: px2rem(56) auto 0;
+        overflow-y: scroll;
+        color: #FFA7C4;
+        font-size: px2rem(24);
+
+        &::-webkit-scrollbar {
+            display: none;
+        }
+
+        p {
+            margin-bottom: px2rem(35);
+            line-height: px2rem(35);
+        }
+    }
+}
+
+.pub {
+    position: fixed;
+    z-index: 99;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0, 0, 0, .6);
+    display: none;
+
+    .pub_in {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        width: px2rem(545);
+        height: px2rem(373);
+        background: url(../images/pubBg.png) no-repeat;
+        background-size: 100% 100%;
+        overflow: hidden;
+
+        .box1 {
+            display: none;
+
+            .title {
+                width: 100%;
+                text-align: center;
+                margin-top: px2rem(62);
+                color: #FFF724;
+                font-size: px2rem(34);
+            }
+
+            .content {
+                margin-top: px2rem(54);
+                width: 100%;
+                text-align: center;
+                color: #FFA7C4;
+                font-size: px2rem(30);
+            }
+
+            .ok {
+                width: px2rem(176);
+                height: px2rem(72);
+                line-height: px2rem(72);
+                background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+                text-align: center;
+                color: #fff;
+                text-shadow: 0px px2rem(3) 0px #FF5A00;
+                float: left;
+                margin-left: px2rem(77);
+                border-radius: px2rem(72);
+                margin-top: px2rem(62);
+                font-size: px2rem(30);
+            }
+
+            .close {
+                width: px2rem(176);
+                height: px2rem(72);
+                line-height: px2rem(72);
+                background: #EE57A9;
+                text-align: center;
+                color: #fff;
+                text-shadow: 0px px2rem(3) 0px #FF5A00;
+                float: right;
+                margin-right: px2rem(77);
+                border-radius: px2rem(72);
+                margin-top: px2rem(62);
+                font-size: px2rem(30);
+            }
+        }
+
+        .box2 {
+            display: none;
+
+            .title {
+                width: 100%;
+                text-align: center;
+                margin-top: px2rem(62);
+                color: #FFF724;
+                font-size: px2rem(34);
+            }
+
+            .content {
+                margin-top: px2rem(54);
+                width: 100%;
+                text-align: center;
+                color: #FFA7C4;
+                font-size: px2rem(30);
+            }
+
+            .ok {
+                width: px2rem(176);
+                height: px2rem(72);
+                line-height: px2rem(72);
+                background: linear-gradient(0deg, #FFE44E, #FF8B0F);
+                text-align: center;
+                color: #fff;
+                text-shadow: 0px px2rem(3) 0px #FF5A00;
+                float: left;
+                margin-left: px2rem(77);
+                border-radius: px2rem(72);
+                margin-top: px2rem(62);
+                font-size: px2rem(30);
+            }
+
+            .close {
+                width: px2rem(176);
+                height: px2rem(72);
+                line-height: px2rem(72);
+                background: #EE57A9;
+                text-align: center;
+                color: #fff;
+                text-shadow: 0px px2rem(3) 0px #FF5A00;
+                float: right;
+                margin-right: px2rem(77);
+                border-radius: px2rem(72);
+                margin-top: px2rem(62);
+                font-size: px2rem(30);
+            }
+        }
+    }
+}
+
+.english {
+    .header .tab div {
+        font-size: px2rem(30);
+        line-height: 0.4rem;
+        box-sizing: border-box;
+        padding: px2rem(20) px2rem(5) px2rem(0);
+    }
+}
+
+.arabic {
+    .header .tab div {
+        font-size: px2rem(24);
+        line-height: 0.4rem;
+        box-sizing: border-box;
+        padding: px2rem(20) px2rem(5) px2rem(0);
+    }
+}

view/molistar/modules/weeklyCard/index.html

@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="title"></title>
+    <!-- 金幣周卡 -->
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div>
+    <!-- 頭部 -->
+    <div class="header img1">
+        <!-- tab -->
+        <div class="tab">
+            <div class="act text1"></div>
+            <div class="text2"></div>
+            <div class="text3"></div>
+        </div>
+    </div>
+    <!-- 周卡列表 -->
+    <div class="cardBox">
+        <div class="Box">
+            <!-- <div class="box">
+                <div class="title">第1天</div>
+                <img src="./images/left.png" alt="" class="leftLine">
+                <img src="./images/right.png" alt="" class="rightLine">
+                <div class="gold">
+                    <img src="./images/gold.png" alt="">
+                    <img src="./images/ok.png" alt="" class="ok">
+                    <img src="./images/not.png" alt="" class="not">
+                    <div class="giftName">金幣</div>
+                    <div class="num"><b>50</b>金幣</div>
+                </div>
+                <div class="gift">
+                    <img src="./images/gold.png" alt="">
+                    <img src="./images/ok.png" alt="" class="ok">
+                    <img src="./images/not.png" alt="" class="not">
+                    <div class="giftName">禮物昵稱</div>
+                    <div class="num"><b>50</b>金幣</div>
+                    <span>1天</span>
+                </div>
+            </div>
+            <div class="box boxBig">
+                <div class="title">第1天</div>
+                <img src="./images/left.png" alt="" class="leftLine">
+                <img src="./images/right.png" alt="" class="rightLine">
+                <div class="gold">
+                    <img src="./images/gold.png" alt="">
+                    <div class="giftName">金幣</div>
+                    <div class="num"><b>50</b>金幣</div>
+                </div>
+                <div class="gift">
+                    <img src="./images/gold.png" alt="">
+                    <div class="giftName">禮物昵稱</div>
+                    <div class="num"><b>50</b>金幣</div>
+                </div>
+            </div> -->
+        </div>
+        <div class="but but1">
+            <p>1$</p>
+            <u>原價:9.5$</u>
+        </div>
+        <div class="but but2 text4"></div>
+        <div class="but but3 text5"></div>
+        <p class="tips">當前補簽卡剩餘:10,<br>贈送任意價值≥1金幣的禮物即可獲得補簽卡,每天最多可得5張</p>
+    </div>
+    <!-- 活動規則 -->
+    <div class="rule text6">
+        
+    </div>
+    <!-- 彈窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="box1">
+                <div class="title text7"></div>
+                <div class="content"></div>
+                <div class="ok text8"></div>
+                <div class="close text9"></div>
+            </div>
+            <div class="box2">
+                <div class="title text10"></div>
+                <div class="content"></div>
+                <div class="ok text8"></div>
+                <div class="close text9"></div>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./js/index.js"></script>
+<script src="../../common/local/langHandler.js"></script>

view/molistar/modules/weeklyCard/js/index.js

@@ -0,0 +1,305 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+const showLoading = (content = langReplace(localLang.demoModule.layerIndex1)) => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success(e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = langReplace(localLang.demoModule.layerIndex2), time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+var cardList;
+var tabId;
+var listIndex = 1;
+var currGroupId;//當天ID
+// 初始化函數
+$(function () {
+    getInfoFromClient();
+    fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+    setTimeout(function () {
+        // 頁面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 頂部返回事件
+        $('.back img').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        getWeekCardTabList();
+    }, 100)
+})
+function translateFun() {
+    var langReplace = window.lang.replace;
+    var localLang = window.lang;
+    $('.img1').attr("style", langReplace(localLang.demoModule.img1))
+    $('.title').html(langReplace(localLang.demoModule.title));
+    $('.text1').html(langReplace(localLang.demoModule.text1));
+    $('.text2').html(langReplace(localLang.demoModule.text2));
+    $('.text3').html(langReplace(localLang.demoModule.text3));
+    $('.text4').html(langReplace(localLang.demoModule.text4));
+    $('.text5').html(langReplace(localLang.demoModule.text5));
+    $('.text6').html(langReplace(localLang.demoModule.text6));
+    $('.text7').html(langReplace(localLang.demoModule.text7));
+    $('.text8').html(langReplace(localLang.demoModule.text8));
+    $('.text9').html(langReplace(localLang.demoModule.text9));
+    $('.text10').html(langReplace(localLang.demoModule.text10));
+    $('.text11').html(langReplace(localLang.demoModule.text11));
+
+}
+// 獲取檔位
+function getWeekCardTabList() {
+    $('.cardBox .but1,.cardBox .but2,.cardBox .but3').hide();
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/weekCardTab/list',
+        success(res) {
+            if (res.code === 200) {
+                cardList = res.data;
+                tabId = cardList[listIndex - 1].id;
+                currGroupId = cardList[listIndex - 1].currGroupId;
+                if (cardList[listIndex - 1].isPay == false) {//未購買
+                    $('.cardBox .but1 p').text(`${cardList[listIndex - 1].chargeProdAmount}$`)
+                    $('.cardBox .but1 u').text(`${langReplace(localLang.demoModule.text12)}:${cardList[listIndex - 1].showAmount}$`);
+                    $('.cardBox .but1').show();
+                } else if (cardList[listIndex - 1].isPay && cardList[listIndex - 1].isNeedRepair == false) {//今日已經簽到
+                    $('.cardBox .but3').show();
+                } else {//可簽到
+                    $('.cardBox .but2').show();
+                }
+                if (getQueryString().lang == "zh") {
+                    $('.cardBox .tips').text(`當前補簽卡剩餘:${cardList[listIndex - 1].repairNum},贈送任意價值≥1金幣的禮物即可獲得補簽卡,每天最多可得5張`)
+                } else if (getQueryString().lang == "ar") {
+                    $('.cardBox .tips').text(`البطاقات المتبقية لإعادة التوقيع: ${cardList[listIndex - 1].repairNum} احصل على ما يصل إلى 5 بطاقات يوميًا عن طريق إهداء هدية تُقدر بقيمة لا تقل عن 1 عملة.`)
+                } else {
+                    $('.cardBox .tips').text(`Current Residual Re-signing Cards: ${cardList[listIndex - 1].repairNum}. Receive up to 5 cards daily by gifting any gift valued at least 1 coin`)
+                }
+                rewardList()
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 獎勵列表
+function rewardList() {
+    $('.cardBox .Box .box').remove()
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/weekCard/rewardList',
+        data: { tabId, },
+        success(res) {
+            if (res.code === 200) {
+                var str = '';
+                var length = res.data.length - 1;
+                res.data.forEach((res, i) => {
+                    str += `
+                        <div class="box ${i == length ? 'boxBig' : ''} " groupId=${res.groupId} isCheckIn=${res.isCheckIn}>
+                            <div class="title">${res.groupName}</div>
+                            <img src="./images/left.png" alt="" class="leftLine">
+                            <img src="./images/right.png" alt="" class="rightLine">
+                            ${strFun(res.rewards, res.isCheckIn, i + 1)}
+                        </div>
+                    `
+                })
+                $('.cardBox .Box').append(str);
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+function strFun(val, isCheckIn, dayIndex) {
+    var str = ''
+    val.forEach(res => {
+        if (res.rewardType == 1) {
+            str += `
+            <div class="gold">
+                <img src="${res.rewardIcon}" alt="">
+                <img style="display:${cardList[listIndex - 1].isNeedRepair == false ? 'none' : isCheckIn ? 'block' : 'none'}" src="./images/ok.png" alt="" class="ok">
+                <img style="display:${cardList[listIndex - 1].isNeedRepair == false ? 'none' : isCheckIn && dayIndex < currGroupId ? 'block' : 'none'}" src="./images/not.png" alt="" class="not">
+                <div class="giftName">${res.rewardName?res.rewardName:langReplace(localLang.demoModule.text13)}</div>
+                <div class="num"><b>${res.rewardNum}</b>${langReplace(localLang.demoModule.text13)}</div>
+            </div>
+            `
+        } else {
+            str += `
+            <div class="gift">
+                <img src="${res.rewardIcon}" alt="">
+                <img style="display:${cardList[listIndex - 1].isNeedRepair == false ? 'none' : isCheckIn ? 'block' : 'none'}" src="./images/ok.png" alt="" class="ok">
+                <img style="display:${cardList[listIndex - 1].isNeedRepair == false ? 'none' : isCheckIn && dayIndex < currGroupId ? 'block' : 'none'}" src="./images/not.png" alt="" class="not">
+                <img style="display:${isCheckIn ? 'none' : 'block'} src="./images/not.png" alt="" class="not">
+                <div class="giftName">${res.rewardName}</div>
+                <div class="num"><b>${res.rewardPrice}</b>${langReplace(localLang.demoModule.text13)}</div>
+                <span>${res.rewardNum}${rewardTypeNumFun(res.rewardType).unit}</span>
+            </div>
+            `
+        }
+    })
+    return str;
+}
+// 切換
+$('.header .tab div').click(function () {
+    listIndex = $(this).index() + 1;
+    $(this).addClass('act').siblings().removeClass('act');
+    getWeekCardTabList();
+})
+// 購買周卡按鈕
+$('.cardBox .but1,.cardBox .but1 p,.cardBox .but1 u').click(function () {
+    $('.pub').show();
+    var num = cardList[listIndex - 1].chargeProdAmount;
+    var grade = listIndex == 1 ? "初級" : listIndex == 2 ? "中級" : "高級";
+    var gradeEn = listIndex == 1 ? "Beginner" : listIndex == 2 ? "Intermediate" : "Advanced";
+    var gradeAr = listIndex == 1 ? "المبتدئين" : listIndex == 2 ? "المتوسطين" : "المتقدمين";
+    if (getQueryString().lang == "zh") {
+        $('.pub .pub_in .box1 .content').text(`確認消費${num}$開通${grade}金幣周卡`)
+    } else if (getQueryString().lang == "en") {
+        $('.pub .pub_in .box1 .content').text(`Confirm spending ${num} dollars to buy the ${gradeEn} Week Card`)
+    } else {
+        $('.pub .pub_in .box1 .content').text(`تأكيد الاستهلاك${num}$يفتح${gradeAr}البطاقة الأسبوعية للعملة الذهبية`)
+    }
+    $('.pub .pub_in .box1').show();
+    $('.pub .pub_in .box2').hide();
+    bodyScroolFun(true);
+})
+// 二次確認購買周卡彈窗
+$('.pub .pub_in .box1 .ok').click(function () {
+    var productId;
+    if (browser.android) {
+        productId = cardList[listIndex - 1].googleChargeProdId;
+        window.androidJsObj.openPayment(productId)
+    } else {
+        productId = cardList[listIndex - 1].appleChargeProdId;
+        window.webkit.messageHandlers.openPayment.postMessage(productId)
+    }
+})
+//支付成功後的回調
+function openPaymentCallback(obj) {
+    console.log('回調對象', obj);
+    console.log('回調orderId', obj.orderId);
+    console.log('回調code', obj.code);
+    console.log('回調productId', obj.productId);
+    $('.pub').hide();
+    bodyScroolFun(false);
+    showLoading()
+    networkRequest({
+        type: 'post',
+        url: urlPrefix + '/weekCard/buy',
+        data: { tabId, },
+        success(res) {
+            if (res.code === 200) {
+                toastMsg(langReplace(localLang.demoModule.text14));
+                getWeekCardTabList();
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 簽到按鈕
+$('.cardBox .but2').click(function () {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/weekCard/checkIn',
+        data: { tabId, },
+        success(res) {
+            if (res.code === 200) {
+                toastMsg(langReplace(localLang.demoModule.text15));
+                getWeekCardTabList();
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+})
+// 補簽簽按鈕
+$('.cardBox .Box').on('click', '.box', function () {
+    var isCheckIn = $(this).attr("isCheckIn");
+    var groupid = $(this).attr("groupid");
+    $('.pub .pub_in .box2 .ok').attr("groupid", groupid);
+    if (isCheckIn == false) {
+        $('.pub').show();
+        $('.pub .pub_in .box1').hide();
+        $('.pub .pub_in .box2').show();
+
+    }
+})
+// 二次確認補簽彈窗
+$('.pub .pub_in .box2 .ok').click(function () {
+    var groupid = $('.pub .pub_in .box2 .ok').attr("groupid");
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/weekCard/repair',
+        data: { tabId, groupId: groupid },
+        success(res) {
+            if (res.code === 200) {
+                toastMsg(langReplace(localLang.demoModule.text16));
+                getWeekCardTabList();
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+})
+// 關閉彈窗
+$('.pub .pub_in .box2 .close,.pub .pub_in .box1 .close').click(function () {
+    bodyScroolFun(false);
+    $('.pub').hide();
+})

view/molistar/modules/weeklyCard/local/ar.js

@@ -0,0 +1,38 @@
+// 阿拉伯
+langAr = {
+    // 模块
+    demoModule: {
+        img1: `background: url(./images/header-ar.png) no-repeat;background-size: 100% 100%;`,
+        layerIndex1: 'جار التحميل...',
+        layerIndex2: 'تمت العملية',
+        layerIndex3: 'خطأ في الشبكة، يرجى الخروج وإعادة الدخول',
+        title: `بطاقة أسبوع الذهب`,
+        text1: `بطاقة أسبوعية مبتدئة`,
+        text2: `بطاقة أسبوعية متوسطة`,
+        text3: `بطاقة أسبوعية متقدمة`,
+        text4: `تسجيل الدخول`,
+        text5: `تم التسجيل`,
+        text6: `
+    <div class="title">قواعد النشاط</div>
+    <div class="content">
+        <p>1. تنقسم البطاقات الأسبوعية إلى مستوى مبتدئ/متوسط/متقدم، يمكن شراء مستويات مختلفة وتفعيلها في نفس الوقت؛</p>
+        <p>2. بعد الشراء، في يوم النشاط، يمكنك استلام جائزة اليوم الأول، ثم استلام الجوائز المقابلة للأيام الستة التالية؛</p>
+        <p>3. إذا فاتك يوم من التسجيل، يمكنك استخدام بطاقة إعادة التسجيل لتسجيل الدخول. انقر على "لم يتم التسجيل" في الحدث لإعادة التسجيل ~</p>
+        <p>4. كيفية الحصول على بطاقات التسجيل: من خلال إهداء أي هدية تقدر قيمتها بما لا يقل عن 1 عملة، يمكنك الحصول على بطاقة إعادة التسجيل واحدة. باستخدام بطاقة إعادة التسجيل، يمكنك تعويض يوم واحد. تكون بطاقة إعادة التسجيل صالحة لليوم وتنتهي منتصف الليل في اليوم التالي. يمكنك الحصول على ما يصل إلى 5 بطاقات يوميًا؛</p>
+        <p>5. البطاقة الأسبوعية صالحة من يوم الشراء لمدة 7 أيام كاملة. بعد انتهاء فترة الصلاحية، لا يمكنك التسجيل لتلك الجائزة؛</p>
+        <p>6. إذا كان لديك أي أسئلة، يرجى الاتصال بخدمة العملاء (LINE: pekoyuyin، البحث عن الرقم في التطبيق: 10001، WeChat: sd245376)؛</p>
+        <p>7. تعود التفسير النهائي لهذا النشاط إلى الجهة الرسمية، ولا يتعلق بشركة Apple Inc./Google؛</p>
+    </div>`,
+        text7: `تفعيل بطاقة أسبوع الذهب`,
+        text8: `نعم`,
+        text9: `لا`,
+        text10: `إعادة التسجيل`,
+        text11: `هل ترغب في استخدام بطاقة إعادة التسجيل لإعادة التسجيل؟`,
+        text12: `السعر الأصلي`,
+        text13: `عملة`,
+        text14: `تم الشراء بنجاح`,
+        text15: `تم التسجيل بنجاح`,
+        text16: `تمت إعادة التسجيل بنجاح`,
+
+    }
+}

view/molistar/modules/weeklyCard/local/en.js

@@ -0,0 +1,37 @@
+// 英文
+langEn = {
+    // 模块
+    demoModule: {
+        img1: `background: url(./images/header-en.png) no-repeat;background-size: 100% 100%;`,
+        layerIndex1: 'Loading...',
+        layerIndex2: 'Operation completed',
+        layerIndex3: 'Network error, please exit and re-enter',
+        title: `Gold Weekly Card`,
+        text1: `Junior Weekly Card`,
+        text2: `Intermediate Weekly Card`,
+        text3: `Advanced Weekly Card`,
+        text4: `Sign In`,
+        text5: `Signed In`,
+        text6: `
+    <div class="title">Activity Rules</div>
+    <div class="content">
+        <p>1. Weekly cards are divided into Junior/Intermediate/Advanced levels, different levels can be purchased and activated simultaneously;</p>
+        <p>2. After purchase, on the day of activation, you can receive the reward for the first day, and then receive corresponding rewards for the next six days;</p>
+        <p>3. If you miss a day's check-in, you can use a re-signing card to check in. Click on the "Not Signed In" in the event to re-sign ~</p>
+        <p>4. How to obtain sign-in cards: By gifting any gift valued at least 1 coin, you can obtain 1 re-signing card. Using a re-signing card allows you to make up for one day. The re-signing card is valid for the day and expires at midnight the next day. You can receive up to 5 cards daily;</p>
+        <p>5. The weekly card is valid from the day of purchase for 7 full days. After the validity period expires, you cannot sign in for that reward;</p>
+        <p>6. If you have any questions, please contact customer service (LINE: pekoyuyin, search ID in app: 10001, WeChat: sd245376);</p>
+        <p>7. The final interpretation of this activity belongs to the official, and it has nothing to do with Apple Inc./Google;</p>
+    </div>`,
+        text7: `Activate Gold Weekly Card`,
+        text8: `Yes`,
+        text9: `No`,
+        text10: `Re-sign`,
+        text11: `Do you want to use a re-signing card for re-signing?`,
+        text12: `Original Price`,
+        text13: `Coins`,
+        text14: `Purchase Successful`,
+        text15: `Sign In Successful`,
+        text16: `Re-sign Successful`,
+    }
+}

view/molistar/modules/weeklyCard/local/zh.js

@@ -0,0 +1,37 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        img1: `background: url(./images/header.png) no-repeat;background-size: 100% 100%;`,
+        layerIndex1: '加載中...',
+        layerIndex2: '操作完成',
+        layerIndex3: '網絡錯誤，請退出重進',
+        title: `金幣周卡`,
+        text1: `初級周卡`,
+        text2: `中級周卡`,
+        text3: `高級周卡`,
+        text4: `簽到`,
+        text5: `已簽到`,
+        text6: `
+        <div class="title">活動規則</div>
+        <div class="content">
+            <p>1.周卡分初級/中級/高級周卡，不同檔位可同時購買同時生效；</p>
+            <p>2.購買後，生效當日可即可領取第一日獎勵，至未來六日每日分領取對應獎勵；</p>
+            <p>3.如果錯過某日簽到可使用補簽進行簽到，點擊活動內【未簽到】的字樣就可以進行補簽啦～</p>
+            <p>4.簽到卡如何獲得：贈送一次任意價值≥1金幣的禮物，可獲得1張補簽卡，使用補簽卡一次可補簽一天，補簽卡當日有效，次日零點失效，每日最高可獲得5張；</p>
+            <p>5.周卡有效時間為購買日當日起整7個整日，超過有效期後無法再簽到該獎勵；</p>
+            <p>6.有任何疑問請聯繫客服（LINE:pekoyuyin、app內搜索ID：10001、WeChat:sd245376）；</p>
+            <p>7.本活動最終解釋權歸官方所有，並與Apple inc/Google公司無關；</p>
+        </div>`,
+        text7: `開通金幣周卡`,
+        text8: `是`,
+        text9: `否`,
+        text10: `補簽`,
+        text11: `是否使用補簽卡進行補簽`,
+        text12: `原價`,
+        text13: `金幣`,
+        text14: `購買成功`,
+        text15: `簽到成功`,
+        text16: `補簽成功`,
+    }
+}