‘新增指引公会-阿拉伯’

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

@@ -0,0 +1,61 @@
+html,
+body {
+  width: 100%;
+  height: 17.78667rem;
+  background: #F5F7F9;
+  box-sizing: border-box;
+  padding: 1.6rem 0.36rem 0 0.36rem;
+  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: 32%;
+}
+
+p {
+  color: #000000;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  float: right;
+  width: 100%;
+  margin-bottom: 0.46667rem;
+}
+
+.title {
+  margin-bottom: 0.69333rem;
+}
+
+img {
+  display: block;
+  width: 3.77333rem;
+  margin: 0.33333rem 0;
+}
+
+.null {
+  height: 0.48rem;
+}
+
+.arabic .back img {
+  transform: rotate(180deg);
+  left: auto;
+  right: 0.24rem;
+}

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

@@ -0,0 +1,67 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: px2rem(1334);
+    background: #F5F7F9;
+    box-sizing: border-box;
+    padding: px2rem(120) px2rem(27) 0 px2rem(27);
+    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: 32%;
+    }
+}
+
+p {
+    color: #000000;
+    font-size: px2rem(28);
+    font-weight: 400;
+    float: right;
+    width: 100%;
+    margin-bottom: px2rem(35);
+}
+
+.title {
+    margin-bottom: px2rem(52);
+}
+
+img {
+    display: block;
+    width: px2rem(283);
+    margin: px2rem(25) 0;
+    // float: right;
+}
+.null{
+    height: px2rem(36);
+}
+
+.arabic {
+    .back img {
+        transform: rotate(180deg);
+        left: auto;
+        right: 0.24rem;
+    }
+}

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

@@ -179,6 +179,8 @@ body {
   text-align: left;
   box-sizing: border-box;
   padding: 0 0.13333rem;
+  position: relative;
+  word-spacing: normal;
 }
 
 .headerBox .headerBox_in div img {
@@ -188,6 +190,12 @@ body {
   vertical-align: middle;
 }
 
+.headerBox .headerBox_in div .why {
+  width: 0.53333rem;
+  height: 0.53333rem;
+  margin-top: -0.06667rem;
+}
+
 .headerBox .headerBox_in div span {
   display: inline-block;
   color: #313131;
@@ -408,7 +416,8 @@ body {
   line-height: 0.45333rem;
 }
 
-.weeklyRewards .weeklyRewards_in .box .right .speedOfProgress span, .weeklyRewards .weeklyRewards_in .box .right .speedOfProgress b {
+.weeklyRewards .weeklyRewards_in .box .right .speedOfProgress span,
+.weeklyRewards .weeklyRewards_in .box .right .speedOfProgress b {
   color: #7B7B7D;
   font-size: 0.32rem;
   font-weight: 400;

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

@@ -184,6 +184,8 @@ body {
             text-align: left;
             box-sizing: border-box;
             padding: 0 px2rem(10);
+            position: relative;
+            word-spacing: normal;
 
             img {
                 display: inline;
@@ -192,6 +194,16 @@ body {
                 vertical-align: middle;
             }
 
+            .why {
+                width: px2rem(40);
+                height: px2rem(40);
+                margin-top: px2rem(-5);
+                // right: px2rem(50);
+                // top: 53%;
+                // transform: translateY(-50%);
+                // position: absolute;
+            }
+
             span {
                 display: inline-block;
                 color: #313131;
@@ -410,7 +422,8 @@ body {
                     height: px2rem(34);
                     line-height: px2rem(34);
 
-                    span,b {
+                    span,
+                    b {
                         color: #7B7B7D;
                         font-size: px2rem(24);
                         font-weight: 400;

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

@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="ar">
+
+<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/guide.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back3.png" alt="">
+        <b class="text2"></b>
+    </div>
+    <p class="title">اهلا ايها مضيفون مولي ستار</p>
+    <p>عندنا اثنان طريقان لسحب الرواتب، طريق وكيل الشحن وطريق وكيل المضيفين، يشيركم التفاصيل فيما يلي:</p>
+    <p>طريق وكيل الشحن:</p>
+    <p>ادخل صفحة وكالتي، من ثم حسلب الرواتب، من ثم شخصي </p>
+    <p>طريق وكيل المضيفين</p>
+    <p>ادخل صفحة وكالتي، من ثم حساب الرواتب، من ثم وكيل </p>
+    <img src="./images/guide1.png" alt="">
+    <p>طريق وكيل المضيفين</p>
+    <p>ادخل صفحة وكالتي، من ثم حساب الرواتب، من ثم وكيل </p>
+    <img src="./images/guide2.png" alt="">
+    <div class="null"></div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<!-- <script src="./js/guide.js"></script> -->
+<script src="../../common/local/langHandler.js"></script>
+<script>
+    let browser = checkVersion()
+    $(function () {
+        let env = EnvCheck();
+        if (env == 'test') {
+            new VConsole();
+        }
+        getInfoFromClient()
+        setTimeout(() => {
+            // 頁面全屏
+            if (browser.app) {
+                if (browser.android) {
+                    window.androidJsObj.initShowNav(false)
+                } else {
+                    window.webkit.messageHandlers.initShowNav.postMessage(0)
+                }
+            };
+            // 頂部返回事件
+            $('.back img').click(() => {
+                window.history.back();
+            })
+            fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
+            translateFun();
+        }, 100);
+    })
+    function translateFun() {
+        const langReplace = window.lang.replace;
+        const localLang = window.lang;
+        $('.text3').text(langReplace(localLang.demoModule.text3));
+    }
+</script>

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

@@ -75,8 +75,9 @@
                 <span class="newtext1"></span>
             </div>
             <div style="display: none;" class="memberFlow2 FFEFE5">
-                <img src="./images/icon2.png" alt="">
-                <span class="newtext2"></span>
+                <b><img src="./images/icon2.png" alt="">
+                    <span class="newtext2"></span></b>
+                <img src="./images/why.png" alt="" class="why">
             </div>
             <div style="display: none;" class="guildInfoSet">
                 <img src="./images/icon3.png" alt="">

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

@@ -388,8 +388,13 @@ $('.memberFlow').click(function (params) {
     window.location.href = `./personal.html?roleTypes=${roleTypes}`
 })
 // 薪资账户
-$('.memberFlow2').click(function (params) {
+$('.memberFlow2 b').click(function (params) {
     window.location.href = `./salary_account.html`
+    return
+})
+$('.memberFlow2 .why').click(function () {
+    window.location.href = `./guide.html`
+    return
 })
 // 邀请成员
 $('.inveMember').click(function (params) {