完成boom分区规则

view/molistar/modules/dailyConsumption/css/index.css

@@ -0,0 +1,815 @@
+html,
+body {
+  width: 100%;
+  background: #290C05;
+}
+
+.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: 12.53333rem;
+  background: url(../images/header.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 auto;
+  position: relative;
+}
+
+.header .rule_icon {
+  width: 1.86667rem;
+  height: 0.66667rem;
+  line-height: 0.6rem;
+  background: url(../images/rule_cion.png) no-repeat;
+  background-size: 100% 100%;
+  color: #FFED70;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  position: absolute;
+  top: 5.49333rem;
+  right: 0rem;
+  text-align: center;
+  text-indent: 2px;
+}
+
+.header .timeBox {
+  width: 7.16rem;
+  height: 1.62667rem;
+  box-sizing: border-box;
+  padding: 0 0.66667rem;
+  position: absolute;
+  top: 8.48rem;
+  left: 50%;
+  transform: translateX(-50%);
+  display: flex;
+  justify-content: space-between;
+}
+
+.header .timeBox div {
+  width: 1.33333rem;
+  height: 1.33333rem;
+  background: url(../images/time.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  text-align: center;
+  line-height: 1.33333rem;
+}
+
+.header .timeBox div b {
+  color: #FFED70;
+  font-size: 0.58667rem;
+  font-weight: 600;
+  font-family: PingFang SC;
+}
+
+.header .timeBox div span {
+  width: 2.4rem;
+  height: 0.48rem;
+  line-height: 0.48rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: -0.54667rem;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  font-family: PingFang SC;
+  background: url(../images/timeBg.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.header .timeBox .day {
+  margin-right: 0.78667rem;
+}
+
+.header .timeBox .colon {
+  width: 0.21333rem;
+  height: 0.53333rem;
+  background: url(../images/colon.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 0.22667rem;
+  margin-top: 0.54667rem;
+}
+
+.myBox {
+  width: 10rem;
+  height: 8.05333rem;
+  background: url(../images/box.png) no-repeat;
+  background-size: 100% 100%;
+  margin: -1.1rem auto 0.46667rem;
+  position: relative;
+}
+
+.myBox .ts {
+  width: 1.70667rem;
+  height: 1.70667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 2.44rem;
+  z-index: 2;
+}
+
+.myBox .tx {
+  width: 1.70667rem;
+  height: 1.70667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 2.44rem;
+  z-index: 1;
+  border-radius: 50%;
+}
+
+.myBox .name {
+  width: 4.8rem;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 4.28rem;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.37333rem;
+  font-weight: 600;
+}
+
+.myBox .lineBox {
+  width: 8.26667rem;
+  height: 0.21333rem;
+  border-radius: 0.21333rem;
+  background: #824115;
+  position: absolute;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 5.85333rem;
+  border-radius: 0.21333rem;
+}
+
+.myBox .lineBox .line {
+  width: 0%;
+  height: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  background: linear-gradient(90deg, #FBF392, #FCB41B);
+  border-radius: 0.21333rem;
+}
+
+.myBox .lineBox .boxs {
+  width: 0.82667rem;
+  height: 0.82667rem;
+  background: url(../images/false.png) no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.myBox .lineBox .boxs span {
+  height: 0.45333rem;
+  line-height: 0.45333rem;
+  position: absolute;
+  left: 50%;
+  transform: translate(-50%);
+  top: -0.66667rem;
+  display: flex;
+  color: #FFED70;
+  font-size: 0.34667rem;
+  font-weight: 400;
+}
+
+.myBox .lineBox .boxs span img {
+  display: block;
+  width: 0.45333rem;
+  height: 0.45333rem;
+  margin: 0 0.06667rem;
+}
+
+.myBox .lineBox .box1 {
+  left: 2rem;
+}
+
+.myBox .lineBox .box2 {
+  left: 4.52rem;
+}
+
+.myBox .lineBox .box3 {
+  right: 0rem;
+}
+
+.myBox .lineBox .act {
+  background: url(../images/true.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.myBox .tetxBox {
+  width: 8.26667rem;
+  display: flex;
+  justify-content: space-between;
+  position: absolute;
+  top: 6.4rem;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #FFED70;
+  font-weight: 400;
+}
+
+.myBox .tetxBox .left {
+  font-size: 0.34667rem;
+}
+
+.myBox .tetxBox .rirgt {
+  font-size: 0.37333rem;
+}
+
+.tab {
+  width: 9.73333rem;
+  height: 1.33333rem;
+  margin: 0 auto 0.41333rem;
+  display: flex;
+  justify-content: space-between;
+}
+
+.tab div {
+  width: 4.8rem;
+  height: 1.33333rem;
+  line-height: 1.33333rem;
+  text-align: center;
+  color: #EBC9B2;
+  font-size: 0.4rem;
+  font-weight: 600;
+  background: url(../images/tab.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.tab .tabbox {
+  background: url(../images/tab2.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.tab .act {
+  color: #290C05;
+  background: url(../images/act.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.tab .act2 {
+  color: #290C05;
+  background: url(../images/tabact2.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content1 {
+  width: 10rem;
+  height: auto;
+  margin: 0 auto 0.41333rem;
+}
+
+.content1 .contentBox1,
+.content1 .contentBox2,
+.content1 .contentBox3 {
+  width: 100%;
+  height: 16.58667rem;
+  background: url(../images/bg.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 auto 0.53333rem;
+  position: relative;
+  overflow: hidden;
+}
+
+.content1 .contentBox1 .title,
+.content1 .contentBox2 .title,
+.content1 .contentBox3 .title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0;
+  width: 5.22667rem;
+  height: 1.28rem;
+  line-height: 1.28rem;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.42667rem;
+  font-weight: 600;
+  background: url(../images/title.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content1 .contentBox1 .title span,
+.content1 .contentBox2 .title span,
+.content1 .contentBox3 .title span {
+  vertical-align: middle;
+  display: inline-block;
+}
+
+.content1 .contentBox1 .title img,
+.content1 .contentBox2 .title img,
+.content1 .contentBox3 .title img {
+  width: 0.53333rem;
+  height: 0.53333rem;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 0.06667rem;
+}
+
+.content1 .contentBox1 .box,
+.content1 .contentBox2 .box,
+.content1 .contentBox3 .box {
+  width: 8.93333rem;
+  height: 10.66667rem;
+  margin: 2.10667rem auto 0.13333rem;
+  background: url(../images/700.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+}
+
+.content1 .contentBox1 .box .ts,
+.content1 .contentBox2 .box .ts,
+.content1 .contentBox3 .box .ts {
+  width: 2.13333rem;
+  height: 2.13333rem;
+  position: absolute;
+  right: 0.5rem;
+  top: 5.9rem;
+}
+
+.content1 .contentBox1 .box .zj,
+.content1 .contentBox2 .box .zj,
+.content1 .contentBox3 .box .zj {
+  width: 5.2rem;
+  height: 8.5rem;
+  position: absolute;
+  left: 0.35rem;
+  top: 0.3rem;
+  overflow: hidden;
+}
+
+.content1 .contentBox1 .box .zj canvas,
+.content1 .contentBox2 .box .zj canvas,
+.content1 .contentBox3 .box .zj canvas {
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+.content1 .contentBox1 .priorityWinners,
+.content1 .contentBox2 .priorityWinners,
+.content1 .contentBox3 .priorityWinners {
+  width: 100%;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  margin-bottom: 0.36rem;
+}
+
+.content1 .contentBox1 .priorityWinnersBox,
+.content1 .contentBox2 .priorityWinnersBox,
+.content1 .contentBox3 .priorityWinnersBox {
+  height: 1.6rem;
+  width: 83%;
+  display: flex;
+  justify-content: space-around;
+  margin: 0 auto;
+}
+
+.content1 .contentBox1 .priorityWinnersBox div,
+.content1 .contentBox2 .priorityWinnersBox div,
+.content1 .contentBox3 .priorityWinnersBox div {
+  width: 1.6rem;
+  height: 1.6rem;
+  position: relative;
+}
+
+.content1 .contentBox1 .priorityWinnersBox div img,
+.content1 .contentBox2 .priorityWinnersBox div img,
+.content1 .contentBox3 .priorityWinnersBox div img {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  border-radius: 50%;
+  left: 0;
+  top: 0;
+  border: 0.04rem #FFED70 solid;
+}
+
+.content1 .contentBox1 .priorityWinnersBox div span,
+.content1 .contentBox2 .priorityWinnersBox div span,
+.content1 .contentBox3 .priorityWinnersBox div span {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.34667rem;
+  font-weight: 500;
+  text-align: center;
+  position: absolute;
+  left: 0;
+  bottom: -0.6rem;
+  height: 0.4rem;
+}
+
+.content1 .contentBox2 .box {
+  background: url(../images/350.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content1 .contentBox3 .box {
+  background: url(../images/70.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content2 {
+  width: 10rem;
+  height: auto;
+  margin: 0 auto 0.41333rem;
+  display: none;
+}
+
+.content2 .contentBox1,
+.content2 .contentBox2,
+.content2 .contentBox3 {
+  width: 100%;
+  height: 16.58667rem;
+  background: url(../images/bg.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 0 auto 0.53333rem;
+  position: relative;
+  overflow: hidden;
+}
+
+.content2 .contentBox1 .title,
+.content2 .contentBox2 .title,
+.content2 .contentBox3 .title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0;
+  width: 5.22667rem;
+  height: 1.28rem;
+  line-height: 1.28rem;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.42667rem;
+  font-weight: 600;
+  background: url(../images/title.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content2 .contentBox1 .title span,
+.content2 .contentBox2 .title span,
+.content2 .contentBox3 .title span {
+  vertical-align: middle;
+  display: inline-block;
+}
+
+.content2 .contentBox1 .title img,
+.content2 .contentBox2 .title img,
+.content2 .contentBox3 .title img {
+  width: 0.53333rem;
+  height: 0.53333rem;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 0.06667rem;
+}
+
+.content2 .contentBox1 .box,
+.content2 .contentBox2 .box,
+.content2 .contentBox3 .box {
+  width: 8.93333rem;
+  height: 10.66667rem;
+  margin: 2.10667rem auto 0.13333rem;
+  background: url(../images/7.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+}
+
+.content2 .contentBox1 .box .ts,
+.content2 .contentBox2 .box .ts,
+.content2 .contentBox3 .box .ts {
+  width: 2.13333rem;
+  height: 2.13333rem;
+  position: absolute;
+  right: 0.5rem;
+  top: 3.6rem;
+}
+
+.content2 .contentBox1 .box .zj,
+.content2 .contentBox2 .box .zj,
+.content2 .contentBox3 .box .zj {
+  width: 5.2rem;
+  height: 8.5rem;
+  position: absolute;
+  left: 0.35rem;
+  top: 0.3rem;
+  overflow: hidden;
+}
+
+.content2 .contentBox1 .box .zj canvas,
+.content2 .contentBox2 .box .zj canvas,
+.content2 .contentBox3 .box .zj canvas {
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+.content2 .contentBox1 .box .zjIcon,
+.content2 .contentBox2 .box .zjIcon,
+.content2 .contentBox3 .box .zjIcon {
+  width: 0.61333rem;
+  height: 0.61333rem;
+  position: absolute;
+  left: 2.6rem;
+  top: 8.94667rem;
+  z-index: 2;
+}
+
+.content2 .contentBox1 .box .xzIcon,
+.content2 .contentBox2 .box .xzIcon,
+.content2 .contentBox3 .box .xzIcon {
+  width: 0.61333rem;
+  height: 0.61333rem;
+  position: absolute;
+  right: 1.2rem;
+  top: 8.94667rem;
+  z-index: 2;
+}
+
+.content2 .contentBox1 .priorityWinners,
+.content2 .contentBox2 .priorityWinners,
+.content2 .contentBox3 .priorityWinners {
+  width: 100%;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  margin-bottom: 0.36rem;
+}
+
+.content2 .contentBox1 .priorityWinnersBox,
+.content2 .contentBox2 .priorityWinnersBox,
+.content2 .contentBox3 .priorityWinnersBox {
+  height: 1.6rem;
+  width: 83%;
+  display: flex;
+  justify-content: space-around;
+  margin: 0 auto;
+}
+
+.content2 .contentBox1 .priorityWinnersBox div,
+.content2 .contentBox2 .priorityWinnersBox div,
+.content2 .contentBox3 .priorityWinnersBox div {
+  width: 1.6rem;
+  height: 1.6rem;
+  position: relative;
+}
+
+.content2 .contentBox1 .priorityWinnersBox div img,
+.content2 .contentBox2 .priorityWinnersBox div img,
+.content2 .contentBox3 .priorityWinnersBox div img {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  border-radius: 50%;
+  left: 0;
+  top: 0;
+  border: 0.04rem #FFED70 solid;
+}
+
+.content2 .contentBox1 .priorityWinnersBox div span,
+.content2 .contentBox2 .priorityWinnersBox div span,
+.content2 .contentBox3 .priorityWinnersBox div span {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.34667rem;
+  font-weight: 500;
+  text-align: center;
+  position: absolute;
+  left: 0;
+  bottom: -0.6rem;
+}
+
+.content2 .contentBox2 .box {
+  background: url(../images/3500.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content2 .contentBox3 .box {
+  background: url(../images/210.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.content2 .contentBox3 .box .ts {
+  top: 5.9rem;
+}
+
+.null {
+  width: 100%;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  opacity: 0.6;
+  margin-bottom: 0.53333rem;
+}
+
+.video,
+.video2,
+.video3 {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 99;
+  display: none;
+}
+
+.video video,
+.video2 video,
+.video3 video {
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: 65%;
+}
+
+.video .close,
+.video2 .close,
+.video3 .close {
+  width: 0.90667rem;
+  height: 0.90667rem;
+  position: absolute;
+  top: 10%;
+  right: 0.93333rem;
+  z-index: 9;
+}
+
+.rule {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 99;
+  display: none;
+}
+
+.rule .rule_in {
+  width: 9.33333rem;
+  height: 11.06667rem;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  background: url(../images/ruleBg.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.rule .rule_in .close {
+  width: 0.88rem;
+  height: 0.88rem;
+  position: absolute;
+  right: 0;
+  top: -0.93333rem;
+}
+
+.rule .rule_in .title {
+  width: 4.66667rem;
+  height: 1.28rem;
+  line-height: 1.28rem;
+  text-align: center;
+  color: #FFED70;
+  font-size: 0.42667rem;
+  font-weight: 600;
+  position: absolute;
+  top: -0.16rem;
+  left: 50%;
+  transform: translateX(-50%);
+  background: url(../images/ruleTitle.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.rule .rule_in .box {
+  width: 7.53333rem;
+  height: 8rem;
+  position: absolute;
+  top: 2.36rem;
+  left: 50%;
+  transform: translateX(-50%);
+  overflow-y: scroll;
+}
+
+.rule .rule_in .box::-webkit-scrollbar {
+  display: none;
+}
+
+.rule .rule_in .box p {
+  color: #FFED70;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  line-height: 0.53333rem;
+  margin-bottom: 0.45333rem;
+}
+
+.arabic .header {
+  background: url(../images/header-ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .myBox .tetxBox {
+  direction: ltr;
+}
+
+.arabic .content1 .contentBox1 .box {
+  background: url(../images/700ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content1 .contentBox1 .box .ts {
+  direction: ltr;
+}
+
+.arabic .content1 .contentBox2 .box {
+  background: url(../images/350ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content1 .contentBox2 .box .ts {
+  direction: ltr;
+}
+
+.arabic .content1 .contentBox3 .box {
+  background: url(../images/70ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content1 .contentBox3 .box .ts {
+  direction: ltr;
+}
+
+.arabic .content2 .contentBox1 .box {
+  background: url(../images/7ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content2 .contentBox1 .box .ts {
+  direction: ltr;
+}
+
+.arabic .content2 .contentBox2 .box {
+  background: url(../images/3500ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content2 .contentBox2 .box .ts {
+  direction: ltr;
+}
+
+.arabic .content2 .contentBox3 .box {
+  background: url(../images/210ar.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.arabic .content2 .contentBox3 .box .ts {
+  direction: ltr;
+}
+
+.arabic .back img {
+  left: auto;
+  right: 0.24rem;
+  transform: rotate(180deg);
+}

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

@@ -0,0 +1,790 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: #290C05;
+}
+
+.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(940);
+    background: url(../images/header.png) no-repeat;
+    background-size: 100% 100%;
+    margin: 0 auto;
+    position: relative;
+
+    .rule_icon {
+        width: px2rem(140);
+        height: px2rem(50);
+        line-height: px2rem(45);
+        background: url(../images/rule_cion.png) no-repeat;
+        background-size: 100% 100%;
+        color: #FFED70;
+        font-size: px2rem(28);
+        font-weight: 500;
+        position: absolute;
+        top: px2rem(412);
+        right: px2rem(0);
+        text-align: center;
+        text-indent: 2px;
+    }
+
+    .timeBox {
+        width: 7.16rem;
+        height: px2rem(122);
+        box-sizing: border-box;
+        padding: 0 px2rem(50);
+        position: absolute;
+        top: px2rem(636);
+        left: 50%;
+        transform: translateX(-50%);
+        display: flex;
+        justify-content: space-between;
+
+        div {
+            width: px2rem(100);
+            height: px2rem(100);
+            background: url(../images/time.png) no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+            text-align: center;
+            line-height: px2rem(100);
+
+            b {
+                color: #FFED70;
+                font-size: px2rem(44);
+                font-weight: 600;
+                font-family: PingFang SC;
+            }
+
+            span {
+                width: px2rem(180);
+                height: px2rem(36);
+                line-height: px2rem(36);
+                position: absolute;
+                left: 50%;
+                transform: translateX(-50%);
+                bottom: px2rem(-41);
+                text-align: center;
+                color: #FFED70;
+                font-size: px2rem(28);
+                font-weight: 400;
+                font-family: PingFang SC;
+                background: url(../images/timeBg.png) no-repeat;
+                background-size: 100% 100%;
+            }
+        }
+
+        .day {
+            margin-right: px2rem(59);
+        }
+
+        .colon {
+            width: px2rem(16);
+            height: px2rem(40);
+            background: url(../images/colon.png) no-repeat;
+            background-size: 100% 100%;
+            margin: 0 px2rem(17);
+            margin-top: px2rem(41);
+        }
+    }
+}
+
+.myBox {
+    width: px2rem(750);
+    height: px2rem(604);
+    background: url(../images/box.png) no-repeat;
+    background-size: 100% 100%;
+    margin: -1.1rem auto px2rem(35);
+    position: relative;
+
+    .ts {
+        width: px2rem(128);
+        height: px2rem(128);
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(183);
+        z-index: 2;
+    }
+
+    .tx {
+        width: px2rem(128);
+        height: px2rem(128);
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(183);
+        z-index: 1;
+        border-radius: 50%;
+    }
+
+    .name {
+        width: px2rem(360);
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(321);
+        text-align: center;
+        color: #FFED70;
+        font-size: px2rem(28);
+        font-weight: 600;
+    }
+
+    .lineBox {
+        width: px2rem(620);
+        height: px2rem(16);
+        border-radius: px2rem(16);
+        background: #824115;
+        position: absolute;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(439);
+        border-radius: px2rem(16);
+
+        .line {
+            width: 0%;
+            height: 100%;
+            position: absolute;
+            left: 0;
+            top: 0;
+            background: linear-gradient(90deg, #FBF392, #FCB41B);
+            border-radius: px2rem(16);
+        }
+
+        .boxs {
+            width: px2rem(62);
+            height: px2rem(62);
+            background: url(../images/false.png) no-repeat;
+            background-size: 100% 100%;
+            position: absolute;
+            top: 50%;
+            transform: translateY(-50%);
+
+            span {
+                height: px2rem(34);
+                line-height: px2rem(34);
+                position: absolute;
+                left: 50%;
+                transform: translate(-50%);
+                top: px2rem(-50);
+                display: flex;
+                color: #FFED70;
+                font-size: px2rem(26);
+                font-weight: 400;
+
+                img {
+                    display: block;
+                    width: px2rem(34);
+                    height: px2rem(34);
+                    margin: 0 px2rem(5);
+                }
+            }
+        }
+
+        .box1 {
+            left: px2rem(150);
+        }
+
+        .box2 {
+            left: px2rem(339);
+        }
+
+        .box3 {
+            right: px2rem(0);
+        }
+
+        .act {
+            background: url(../images/true.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+
+    .tetxBox {
+        width: px2rem(620);
+        display: flex;
+        justify-content: space-between;
+        position: absolute;
+        top: px2rem(480);
+        left: 50%;
+        transform: translateX(-50%);
+        color: #FFED70;
+        font-weight: 400;
+
+        .left {
+            font-size: px2rem(26);
+        }
+
+        .rirgt {
+            font-size: px2rem(28);
+        }
+    }
+}
+
+.tab {
+    width: px2rem(730);
+    height: px2rem(100);
+    margin: 0 auto px2rem(31);
+    display: flex;
+    justify-content: space-between;
+
+    div {
+        width: px2rem(360);
+        height: px2rem(100);
+        line-height: px2rem(100);
+        text-align: center;
+        color: #EBC9B2;
+        font-size: px2rem(30);
+        font-weight: 600;
+        background: url(../images/tab.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .tabbox {
+        background: url(../images/tab2.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .act {
+        color: #290C05;
+        background: url(../images/act.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .act2 {
+        color: #290C05;
+        background: url(../images/tabact2.png) no-repeat;
+        background-size: 100% 100%;
+    }
+}
+
+.content1 {
+    width: px2rem(750);
+    height: auto;
+    margin: 0 auto px2rem(31);
+    // display: none;
+
+    .contentBox1,
+    .contentBox2,
+    .contentBox3 {
+        width: 100%;
+        height: px2rem(1244);
+        background: url(../images/bg.png) no-repeat;
+        background-size: 100% 100%;
+        margin: 0 auto px2rem(40);
+        position: relative;
+        overflow: hidden;
+
+        .title {
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: 0;
+            width: px2rem(392);
+            height: px2rem(96);
+            line-height: px2rem(96);
+            text-align: center;
+            color: #FFED70;
+            font-size: px2rem(32);
+            font-weight: 600;
+            background: url(../images/title.png) no-repeat;
+            background-size: 100% 100%;
+
+            span {
+                vertical-align: middle;
+                display: inline-block;
+            }
+
+            img {
+                width: px2rem(40);
+                height: px2rem(40);
+                display: inline-block;
+                vertical-align: middle;
+                margin: 0 px2rem(5);
+            }
+        }
+
+        .box {
+            width: px2rem(670);
+            height: px2rem(800);
+            margin: px2rem(158) auto px2rem(10);
+            background: url(../images/700.png) no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+
+            .ts {
+                width: px2rem(160);
+                height: px2rem(160);
+                position: absolute;
+                right: 0.5rem;
+                top: 5.9rem;
+            }
+
+            .zj {
+                width: 5.2rem;
+                height: 8.5rem;
+                position: absolute;
+                left: 0.35rem;
+                top: 0.3rem;
+                overflow: hidden;
+
+                canvas {
+                    position: absolute;
+                    left: 0;
+                    top: 0;
+                }
+            }
+        }
+
+        .priorityWinners {
+            width: 100%;
+            text-align: center;
+            color: #FFED70;
+            font-size: px2rem(32);
+            font-weight: 500;
+            margin-bottom: px2rem(27);
+        }
+
+        .priorityWinnersBox {
+            height: px2rem(120);
+            width: 83%;
+            display: flex;
+            justify-content: space-around;
+            margin: 0 auto;
+
+            div {
+                width: px2rem(120);
+                height: px2rem(120);
+                position: relative;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    border-radius: 50%;
+                    left: 0;
+                    top: 0;
+                    border: px2rem(3) #FFED70 solid;
+                }
+
+                span {
+                    width: 100%;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    text-align: center;
+                    color: #FFED70;
+                    font-size: px2rem(26);
+                    font-weight: 500;
+                    text-align: center;
+                    position: absolute;
+                    left: 0;
+                    bottom: -0.6rem;
+                    height: 0.4rem;
+                }
+            }
+        }
+    }
+
+    .contentBox2 {
+        .box {
+            background: url(../images/350.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+
+    .contentBox3 {
+        .box {
+            background: url(../images/70.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+}
+
+.content2 {
+    width: px2rem(750);
+    height: auto;
+    margin: 0 auto px2rem(31);
+    display: none;
+
+    .contentBox1,
+    .contentBox2,
+    .contentBox3 {
+        width: 100%;
+        height: px2rem(1244);
+        background: url(../images/bg.png) no-repeat;
+        background-size: 100% 100%;
+        margin: 0 auto px2rem(40);
+        position: relative;
+        overflow: hidden;
+
+        .title {
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            top: 0;
+            width: px2rem(392);
+            height: px2rem(96);
+            line-height: px2rem(96);
+            text-align: center;
+            color: #FFED70;
+            font-size: px2rem(32);
+            font-weight: 600;
+            background: url(../images/title.png) no-repeat;
+            background-size: 100% 100%;
+
+            span {
+                vertical-align: middle;
+                display: inline-block;
+            }
+
+            img {
+                width: px2rem(40);
+                height: px2rem(40);
+                display: inline-block;
+                vertical-align: middle;
+                margin: 0 px2rem(5);
+            }
+        }
+
+        .box {
+            width: px2rem(670);
+            height: px2rem(800);
+            margin: px2rem(158) auto px2rem(10);
+            background: url(../images/7.png) no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+
+            .ts {
+                width: px2rem(160);
+                height: px2rem(160);
+                position: absolute;
+                right: 0.5rem;
+                top: 3.6rem;
+            }
+
+            .zj {
+                width: 5.2rem;
+                height: 8.5rem;
+                position: absolute;
+                left: 0.35rem;
+                top: 0.3rem;
+                overflow: hidden;
+
+                canvas {
+                    position: absolute;
+                    left: 0;
+                    top: 0;
+                }
+            }
+
+            .zjIcon {
+                width: px2rem(46);
+                height: px2rem(46);
+                position: absolute;
+                left: px2rem(195);
+                top: px2rem(671);
+                z-index: 2;
+            }
+
+            .xzIcon {
+                width: px2rem(46);
+                height: px2rem(46);
+                position: absolute;
+                right: px2rem(90);
+                top: px2rem(671);
+                z-index: 2;
+            }
+        }
+
+        .priorityWinners {
+            width: 100%;
+            text-align: center;
+            color: #FFED70;
+            font-size: px2rem(32);
+            font-weight: 500;
+            margin-bottom: px2rem(27);
+        }
+
+        .priorityWinnersBox {
+            height: px2rem(120);
+            width: 83%;
+            display: flex;
+            justify-content: space-around;
+            margin: 0 auto;
+
+            div {
+                width: px2rem(120);
+                height: px2rem(120);
+                position: relative;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                    position: absolute;
+                    border-radius: 50%;
+                    left: 0;
+                    top: 0;
+                    border: px2rem(3) #FFED70 solid;
+                }
+
+                span {
+                    width: 100%;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    text-align: center;
+                    color: #FFED70;
+                    font-size: px2rem(26);
+                    font-weight: 500;
+                    text-align: center;
+                    position: absolute;
+                    left: 0;
+                    bottom: -0.6rem;
+                }
+            }
+        }
+    }
+
+    .contentBox2 {
+        .box {
+            background: url(../images/3500.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+
+    .contentBox3 {
+        .box {
+            background: url(../images/210.png) no-repeat;
+            background-size: 100% 100%;
+
+            .ts {
+                top: 5.9rem;
+            }
+        }
+    }
+}
+
+.null {
+    width: 100%;
+    text-align: center;
+    color: #FFED70;
+    font-size: px2rem(26);
+    font-weight: 400;
+    opacity: 0.6;
+    margin-bottom: px2rem(40);
+}
+
+.video,
+.video2,
+.video3 {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0, 0, 0, .5);
+    z-index: 99;
+    display: none;
+
+    video {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        width: 65%;
+    }
+
+    .close {
+        width: px2rem(68);
+        height: px2rem(68);
+        position: absolute;
+        top: 10%;
+        right: px2rem(70);
+        z-index: 9;
+    }
+}
+
+.rule {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0, 0, 0, .5);
+    z-index: 99;
+    display: none;
+
+    .rule_in {
+        width: px2rem(700);
+        height: px2rem(830);
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        background: url(../images/ruleBg.png) no-repeat;
+        background-size: 100% 100%;
+
+        .close {
+            width: px2rem(66);
+            height: px2rem(66);
+            position: absolute;
+            right: 0;
+            top: px2rem(-70);
+        }
+
+        .title {
+            width: px2rem(350);
+            height: px2rem(96);
+            line-height: px2rem(96);
+            text-align: center;
+            color: #FFED70;
+            font-size: px2rem(32);
+            font-weight: 600;
+            position: absolute;
+            top: px2rem(-12);
+            left: 50%;
+            transform: translateX(-50%);
+            background: url(../images/ruleTitle.png) no-repeat;
+            background-size: 100% 100%;
+        }
+
+        .box {
+            width: px2rem(565);
+            height: 8rem;
+            position: absolute;
+            top: px2rem(177);
+            left: 50%;
+            transform: translateX(-50%);
+            overflow-y: scroll;
+
+            &::-webkit-scrollbar {
+                display: none;
+            }
+
+            p {
+                color: #FFED70;
+                font-size: px2rem(28);
+                font-weight: 400;
+                line-height: px2rem(40);
+                margin-bottom: px2rem(34);
+            }
+        }
+    }
+}
+
+.arabic {
+    .header {
+        background: url(../images/header-ar.png) no-repeat;
+        background-size: 100% 100%;
+    }
+
+    .myBox .tetxBox {
+        direction: ltr;
+    }
+
+    .content1 {
+        .contentBox1 {
+            .box {
+                background: url(../images/700ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+
+        .contentBox2 {
+            .box {
+                background: url(../images/350ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+
+        .contentBox3 {
+            .box {
+                background: url(../images/70ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+    }
+
+    .content2 {
+        .contentBox1 {
+            .box {
+                background: url(../images/7ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+
+        .contentBox2 {
+            .box {
+                background: url(../images/3500ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+
+        .contentBox3 {
+            .box {
+                background: url(../images/210ar.png) no-repeat;
+                background-size: 100% 100%;
+
+                .ts {
+                    direction: ltr;
+                }
+            }
+        }
+    }
+
+    .back img {
+        left: auto;
+        right: 0.24rem;
+        transform: rotate(180deg);
+    }
+}

view/molistar/modules/dailyConsumption/index.html

@@ -0,0 +1,222 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></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">
+        <div class="rule_icon text2"></div>
+        <!-- 倒计时 -->
+        <div class="timeBox">
+            <div class="hour">
+                <b>00</b>
+                <span class="text3"></span>
+            </div>
+            <div class="min">
+                <b>00</b>
+                <span class="text4"></span>
+            </div>
+            <div class="sec">
+                <b>00</b>
+                <span class="text5"></span>
+            </div>
+        </div>
+    </div>
+    <!--我的消费进度  -->
+    <div class="myBox">
+        <img src="./images/txk.png" alt="" class="ts">
+        <img src="" alt="" class="tx">
+        <div class="name"></div>
+        <div class="lineBox">
+            <div class="line"></div>
+            <div class="box1 boxs">
+                <span><b>0K</b> <img src="./images/gold.png" alt=""></span>
+            </div>
+            <div class="box2 boxs">
+                <span><b>0K</b> <img src="./images/gold.png" alt=""></span>
+            </div>
+            <div class="box3 boxs">
+                <span><b>0K</b> <img src="./images/gold.png" alt=""></span>
+            </div>
+        </div>
+        <div class="tetxBox">
+            <div class="l text6"></div>
+            <div class="r"><b>0</b>/<strong></strong></div>
+        </div>
+    </div>
+    <!-- tab -->
+    <div class="tab">
+        <div class="tabbox act text7"></div>
+        <div class="text8"></div>
+    </div>
+    <!-- 档位1 -->
+    <div class="content1">
+        <div class="contentBox1 level3">
+            <!-- 标题 -->
+            <div class="title">
+                <span><strong class="text9"></strong></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts ts350" id="ts350"></div>
+                <div class="zj zj700" id="zj700"></div>
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+            </div>
+        </div>
+        <div class="contentBox2 level2">
+            <!-- 标题 -->
+            <div class="title">
+                <span><strong class="text10"></strong></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts ts70" id="ts70"></div>
+                <div class="zj zj350" id="zj350"></div>
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+                <!-- <div>
+                    <img src="" alt="">
+                    <span>名字</span>
+                </div>
+                <div>
+                    <img src="" alt="">
+                    <span>名字</span>
+                </div> -->
+            </div>
+        </div>
+        <div class="contentBox3 level1">
+            <!-- 标题 -->
+            <div class="title">
+                <span><strong class="text11"></strong></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts ts700" id="ts700"></div>
+                <div class="zj zj70" id="zj70"></div>
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+            </div>
+        </div>
+    </div>
+    <!-- 档位2 -->
+    <div class="content2">
+        <div class="contentBox1 level6">
+            <!-- 标题 -->
+            <div class="title">
+                <span class="text12"></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts" id="ts7"></div>
+                <!-- 播放图标 -->
+                <img src="./images/bf.png" alt="" class="zjIcon">
+                <img src="./images/bf.png" alt="" class="xzIcon">
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+            </div>
+        </div>
+        <div class="contentBox2 level5">
+            <!-- 标题 -->
+            <div class="title">
+                <span><strong class="text13"></strong></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts" id="ts3500"></div>
+                <div class="zj" id="zj3500"></div>
+                <!-- 播放图标 -->
+                <img src="./images/bf.png" alt="" class="xzIcon">
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+                <!-- <div>
+                    <img src="" alt="">
+                    <span>名字</span>
+                </div>
+                <div>
+                    <img src="" alt="">
+                    <span>名字</span>
+                </div> -->
+            </div>
+        </div>
+        <div class="contentBox3 level4">
+            <!-- 标题 -->
+            <div class="title">
+                <span><strong class="text14"></strong></span><img src="./images/gold.png" alt="">
+            </div>
+            <!-- 奖励内容 -->
+            <div class="box">
+                <div class="ts" id="ts210"></div>
+                <div class="zj" id="zj210"></div>
+            </div>
+            <!-- 获奖人员 -->
+            <div class="priorityWinners"></div>
+            <div class="priorityWinnersBox">
+            </div>
+        </div>
+    </div>
+    <div class="null"></div>
+    <div class="video">
+        <video id="zjVideo" controls playsinline webkit-playsinline>
+            <source src="./video/zj7.mp4" type="video/mp4">
+        </video>
+        <img src="./images/close.png" alt="" class="close">
+    </div>
+    <div class="video2">
+        <video id="zjVideo2" controls playsinline webkit-playsinline>
+            <source src="./video/xz7.mp4" type="video/mp4">
+        </video>
+        <img src="./images/close.png" alt="" class="close">
+    </div>
+    <div class="video3">
+        <video id="zjVideo3" controls playsinline webkit-playsinline>
+            <source src="./video/xz3500.mp4" type="video/mp4">
+        </video>
+        <img src="./images/close.png" alt="" class="close">
+    </div>
+
+    <!-- 规则 -->
+    <div class="rule">
+        <div class="rule_in">
+            <img src="./images/close.png" alt="" class="close">
+            <div class="title text2">Rules</div>
+            <div class="box"></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="../../common/js/svga.min.js"></script>
+<script src="./js/index.js"></script>
+<script src="../../common/local/langHandler.js"></script>

view/molistar/modules/dailyConsumption/js/index.js

@@ -0,0 +1,315 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+var langReplace;
+var localLang;
+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 countupTime;//倒计时容器
+var page = 0;
+var maxPage = 0;
+var arr = [];
+// 初始化函數
+$(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)
+            }
+        })
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        getConfig();
+    }, 100)
+})
+// 处理SVGA
+document.addEventListener('DOMContentLoaded', function () {
+    function loadSVGA(containerId, svgaPath) {
+        var container = document.getElementById(containerId);
+        var player = new SVGA.Player(container);
+
+        var parser = new SVGA.Parser();
+        parser.load(svgaPath, function (videoItem) {
+            player.setVideoItem(videoItem);
+            player.startAnimation();
+        });
+    }
+
+    loadSVGA('ts700', './svga/ts700.svga');
+    loadSVGA('ts350', './svga/ts350.svga');
+    loadSVGA('ts70', './svga/ts70.svga');
+    loadSVGA('zj700', './svga/zj350.svga');
+    loadSVGA('zj350', './svga/zj210.svga');
+    loadSVGA('zj70', './svga/zj70.svga');
+
+    loadSVGA('ts7', './svga/ts210.svga');
+    loadSVGA('ts3500', './svga/ts3500.svga');
+    loadSVGA('ts210', './svga/ts7.svga');
+
+
+    loadSVGA('zj3500', './svga/zj3500.svga');
+    loadSVGA('zj210', './svga/zj700.svga');
+});
+function translateFun() {
+    var langReplace = window.lang.replace;
+    var localLang = window.lang;
+    $('.text1').text(langReplace(localLang.demoModule.text1));
+    $('.text2').text(langReplace(localLang.demoModule.text2));
+    $('.text3').text(langReplace(localLang.demoModule.text3));
+    $('.text4').text(langReplace(localLang.demoModule.text4));
+    $('.text5').text(langReplace(localLang.demoModule.text5));
+    $('.text6').text(langReplace(localLang.demoModule.text6));
+    $('.text7').text(langReplace(localLang.demoModule.text7));
+    $('.text8').text(langReplace(localLang.demoModule.text8));
+    $('.text9').text(langReplace(localLang.demoModule.text9));
+    $('.text10').text(langReplace(localLang.demoModule.text10));
+    $('.text11').text(langReplace(localLang.demoModule.text11));
+    $('.text12').text(langReplace(localLang.demoModule.text12));
+    $('.text13').text(langReplace(localLang.demoModule.text13));
+    $('.text14').text(langReplace(localLang.demoModule.text14));
+    $('.text17').text(langReplace(localLang.demoModule.text17));
+    $('.text18').text(langReplace(localLang.demoModule.text18));
+    $('.text19').text(langReplace(localLang.demoModule.text19));
+    $('.priorityWinners').text(langReplace(localLang.demoModule.priorityWinners));
+    if (browser.ios) {
+        $('.null').text(langReplace(localLang.demoModule.text15));
+    } else {
+
+        $('.null').text(langReplace(localLang.demoModule.text16));
+    }
+}
+console.log(unitProcessingAr(7000000, 1));
+// 配置接口
+function getConfig() {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/activity/h5/dayConsume',
+        data: { uid: pubInfo.uid },
+        success(res) {
+            if (res.code === 200) {
+                // 分区规则
+                $('.rule .rule_in .box').html(res.data.partitionId == 2 ? langReplace(localLang.demoModule.arRule) : langReplace(localLang.demoModule.enRule));
+                // 处理是否代理人
+                res.data.rechargeUser ? $('.myBox').hide() : $('.myBox').show();
+                // 处理等级不足不显示榜单
+                res.data.wealth <= 7 ? $('.priorityWinners,.priorityWinnersBox').hide() : $('.priorityWinners,.priorityWinnersBox').show()
+                // 处理倒计时
+                countup(res.data.endTime - res.timestamp);
+                // 处理顶部进度以及个人信息
+                $('.myBox .tx').attr('src', res.data.avatar);
+                $('.myBox .name').text(res.data.nick);
+                $('.myBox .tetxBox .r b').text(res.data.goldNum);
+                console.log(res.data.goldNum < 700000);
+                if (res.data.goldNum < 700000) {
+                    $('.myBox .tetxBox .r strong').text(700000);
+                    $('.myBox .lineBox .box1 span b').text('70K');
+                    $('.myBox .lineBox .box1').css('left', `${(70000 / 700000) * 100}%`);
+                    $('.myBox .lineBox .box2 span b').text('350K');
+                    $('.myBox .lineBox .box2').css('left', `${(350000 / 700000) * 100}%`);
+                    $('.myBox .lineBox .box3 span b').text('700K');
+                    $('.myBox .lineBox .box3').css('right', `0%`);
+                    $('.myBox .lineBox .line').css('width', `${((res.data.goldNum / 700000) * 100) > 100 ? 100 : (res.data.goldNum / 700000) * 100}%`);
+                    if (res.data.goldNum >= 70000) { $('.myBox .lineBox .box1').addClass('act') }
+                    if (res.data.goldNum >= 350000) { $('.myBox .lineBox .box2').addClass('act') }
+                    if (res.data.goldNum >= 700000) { $('.myBox .lineBox .box3').addClass('act') }
+                } else {
+                    $('.myBox .tetxBox .r strong').text(7000000);
+                    $('.myBox .lineBox .box1 span b').text('210K');
+                    $('.myBox .lineBox .box1').css('left', `${(70000 / 7000000) * 100}%`);
+                    $('.myBox .lineBox .box2 span b').text('3500K');
+                    $('.myBox .lineBox .box2').css('left', `${(3500000 / 7000000) * 100}%`);
+                    $('.myBox .lineBox .box3 span b').text('7M');
+                    $('.myBox .lineBox .box3').css('right', `0`);
+                    $('.myBox .lineBox .line').css('width', `${((res.data.goldNum / 7000000) * 100) > 100 ? 100 : (res.data.goldNum / 7000000) * 100}%`);
+                    if (res.data.goldNum >= 210000) { $('.myBox .lineBox .box1').addClass('act') }
+                    if (res.data.goldNum >= 3500000) { $('.myBox .lineBox .box2').addClass('act') }
+                    if (res.data.goldNum >= 7000000) { $('.myBox .lineBox .box3').addClass('act') }
+                }
+                // 处理每个档位的用户前四名
+                res.data.activityLevelUserVo.forEach((res, i) => {
+                    var str = '';
+                    if ((res.level) <= 3) {
+                        $(`.content1 .level${res.level} .priorityWinnersBox div`).remove();
+                    } else {
+                        $(`.content2 .level${res.level} .priorityWinnersBox div`).remove();
+                    }
+                    if (res.userVos.length > 0) {
+                        res.userVos.forEach(val => {
+                            str += `
+                                <div>
+                                    <img src="${val.avatar}" alt="">
+                                    <span>${val.name}</span>
+                                </div>
+                        `
+                        })
+                    } else {
+                        str += `
+                                <div>
+                                    <img src="./images/null.png" alt="">
+                                    <span>${localLang.demoModule.waiting}</span>
+                                </div>
+                        `
+                    }
+                    if ((res.level) <= 3) {
+                        $(`.content1 .level${res.level} .priorityWinnersBox`).append(str);
+                    } else {
+                        $(`.content2 .level${res.level} .priorityWinnersBox`).append(str);
+                    }
+                })
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 倒計時
+function countup(leftTime) {
+    clearTimeout(countupTime)
+    //獲取當前時間
+    // var now = nowTime;
+    var d = 0;
+    var h = 0;
+    var m = 0;
+    var s = 0;
+    //定義變數 d,h,m,s保存倒計時的時間
+    var d, h, m, s;
+    //遞歸每秒調⽤countTime⽅法，顯⽰動態時間效果 
+    if (leftTime > 0) {
+        d = getzf(Math.floor(leftTime / 1000 / 60 / 60 / 24));
+        h = getzf(Math.floor(leftTime / 1000 / 60 / 60 % 24));
+        m = getzf(Math.floor(leftTime / 1000 / 60 % 60));
+        s = getzf(Math.floor(leftTime / 1000 % 60));
+        //將倒計時賦值到div中
+        $('.header .timeBox .hour b').text(h);
+        $('.header .timeBox .min b').text(m);
+        $('.header .timeBox .sec b').text(s);
+    } else {
+        getConfig();
+    }
+    if (leftTime > 0) {
+        leftTime = leftTime - 1000;
+    }
+    countupTime = setTimeout(function () {
+        countup(leftTime);
+    }, 1000);
+}
+//补0操作  
+function getzf(num) {
+    if (parseInt(num) < 10) {
+        num = '0' + num;
+    }
+    return num;
+}
+// tab切换
+$('.tab div').click(function () {
+    var i = $(this).index() + 1;
+    $('.content1,.content2').hide();
+    $(`.content${i}`).show();
+    $(this).addClass(`${i == 2 ? 'act2' : 'act'}`).siblings().removeClass('act').removeClass('act2')
+})
+// 打开mp4弹窗
+$('.content2 .contentBox1 .box .zjIcon').click(function () {
+    var video = document.getElementById('zjVideo');
+    video.play();
+    bodyScroolFun(true);
+    $('.video').show();
+})
+$('.content2 .contentBox1 .box .xzIcon').click(function () {
+    var video = document.getElementById('zjVideo2');
+    video.play();
+    bodyScroolFun(true);
+    $('.video2').show();
+})
+$('.content2 .contentBox2 .box .xzIcon').click(function () {
+    var video = document.getElementById('zjVideo3');
+    video.play();
+    bodyScroolFun(true);
+    $('.video3').show();
+})
+// 关闭mp4弹窗
+$('.video .close,.video2 .close,.video3 .close').click(function () {
+    var video = document.getElementById('zjVideo');
+    var video2 = document.getElementById('zjVideo2');
+    var video3 = document.getElementById('zjVideo3');
+    video.pause();
+    video2.pause();
+    video3.pause();
+    bodyScroolFun(false);
+    $('.video,.video2,.video3').hide();
+})
+// 监听播放完毕事件
+var video = document.getElementById('zjVideo');
+video.addEventListener('ended', function () {
+    video.pause();
+    bodyScroolFun(false);
+    $('.video').hide();
+});
+// 监听播放完毕事件
+var video2 = document.getElementById('zjVideo2');
+video.addEventListener('ended', function () {
+    video2.pause();
+    bodyScroolFun(false);
+    $('.video2').hide();
+});
+// 监听播放完毕事件
+var video3 = document.getElementById('zjVideo3');
+video.addEventListener('ended', function () {
+    video3.pause();
+    bodyScroolFun(false);
+    $('.video3').hide();
+});
+
+// 打开规则
+$('.header .rule_icon').click(function () {
+    $('.rule').show();
+    bodyScroolFun(true);
+})
+// 关闭规则
+$('.rule .rule_in .close').click(function () {
+    $('.rule').hide();
+    bodyScroolFun(false);
+})

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

@@ -0,0 +1,59 @@
+// 阿拉伯
+langAr = {
+    // 模块
+    demoModule: {
+        layerIndex1: `جاري التحميل...`,
+        layerIndex2: `نجاح`,
+        layerIndex3: `خطأ في الشبكة`,
+        text1: `الاستهلاك اليومي`,
+        text2: `القواعد`,
+        text3: `ساعة`,
+        text4: `دقيقة`,
+        text5: `ثانية`,
+        text6: `استهلاك العملات`,
+        text7: `استهلاك 70K-700K`,
+        text8: `استهلاك 210K-7M`,
+        text9: `استهلاك 700K`,
+        text10: `استهلاك 350K`,
+        text11: `استهلاك 70K`,
+        text12: `استهلاك 7M`,
+        text13: `استهلاك 3500K`,
+        text14: `استهلاك 210K`,
+        text15: `هذا الحدث لا علاقة له بـ Apple`,
+        text16: `هذا الحدث لا علاقة له بـ Google`,
+        priorityWinners: `الفائزون ذوو الأولوية`,
+        enRule: `
+        <p>
+        1. وقت النشاط: يوميًا من 00:00 إلى 23:59 (GMT+3).<br>
+        2. يتم حساب إنفاقك اليومي على المنصة، إرسال 1 هدية بعملة = 1 قيمة العملة؛ 1 هدية الحظ بعملة = 0.05 قيمة العملة.<br>
+        3. عند وصولك إلى المستوى المناسب، ستحصل على مكافأة المستوى المناسب.<br>
+        </p>
+        <p>
+            القيود:<br>
+            1. وكلاء الشحن لا يشاركون في هذا النشاط.<br>
+            2. لا يتم احتساب مدخلات اللعبة كاستهلاك للعملات المعدنية.<br>
+        </p>
+        <p>
+            ملاحظة:<br>
+            1. هذا النشاط ليس له علاقة بـ Google و Apple.
+        </p>
+        `,
+        arRule: `
+        <p>
+        1. وقت النشاط: يوميًا من 00:00 إلى 23:59 (GMT+3).<br>
+        2. يتم حساب إنفاقك اليومي على المنصة، إرسال 1 هدية بعملة = 1 قيمة العملة؛ 1 هدية الحظ بعملة = 0.05 قيمة العملة.<br>
+        3. عند وصولك إلى المستوى المناسب، ستحصل على مكافأة المستوى المناسب.<br>
+    </p>
+    <p>
+        القيود:<br>
+        1. وكلاء الشحن لا يشاركون في هذا النشاط.<br>
+        2. لا يتم احتساب مدخلات اللعبة كاستهلاك للعملات المعدنية.<br>
+    </p>
+    <p>
+        ملاحظة:<br>
+        1. هذا النشاط ليس له علاقة بـ Google و Apple.
+    </p>
+        `,
+        waiting: `ي انتظار`,
+    }
+}

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

@@ -0,0 +1,58 @@
+langEn = {
+    demoModule: {
+        layerIndex1: `Loading...`,
+        layerIndex2: `Success`,
+        layerIndex3: `Network error`,
+        text1: `Daily Consumption`,
+        text2: `Rules`,
+        text3: `Hour`,
+        text4: `Min`,
+        text5: `Sec`,
+        text6: `Consume coins`,
+        text7: `Consume 70K-700K`,
+        text8: `Consume 210K-7M`,
+        text9: `Consume 700K`,
+        text10: `Consume 350K`,
+        text11: `Consume 70K`,
+        text12: `Consume 7M`,
+        text13: `Consume 3500K`,
+        text14: `Consume 210K`,
+        text15: `This event has nothing to do with Apple`,
+        text16: `This event has nothing to do with Google`,
+        priorityWinners: `Priority Winners`,
+        enRule: `
+            <p>
+                1. Activity time: daily 0:00-23:59 (GMT+8).<br>
+                2. Daily calculation of your spending in the platform, send 1 coin gift = 1 coin value; 1 coin lucky
+                gift = 0.02 coin value.<br>
+                3. When you reach the corresponding level, you will get the corresponding level reward.<br>
+                </p>
+                <p>
+                    Restrictions:<br>
+                    1. Recharge agent do not participate in this activity.<br>
+                    2. The input of game is not counted as consumption of coins.<br>
+                </p>
+                <p>
+                    Attention:<br>
+                    1. This activity has nothing to do with Google and Apple.
+                </p>
+        `,
+        arRule: `
+        <p>
+            1. Activity time: daily 0:00-23:59 (GMT+3).<br>
+            2. Daily calculation of your spending on the platform, send 1 coin gift = 1 coin value; 1 coin lucky gift = 0.05 coin value.<br>
+            3. When you reach the corresponding level, you will get the corresponding level reward.<br>
+        </p>
+        <p>
+            Restrictions:<br>
+            1. Recharge agents do not participate in this activity.<br>
+            2. Game input is not counted as coin consumption.<br>
+        </p>
+        <p>
+            Attention:<br>
+            1. This activity has nothing to do with Google and Apple.
+        </p>
+        `,
+        waiting: `Waiting`,
+    }
+}

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

@@ -0,0 +1,59 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        layerIndex1: `加载中...`,
+        layerIndex2: `成功`,
+        layerIndex3: `网络错误`,
+        text1: `每日消費`,
+        text2: `規則`,
+        text3: `小時`,
+        text4: `分`,
+        text5: `秒`,
+        text6: `消耗金幣`,
+        text7: `消耗 70K-700K`,
+        text8: `消耗 210K-700萬`,
+        text9: `消耗 700K`,
+        text10: `消耗 350K`,
+        text11: `消耗 70K`,
+        text12: `消耗 700萬`,
+        text13: `消耗 3500K`,
+        text14: `消耗 210K`,
+        text15: `此活動與 Apple 無關`,
+        text16: `此活動與 Google 無關`,
+        priorityWinners: `優先獲勝者`,
+        enRule: `
+        <p>
+        1. 活動時間：每日 0:00-23:59（GMT+8）。<br>
+        2. 每日計算您在平台上的消費，送 1 枚金幣禮物 = 1 枚金幣價值；1 枚金幣幸運禮物 = 0.02 枚金幣價值。<br>
+        3. 當您達到相應級別時，您將獲得相應級別的獎勵。<br>
+        </p>
+        <p>
+            限制：<br>
+            1. 充值代理不參加此活動。<br>
+            2. 遊戲的投入不計為金幣消費。<br>
+        </p>
+        <p>
+            注意：<br>
+            1. 此活動與 Google 和 Apple 無關。
+        </p>
+        `,
+        arRule: `
+        <p>
+        1. 活動時間：每日 0:00-23:59（GMT+3）。<br>
+        2. 每日計算您在平台上的消費，送 1 枚金幣禮物 = 1 枚金幣價值；1 枚金幣幸運禮物 = 0.05 枚金幣價值。<br>
+        3. 當您達到相應級別時，您將獲得相應級別的獎勵。<br>
+    </p>
+    <p>
+        限制：<br>
+        1. 充值代理不參加此活動。<br>
+        2. 遊戲的投入不計為金幣消費。<br>
+    </p>
+    <p>
+        注意：<br>
+        1. 此活動與 Google 和 Apple 無關。
+    </p>
+        `,
+        waiting: `等待中`,
+    }
+}

view/molistar/modules/guild-ar/BANK.html

@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Bank</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="">Bank</b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <input type="text" disabled placeholder="Currency Type:USD">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <p class="p "><span>*</span> <b class="p1"></b></p>
+    <div class="box country">
+        <input type="text" readonly placeholder="Country" class="text5">
+        <img src="./images/right.png" alt="" class="right">
+    </div>
+    <p class="p "><span>*</span> <b class="p2"></b></p>
+    <div class="box payeeAccountNo">
+        <input type="text" placeholder="payeeAccountNo" class="text6">
+    </div>
+    <p class="p "><span>*</span> <b class="p3"></b></p>
+    <div class="box bankName">
+        <input type="text" placeholder="Bank Name" class="text7"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <p class="p "><span>*</span> <b class="p4"></b></p>
+    <div class="box sWIFTCode">
+        <input type="text" placeholder="SWIFT Code" class="text8"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <p class="p 5"><span>*</span> <b class="p5"></b></p>
+    <div class="box payeeName">
+        <input type="text" placeholder="payeeName" class="text9"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <p class="p "><span>*</span> <b class="p6"></b></p>
+    <div class="box Address">
+        <input type="text" placeholder="Address" class="text10"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok text1"></div>
+        <!-- 解绑按钮 -->
+        <div class="determine text2"></div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title text3"></div>
+            <div class="soure text4"></div>
+            <div class="countryPub"></div>
+        </div>
+    </div>
+    <div class="null"></div>
+</body>
+<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/BANK.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>

view/molistar/modules/guild-ar/PAYONNER.html

@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1"></title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="text1"></b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <input type="text" disabled placeholder="Currency Type:USD" class="text6">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <p class="p "><span>*</span> <b class="p1"></b></p>
+    <div class="box country">
+        <input type="text" readonly placeholder="Country" class="text7">
+        <img src="./images/right.png" alt="" class="right">
+    </div>
+    <p class="p "><span>*</span> <b class="p7"></b></p>
+    <div class="box payeeAccountNo">
+        <input type="text" placeholder="payeeAccountNo" class="text8">
+    </div>
+    <p class="p 5"><span>*</span> <b class="p5"></b></p>
+    <div class="box payeeName">
+        <input type="text" placeholder="payeeName" class="text9"
+            onkeyup="this.value=this.value.replace(/[^a-zA-Z]/g,'')">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok text2"></div>
+        <!-- 解绑按钮 -->
+        <div class="determine text3"></div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title text4"></div>
+            <div class="soure text5"></div>
+            <div class="countryPub"></div>
+        </div>
+    </div>
+</body>
+<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/PAYONNER.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>

view/molistar/modules/guild-ar/USDT.html

@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>USDT</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="text2">USDT</b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <span></span>
+        <input type="text" disabled placeholder="Currency Type:USD">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <div class="box country">
+        <span>*</span>
+        <input type="text" readonly placeholder="Country">
+        <img src="./images/right.png" alt="" class="right">
+    </div>
+    <div class="box payeeAccountNo">
+        <span>*</span>
+        <input type="text" placeholder="payeeAccountNo">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok">Confirm</div>
+        <!-- 解绑按钮 -->
+        <div class="determine">Determine</div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title">Country</div>
+            <div class="soure">OK</div>
+            <div class="countryPub">asdasdasd</div>
+        </div>
+    </div>
+</body>
+<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/USDT.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>

view/molistar/modules/guild-ar/VODAFONE.html

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="">Vodafone</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/BANK.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="">Vodafone</b>
+    </div>
+    <!-- 账户信息 -->
+    <div class="box currencyType">
+        <input type="text" disabled placeholder="Currency Type:USD">
+        <!-- <img src="./images/right.png" alt="" class="right"> -->
+    </div>
+    <p class="p "><span>*</span> <b class="p1"></b></p>
+    <div class="box country">
+        <input type="text" readonly placeholder="Country" class="text7">
+        <img src="./images/right.png" alt="" class="right" >
+    </div>
+    <p class="p "><span>*</span> <b class="p2"></b></p>
+    <div class="box payeeAccountNo">
+        <input type="text" placeholder="payeeAccountNo" class="text8">
+    </div>
+    <!-- 按钮 -->
+    <div class="but">
+        <!-- 确认按钮 -->
+        <div class="ok text2">Confirm</div>
+        <!-- 解绑按钮 -->
+        <div class="determine text3">Determine</div>
+    </div>
+    <!-- 选择弹窗 -->
+    <div class="pub">
+        <div class="pub_in">
+            <div class="title text4">Country</div>
+            <div class="soure text5">OK</div>
+            <div class="countryPub"></div>
+        </div>
+    </div>
+</body>
+<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/VODAFONE.js"></script>
+<script src="../../common/local/langHandler.js"></script>
+
+</html>

view/molistar/modules/guild-ar/css/BANK.css

@@ -0,0 +1,232 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  background: #fff;
+  box-sizing: border-box;
+}
+
+.back {
+  width: 100%;
+  height: 2.66667rem;
+  line-height: 3.46667rem;
+  position: fixed;
+  left: 0;
+  top: 0rem;
+  text-align: center;
+  color: #333333;
+  font-size: 0.50667rem;
+  font-weight: bold;
+  z-index: 10;
+  background: #fff;
+}
+
+.back img {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 54%;
+}
+
+.box {
+  width: 9.2rem;
+  height: 1.49333rem;
+  border-radius: 0.21333rem;
+  background: #F2F3F7;
+  margin: 0 auto 0.32rem;
+  position: relative;
+  box-sizing: border-box;
+  padding: 0 0.26667rem;
+}
+
+.box span {
+  color: #ED4343;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  height: 100%;
+  line-height: 1.49333rem;
+  display: block;
+  float: left;
+  margin: 0 0.26667rem;
+}
+
+.box input {
+  display: block;
+  float: left;
+  width: 7rem;
+  height: 100%;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  outline: none;
+  border: 0;
+  background: none;
+  font-weight: bold;
+}
+
+.box input::placeholder {
+  color: #7B7B7D;
+  font-weight: 400;
+}
+
+.box .right {
+  display: block;
+  width: 0.56rem;
+  height: 0.56rem;
+  float: right;
+  margin: 0.48rem 0.26667rem 0;
+}
+
+.p {
+  width: 9.2rem;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  margin: 0 auto 0.21333rem;
+}
+
+.p span {
+  color: #ED4343;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  height: 100%;
+  display: block;
+  float: left;
+  margin: 0 0.10667rem;
+}
+
+.p b {
+  font-size: 0.37333rem;
+  color: #313131;
+  font-weight: 500;
+}
+
+.currencyType {
+  margin-top: 3.1rem;
+}
+
+.but {
+  width: 9.2rem;
+  display: flex;
+  justify-content: center;
+  margin: 0 auto 0.45333rem;
+}
+
+.but .ok {
+  width: 4.45333rem;
+  height: 1.22667rem;
+  border-radius: 1.22667rem;
+  line-height: 1.22667rem;
+  color: #FFFFFF;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  text-align: center;
+  background: #04D5C6;
+  margin: 0 0.14667rem;
+}
+
+.but .determine {
+  width: 4.45333rem;
+  height: 1.22667rem;
+  border-radius: 1.22667rem;
+  line-height: 1.22667rem;
+  color: #FFFFFF;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  text-align: center;
+  background: #FF6A6A;
+  margin: 0 0.14667rem;
+}
+
+.pub {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 999;
+  display: none;
+}
+
+.pub .pub_in {
+  width: 10rem;
+  height: auto;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0;
+  background: #fff;
+  border-radius: 0.42667rem 0.42667rem 0 0;
+  box-sizing: border-box;
+  padding-top: 1.49333rem;
+  padding-bottom: 0.26667rem;
+}
+
+.pub .pub_in .title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  color: #313131;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  top: 0.32rem;
+  height: 0.58667rem;
+  line-height: 0.58667rem;
+}
+
+.pub .pub_in .soure {
+  z-index: 2;
+  color: #04D5C6;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  position: absolute;
+  right: 0.42667rem;
+  top: 0.37333rem;
+}
+
+.pub .pub_in .countryPub {
+  width: 100%;
+  height: 0.85333rem;
+  line-height: 0.85333rem;
+  text-align: center;
+  color: #7B7B7D;
+  font-size: 0.4rem;
+  font-weight: 400;
+}
+
+.pub .pub_in .act {
+  background: #F4F4F4;
+  color: #313131;
+}
+
+.arabic .back img {
+  right: 0.2rem;
+  left: unset;
+  transform: rotate(180deg);
+}
+
+.arabic .box span {
+  float: right;
+}
+
+.arabic .box input {
+  float: right;
+}
+
+.arabic .box .right {
+  float: left;
+  transform: rotate(180deg);
+}
+
+.arabic .pub .pub_in .soure {
+  right: auto;
+  left: 0.42667rem;
+}
+
+.arabic .p span {
+  float: right;
+}
+
+.null {
+  height: 6rem;
+}

view/molistar/modules/guild-ar/css/BANK.scss

@@ -0,0 +1,244 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    background: #fff;
+    box-sizing: border-box;
+}
+
+.back {
+    width: 100%;
+    height: px2rem(200);
+    line-height: px2rem(260);
+    position: fixed;
+    left: 0;
+    top: px2rem(0);
+    text-align: center;
+    color: #333333;
+    font-size: px2rem(38);
+    font-weight: bold;
+    z-index: 10;
+    background: #fff;
+
+    img {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: 54%;
+    }
+}
+
+.box {
+    width: px2rem(690);
+    height: px2rem(112);
+    border-radius: px2rem(16);
+    background: #F2F3F7;
+    margin: 0 auto px2rem(24);
+    position: relative;
+    box-sizing: border-box;
+    padding: 0 px2rem(20);
+
+    span {
+        color: #ED4343;
+        font-size: px2rem(28);
+        font-weight: 600;
+        height: 100%;
+        line-height: px2rem(112);
+        display: block;
+        float: left;
+        margin: 0 px2rem(20);
+    }
+
+    input {
+        display: block;
+        float: left;
+        width: 7rem;
+        height: 100%;
+        font-size: px2rem(28);
+        font-weight: 400;
+        outline: none;
+        border: 0;
+        background: none;
+        font-weight: bold;
+
+        &::placeholder {
+            color: #7B7B7D;
+            font-weight: 400;
+        }
+    }
+
+    .right {
+        display: block;
+        width: px2rem(42);
+        height: px2rem(42);
+        float: right;
+        margin: px2rem(36) px2rem(20) 0;
+    }
+}
+
+.p {
+    width: px2rem(690);
+    height: px2rem(40);
+    line-height: px2rem(40);
+    margin: 0 auto px2rem(16);
+
+    span {
+        color: #ED4343;
+        font-size: px2rem(28);
+        font-weight: 600;
+        height: 100%;
+        display: block;
+        float: left;
+        margin: 0 px2rem(8);
+    }
+
+    b {
+        font-size: px2rem(28);
+        color: #313131;
+        font-weight: 500;
+
+    }
+}
+
+.currencyType {
+    margin-top: 3.1rem;
+}
+
+.but {
+    width: px2rem(690);
+    display: flex;
+    justify-content: center;
+    margin: 0 auto px2rem(34);
+
+    .ok {
+        width: px2rem(334);
+        height: px2rem(92);
+        border-radius: px2rem(92);
+        line-height: px2rem(92);
+        color: #FFFFFF;
+        font-size: px2rem(32);
+        font-weight: 500;
+        text-align: center;
+        background: #04D5C6;
+        margin: 0 px2rem(11);
+    }
+
+    .determine {
+        width: px2rem(334);
+        height: px2rem(92);
+        border-radius: px2rem(92);
+        line-height: px2rem(92);
+        color: #FFFFFF;
+        font-size: px2rem(32);
+        font-weight: 500;
+        text-align: center;
+        background: #FF6A6A;
+        margin: 0 px2rem(11);
+    }
+}
+
+.pub {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0, 0, 0, .5);
+    z-index: 999;
+    display: none;
+
+    .pub_in {
+        width: px2rem(750);
+        height: auto;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        bottom: 0;
+        background: #fff;
+        border-radius: px2rem(32) px2rem(32) 0 0;
+        box-sizing: border-box;
+        padding-top: px2rem(112);
+        padding-bottom: px2rem(20);
+
+        .title {
+            position: absolute;
+            left: 50%;
+            transform: translateX(-50%);
+            color: #313131;
+            font-size: px2rem(32);
+            font-weight: 500;
+            top: px2rem(24);
+            height: px2rem(44);
+            line-height: px2rem(44);
+        }
+
+        .soure {
+            z-index: 2;
+            color: #04D5C6;
+            font-size: px2rem(32);
+            font-weight: 500;
+            position: absolute;
+            right: px2rem(32);
+            top: px2rem(28);
+        }
+
+        .countryPub {
+            width: 100%;
+            height: px2rem(64);
+            line-height: px2rem(64);
+            text-align: center;
+            color: #7B7B7D;
+            font-size: px2rem(30);
+            font-weight: 400;
+        }
+
+        .act {
+            background: #F4F4F4;
+            color: #313131;
+        }
+    }
+}
+
+
+.arabic {
+    .back img {
+        right: px2rem(15);
+        left: unset;
+        transform: rotate(180deg);
+    }
+
+    .box {
+        span {
+            float: right;
+        }
+
+        input {
+            float: right;
+        }
+
+        .right {
+            float: left;
+            transform: rotate(180deg);
+        }
+    }
+
+    .pub .pub_in .soure {
+        right: auto;
+        left: px2rem(32);
+    }
+
+    .p {
+        span {
+            float: right;
+        }
+    }
+}
+
+.null {
+    height: 6rem;
+}

view/molistar/modules/guild-ar/css/bill.css

@@ -118,6 +118,43 @@ ul li div span {
   margin-top: 0.26667rem;
 }
 
+ul .actLi {
+  height: 2.45333rem;
+  position: relative;
+  overflow: hidden;
+}
+
+ul .actLi p,
+ul .actLi b {
+  margin-top: 0.66667rem;
+}
+
+ul .actLi i {
+  font-style: normal;
+  position: absolute;
+  top: 0;
+  right: 0;
+  height: 0.50667rem;
+  line-height: 0.50667rem;
+  padding: 0 0.21333rem;
+  border-radius: 0px 0.26667rem 0px 0.26667rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.32rem;
+}
+
+ul .actLi .sp0 {
+  background: #FCAC3A;
+}
+
+ul .actLi .sp1 {
+  background: #04D5C6;
+}
+
+ul .actLi .sp2 {
+  background: #FF605A;
+}
+
 .arLang .nav .back {
   right: 0.4rem;
   left: unset;

view/molistar/modules/guild-ar/css/bill.scss

@@ -124,6 +124,43 @@ ul {
       // }
     }
   }
+
+  .actLi {
+    height: px2rem(92);
+    position: relative;
+    overflow: hidden;
+
+    p,
+    b {
+      margin-top: px2rem(25);
+    }
+
+    i {
+      font-style: normal;
+      position: absolute;
+      top: 0;
+      right: 0;
+      height: px2rem(19);
+      line-height: px2rem(19);
+      padding: 0 px2rem(8);
+      border-radius: 0px px2rem(10) 0px px2rem(10);
+      text-align: center;
+      color: #FFFFFF;
+      font-size: px2rem(12);
+    }
+
+    .sp0 {
+      background: #FCAC3A;
+    }
+
+    .sp1 {
+      background: #04D5C6;
+    }
+
+    .sp2 {
+      background: #FF605A;
+    }
+  }
 }
 
 .arLang {

view/molistar/modules/guild-ar/css/salary.css

@@ -193,6 +193,12 @@ html {
   width: 0.42667rem;
   height: 0.42667rem;
   margin-top: 0.05333rem;
+}
+
+.transfer_method li .wenhao,
+.transfer_dollars li .wenhao {
+  width: 0.58667rem;
+  height: 0.58667rem;
   display: inline-block;
 }
 
@@ -240,23 +246,234 @@ html {
 .transfer_method .agent_settlement .pop,
 .transfer_dollars .official_withdraw .pop,
 .transfer_dollars .agent_settlement .pop {
-  width: 4.8rem;
-  height: 1.12rem;
-  background: url(../images/pop.png) no-repeat;
-  background-size: 100% 100%;
+  min-width: 5.76rem;
   position: absolute;
-  top: -0.42667rem;
-  left: 3.52rem;
+  top: -0.4rem;
+  left: 2.9rem;
   font-size: 0.32rem;
   line-height: 0.42667rem;
   color: #ffffff;
-  padding: 0.10667rem 0.21333rem 0;
+  padding: 0.21333rem;
+  background: #04D5C6;
+  border-radius: 0.21333rem;
 }
 
 .transfer_dollars {
   margin-bottom: 2.13333rem;
 }
 
+.withdrawalAccount {
+  width: 9.2rem;
+  height: 1.49333rem;
+  line-height: 1.49333rem;
+  box-sizing: border-box;
+  background: #F2F3F7;
+  border-radius: 0.21333rem;
+  margin: 0.26667rem auto 0.26667rem;
+  padding: 0 0.53333rem;
+  display: none;
+}
+
+.withdrawalAccount .left {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 600;
+  float: left;
+}
+
+.withdrawalAccount .left b {
+  color: #ED4343;
+  margin-right: 0.10667rem;
+}
+
+.withdrawalAccount .right {
+  color: #7B7B7D;
+  font-size: 0.37333rem;
+  float: right;
+}
+
+.withdrawalAccount .right img {
+  display: inline-block;
+  width: 0.56rem;
+  height: 0.56rem;
+  margin-top: 0.48rem;
+}
+
+.selectAccount {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+
+.selectAccount .selectAccount_in {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0;
+  width: 10rem;
+  min-height: 6.10667rem;
+  background: #fff;
+  border-radius: 0.42667rem 0.42667rem 0rem 0rem;
+}
+
+.selectAccount .selectAccount_in .title {
+  width: 100%;
+  text-align: center;
+  color: #313131;
+  font-size: 0.42667rem;
+  margin-top: 0.34667rem;
+  margin-bottom: 0.34667rem;
+  font-weight: 600;
+}
+
+.selectAccount .selectAccount_in .accountBox {
+  margin: 0 auto;
+  width: 9.14667rem;
+}
+
+.selectAccount .selectAccount_in .accountBox .account {
+  width: 100%;
+  height: 1.06667rem;
+  line-height: 1.06667rem;
+  background: #F4F4F4;
+  border-radius: 0.21333rem;
+  margin-bottom: 0.42667rem;
+  box-sizing: border-box;
+  padding: 0 0.32rem;
+}
+
+.selectAccount .selectAccount_in .accountBox .account .sel {
+  width: 0.48rem;
+  height: 0.48rem;
+  margin-top: 0.29333rem;
+  margin-right: 0.13333rem;
+  display: block;
+  float: left;
+}
+
+.selectAccount .selectAccount_in .accountBox .account b,
+.selectAccount .selectAccount_in .accountBox .account span {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  float: left;
+}
+
+.selectAccount .selectAccount_in .accountBox .account .eid {
+  display: block;
+  float: right;
+  margin-top: 0.24rem;
+  width: 0.58667rem;
+  height: 0.58667rem;
+}
+
+.pubWithdrawal {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+}
+
+.pubWithdrawal .pubWithdrawal_in {
+  width: 9.14667rem;
+  min-height: 10.72rem;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  background: #fff;
+  border-radius: 0.42667rem;
+}
+
+.pubWithdrawal .pubWithdrawal_in .title {
+  width: 100%;
+  text-align: center;
+  color: #313131;
+  font-size: 0.45333rem;
+  font-weight: 500;
+  margin-top: 0.53333rem;
+  margin-bottom: 0.37333rem;
+}
+
+.pubWithdrawal .pubWithdrawal_in .boxw {
+  width: 8.08rem;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  margin: 0 auto 0.53333rem;
+  display: flex;
+  justify-content: space-between;
+  overflow: hidden;
+}
+
+.pubWithdrawal .pubWithdrawal_in .boxw .left {
+  color: #7B7B7D;
+  font-size: 0.37333rem;
+  font-weight: 500;
+}
+
+.pubWithdrawal .pubWithdrawal_in .boxw .left b,
+.pubWithdrawal .pubWithdrawal_in .boxw .left p {
+  color: #7B7B7D;
+  font-size: 0.37333rem;
+  font-weight: 500;
+}
+
+.pubWithdrawal .pubWithdrawal_in .boxw .right {
+  color: #313131;
+  font-size: 0.37333rem;
+  font-weight: 500;
+}
+
+.pubWithdrawal .pubWithdrawal_in .box3 {
+  height: auto;
+}
+
+.pubWithdrawal .pubWithdrawal_in .box3 b {
+  margin-bottom: 0.16rem;
+  display: block;
+}
+
+.pubWithdrawal .pubWithdrawal_in .text {
+  color: #7B7B7D;
+  font-size: 0.37333rem;
+  width: 8.08rem;
+  margin: 0 auto 0.45333rem;
+  font-weight: 400;
+}
+
+.pubWithdrawal .pubWithdrawal_in .ok {
+  width: 8.08rem;
+  height: 1.22667rem;
+  line-height: 1.22667rem;
+  border-radius: 1.22667rem;
+  background: #04D5C6;
+  margin: 0 auto 0.32rem;
+  color: #FFFFFF;
+  font-size: 0.42667rem;
+  text-align: center;
+}
+
+.pubWithdrawal .pubWithdrawal_in .close {
+  width: 8.08rem;
+  height: 1.22667rem;
+  line-height: 1.22667rem;
+  border-radius: 1.22667rem;
+  background: #F2F3F7;
+  margin: 0 auto 0;
+  color: #7B7B7D;
+  font-size: 0.42667rem;
+  text-align: center;
+}
+
 .confirm {
   width: 9.17333rem;
   height: 1.06667rem;
@@ -576,6 +793,61 @@ html {
   color: #7b7b7d;
 }
 
+.success {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: none;
+}
+
+.success .success_in {
+  width: 9.14667rem;
+  min-height: 4.64rem;
+  background: #fff;
+  border-radius: 0.42667rem;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.success .success_in .title {
+  width: 100%;
+  text-align: center;
+  color: #313131;
+  font-size: 0.45333rem;
+  height: 0.64rem;
+  margin-top: 0.4rem;
+  margin-bottom: 0.37333rem;
+  font-weight: 500;
+}
+
+.success .success_in p {
+  width: 8.08rem;
+  margin: 0 auto 0.37333rem;
+  color: #7B7B7D;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  line-height: 0.53333rem;
+}
+
+.success .success_in .but {
+  width: 8.08rem;
+  height: 1.22667rem;
+  line-height: 1.22667rem;
+  text-align: center;
+  color: #fff;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  margin: 0 auto;
+  background: #04D5C6;
+  border-radius: 0.66667rem;
+}
+
 .arabic .nav .back {
   right: 0.4rem;
   left: unset;
@@ -584,7 +856,8 @@ html {
 
 .arabic .transfer_method .official_withdraw .pop {
   left: unset;
-  right: 3.52rem;
+  right: 3.2rem;
+  top: -0.8rem;
 }
 
 .arabic .my_salary p img {
@@ -601,9 +874,16 @@ html {
   padding-left: unset;
 }
 
-.arabic .transfer_method .official_withdraw .pop, .arabic .transfer_method .agent_settlement .pop, .arabic .transfer_dollars .official_withdraw .pop, .arabic .transfer_dollars .agent_settlement .pop {
-  background: url(../images/pop-ar.png) no-repeat;
-  background-size: 100% 100%;
-  left: auto;
-  right: 3.52rem;
+.arabic .pubWithdrawal .pubWithdrawal_in {
+  height: 11.6rem;
+}
+
+.arabic .pubWithdrawal .pubWithdrawal_in .boxw .right {
+  float: left;
+  white-space: nowrap;
+}
+
+.english .transfer_method .official_withdraw .pop {
+  top: -0.8rem;
+  left: 2.9rem;
 }

view/molistar/modules/guild-ar/css/salary.scss

@@ -1,5 +1,5 @@
-@function px2rem($px, $rem: 37.5) {
-  @return $px / $rem +rem;
+@function px2rem($px) {
+  @return $px / 37.5+rem;
 }
 
 body,
@@ -189,6 +189,11 @@ html {
       width: px2rem(16);
       height: px2rem(16);
       margin-top: px2rem(2);
+    }
+
+    .wenhao {
+      width: px2rem(22);
+      height: px2rem(22);
       display: inline-block;
     }
 
@@ -228,17 +233,19 @@ html {
     // display: none;
 
     .pop {
-      width: px2rem(180);
-      height: px2rem(42);
-      background: url(../images/pop.png) no-repeat;
-      background-size: 100% 100%;
+      min-width: px2rem(216);
+      // height: px2rem(42);
+      // background: url(../images/pop.png) no-repeat;
+      // background-size: 100% 100%;
       position: absolute;
-      top: px2rem(-16);
-      left: px2rem(132);
+      top: -0.4rem;
+      left: 2.9rem;
       font-size: px2rem(12);
       line-height: px2rem(16);
       color: #ffffff;
-      padding: px2rem(4) px2rem(8) 0;
+      padding: px2rem(8);
+      background: #04D5C6;
+      border-radius: px2rem(8);
     }
   }
 }
@@ -247,6 +254,221 @@ html {
   margin-bottom: px2rem(80);
 }
 
+.withdrawalAccount {
+  width: px2rem(345);
+  height: px2rem(56);
+  line-height: px2rem(56);
+  box-sizing: border-box;
+  background: #F2F3F7;
+  border-radius: px2rem(8);
+  margin: px2rem(10) auto px2rem(10);
+  padding: 0 px2rem(20);
+  display: none;
+
+  .left {
+    color: #313131;
+    font-size: px2rem(14);
+    font-weight: 600;
+    float: left;
+
+    b {
+      color: #ED4343;
+      margin-right: px2rem(4);
+    }
+  }
+
+  .right {
+    color: #7B7B7D;
+    font-size: px2rem(14);
+    float: right;
+
+    img {
+      display: inline-block;
+      width: px2rem(21);
+      height: px2rem(21);
+      margin-top: px2rem(18);
+    }
+  }
+}
+
+.selectAccount {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+
+  .selectAccount_in {
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 0;
+    width: px2rem(375);
+    min-height: px2rem(229);
+    background: #fff;
+    border-radius: px2rem(16) px2rem(16) px2rem(0) px2rem(0);
+
+    .title {
+      width: 100%;
+      text-align: center;
+      color: #313131;
+      font-size: px2rem(16);
+      margin-top: px2rem(13);
+      margin-bottom: px2rem(13);
+      font-weight: 600;
+    }
+
+    .accountBox {
+      margin: 0 auto;
+      width: px2rem(343);
+
+      .account {
+        width: 100%;
+        height: px2rem(40);
+        line-height: px2rem(40);
+        background: #F4F4F4;
+        border-radius: px2rem(8);
+        margin-bottom: px2rem(16);
+        box-sizing: border-box;
+        padding: 0 px2rem(12);
+
+        .sel {
+          width: px2rem(18);
+          height: px2rem(18);
+          margin-top: px2rem(11);
+          margin-right: px2rem(5);
+          display: block;
+          float: left;
+        }
+
+        b,
+        span {
+          color: #313131;
+          font-size: px2rem(14);
+          font-weight: 400;
+          float: left;
+        }
+
+        .eid {
+          display: block;
+          float: right;
+          margin-top: px2rem(9);
+          width: px2rem(22);
+          height: px2rem(22);
+        }
+      }
+    }
+  }
+}
+
+.pubWithdrawal {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: none;
+
+  // display: none;
+  .pubWithdrawal_in {
+    width: px2rem(343);
+    min-height: px2rem(402);
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    background: #fff;
+    border-radius: px2rem(16);
+
+    .title {
+      width: 100%;
+      text-align: center;
+      color: #313131;
+      font-size: px2rem(17);
+      font-weight: 500;
+      margin-top: px2rem(20);
+      margin-bottom: px2rem(14);
+    }
+
+    .boxw {
+      width: px2rem(303);
+      height: px2rem(20);
+      line-height: px2rem(20);
+      margin: 0 auto px2rem(20);
+      display: flex;
+      justify-content: space-between;
+      overflow: hidden;
+
+      .left {
+        color: #7B7B7D;
+        font-size: px2rem(14);
+        font-weight: 500;
+
+        b,
+        p {
+          color: #7B7B7D;
+          font-size: px2rem(14);
+          font-weight: 500;
+        }
+      }
+
+      .right {
+        color: #313131;
+        font-size: px2rem(14);
+        font-weight: 500;
+      }
+    }
+
+    .box3 {
+      height: auto;
+
+      b {
+        margin-bottom: px2rem(6);
+        display: block;
+      }
+    }
+
+    .text {
+      color: #7B7B7D;
+      font-size: px2rem(14);
+      width: px2rem(303);
+      margin: 0 auto px2rem(17);
+      font-weight: 400;
+    }
+
+    .ok {
+      width: px2rem(303);
+      height: px2rem(46);
+      line-height: px2rem(46);
+      border-radius: px2rem(46);
+      background: #04D5C6;
+      margin: 0 auto px2rem(12);
+      color: #FFFFFF;
+      font-size: px2rem(16);
+      text-align: center;
+    }
+
+    .close {
+      width: px2rem(303);
+      height: px2rem(46);
+      line-height: px2rem(46);
+      border-radius: px2rem(46);
+      background: #F2F3F7;
+      margin: 0 auto 0;
+      color: #7B7B7D;
+      font-size: px2rem(16);
+      text-align: center;
+
+    }
+  }
+
+}
+
 .confirm {
   width: px2rem(344);
   height: px2rem(40);
@@ -410,6 +632,7 @@ html {
       }
     }
   }
+
   // .agent_pop_in{
   //   width: px2rem(580);
   //   height: px2rem(988);
@@ -527,6 +750,61 @@ html {
   }
 }
 
+.success {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 9999;
+  display: none;
+
+  .success_in {
+    width: px2rem(343);
+    min-height: px2rem(174);
+    background: #fff;
+    border-radius: px2rem(16);
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+
+    .title {
+      width: 100%;
+      text-align: center;
+      color: #313131;
+      font-size: px2rem(17);
+      height: px2rem(24);
+      margin-top: px2rem(15);
+      margin-bottom: px2rem(14);
+      font-weight: 500;
+    }
+
+    p {
+      width: px2rem(303);
+      margin: 0 auto px2rem(14);
+      color: #7B7B7D;
+      font-size: px2rem(14);
+      font-weight: 400;
+      line-height: px2rem(20);
+    }
+
+    .but {
+      width: px2rem(303);
+      height: px2rem(46);
+      line-height: px2rem(46);
+      text-align: center;
+      color: #fff;
+      font-size: px2rem(16);
+      font-weight: 500;
+      margin: 0 auto;
+      background: #04D5C6;
+      border-radius: px2rem(25);
+    }
+  }
+}
+
 .arabic {
   .nav {
     .back {
@@ -538,7 +816,8 @@ html {
 
   .transfer_method .official_withdraw .pop {
     left: unset;
-    right: 3.52rem;
+    right: 3.2rem;
+    top: -0.8rem;
   }
 
   .my_salary p img {
@@ -556,10 +835,29 @@ html {
       padding-left: unset;
     }
   }
-  .transfer_method .official_withdraw .pop, .transfer_method .agent_settlement .pop, .transfer_dollars .official_withdraw .pop, .transfer_dollars .agent_settlement .pop{
-    background: url(../images/pop-ar.png) no-repeat;
-    background-size: 100% 100%;
-    left: auto;
-    right: 3.52rem;
+
+  // .transfer_method .official_withdraw .pop,
+  // .transfer_method .agent_settlement .pop,
+  // .transfer_dollars .official_withdraw .pop,
+  // .transfer_dollars .agent_settlement .pop {
+  //   background: url(../images/pop-ar.png) no-repeat;
+  //   background-size: 100% 100%;
+  //   left: auto;
+  //   right: 3.52rem;
+  // }
+  .pubWithdrawal .pubWithdrawal_in {
+    height: 11.6rem;
+
+    .boxw .right {
+      float: left;
+      white-space: nowrap;
+    }
+  }
+}
+
+.english {
+  .transfer_method .official_withdraw .pop {
+    top: -0.8rem;
+    left: 2.9rem;
   }
 }

view/molistar/modules/guild-ar/js/BANK.js

@@ -0,0 +1,221 @@
+const urlData = getQueryString();
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+var langReplace;
+var localLang;
+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 fields = {};
+$(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(() => {
+            window.history.back();
+        })
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        get()
+    }, 100);
+
+});
+function translateFun() {
+    langReplace = window.lang.replace;
+    localLang = window.lang;
+    $('.text1').text(langReplace(localLang.bank.text1));
+    $('.text2').text(langReplace(localLang.bank.text2));
+    $('.text3').text(langReplace(localLang.bank.text3));
+    $('.text4').text(langReplace(localLang.bank.text4));
+    $('.text5').attr('placeholder', langReplace(localLang.bank.text5));
+    $('.text6').attr('placeholder', langReplace(localLang.bank.text6));
+    $('.text7').attr('placeholder', langReplace(localLang.bank.text7));
+    $('.text8').attr('placeholder', langReplace(localLang.bank.text8));
+    $('.text9').attr('placeholder', langReplace(localLang.bank.text9));
+    $('.text10').attr('placeholder', langReplace(localLang.bank.text10));
+    $('.p1').text(langReplace(localLang.pTitle.p1));
+    $('.p2').text(langReplace(localLang.pTitle.p2));
+    $('.p3').text(langReplace(localLang.pTitle.p3));
+    $('.p4').text(langReplace(localLang.pTitle.p4));
+    $('.p5').text(langReplace(localLang.pTitle.p5));
+    $('.p6').text(langReplace(localLang.pTitle.p6));
+}
+// 获取
+function get() {
+    showLoading();
+    networkRequest({
+        type: "GET",
+        url: urlPrefix + "/guild/usd/withdrawAccount/get",
+        data: { type: getQueryString().type },
+        success: function (res) {
+            if (res.code == 200) {
+                // 回显数据
+                $('.currencyType input').val(langReplace(localLang.payonner.text6) + res.data.currency);
+                fields = res.data.fields;
+                if (fields.country == '') {
+                    $('.but .determine').hide();
+                    $('.but .ok').show();
+                    $('.box input').attr('disabled', false)
+                } else {
+                    $('.but .determine').show();
+                    $('.but .ok').hide();
+                    $('.box input').attr('disabled', true)
+                }
+                $('.currencyType input').attr('disabled', true)
+                $('.country input').val(fields.country);
+                $('.payeeAccountNo input').val(fields.bank_account);
+                $('.bankName input').val(fields.bank_name);
+                $('.sWIFTCode input').val(fields.swift_code);
+                $('.payeeName input').val(fields.full_name);
+                $('.Address input').val(fields.address);
+                // 渲染国家
+                $('.pub .pub_in .countryPub').remove();
+                var str = '';
+                res.data.countryOptionalList.forEach(res => {
+                    str += `
+                        <div country='${res.value}' name="${res.name}" class="countryPub">${res.name}</div>
+                    `
+                })
+                $('.pub .pub_in').append(str);
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            console.log(res, "报错啦");
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 选择国家
+$('.country').click(function () {
+    $('.pub').show();
+})
+// 关闭选择国家
+$('.pub').click(function (params) {
+    $('.pub').hide();
+})
+// 选中国家
+var nameval;
+$('.pub .pub_in').on('click', '.countryPub', function (params) {
+    $(this).addClass('act').siblings().removeClass('act');
+    nameval = $(this).attr('name');
+    var country = $(this).attr('country');
+    fields.country = country;
+    return false;
+})
+// 确认选中国家
+$('.pub .pub_in .soure').click(function (params) {
+    $('.country input').val(nameval);
+    $('.pub').hide();
+})
+// 确认绑定按钮
+$('.but .ok').click(function (params) {
+    console.log(fields);
+    var obj = {}
+    obj.country = fields.country;
+    obj.bank_account = $('.payeeAccountNo input').val();
+    obj.bank_name = $('.bankName input').val();
+    obj.swift_code = $('.sWIFTCode input').val();
+    obj.full_name = $('.payeeName input').val();
+    obj.address = $('.Address input').val();
+    if (obj.country && obj.bank_account && obj.bank_name && obj.swift_code && obj.full_name && obj.address != '') {
+        fields = obj;
+        var objJson = {
+            uid: pubInfo.uid,
+            type: getQueryString().type,
+            fields,
+        }
+        update(JSON.stringify(objJson));
+    } else {
+        toastMsg(langReplace(localLang.payonner.text10));
+    }
+})
+// 绑定更新信息
+function update(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/bound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+                location.href = './salary_account.html'
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 解绑
+$('.but .determine').click(function () {
+    var objJson = {
+        uid: pubInfo.uid,
+        type: getQueryString().type,
+    }
+    unbound(JSON.stringify(objJson));
+})
+// 解绑
+function unbound(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/unbound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}

view/molistar/modules/guild-ar/js/PAYONNER.js

@@ -0,0 +1,212 @@
+const urlData = getQueryString();
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+var langReplace;
+var localLang;
+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 fields = {};
+$(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(() => {
+            window.history.back();
+        })
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        get()
+    }, 100);
+
+});
+function translateFun() {
+    langReplace = window.lang.replace;
+    localLang = window.lang;
+    $('.text1').text(langReplace(localLang.payonner.text1));
+    $('.text2').text(langReplace(localLang.payonner.text2));
+    $('.text3').text(langReplace(localLang.payonner.text3));
+    $('.text4').text(langReplace(localLang.payonner.text4));
+    $('.text5').text(langReplace(localLang.payonner.text5));
+    $('.text6').attr('placeholder', langReplace(localLang.payonner.text6));
+    $('.text7').attr('placeholder', langReplace(localLang.payonner.text7));
+    $('.text8').attr('placeholder', langReplace(localLang.pTitle.p7));
+    $('.text9').attr('placeholder', langReplace(localLang.payonner.text9));
+    $('.p1').text(langReplace(localLang.pTitle.p1));
+    $('.p7').text(langReplace(localLang.pTitle.p7));
+    $('.p5').text(langReplace(localLang.pTitle.p5));
+
+}
+// 获取
+function get() {
+    showLoading();
+    networkRequest({
+        type: "GET",
+        url: urlPrefix + "/guild/usd/withdrawAccount/get",
+        data: { type: getQueryString().type },
+        success: function (res) {
+            if (res.code == 200) {
+                // 回显数据
+                $('.currencyType input').val(langReplace(localLang.payonner.text6) + res.data.currency);
+                fields = res.data.fields;
+                if (fields.country == '') {
+                    $('.but .determine').hide();
+                    $('.but .ok').show();
+                    $('.box input').attr('disabled', false)
+                } else {
+                    $('.but .determine').show();
+                    $('.but .ok').hide();
+                    $('.box input').attr('disabled', true)
+                }
+                $('.currencyType input').attr('disabled', true)
+                $('.country input').val(fields.country);
+                $('.payeeAccountNo input').val(fields.bank_account);
+                $('.payeeName input').val(fields.full_name);
+                // 渲染国家
+                $('.pub .pub_in .countryPub').remove();
+                var str = '';
+                res.data.countryOptionalList.forEach(res => {
+                    str += `
+                    <div country='${res.value}' name="${res.name}" class="countryPub">${res.name}</div>
+                    `
+                })
+                $('.pub .pub_in').append(str);
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            console.log(res, "报错啦");
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 选择国家
+$('.country').click(function () {
+    $('.pub').show();
+})
+// 关闭选择国家
+$('.pub').click(function (params) {
+    $('.pub').hide();
+})
+// 选中国家
+var nameTitle
+$('.pub .pub_in').on('click', '.countryPub', function name(params) {
+    $(this).addClass('act').siblings().removeClass('act');
+    nameTitle = $(this).attr('name');
+    var country = $(this).attr('country');
+    fields.country = country;
+    return false;
+})
+// 确认选中国家
+$('.pub .pub_in .soure').click(function name(params) {
+    $('.country input').val(nameTitle);
+    $('.pub').hide();
+})
+// 确认绑定按钮
+$('.but .ok').click(function (params) {
+    console.log(fields);
+    var obj = {}
+    obj.country = fields.country;
+    obj.bank_account = $('.payeeAccountNo input').val();
+    obj.full_name = $('.payeeName input').val();
+    if (obj.country && obj.bank_account && obj.full_name) {
+        fields = obj;
+        var objJson = {
+            uid: pubInfo.uid,
+            type: getQueryString().type,
+            fields,
+        }
+        update(JSON.stringify(objJson));
+    } else {
+        toastMsg(langReplace(localLang.payonner.text10));
+    }
+})
+// 绑定更新信息
+function update(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/bound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+                location.href = './salary_account.html'
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 解绑
+$('.but .determine').click(function () {
+    var objJson = {
+        uid: pubInfo.uid,
+        type: getQueryString().type,
+    }
+    unbound(JSON.stringify(objJson));
+})
+// 解绑
+function unbound(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/unbound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}

view/molistar/modules/guild-ar/js/VODAFONE.js

@@ -0,0 +1,206 @@
+const urlData = getQueryString();
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+var langReplace;
+var localLang;
+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 fields = {};
+$(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(() => {
+            window.history.back();
+        })
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        langReplace = window.lang.replace;
+        localLang = window.lang;
+        translateFun();
+        get()
+    }, 100);
+
+});
+function translateFun() {
+    langReplace = window.lang.replace;
+    localLang = window.lang;
+    $('.text2').text(langReplace(localLang.payonner.text2));
+    $('.text3').text(langReplace(localLang.payonner.text3));
+    $('.text4').text(langReplace(localLang.payonner.text4));
+    $('.text5').text(langReplace(localLang.payonner.text5));
+    $('.text7').attr('placeholder', langReplace(localLang.payonner.text7));
+    $('.text8').attr('placeholder', langReplace(localLang.payonner.text8));
+    $('.p1').text(langReplace(localLang.pTitle.p1));
+    $('.p2').text(langReplace(localLang.pTitle.p2));
+
+}
+// 获取
+function get() {
+    showLoading();
+    networkRequest({
+        type: "GET",
+        url: urlPrefix + "/guild/usd/withdrawAccount/get",
+        data: { type: getQueryString().type },
+        success: function (res) {
+            if (res.code == 200) {
+                // 回显数据
+                $('.currencyType input').val(langReplace(localLang.payonner.text6) + res.data.currency);
+                fields = res.data.fields;
+                if (fields.country == '') {
+                    $('.but .determine').hide();
+                    $('.but .ok').show();
+                    $('.box input').attr('disabled', false)
+                } else {
+                    $('.but .determine').show();
+                    $('.but .ok').hide();
+                    $('.box input').attr('disabled', true)
+                }
+                $('.currencyType input').attr('disabled', true)
+                $('.country input').val(fields.country);
+                $('.payeeAccountNo input').val(fields.bank_account);
+                // 渲染国家
+                $('.pub .pub_in .countryPub').remove();
+                var str = '';
+                res.data.countryOptionalList.forEach(res => {
+                    str += `
+                    <div country='${res.value}' name="${res.name}" class="countryPub">${res.name}</div>
+                    `
+                })
+                $('.pub .pub_in').append(str);
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            console.log(res, "报错啦");
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 选择国家
+$('.country').click(function () {
+    $('.pub').show();
+})
+// 关闭选择国家
+$('.pub').click(function (params) {
+    $('.pub').hide();
+})
+// 选中国家
+var nameTitle;
+$('.pub .pub_in').on('click', '.countryPub', function name(params) {
+    $(this).addClass('act').siblings().removeClass('act');
+    nameTitle = $(this).attr('name');
+    var country = $(this).attr('country');
+    fields.country = country;
+    return false;
+})
+// 确认选中国家
+$('.pub .pub_in .soure').click(function name(params) {
+    $('.country input').val(nameTitle);
+    $('.pub').hide();
+})
+// 确认绑定按钮
+$('.but .ok').click(function (params) {
+    console.log(fields);
+    var obj = {}
+    obj.country = fields.country;
+    obj.bank_account = $('.payeeAccountNo input').val();
+    if (obj.country && obj.bank_account) {
+        fields = obj;
+        var objJson = {
+            uid: pubInfo.uid,
+            type: getQueryString().type,
+            fields,
+        }
+        update(JSON.stringify(objJson));
+    } else {
+        toastMsg(langReplace(localLang.payonner.text10));
+    }
+})
+// 绑定更新信息
+function update(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/bound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+                location.href = './salary_account.html'
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}
+// 解绑
+$('.but .determine').click(function () {
+    var objJson = {
+        uid: pubInfo.uid,
+        type: getQueryString().type,
+    }
+    unbound(JSON.stringify(objJson));
+})
+// 解绑
+function unbound(obj) {
+    showLoading();
+    networkRequest({
+        type: "post",
+        url: urlPrefix + "/guild/usd/withdrawAccount/unbound",
+        contentType: 'application/json;charset=UTF-8',
+        data: obj,
+        success: function (res) {
+            if (res.code == 200) {
+                get();
+                toastMsg('success');
+            } else {
+                toastMsg(res.message);
+            }
+            hideLoading(layerIndex);
+        },
+        error: function (res) {
+            hideLoading(layerIndex);
+        },
+    });
+}

view/molistar/modules/guild-ar/js/bill.js

@@ -98,16 +98,18 @@ function getData() {
                 list.forEach(item => {
                     // tradeType 1 收入 2支出
                     // if (item.tradeType == 1) {
-                    str += `<li>
-                            <div>
-                                    <p>${item.type == 1 ? `${langReplace(localLang.bill.text5)}` : item.type == 2 ? `${langReplace(localLang.bill.text6)}` : item.type == 3 ? `${langReplace(localLang.bill.text7)}` : item.type == 4 ? `ID:${type == 1 ? item.target.erbanNo : item.me.erbanNo} ${langReplace(localLang.bill.text8)} ID: ${type == 1 ? item.me.erbanNo : item.target.erbanNo}` : `${langReplace(localLang.bill.text9)}`}</p>
-                                    <b dir="ltr">${type == 1 ? '+ ' + item.operateUsdNum.toLocaleString() : item.operateUsdNum.toLocaleString()} ÜS</b>
-                            </div>
-                            <div>
-                                    <span>${langReplace(localLang.bill.text4)}${item.beforeUsdNum}ÜS -> ${item.afterUsdNum}ÜS</span>
-                                    <span>${dateFormat(item.createTime, 'yyyy/MM/dd hh:mm:ss')}</span>
-                            </div>
-                        </li>`
+                    str += `
+                            <li class="${item.type == 5 || item.type == 6 ? 'actLi' : ''}">
+                                <div>
+                                        ${(item.type == 5 || item.type == 6) ? `<i class="sp${item.status}">${(item.status == 0 ? langReplace(localLang.bill.text10) : item.status == 1 ? langReplace(localLang.bill.text11) : langReplace(localLang.bill.text12))}</i>` : ''}
+                                        <p>${item.type == 1 ? `${langReplace(localLang.bill.text5)}` : item.type == 2 ? `${langReplace(localLang.bill.text6)}` : item.type == 3 ? `${langReplace(localLang.bill.text7)}` : item.type == 4 ? `ID:${type == 1 ? item.target.erbanNo : item.me.erbanNo} ${langReplace(localLang.bill.text8)} ID: ${type == 1 ? item.me.erbanNo : item.target.erbanNo}` : `${langReplace(localLang.bill.text9)}`}</p>
+                                        <b dir="ltr">${type == 1 ? '+ ' + item.operateUsdNum.toLocaleString() : item.operateUsdNum.toLocaleString()} ÜS</b>
+                                </div>
+                                <div>
+                                        <span>${langReplace(localLang.bill.text4)}${item.beforeUsdNum}ÜS -> ${item.afterUsdNum}ÜS</span>
+                                        <span>${dateFormat(item.createTime, 'yyyy/MM/dd hh:mm:ss')}</span>
+                                </div>
+                            </li>`
                     //     } else {
                     //         str += `<li>
                     //       <div>

view/molistar/modules/guild-ar/js/salary.js

@@ -46,6 +46,9 @@ var transfer_dollars_ArrType;
 var typeTabType = '';
 var ratio;
 var usGold;
+var accountListName;
+var accountObj = {};
+var withdrawRate;
 $(function () {
   getInfoFromClient();
   fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
@@ -90,6 +93,21 @@ $(function () {
     $('.text16').text(langReplace(localLang.salary.text16));
     $('.text17').html(langReplace(localLang.salary.text17));
     $('.text18').html(langReplace(localLang.salary.text18));
+    $('.textnew1').html(langReplace(localLang.salary.textnew1));
+    $('.textnew2').html(langReplace(localLang.salary.textnew2));
+    $('.textnew3').html(langReplace(localLang.salary.textnew3));
+    $('.textnew4').html(langReplace(localLang.salary.textnew4));
+    $('.textnew5').html(langReplace(localLang.salary.textnew5));
+    $('.textnew6').html(langReplace(localLang.salary.textnew6));
+    $('.textnew7').html(langReplace(localLang.salary.textnew7));
+    $('.textnew8').html(langReplace(localLang.salary.textnew8));
+    $('.textnew9').html(langReplace(localLang.salary.textnew9));
+    $('.textnew10').html(langReplace(localLang.salary.textnew10));
+    $('.textnew11').html(langReplace(localLang.salary.textnew11));
+    $('.textnew12').html(langReplace(localLang.salary.textnew12));
+    $('.textnew15').html(langReplace(localLang.salary.textnew15));
+    $('.textnew16').html(langReplace(localLang.salary.textnew16));
+    $('.textnew17').html(langReplace(localLang.salary.textnew17));
   }
 });
 // 获取usd操作的功能标签tab
@@ -129,6 +147,20 @@ function getTab() {
           })
           $('.agent_pop .wrap').append(agent_popStr);
           $('.agent_pop .sure').attr('uid', rechargeUserList[0].uid);
+          // 渲染账户列表
+          var accountListStr = '';
+          withdrawRate = res.data.withdrawAccountVo.withdrawRate;
+          $('.selectAccount .selectAccount_in .accountBox .account').remove();
+          res.data.withdrawAccountVo.accountList.forEach(res => {
+            accountListStr += `
+                  <div class="account">
+                    <img style="display:${res.hasBound ? 'block' : 'none'}" src="./images/not.png" alt="" class="sel" name=${res.name} type=${res.type} obj='${JSON.stringify(res)}'>
+                    <b>${res.name}</b><span>${res.hasBound ? '' : '(Unbound)'}</span>
+                    <img  src="./images/eidIcon.png" alt="" class="eid" type=${res.type}>
+                  </div>
+            `
+          })
+          $('.selectAccount .selectAccount_in .accountBox').append(accountListStr);
         }
         // 当前可提现余额
         usGold = res.data.guildUsdNum
@@ -146,7 +178,7 @@ function getTab() {
           tabStr += `<div tabKey=${res.tabKey} class="item ${i == 0 ? 'act' : ''}">${res.tabKey == 'personal' ? langReplace(localLang.salary.text4) : langReplace(localLang.salary.text5)}</div>`
         })
         $('.tab').append(tabStr);
-        typeTabType =  res.data.typeTab[0].tabKey
+        typeTabType = res.data.typeTab[0].tabKey
         typeTabFun(typeTabType);
       } else {
         toastMsg(res.message)
@@ -175,6 +207,7 @@ function typeTabFun(type) {
   transfer_dollars_Arr = {};
   $('.transfer_method li').remove();
   $('.transfer_dollars li').remove();
+  $('.withdrawalAccount').hide();
   var str = '';
   var arr = type == 'personal' ? tabPersonalArr[0] : tabAgentArr[0];
   // 处理方式
@@ -207,14 +240,16 @@ function typeTabFun(type) {
           </li>
       `
     } else if (res.type == 5) {
+      $('.withdrawalAccount').show();
       str += `
           <li class="official_withdraw ${i == 0 ? 'li_act' : ''}" type="${res.type}" ratio="${res.ratio}">
             <p>
               <img src="./images/dollar.png" class="dollar" alt="">
               <e>${langReplace(localLang.salary.text20)}</e>
+              <img class="wenhao" src="./images/wenhao.png" />
             </p>
-            <div class="pop">
-            ${langReplace(localLang.salary.text21)}
+            <div class="pop" style="display:none">
+             ${langReplace(localLang.salary.text21)}
             </div>
           </li>
       `
@@ -225,7 +260,7 @@ function typeTabFun(type) {
               <img src="./images/dollar.png" class="dollar" alt="">
               <e>${langReplace(localLang.salary.text22)}</e>
             </p>
-            <div class="pop">
+            <div class="pop" style="display:none">
             ${langReplace(localLang.salary.text21)}
             </div>
           </li>
@@ -249,6 +284,7 @@ function typeTabFun(type) {
 }
 // 处理金额
 function dollarsFun(type) {
+  $('.withdrawalAccount').hide();
   $('.transfer_dollars li').remove();
   var str2 = '';
   if (transfer_dollars_Arr[type].canCustom) {
@@ -268,6 +304,9 @@ function dollarsFun(type) {
       $('.president_pop .btn_wrap .sure').attr('guildusdnum', res.guildUsdNum);
       $('.agent_pop .btn_wrap .sure').attr('guildusdnum', res.guildUsdNum);
     }
+    if (res.type == 5) {
+      $('.withdrawalAccount').show();
+    }
     if (res.type == 2) {
       str2 += `
         <li class="${i == 0 ? 'li_act' : ''}" guildusdnum=${res.guildUsdNum}>
@@ -350,6 +389,12 @@ $('.transfer_method').on('click', 'li', function () {
   transfer_dollars_ArrType = type;
   dollarsFun(transfer_dollars_ArrType);
 })
+$('.transfer_method').on('click', 'li .wenhao', function () {
+  $('.pop').show();
+})
+$('.transfer_method').on('click', 'li .pop', function () {
+  $('.pop').hide();
+})
 // 选择金额方式
 $('.transfer_dollars').on('click', 'li', function () {
   $(this).addClass('li_act').siblings().removeClass('li_act');
@@ -458,6 +503,26 @@ function operateValue(than) {
   } else if (type == 4) {
     $('.president_pop').show();
     bodyScroolFun(true);
+  } else if (type == 5) {
+    if (accountListName) {
+      $('.pubWithdrawal .pubWithdrawal_in .ok').attr('guildusdnum', guildUsdNum);
+      $('.pubWithdrawal .pubWithdrawal_in .ok').attr('type', type);
+      $('.pubWithdrawal .pubWithdrawal_in .ok').attr('accountType', accountObj.type);
+      if (accountObj.type == 'VODAFONE') {
+        $('.pubWithdrawal .pubWithdrawal_in .box3 .left p').show();
+        $('.pubWithdrawal .pubWithdrawal_in .box3 .left p span').text(accountObj.usdRatio);
+        $('.pubWithdrawal .pubWithdrawal_in .box4 .right').text(`${((than.attr('guildUsdNum')) - (than.attr('guildUsdNum') * withdrawRate)) * 50} ${accountObj.currency}`);
+      } else {
+        $('.pubWithdrawal .pubWithdrawal_in .box3 .left p').hide();
+        $('.pubWithdrawal .pubWithdrawal_in .box4 .right').text(`${((than.attr('guildUsdNum')) - (than.attr('guildUsdNum') * withdrawRate))} ${accountObj.currency}`);
+      }
+      $('.pubWithdrawal .pubWithdrawal_in .box1 .right').text(`${than.attr('guildUsdNum')} USD`);
+      $('.pubWithdrawal .pubWithdrawal_in .box2 .right').text(withdrawRate * 100 + '%');
+      $('.pubWithdrawal .pubWithdrawal_in .box3 .right').text(`${than.attr('guildUsdNum') * withdrawRate} USD`);
+      $('.pubWithdrawal').show();
+    } else {
+      toastMsg(langReplace(localLang.salary.textnew13))
+    }
   } else {
     var obj = {
       guildUsdNum,
@@ -467,6 +532,26 @@ function operateValue(than) {
     operate(obj)
   }
 }
+// 确认提现按钮
+$('.pubWithdrawal .pubWithdrawal_in .ok').click(function () {
+  var guildUsdNum = $(this).attr('guildUsdNum');
+  var type = $(this).attr('type');
+  var accountType = $(this).attr('accountType');
+  var obj = {
+    guildUsdNum,
+    accountType,
+    type,
+  };
+  if ($(this).attr('accountType') == 'VODAFONE' && $(this).attr('guildUsdNum') > 1000) {
+    toastMsg(langReplace(localLang.salary.textnew14))
+  } else {
+    operate(obj)
+  }
+})
+// 取消提现按钮
+$('.pubWithdrawal .pubWithdrawal_in .close').click(function () {
+  $('.pubWithdrawal').hide();
+})
 // 确认提交接口
 function operate(obj) {
   showLoading()
@@ -478,7 +563,12 @@ function operate(obj) {
       if (res.code === 200) {
         getTab();
         // window.location.href = `./salary_account.html?type=${obj.type}&createTime=${dateFormat(res.data.createTime,'yyyy/MM/dd hh:mm:ss')}&guildUsdNum=${res.data.guildUsdNum}`
-        window.location.href = `./successful.html?type=${obj.type}&data=${JSON.stringify(res.data)}`
+        if (obj.type == 5) {
+          $('.pubWithdrawal').hide();
+          $('.success').show();
+        } else {
+          window.location.href = `./successful.html?type=${obj.type}&data=${JSON.stringify(res.data)}`
+        }
       } else {
         toastMsg(res.message)
       }
@@ -489,4 +579,34 @@ function operate(obj) {
       toastMsg(langReplace(localLang.demoModule.layerIndex3))
     }
   })
-}
+}
+// 打开账户按钮
+$('.withdrawalAccount').click(function name(params) {
+  $('.selectAccount').show();
+})
+// 关闭账户按钮
+$('.selectAccount').click(function () {
+  $('.selectAccount').hide();
+})
+// 选择账户按钮
+$('.selectAccount .selectAccount_in .accountBox').on('click', ' .account', function () {
+  return false;
+})
+// 选择账户按钮
+$('.selectAccount .selectAccount_in .accountBox').on('click', ' .account .sel', function () {
+  $('.selectAccount .selectAccount_in .accountBox .account .sel').attr("src", './images/not.png');
+  $(this).attr("src", './images/yes.png');
+  accountListName = $(this).attr("name");
+  accountObj = JSON.parse($(this).attr('obj'));
+  $('.withdrawalAccount .right b').text(accountListName);
+  $('.selectAccount').hide();
+})
+// 选择账户编辑
+$('.selectAccount .selectAccount_in .accountBox').on('click', ' .account .eid', function () {
+  var type = $(this).attr('type');
+  location.href = `./${type}.html?type=${type}`
+})
+// 关闭成功按钮
+$('.success .success_in .but').click(function () {
+  $('.success').hide();
+})

view/molistar/modules/guild-ar/local/ar.js

@@ -225,11 +225,28 @@ langAr = {
         text18: `(نسبة التبادل 1:<b>7000</b>)`,
         text19: `تبادل العملات`,
         text20: `السحب الرسمي`,
-        text21: `يمكن التسوية في الأول و 16 من كل شهر`,
+        text21: `تفتح قناة السحب في اليومين الأول والثاني من كل شهر.`,
         text22: `تسوية الوكيل`,
         text23: `تسوية وكلاء الشحن`,
         text24: `يرجى إدخال المبلغ المراد استرداده`,
-        text25: `عملات`
+        text25: `عملات`,
+        textnew1: `حساب السحب`,
+        textnew2: `غير مرتبط`,
+        textnew3: `اختر الحساب`,
+        textnew4: `سحب`,
+        textnew5: `مبلغ السحب`,
+        textnew6: `معدل رسوم المعالجة`,
+        textnew7: `رسوم المعالجة`,
+        textnew8: `سعر الصرف من الدولار الأمريكي إلى الجنيه المصري: 1:`,
+        textnew9: `المبلغ المقدر`,
+        textnew10: `ملاحظة: قد يتأثر المبلغ المتوقع الوصول بسعر صرف البنك وما إلى ذلك.`,
+        textnew11: `سحب`,
+        textnew12: `إلغاء`,
+        textnew13: `يرجى اختيار حساب السحب`,
+        textnew14: `أكثر من الحد الأقصى للمبلغ القابل للتحويل.`,
+        textnew15: `نجاح`,
+        textnew16: `وقت معالجة طلبات السحب يكون من اليوم الثالث إلى العاشر من كل شهر.`,
+        textnew17: `موافق`,
     },
     bill: {
         text1: `الفاتورة`,
@@ -241,6 +258,9 @@ langAr = {
         text7: `تحويل الراتب إلى عملات`,
         text8: `تحويل الراتب`,
         text9: `راتب الوكيل`,
+        text10: `قيد المراجعة`,
+        text11: `تم الإصدار`,
+        text12: `مرفوض`,
     },
     success: {
         text1: `التسوية ناجحة`,
@@ -259,5 +279,38 @@ langAr = {
         text14: `حساب التسوية`,
         text15: `الوقت`,
         text16: `طلب`
+    },
+    payonner: {
+        text1: `Payonner`,
+        text2: `تأكيد`,
+        text3: `إلغاء الربط`,
+        text4: `البلد`,
+        text5: `موافق`,
+        text6: `نوع العملة:`,
+        text7: `البلد`,
+        text8: `رقم حساب المستلم`,
+        text9: `اسم المستلم`,
+        text10: `لا يمكن ترك الحقول الإلزامية فارغة`,
+    },
+    bank: {
+        text1: `تأكيد`,
+        text2: `إلغاء الربط`,
+        text3: `البلد`,
+        text4: `موافق`,
+        text5: `البلد`,
+        text6: `رقم حساب المستلم`,
+        text7: `اسم البنك`,
+        text8: `رمز SWIFT`,
+        text9: `اسم المستلم`,
+        text10: `العنوان`,
+    },
+    pTitle: {
+        p1: `البلد`,
+        p2: `رقم حساب المستلم`,
+        p3: `اسم البنك (أدخل الإنجليزية فقط)`,
+        p4: `رمز SWIFT (أدخل الإنجليزية فقط)`,
+        p5: `اسم المستلم (أدخل الإنجليزية فقط)`,
+        p6: `العنوان (أدخل الإنجليزية فقط)`,
+        p7: `حساب المستلم (صيغة البريد الإلكتروني)`,  
     }
 }

view/molistar/modules/guild-ar/local/en.js

@@ -222,12 +222,29 @@ langEn = {
         text17: `Can be exchanged for <b>0</b> gold coin`,
         text18: `(Exchange at a ratio of 1:<b>7000</b>)`,
         text19: `Exchange coins`,
-        text20: `Official withdraw`,
-        text21: `Settlement available on the 1st and 16th of each month`,
+        text20: `Withdraw`,
+        text21: `The withdrawal channel opens on the 1st and 2nd of every month.`,
         text22: `Agent settlement`,
         text23: `Recharge agent settlement`,
         text24: `Please enter the amount to be redeemed`,
         text25: `Coins`,
+        textnew1: `Withdrawal account`,
+        textnew2: `Unbound`,
+        textnew3: `Select Account`,
+        textnew4: `Withdrawal`,
+        textnew5: `Withdrawal amount `,
+        textnew6: `Handling Fee rate`,
+        textnew7: `Handling Fee`,
+        textnew8: `USD to EGP exchange rate: 1:`,
+        textnew9: `Estimated amount`,
+        textnew10: `Note: Estimated arrival amount may be affected by bank exchange rate, etc.`,
+        textnew11: `Withdraw`,
+        textnew12: `Cancel`,
+        textnew13: `Please select a withdrawal account`,
+        textnew14: `More than the maximum transferable amount.`,
+        textnew15: `Success`,
+        textnew16: `The processing time for withdrawal requests is from the 3rd to the 10th of every month.`,
+        textnew17: `OK`,
     },
     bill: {
         text1: `Bill`,
@@ -239,6 +256,10 @@ langEn = {
         text7: `Salary exchange for coins`,
         text8: `Salary transfer`,
         text9: `Agent salary`,
+        text10: `In Review  `,
+        text11: `Issued`,
+        text12: `Rejected`,
+        text13: ``,
     },
     success: {
         text1: `Settlement successful`,
@@ -258,4 +279,37 @@ langEn = {
         text15: `Time`,
         text16: `Order`,
     },
+    payonner: {
+        text1: `Payonner `,
+        text2: `Confirm`,
+        text3: `Unbind `,
+        text4: `Country`,
+        text5: `OK`,
+        text6: `Currency Type:`,
+        text7: `Country`,
+        text8: `payeeAccountNo`,
+        text9: `payeeName`,
+        text10: `Mandatory fields cannot be blank`,
+    },
+    bank: {
+        text1: `Confirm`,
+        text2: `Unbind `,
+        text3: `Country`,
+        text4: `OK`,
+        text5: `Country`,
+        text6: `payeeAccountNo`,
+        text7: `Bank Name`,
+        text8: `SWIFT Code`,
+        text9: `payeeName`,
+        text10: `Address`,
+    },
+    pTitle: {
+        p1: `Country`,
+        p2: `payeeAccountNo`,
+        p3: `Bank Name(Only Enter English)`,
+        p4: `SWIFT Code(Only Enter English)`,
+        p5: `payeeName(Only Enter English)`,
+        p6: `Address(Only Enter English)`,
+        p7: `payeeAccount(E-mail fomat)`,
+    }
 }

view/molistar/modules/guild-ar/local/zh.js

@@ -226,11 +226,28 @@ langZh = {
         text18: `(兌換比例為 1:<b>7000</b>)`,
         text19: `兌換硬幣`,
         text20: `官方提現`,
-        text21: `每月的 1 日和 16 日可結算`,
+        text21: `提款通道每月1日和2日開放。`,
         text22: `代理結算`,
         text23: `充值代理結算`,
         text24: `請輸入要贖回的金額`,
-        text25: `金幣`
+        text25: `金幣`,
+        textnew1: `提款賬戶`,
+        textnew2: `未綁定`,
+        textnew3: `選擇賬戶`,
+        textnew4: `提款`,
+        textnew5: `提款金額`,
+        textnew6: `手續費率`,
+        textnew7: `手續費`,
+        textnew8: `美元兌埃及鎊匯率：1：`,
+        textnew9: `預估金額`,
+        textnew10: `注意：預估到賬金額可能會受銀行匯率等影響。`,
+        textnew11: `提款`,
+        textnew12: `取消`,
+        textnew13: `請選擇提款賬戶`,
+        textnew14: `超過最大可轉賬金額。`,
+        textnew15: `成功`,
+        textnew16: `提款申請的處理時間為每月3日至10日。`,
+        textnew17: `確定`,
     },
     bill: {
         text1: `賬單`,
@@ -242,6 +259,9 @@ langZh = {
         text7: `薪資兌換為硬幣`,
         text8: `薪資轉賬`,
         text9: `代理薪資`,
+        text10: `審核中`,
+        text11: `已發放`,
+        text12: `已拒絕`,
     },
     success: {
         text1: `結算成功`,
@@ -261,4 +281,37 @@ langZh = {
         text15: `時間`,
         text16: `訂單`
     },
+    payonner: {
+        text1: `Payonner`,
+        text2: `確認`,
+        text3: `解绑`,
+        text4: `國家`,
+        text5: `確定`,
+        text6: `貨幣類型：`,
+        text7: `國家`,
+        text8: `收款人賬號`,
+        text9: `收款人姓名`,
+        text10: `必填字段不能為空`,
+    },
+    bank: {
+        text1: `確認`,
+        text2: `解绑`,
+        text3: `國家`,
+        text4: `確定`,
+        text5: `國家`,
+        text6: `收款人賬號`,
+        text7: `銀行名稱`,
+        text8: `SWIFT 代碼`,
+        text9: `收款人姓名`,
+        text10: `地址`,
+    },
+    pTitle: {
+        p1: `國家`,
+        p2: `收款人賬號`,
+        p3: `銀行名稱(僅輸入英文)`,
+        p4: `SWIFT 代碼(僅輸入英文)`,
+        p5: `收款人姓名(僅輸入英文)`,
+        p6: `地址(僅輸入英文)`,
+        p7: `收款人賬號（電子郵件格式）`,  
+    }
 }

view/molistar/modules/guild-ar/salary_account.html

@@ -70,6 +70,12 @@
       </div>
     </li> -->
   </ul>
+  <!-- 绑定账户 -->
+  <div class="withdrawalAccount">
+    <div class="left"><b>*</b><span class="textnew1"></span></div>
+    <!-- textnew2 -->
+    <div class="right"><b class=""> </b><img src="./images/right.png" alt=""></div>
+  </div>
   <!-- 转增金额 -->
   <div class="transfer_dollars_tit">
     <div class="title text7"></div>
@@ -157,6 +163,58 @@
     </div>
   </div>
 
+  <!-- 选择账户弹窗 -->
+  <div class="selectAccount">
+    <div class="selectAccount_in">
+      <div class="title textnew3"></div>
+      <div class="accountBox">
+        <!-- <div class="account">
+          <img src="./images/not.png" alt="" class="sel">
+          <b>Vodafone</b><span>(Unbound)</span>
+          <img src="./images/eidIcon.png" alt="" class="eid">
+        </div> -->
+      </div>
+    </div>
+  </div>
+
+  <!-- 确认提现账户弹窗 -->
+  <div class="pubWithdrawal">
+    <div class="pubWithdrawal_in">
+      <div class="title textnew4"></div>
+      <div class="boxw box1">
+        <div class="left textnew5"></div>
+        <div class="right">0USD</div>
+      </div>
+      <div class="boxw box2">
+        <div class="left textnew6"></div>
+        <div class="right">6%</div>
+      </div>
+      <div class="boxw box3">
+        <div class="left">
+          <b class="textnew7"></b>
+          <p><strong class="textnew8"></strong><span>50</span></p>
+        </div>
+        <div class="right">0USD</div>
+      </div>
+      <div class="boxw box4">
+        <div class="left textnew9"></div>
+        <div class="right">0USD</div>
+      </div>
+      <div class="text textnew10"></div>
+      <div class="ok textnew11"></div>
+      <div class="close textnew12 "></div>
+    </div>
+  </div>
+
+  <!-- 提现账户成功弹窗 -->
+  <div class="success">
+    <div class="success_in">
+      <div class="title textnew15">Success</div>
+      <p class="textnew16">The processing time for withdrawal requests is from the 3rd to the 10th of every month.</p>
+      <div class="but textnew17">OK</div>
+    </div>
+  </div>
+
   <script src="../../common/js/jquery-3.2.1.min.js"></script>
   <script src="../../common/js/flexible.js"></script>
   <script src="../../common/js/vconsole.min.js"></script>

view/molistar/modules/rule/boom.html

@@ -0,0 +1,117 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title class="text1">活动规则</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <style>
+        body {
+            width: 10rem;
+            height: 17.78667rem;
+            background: #1C094E;
+            box-sizing: border-box;
+            padding: 0.26667rem 0.42667rem 1.09333rem;
+            margin: 0 auto;
+        }
+
+        h2 {
+            width: 100%;
+            color: #fff;
+            font-size: 0.37333rem;
+            font-weight: 500;
+            line-height: 0.53333rem;
+        }
+
+        h3 {
+            width: 100%;
+            color: #fff;
+            font-size: 0.34667rem;
+            font-weight: 400;
+            margin-bottom: 0.18667rem;
+            line-height: 0.53333rem;
+        }
+
+        img {
+            display: block;
+            width: 9.14667rem;
+            margin-bottom: 0.18667rem;
+            margin-top: 0.18667rem;
+        }
+
+        .img1 {
+            height: 4.26667rem;
+        }
+
+        .img2 {
+            height: 5.44rem;
+        }
+
+        .img3 {
+            height: 3.46667rem;
+        }
+
+        .img9,
+        .img10,
+        .img11,
+        .img12 {
+            margin-top: 0.18667rem;
+        }
+
+        .imgBox {
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: 0.18667rem;
+            margin-top: 0.18667rem;
+        }
+
+        .imgBox img {
+            width: 4.48rem;
+        }
+
+        .null {
+            height: 1.09333rem;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="box">
+    </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="../../common/local/langHandler.js"></script>
+<script>
+    var langReplace;
+    var localLang;
+    // 初始化函數
+    $(function () {
+        getInfoFromClient();
+        fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+        setTimeout(function () {
+            fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+            langReplace = window.lang.replace;
+            localLang = window.lang;
+            translateFun();
+        }, 100)
+    })
+    function translateFun() {
+        var langReplace = window.lang.replace;
+        var localLang = window.lang;
+        $('.text1').text(langReplace(localLang.boom.text1));
+        getQueryString().partitionId == 2 ? $('.box').html(langReplace(localLang.boom.text2)) : $('.box').html(langReplace(localLang.boom.text3));
+
+    }
+</script>

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

@@ -2299,4 +2299,26 @@ langAr = {
         إذا لم ترسل هدايا CP لمدة 60 يومًا متتالية: في الساعة 0:00 من اليوم الحادي والستين، ستنخفض حميمية CP بمقدار 500000، ثم ستنخفض بمقدار 500000 في الساعة 0:00 كل يوم. إذا انخفضت قيمة CP إلى النطاق المقابل للمستوى، سيتم تخفيض مستوى CP.
         إذا كانت قيمة المستوى 0، سيتم فك ارتباط CP بعد التخفيض. بمجرد أن تستأنف إرسال هدايا CP، سيتوقف خصم الحميمية.`
     },
+    // ===============================================Boom======================================
+    boom: {
+        text1: `قواعد النشاط`,
+        text2: `
+                <h3>1. يتم زيادة قيمة الـ BOOM في الغرفة من خلال إرسال الهدايا. 1 هدية عادية = 1 قيمة BOOM؛ 20 هدية حظ = 1 قيمة BOOM.</h3>
+                <h3>2. عندما تصل قيمة الـ BOOM إلى 100%، سيتم تفعيل الجائزة الكبرى BOOM ويمكن للمستخدمين في الغرفة الحصول على مكافآت.</h3>
+                <h3>3. المستخدم الذي يساهم بترتيب التبرعات ويقوم بتفعيل الـ BOOM سيحصل على الجائزة الكبرى لهذا المستوى، وسيحصل المستخدمون الآخرون في الغرفة على جوائز عشوائية.</h3>
+                <h3>4. في كل مرة يتم فيها تفعيل الـ BOOM، يكون لدى مالك الغرفة فرصة للحصول على مكافأة بالعملات الذهبية.</h3>
+                <h3>5. كلما زاد مستوى الـ BOOM، زادت المكافآت التي تحصل عليها.</h3>
+                <h3>6. يتم تحديث قيمة الـ BOOM يوميًا في الساعة 00:00 (GMT+3).</h3>
+                <h3>7. يحتفظ هذا النظام بحق التفسير النهائي لهذا النشاط.</h3>
+                `,
+        text3: `
+                <h3>1. يتم زيادة قيمة الـ BOOM في الغرفة من خلال إرسال الهدايا. 1 هدية عادية = 1 قيمة BOOM؛ 50 هدية حظ = 2 قيمة BOOM.</h3>
+                <h3>2. عندما تصل قيمة الـ BOOM إلى 100%، سيتم تفعيل الجائزة الكبرى BOOM ويمكن للمستخدمين في الغرفة الحصول على مكافآت.</h3>
+                <h3>3. المستخدم الذي يساهم بترتيب التبرعات ويقوم بتفعيل الـ BOOM سيحصل على الجائزة الكبرى لهذا المستوى، وسيحصل المستخدمون الآخرون في الغرفة على جوائز عشوائية.</h3>
+                <h3>4. في كل مرة يتم فيها تفعيل الـ BOOM، يكون لدى مالك الغرفة فرصة للحصول على مكافأة بالعملات الذهبية.</h3>
+                <h3>5. كلما زاد مستوى الـ BOOM، زادت المكافآت التي تحصل عليها.</h3>
+                <h3>6. يتم تحديث قيمة الـ BOOM يوميًا في الساعة 00:00 (GMT+3).</h3>
+                <h3>7. يحتفظ هذا النظام بحق التفسير النهائي لهذا النشاط.</h3>
+                `
+    }
 }

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

@@ -2308,4 +2308,26 @@ langEn = {
         If the level value is 0, the CP will be unbound after downgrading. Once you resume sending CP gift, the
         deduction of intimacy will stop.`,
     },
+    // ===============================================Boom======================================
+    boom: {
+        text1: `Event Rules`,
+        text2: `
+        <h3>1. Increase the BOOM value in the room by sending gifts. 1 coin regular gift = 1 BOOM value; 20 coin lucky gift = 1 BOOM value.</h3>
+        <h3>2. When the BOOM value reaches 100%, the super jackpot BOOM will be triggered, and users in the room can win rewards.</h3>
+        <h3>3. The user who contributes the most and triggers the BOOM will receive the super prize for that level, and other users in the room will randomly receive prizes.</h3>
+        <h3>4. Each time the BOOM is triggered, the room owner has a chance to receive a coin reward.</h3>
+        <h3>5. The higher the BOOM level, the richer the rewards.</h3>
+        <h3>6. BOOM value is reset daily at 00:00 (GMT+3).</h3>
+        <h3>7. The platform reserves the final right of interpretation for this event.</h3>
+        `,
+        text3: `
+        <h3>1. Increase the BOOM value in the room by sending gifts. 1 coin regular gift = 1 BOOM value; 50 coin lucky gift = 2 BOOM value.</h3>
+        <h3>2. When the BOOM value reaches 100%, the super jackpot BOOM will be triggered, and users in the room can win rewards.</h3>
+        <h3>3. The user who contributes the most and triggers the BOOM will receive the super prize for that level, and other users in the room will randomly receive prizes.</h3>
+        <h3>4. Each time the BOOM is triggered, the room owner has a chance to receive a coin reward.</h3>
+        <h3>5. The higher the BOOM level, the richer the rewards.</h3>
+        <h3>6. BOOM value is reset daily at 00:00 (GMT+3).</h3>
+        <h3>7. The platform reserves the final right of interpretation for this event.</h3>
+        `
+    }
 }

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

@@ -737,7 +737,7 @@ langZh = {
 
         // ==========================================隐私政策==================================
         privacyPolicy_title: `Privacy Policy`,
-        privacyPolicy_body:  `<!-- wp:paragraph -->
+        privacyPolicy_body: `<!-- wp:paragraph -->
         <p><em>Last updated: September 24, 202</em>4</p>
         <!-- /wp:paragraph -->
         
@@ -2299,4 +2299,26 @@ langZh = {
         如果您在 60 天內未發送 CP 禮物：在第 61 天的 0:00，CP 親密度將降低 500000，然後每天的 0:00 再降低 500000。如果 CP 值降到對應的等級範圍，CP 等級將會降級。
         如果等級值為 0，CP 將在降級後解除綁定。一旦您恢復發送 CP 禮物，親密度的扣除將停止。`
     },
+    // ===============================================Boom======================================
+    boom: {
+        text1: `活動規則`,
+        text2: `
+        <h3>1. 透過贈送禮物來增加房間的BOOM值。1金幣普通禮物=1 BOOM值；20金幣幸運禮物=1BOOM價值。</h3>
+        <h3>2. 當BOOM值達到100%時，將觸發超級大獎BOOM，房間內的使用者可以獲得獎勵。</h3>
+        <h3>3. 貢獻排名並觸發BOOM的用戶將獲得該級別的超級獎品，房間內的其他用戶將隨機獲得獎品。</h3>
+        <h3>4. 每次觸發BOOM，房主都有機會獲得金幣獎勵。</h3>
+        <h3>5. BOOM等級越高，獲得的獎勵越豐富。</h3>
+        <h3>6. BOOM值每天0:00（GMT+3）更新。</h3>
+        <h3>7. 本平台擁有本活動最終解釋權。</h3>
+        `,//阿拉伯
+        text3: `
+        <h3>1. 透過贈送禮物來增加房間的BOOM值。1金幣普通禮物=1 BOOM值；50金幣幸運禮物=2BOOM價值。</h3>
+        <h3>2. 當BOOM值達到100%時，將觸發超級大獎BOOM，房間內的使用者可以獲得獎勵。</h3>
+        <h3>3. 貢獻排名並觸發BOOM的用戶將獲得該級別的超級獎品，房間內的其他用戶將隨機獲得獎品。</h3>
+        <h3>4. 每次觸發BOOM，房主都有機會獲得金幣獎勵。</h3>
+        <h3>5. BOOM等級越高，獲得的獎勵越豐富。</h3>
+        <h3>6. BOOM值每天0:00（GMT+3）更新。</h3>
+        <h3>7. 本平台擁有本活動最終解釋權。</h3>
+        `//英语区
+    }
 }

view/molistar/modules/smashEggs/css/index.css

@@ -0,0 +1,257 @@
+html,
+body {
+  width: 100%;
+  height: 100%;
+  background: #8B37E4;
+}
+
+.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;
+}
+
+.box {
+  width: 10rem;
+  height: 14.50667rem;
+  background: url(../images/box.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  margin: 0 auto 0;
+}
+
+.box .a {
+  position: absolute;
+  background: rgba(255, 255, 255, 0.6);
+  width: 1.5rem;
+  text-align: center;
+  color: #4F00B0;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  right: 0;
+  border-radius: 0.53333rem 0rem 0 0.53333rem;
+  text-indent: 0.15rem;
+  font-size: 0.30667rem;
+  font-weight: 500;
+}
+
+.box .rank {
+  top: 0.8rem;
+  z-index: 999;
+}
+
+.box .rule {
+  top: 1.6rem;
+}
+
+.box .record {
+  top: 2.4rem;
+}
+
+.box .egg {
+  width: 8.18667rem;
+  height: 5.54667rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 5rem;
+}
+
+.box .but {
+  width: 100%;
+  height: 1.30667rem;
+  display: flex;
+  justify-content: space-between;
+  position: absolute;
+  bottom: 1.06667rem;
+  left: 50%;
+  transform: translateX(-50%);
+  box-sizing: border-box;
+  padding: 0 0.53333rem;
+}
+
+.box .but img {
+  width: 2.02667rem;
+  height: 1.30667rem;
+  display: block;
+}
+
+.box .buyBox {
+  width: 95%;
+  height: 0.74667rem;
+  background: #934DED;
+  position: absolute;
+  bottom: 0rem;
+  left: 50%;
+  transform: translateX(-50%);
+  border-radius: 0.4rem 0.4rem 0 0;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  padding: 0.02667rem 0.2rem 0;
+  font-size: 0.29333rem;
+}
+
+.box .buyBox .prop {
+  height: 100%;
+  line-height: 0.74667rem;
+  color: #fff;
+}
+
+.box .buyBox .tab {
+  width: 3rem;
+  display: flex;
+  justify-content: space-between;
+  background: #4F00B0;
+  height: 0.42667rem;
+  border-radius: 0.42667rem;
+  line-height: 0.42667rem;
+  margin-top: 0.16rem;
+}
+
+.box .buyBox .tab span {
+  text-align: center;
+  width: 1.06667rem;
+  height: 0.42667rem;
+  background: none;
+  color: rgba(255, 255, 255, 0.5);
+  border-radius: 0.42667rem;
+  line-height: 0.42667rem;
+}
+
+.box .buyBox .tab .act {
+  background: rgba(255, 255, 255, 0.6);
+  color: #fff;
+}
+
+.box .buyBox input {
+  background: #4F00B0;
+  outline: none;
+  width: 2.2rem;
+  height: 0.48rem;
+  border-radius: 0.48rem;
+  line-height: 0.48rem;
+  box-sizing: border-box;
+  padding: 0 0.06667rem;
+  text-align: center;
+  color: #fff;
+  margin-top: 0.13333rem;
+}
+
+.box .buyBox input::placeholder {
+  color: rgba(255, 255, 255, 0.6);
+}
+
+.box .buyBox .buy {
+  width: 1.38667rem;
+  height: 0.58667rem;
+  line-height: 0.61333rem;
+  background: url(../images/buy.png) no-repeat;
+  background-size: 100% 100%;
+  text-align: center;
+  margin-top: 0.08rem;
+  color: #fff;
+}
+
+.box ul {
+  text-align: center;
+  height: 3.24rem;
+  overflow-y: scroll;
+  position: absolute;
+  left: 0.77333rem;
+  top: 7.5rem;
+}
+
+.box ul::-webkit-scrollbar {
+  display: none;
+}
+
+.box ul li {
+  height: 100%;
+  height: 0.48rem;
+  line-height: 0.48rem;
+  border-radius: 0.48rem;
+  margin-bottom: 0.13333rem;
+  background: linear-gradient(180deg, #2E2B99 0%, #934AEE 100%);
+  border: 0.01333rem solid #FFCDFC;
+  padding: 0 0.26667rem;
+}
+
+.box ul li .gift {
+  display: block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
+  float: left;
+  margin-right: 0.05333rem;
+  margin-top: 0.02667rem;
+}
+
+.box ul li .nick {
+  color: #fff;
+  font-size: 0.26667rem;
+  float: left;
+  margin-right: 0.05333rem;
+}
+
+.box ul li .gold {
+  display: block;
+  width: 0.29333rem;
+  height: 0.29333rem;
+  float: left;
+  margin-right: 0.05333rem;
+  margin-top: 0.08rem;
+}
+
+.box ul li .num {
+  float: left;
+  color: #fff;
+  margin-right: 0.10667rem;
+}
+
+.box ul li b {
+  display: block;
+  float: left;
+  color: #FFD95C;
+  font-size: 0.32rem;
+  font-weight: bold;
+}
+
+.mc {
+  position: fixed;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: #8B37E4;
+  display: none;
+}
+
+.mc .text {
+  color: #fff;
+  text-align: center;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  font-size: 0.34667rem;
+}

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

@@ -0,0 +1,264 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+    // background: rgba(120, 33, 232, .8);
+    background: #8B37E4;
+}
+
+.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);
+    }
+}
+
+.box {
+    width: px2rem(750);
+    height: 14.50667rem;
+    background: url(../images/box.png) no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    margin: 0 auto 0;
+
+    .a {
+        position: absolute;
+        background: rgba(255, 255, 255, 0.6);
+        width: 1.5rem;
+        text-align: center;
+        color: #4F00B0;
+        height: px2rem(40);
+        line-height: px2rem(40);
+        right: 0;
+        border-radius: px2rem(40) px2rem(0) 0 px2rem(40);
+        text-indent: 0.15rem;
+        font-size: px2rem(23);
+        font-weight: 500;
+    }
+
+    .rank {
+        top: 0.8rem;
+        z-index: 999;
+    }
+
+    .rule {
+        top: 1.6rem;
+    }
+
+    .record {
+        top: 2.4rem;
+    }
+
+    .egg {
+        width: px2rem(614);
+        height: px2rem(416);
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: 5rem;
+    }
+
+    .but {
+        width: 100%;
+        height: px2rem(98);
+        display: flex;
+        justify-content: space-between;
+        position: absolute;
+        bottom: px2rem(80);
+        left: 50%;
+        transform: translateX(-50%);
+        box-sizing: border-box;
+        padding: 0 px2rem(40);
+
+        img {
+            width: px2rem(152);
+            height: px2rem(98);
+            display: block;
+        }
+    }
+
+    .buyBox {
+        // width: px2rem(576);
+        width: 95%;
+        height: px2rem(56);
+        background: #934DED;
+        position: absolute;
+        bottom: px2rem(0);
+        left: 50%;
+        transform: translateX(-50%);
+        border-radius: px2rem(30) px2rem(30) 0 0;
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        padding: px2rem(2) px2rem(15) 0;
+        font-size: px2rem(22);
+
+        .prop {
+            height: 100%;
+            line-height: px2rem(56);
+            color: #fff;
+        }
+
+        .tab {
+            width: 3rem;
+            display: flex;
+            justify-content: space-between;
+            background: #4F00B0;
+            height: px2rem(32);
+            border-radius: px2rem(32);
+            line-height: px2rem(32);
+            margin-top: px2rem(12);
+
+            span {
+                text-align: center;
+                width: px2rem(80);
+                height: px2rem(32);
+                background: none;
+                color: rgba(255, 255, 255, 0.5);
+                border-radius: px2rem(32);
+                line-height: px2rem(32);
+            }
+
+            .act {
+                background: rgba(255, 255, 255, 0.6);
+                color: #fff;
+            }
+        }
+
+        input {
+            background: #4F00B0;
+            outline: none;
+            width: 2.2rem;
+            height: px2rem(36);
+            border-radius: px2rem(36);
+            line-height: px2rem(36);
+            box-sizing: border-box;
+            padding: 0 px2rem(5);
+            text-align: center;
+            color: #fff;
+            margin-top: px2rem(10);
+
+            &::placeholder {
+                color: rgba(255, 255, 255, 0.6);
+            }
+        }
+
+        .buy {
+            width: px2rem(104);
+            height: px2rem(44);
+            line-height: px2rem(46);
+            background: url(../images/buy.png) no-repeat;
+            background-size: 100% 100%;
+            text-align: center;
+            margin-top: px2rem(6);
+            color: #fff;
+        }
+    }
+
+    ul {
+        // min-width: px2rem(236);
+        text-align: center;
+        height: 3.24rem;
+        overflow-y: scroll;
+        position: absolute;
+        left: px2rem(58);
+        top: 7.5rem;
+
+        &::-webkit-scrollbar {
+            display: none;
+        }
+
+        li {
+            height: 100%;
+            height: px2rem(36);
+            line-height: px2rem(36);
+            border-radius: px2rem(36);
+            margin-bottom: px2rem(10);
+            background: linear-gradient(180deg, #2E2B99 0%, #934AEE 100%);
+            border: px2rem(1) solid #FFCDFC;
+            padding: 0 px2rem(20);
+
+            .gift {
+                display: block;
+                width: px2rem(32);
+                height: px2rem(32);
+                border-radius: 50%;
+                float: left;
+                margin-right: px2rem(4);
+                margin-top: px2rem(2);
+            }
+
+            .nick {
+                color: #fff;
+                font-size: px2rem(20);
+                float: left;
+                margin-right: px2rem(4);
+            }
+
+            .gold {
+                display: block;
+                width: px2rem(22);
+                height: px2rem(22);
+                float: left;
+                margin-right: px2rem(4);
+                margin-top: px2rem(6);
+            }
+
+            .num {
+                float: left;
+                color: #fff;
+                margin-right: px2rem(8);
+            }
+
+            b {
+                display: block;
+                float: left;
+                color: #FFD95C;
+                font-size: px2rem(24);
+                font-weight: bold;
+            }
+        }
+    }
+}
+
+.mc {
+    position: fixed;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    right: 0;
+    background: #8B37E4;
+    display: none;
+
+    .text {
+        color: #fff;
+        text-align: center;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        font-size: px2rem(26);
+    }
+}

view/molistar/modules/smashEggs/css/rank.css

@@ -0,0 +1,133 @@
+html,
+body {
+  width: 100%;
+  background: #8B37E4;
+}
+
+.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;
+}
+
+.box {
+  width: 10rem;
+  height: 17.72rem;
+  background: url(../images/rankBg.png) no-repeat;
+  background-size: 100% 14.72rem;
+  overflow: hidden;
+}
+
+.box .tab {
+  width: 6rem;
+  height: 1.06667rem;
+  line-height: 1.06667rem;
+  background: url(../images/tabBg.png) no-repeat;
+  background-size: 100% 100%;
+  margin: 2.13333rem auto 0.69333rem;
+  display: flex;
+  justify-content: space-between;
+  position: relative;
+  z-index: 999;
+}
+
+.box .tab div {
+  width: 2.98667rem;
+  text-align: center;
+  color: rgba(255, 255, 255, 0.7);
+}
+
+.box .tab .act0 {
+  background: url(../images/left.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.box .tab .act1 {
+  background: url(../images/right.png) no-repeat;
+  background-size: 100% 100%;
+}
+
+.box ul {
+  width: 100%;
+  padding: 0 0.32rem;
+  box-sizing: border-box;
+  height: 14.4rem;
+  overflow-y: scroll;
+  margin: 0 auto;
+}
+
+.box ul::-webkit-scrollbar {
+  display: none;
+}
+
+.box ul li {
+  width: 100%;
+  height: 1.54667rem;
+  margin-bottom: 0.58667rem;
+  line-height: 1.54667rem;
+}
+
+.box ul li .num {
+  width: 0.58667rem;
+  text-align: center;
+  color: #FFFBE3;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  float: left;
+  margin-right: 0.53333rem;
+}
+
+.box ul li .tx {
+  width: 1.54667rem;
+  height: 1.54667rem;
+  border-radius: 50%;
+  display: block;
+  margin-right: 0.21333rem;
+  float: left;
+}
+
+.box ul li .nick {
+  width: 2.98667rem;
+  color: #fff;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  float: left;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.box ul li .right {
+  float: right;
+  color: #FFEF41;
+  font-size: 0.37333rem;
+  font-weight: 600;
+}
+
+.box ul li .right .gold {
+  vertical-align: middle;
+  display: inline-block;
+}
+
+.box ul li .right img {
+  vertical-align: middle;
+  display: inline-block;
+  width: 0.4rem;
+  height: 0.4rem;
+}

view/molistar/modules/smashEggs/css/rank.scss

@@ -0,0 +1,139 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    // background: rgba(120, 33, 232, .8);
+    background: #8B37E4;
+
+}
+
+.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);
+    }
+}
+
+.box {
+    width: px2rem(750);
+    height: 17.72rem;
+    background: url(../images/rankBg.png) no-repeat;
+    background-size: 100% px2rem(1104);
+    overflow: hidden;
+
+    .tab {
+        width: px2rem(450);
+        height: px2rem(80);
+        line-height: px2rem(80);
+        background: url(../images/tabBg.png) no-repeat;
+        background-size: 100% 100%;
+        margin: px2rem(160) auto px2rem(52);
+        display: flex;
+        justify-content: space-between;
+        position: relative;
+        z-index: 999;
+
+        div {
+            width: px2rem(224);
+            text-align: center;
+            color: rgba(255, 255, 255, 0.7);
+        }
+
+        .act0 {
+            background: url(../images/left.png) no-repeat;
+            background-size: 100% 100%;
+        }
+
+        .act1 {
+            background: url(../images/right.png) no-repeat;
+            background-size: 100% 100%;
+        }
+    }
+
+    ul {
+        width: 100%;
+        padding: 0 px2rem(24);
+        box-sizing: border-box;
+        height: 14.4rem;
+        overflow-y: scroll;
+        margin: 0 auto;
+
+        &::-webkit-scrollbar {
+            display: none;
+        }
+
+        li {
+            width: 100%;
+            height: px2rem(116);
+            margin-bottom: px2rem(44);
+            line-height: px2rem(116);
+
+            .num {
+                width: px2rem(44);
+                text-align: center;
+                color: #FFFBE3;
+                font-size: px2rem(32);
+                font-weight: 500;
+                float: left;
+                margin-right: px2rem(40);
+            }
+
+            .tx {
+                width: px2rem(116);
+                height: px2rem(116);
+                border-radius: 50%;
+                display: block;
+                margin-right: px2rem(16);
+                float: left;
+            }
+
+            .nick {
+                width: px2rem(224);
+                color: #fff;
+                font-size: px2rem(28);
+                font-weight: 400;
+                float: left;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+            }
+
+            .right {
+                float: right;
+                color: #FFEF41;
+                font-size: px2rem(28);
+                font-weight: 600;
+
+                .gold {
+                    vertical-align: middle;
+                    display: inline-block;
+                }
+
+                img {
+                    vertical-align: middle;
+                    display: inline-block;
+                    width: px2rem(30);
+                    height: px2rem(30);
+                }
+            }
+        }
+    }
+}