新增exp活动

清理缓存
2024-08-12 19:38:36 +08:00 · 2024-08-07 14:54:38 +08:00 · 2024-08-07 14:53:30 +08:00 · 2024-08-07 14:18:37 +08:00 · 2024-08-07 14:02:54 +08:00 · 2024-08-06 10:36:14 +08:00
122 changed files with 10700 additions and 1436 deletions
--- a/view/molistar/activity/exp/css/DIN-BlackItalic.ttf
+++ b/view/molistar/activity/exp/css/DIN-BlackItalic.ttf
--- a/view/molistar/activity/exp/css/Source-KeynoteartHans.ttf
+++ b/view/molistar/activity/exp/css/Source-KeynoteartHans.ttf
--- a/view/molistar/activity/exp/css/index.css
+++ b/view/molistar/activity/exp/css/index.css
--- a/view/molistar/activity/exp/css/index.scss
+++ b/view/molistar/activity/exp/css/index.scss
--- a/view/molistar/activity/exp/images/VIP.png
+++ b/view/molistar/activity/exp/images/VIP.png
--- a/view/molistar/activity/exp/images/bigGold.png
+++ b/view/molistar/activity/exp/images/bigGold.png
--- a/view/molistar/activity/exp/images/boxBg.png
+++ b/view/molistar/activity/exp/images/boxBg.png
--- a/view/molistar/activity/exp/images/boxBg2.png
+++ b/view/molistar/activity/exp/images/boxBg2.png
--- a/view/molistar/activity/exp/images/dam.png
+++ b/view/molistar/activity/exp/images/dam.png
--- a/view/molistar/activity/exp/images/expIcon.png
+++ b/view/molistar/activity/exp/images/expIcon.png
--- a/view/molistar/activity/exp/images/expRule.png
+++ b/view/molistar/activity/exp/images/expRule.png
--- a/view/molistar/activity/exp/images/expTitle.png
+++ b/view/molistar/activity/exp/images/expTitle.png
--- a/view/molistar/activity/exp/images/giftBg.png
+++ b/view/molistar/activity/exp/images/giftBg.png
--- a/view/molistar/activity/exp/images/giftBg_ar.png
+++ b/view/molistar/activity/exp/images/giftBg_ar.png
--- a/view/molistar/activity/exp/images/giftBg_en.png
+++ b/view/molistar/activity/exp/images/giftBg_en.png
--- a/view/molistar/activity/exp/images/giftList1.png
+++ b/view/molistar/activity/exp/images/giftList1.png
--- a/view/molistar/activity/exp/images/giftList1_ar.png
+++ b/view/molistar/activity/exp/images/giftList1_ar.png
--- a/view/molistar/activity/exp/images/giftList1_en.png
+++ b/view/molistar/activity/exp/images/giftList1_en.png
--- a/view/molistar/activity/exp/images/giftList2.png
+++ b/view/molistar/activity/exp/images/giftList2.png
--- a/view/molistar/activity/exp/images/giftList2_ar.png
+++ b/view/molistar/activity/exp/images/giftList2_ar.png
--- a/view/molistar/activity/exp/images/giftList2_en.png
+++ b/view/molistar/activity/exp/images/giftList2_en.png
--- a/view/molistar/activity/exp/images/giftList3.png
+++ b/view/molistar/activity/exp/images/giftList3.png
--- a/view/molistar/activity/exp/images/giftList3_ar.png
+++ b/view/molistar/activity/exp/images/giftList3_ar.png
--- a/view/molistar/activity/exp/images/giftList3_en.png
+++ b/view/molistar/activity/exp/images/giftList3_en.png
--- a/view/molistar/activity/exp/images/giftList4.png
+++ b/view/molistar/activity/exp/images/giftList4.png
--- a/view/molistar/activity/exp/images/giftList4_ar.png
+++ b/view/molistar/activity/exp/images/giftList4_ar.png
--- a/view/molistar/activity/exp/images/giftList4_en.png
+++ b/view/molistar/activity/exp/images/giftList4_en.png
--- a/view/molistar/activity/exp/images/giftListBg.png
+++ b/view/molistar/activity/exp/images/giftListBg.png
--- a/view/molistar/activity/exp/images/gold.png
+++ b/view/molistar/activity/exp/images/gold.png
--- a/view/molistar/activity/exp/images/header.png
+++ b/view/molistar/activity/exp/images/header.png
--- a/view/molistar/activity/exp/images/header_ar.png
+++ b/view/molistar/activity/exp/images/header_ar.png
--- a/view/molistar/activity/exp/images/header_en.png
+++ b/view/molistar/activity/exp/images/header_en.png
--- a/view/molistar/activity/exp/images/line.png
+++ b/view/molistar/activity/exp/images/line.png
--- a/view/molistar/activity/exp/images/listBox.png
+++ b/view/molistar/activity/exp/images/listBox.png
--- a/view/molistar/activity/exp/images/listBox2.png
+++ b/view/molistar/activity/exp/images/listBox2.png
--- a/view/molistar/activity/exp/images/logo.png
+++ b/view/molistar/activity/exp/images/logo.png
--- a/view/molistar/activity/exp/images/myListBg.png
+++ b/view/molistar/activity/exp/images/myListBg.png
--- a/view/molistar/activity/exp/images/qp.png
+++ b/view/molistar/activity/exp/images/qp.png
--- a/view/molistar/activity/exp/images/rule1.png
+++ b/view/molistar/activity/exp/images/rule1.png
--- a/view/molistar/activity/exp/images/rule1_ar.png
+++ b/view/molistar/activity/exp/images/rule1_ar.png
--- a/view/molistar/activity/exp/images/rule1_en.png
+++ b/view/molistar/activity/exp/images/rule1_en.png
--- a/view/molistar/activity/exp/images/rule2.png
+++ b/view/molistar/activity/exp/images/rule2.png
--- a/view/molistar/activity/exp/images/rule2_ar.png
+++ b/view/molistar/activity/exp/images/rule2_ar.png
--- a/view/molistar/activity/exp/images/rule2_en.png
+++ b/view/molistar/activity/exp/images/rule2_en.png
--- a/view/molistar/activity/exp/images/ruleBg.png
+++ b/view/molistar/activity/exp/images/ruleBg.png
--- a/view/molistar/activity/exp/images/rule_iconBg.png
+++ b/view/molistar/activity/exp/images/rule_iconBg.png
--- a/view/molistar/activity/exp/images/s-giftBg.png
+++ b/view/molistar/activity/exp/images/s-giftBg.png
--- a/view/molistar/activity/exp/images/tab1.png
+++ b/view/molistar/activity/exp/images/tab1.png
--- a/view/molistar/activity/exp/images/tab2.png
+++ b/view/molistar/activity/exp/images/tab2.png
--- a/view/molistar/activity/exp/images/textBox.png
+++ b/view/molistar/activity/exp/images/textBox.png
--- a/view/molistar/activity/exp/images/title.png
+++ b/view/molistar/activity/exp/images/title.png
--- a/view/molistar/activity/exp/images/top1.png
+++ b/view/molistar/activity/exp/images/top1.png
--- a/view/molistar/activity/exp/images/top2.png
+++ b/view/molistar/activity/exp/images/top2.png
--- a/view/molistar/activity/exp/images/top3.png
+++ b/view/molistar/activity/exp/images/top3.png
--- a/view/molistar/activity/exp/images/topReward.png
+++ b/view/molistar/activity/exp/images/topReward.png
--- a/view/molistar/activity/exp/images/topReward_ar.png
+++ b/view/molistar/activity/exp/images/topReward_ar.png
--- a/view/molistar/activity/exp/images/topReward_en.png
+++ b/view/molistar/activity/exp/images/topReward_en.png
--- a/view/molistar/activity/exp/images/travel/back.png
+++ b/view/molistar/activity/exp/images/travel/back.png
--- a/view/molistar/activity/exp/images/travel/backB.png
+++ b/view/molistar/activity/exp/images/travel/backB.png
--- a/view/molistar/activity/exp/images/ts.png
+++ b/view/molistar/activity/exp/images/ts.png
--- a/view/molistar/activity/exp/images/ulBg.png
+++ b/view/molistar/activity/exp/images/ulBg.png
--- a/view/molistar/activity/exp/images/why.png
+++ b/view/molistar/activity/exp/images/why.png
--- a/view/molistar/activity/exp/images/xz.png
+++ b/view/molistar/activity/exp/images/xz.png
--- a/view/molistar/activity/exp/images/zj.png
+++ b/view/molistar/activity/exp/images/zj.png
--- a/view/molistar/activity/exp/index.html
+++ b/view/molistar/activity/exp/index.html
@@ -0,0 +1,334 @@
+<!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="ruleIcon"><i class="text2"></i></div>
+        <div class="tiem text3"></div>
+    </div>
+    <!-- 活动礼物 -->
+    <div class="giftBox">
+        <h3 class="text4"></h3>
+        <div class="textBox">
+            <img src="./images/VIP.png" alt="" class="vip">
+            <div class="p1 text5"></div>
+            <div class="p2 text6"></div>
+        </div>
+        <div class="giftList">
+            <div>
+                <div class="exp text48"></div>
+                <img src="./images/giftList1.png" alt="" class="gift newIMg1">
+                <p class="text7"></p>
+                <span>
+                    <img src="./images/gold.png" alt="" class="gold">
+                    <i class="text44"></i>
+                </span>
+            </div>
+            <div>
+                <div class="exp text49"></div>
+                <img src="./images/giftList2.png" alt="" class="gift newIMg2">
+                <p class="text8"></p>
+                <span>
+                    <img src="./images/gold.png" alt="" class="gold">
+                    <i class="text45"></i>
+                </span>
+            </div>
+            <div>
+                <div class="exp text50"></div>
+                <img src="./images/giftList3.png" alt="" class="gift newIMg3">
+                <p class="text9"></p>
+                <span>
+                    <img src="./images/gold.png" alt="" class="gold">
+                    <i class="text46"></i>
+                </span>
+            </div>
+            <div>
+                <div class="exp text51"></div>
+                <img src="./images/giftList4.png" alt="" class="gift newIMg4">
+                <p class="text10"></p>
+                <span>
+                    <img src="./images/gold.png" alt="" class="gold">
+                    <i class="text47"></i>
+                </span>
+            </div>
+        </div>
+    </div>
+    <!-- 等级 -->
+    <div class="listBox listBox1">
+        <div class="tab">
+            <div class="tab1 text19"></div>
+            <div class="tab2 text20"></div>
+        </div>
+        <h3><strong class="text21"> </strong><img src="./images/why.png" alt=""></h3>
+        <div class="expBox">
+            <img src="./images/dam.png" alt="" class="dam">
+            <div class="top">
+                <div class="l text11"></div>
+                <div class="r text12"></div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">15<b class="text13"></b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext1">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/ts.png" alt="" class="gift ts">
+                        <p class="text14">头饰</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtexts1">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/qp.png" alt="" class="gift qp">
+                        <p class="text15">气泡</p>
+                    </div>
+                    <div class="but act"></div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">20<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext2">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/ts.png" alt="" class="gift ts">
+                        <p class="text14">头饰</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText11">*50</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">25<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext3">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/zj.png" alt="" class="gift zj">
+                        <p class="text16">座駕</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText22">*100</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">30<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext4">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/xz.png" alt="" class="gift xz">
+                        <p class="text17">勳章</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText33">*300</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">35<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext5">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/qp.png" alt="" class="gift qp">
+                        <p class="text18">氣泡</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText44">*500</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">40<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext6">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/ts.png" alt="" class="gift ts">
+                        <p class="text14">頭飾</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText55">*1000</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">45<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext7">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/zj.png" alt="" class="gift">
+                        <p class="text16"></p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift zj">
+                        <p><b class="newText66">*1500</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <!-- == -->
+            <div class="bottom">
+                <div class="l">50<b class="text13">级</b></div>
+                <div class="r">
+                    <div class="gift_sbox">
+                        <div class="title"><strong class="newtext8">7</strong><strong class="text22">天</strong></div>
+                        <img src="./images/xz.png" alt="" class="gift xz">
+                        <p class="text17">勳章</p>
+                    </div>
+                    <div class="gift_sbox">
+                        <!-- <div class="title">7<strong class="text22">天</strong></div> -->
+                        <img src="./images/bigGold.png" alt="" class="gift">
+                        <p><b class="newText77">*2000</b></p>
+                    </div>
+                    <div class="but">已领取</div>
+                </div>
+            </div>
+            <div class="my">
+                <img src="./images/logo.png" alt="" class="tx">
+                <div class="user">
+                    <p></p>
+                    <div class="lineBox">
+                        <img src="./images/line.png" alt="" class="line">
+                        <div class="content"><strong class="text23"></strong> <b>70%</b></div>
+                    </div>
+                    <div class="exp">
+                        <div><strong class="text24"></strong><b class="b1">0</b></div>
+                        <div>LV.<b class="b2">0</b></div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 榜单 -->
+    <div class="listBox2">
+        <!-- 切换 -->
+        <div class="tab">
+            <div class="tab1 text19"></div>
+            <div class="tab2 text20"></div>
+        </div>
+        <!-- 榜一奖励 -->
+        <div class="topReward">
+            <div class="listRule text25"></div>
+        </div>
+        <!-- 文案描述 -->
+        <div class="content1 text26"></div>
+        <div class="content2 text27"></div>
+        <!-- 前三 -->
+        <div class="top1">
+            <img src="./images/top1.png" alt="" class="ts">
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick"></div>
+            <div class="score">EXP:<b>0</b></div>
+        </div>
+        <div class="top2">
+            <img src="./images/top2.png" alt="" class="ts">
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick"></div>
+            <div class="score">EXP:<b>0</b></div>
+        </div>
+        <div class="top3">
+            <img src="./images/top3.png" alt="" class="ts">
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick"></div>
+            <div class="score">EXP:<b>0</b></div>
+        </div>
+        <!-- 非前三 -->
+        <ul>
+            <!-- <li>
+                <div class="num">TOP04</div>
+                <img src="./images/logo.png" alt="" class="tx">
+                <div class="nick"></div>
+                <div class="right">
+                    <p>EXP值</p>
+                    <span class="score">0</span>
+                </div>
+            </li> -->
+        </ul>
+        <!-- 自己 -->
+        <div class="my">
+            <div class="rank"></div>
+            <div class="num"></div>
+            <img src="./images/logo.png" alt="" class="tx">
+            <div class="nick"></div>
+            <div class="right">
+                <p></p>
+                <span class="score">0</span>
+            </div>
+        </div>
+    </div>
+    <!-- EXP疑问弹窗 -->
+    <div class="exp_pub">
+        <div class="exp_pub_in">
+            <div class="title text28"></div>
+            <h3 class="text29"></h3>
+            <div class="box">
+                <div class="top">
+                    <div class="l text12">等级</div>
+                    <div class="r text30"></div>
+                </div>
+                <!-- <div class="bottom">
+                    <div class="l">1级</div>
+                    <div class="r">5000</div>
+                </div> -->
+            </div>
+        </div>
+    </div>
+    <!-- 规则弹窗 -->
+    <div class="rule">
+        <div class="rule_in">
+            <div class="tab">
+                <div class="stab1 act1 text31"></div>
+                <div class="stab2 text32"></div>
+            </div>
+            <div class="box">
+                <img src="./images/rule1.png" alt="" class="img1">
+                <img src="./images/rule2.png" alt="" class="img2">
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./local/en.js"></script>
+<script src="./local/zh.js"></script>
+<script src="./local/ar.js"></script>
+<script src="./js/index.js?v=1.1"></script>
+<script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/activity/exp/js/index.js
+++ b/view/molistar/activity/exp/js/index.js
@@ -0,0 +1,363 @@
+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 isLock = true;
+var page = 1;
+// 初始化函數
+$(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)
+})
+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));
+    $('.text15').text(langReplace(localLang.demoModule.text15));
+    $('.text16').text(langReplace(localLang.demoModule.text16));
+    $('.text17').text(langReplace(localLang.demoModule.text17));
+    $('.text18').text(langReplace(localLang.demoModule.text18));
+    $('.text19').text(langReplace(localLang.demoModule.text19));
+    $('.text20').text(langReplace(localLang.demoModule.text20));
+    $('.text21').text(langReplace(localLang.demoModule.text21));
+    $('.text22').text(langReplace(localLang.demoModule.text22));
+    $('.text23').text(langReplace(localLang.demoModule.text23));
+    $('.text24').text(langReplace(localLang.demoModule.text24));
+    $('.text25').text(langReplace(localLang.demoModule.text25));
+    $('.text26').text(langReplace(localLang.demoModule.text26));
+    $('.text27').text(langReplace(localLang.demoModule.text27));
+    $('.text28').text(langReplace(localLang.demoModule.text28));
+    $('.text29').text(langReplace(localLang.demoModule.text29));
+    $('.text30').text(langReplace(localLang.demoModule.text30));
+    $('.text31').text(langReplace(localLang.demoModule.text31));
+    $('.text32').text(langReplace(localLang.demoModule.text32));
+    $('.text43').text(langReplace(localLang.demoModule.text43));
+    $('.text44').text(langReplace(localLang.demoModule.text44));
+    $('.text45').text(langReplace(localLang.demoModule.text45));
+    $('.text46').text(langReplace(localLang.demoModule.text46));
+    $('.text47').text(langReplace(localLang.demoModule.text47));
+    $('.text48').text(langReplace(localLang.demoModule.text48));
+    $('.text49').text(langReplace(localLang.demoModule.text49));
+    $('.text50').text(langReplace(localLang.demoModule.text50));
+    $('.text51').text(langReplace(localLang.demoModule.text51));
+    $('.newtext1').text(langReplace(localLang.demoModule.newtext1));
+    $('.newtexts1').text(langReplace(localLang.demoModule.newtexts1));
+    $('.newtext2').text(langReplace(localLang.demoModule.newtext2));
+    $('.newtext3').text(langReplace(localLang.demoModule.newtext3));
+    $('.newtext4').text(langReplace(localLang.demoModule.newtext4));
+    $('.newtext5').text(langReplace(localLang.demoModule.newtext5));
+    $('.newtext6').text(langReplace(localLang.demoModule.newtext6));
+    $('.newtext7').text(langReplace(localLang.demoModule.newtext7));
+    $('.newtext8').text(langReplace(localLang.demoModule.newtext8));
+    $('.newText11').text(langReplace(localLang.demoModule.newText11));
+    $('.newText22').text(langReplace(localLang.demoModule.newText22));
+    $('.newText33').text(langReplace(localLang.demoModule.newText33));
+    $('.newText44').text(langReplace(localLang.demoModule.newText44));
+    $('.newText55').text(langReplace(localLang.demoModule.newText55));
+    $('.newText66').text(langReplace(localLang.demoModule.newText66));
+    $('.newText77').text(langReplace(localLang.demoModule.newText77));
+    $('.header').attr('style', langReplace(localLang.demoModule.img1))
+    $('.giftBox').attr('style', langReplace(localLang.demoModule.img2))
+    $('.listBox2 .topReward').attr('style', langReplace(localLang.demoModule.img5))
+    $('.rule .rule_in .box .img1').attr('src', langReplace(localLang.demoModule.img3))
+    $('.rule .rule_in .box .img2').attr('src', langReplace(localLang.demoModule.img4))
+    $('.newIMg1').attr('src', langReplace(localLang.demoModule.newIMg1))
+    $('.newIMg2').attr('src', langReplace(localLang.demoModule.newIMg2))
+    $('.newIMg3').attr('src', langReplace(localLang.demoModule.newIMg3))
+    $('.newIMg4').attr('src', langReplace(localLang.demoModule.newIMg4))
+}
+// 配置接口
+function getConfig() {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/act/expBattle/getConfig',
+        success(res) {
+            if (res.code === 200) {
+                // 活动结束
+                if ((res.data.endTime - res.timestamp) <= 0) {
+                    $('.header .tiem').text(langReplace(localLang.demoModule.text33));
+                }
+                var me = res.data.me
+                // 处理自己
+                $('.listBox .expBox .my .tx').attr('src', me.avatar);
+                $('.listBox .expBox .my .user p').text(me.nick);
+                $('.listBox .expBox .my .user .exp .b1').text(me.level);
+                $('.listBox .expBox .my .user .exp .b2').text(me.level + 1);
+                if (me.level >= 50) {
+                    $('.listBox .expBox .my .user .exp .b2').text(me.level);
+                }
+                // 处理任务状态
+                var levelTaskStatusMap = res.data.levelTaskStatusMap;
+                const sortedKeys = Object.keys(levelTaskStatusMap).sort((a, b) => Number(a) - Number(b));
+                const sortedObj = {};
+                sortedKeys.forEach(key => {
+                    sortedObj[key] = levelTaskStatusMap[key];
+                });
+                Object.getOwnPropertyNames(sortedObj).forEach((res, i) => {
+                    if (sortedObj[res] == 0) {
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').removeClass('act');
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text34));
+                    } else if (sortedObj[res] == 1) {
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').addClass('act');
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text34));
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').attr("status", sortedObj[res]);
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').attr("leve", Object.keys(sortedObj)[i]);
+                    } else {
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').removeClass('act');
+                        $(`.listBox .expBox .bottom`).eq(i).children('.r').children('.but').text(langReplace(localLang.demoModule.text35));
+                    }
+                })
+                // 处理等级
+                var expLevelMap = res.data.expLevelMap;
+                const sortedKeys1 = Object.keys(expLevelMap).sort((a, b) => Number(a) - Number(b));
+                const sortedObj1 = {};
+                sortedKeys1.forEach(key => {
+                    sortedObj1[key] = expLevelMap[key];
+                });
+                var str = '';
+                $('.exp_pub .exp_pub_in .box .bottom').remove();
+                for (const key in sortedObj1) {
+                    if (sortedObj1.hasOwnProperty(key)) { // 仅遍历对象自身的属性，不包括继承的属性
+                        const value = sortedObj1[key];
+                        str += `
+                            <div class="bottom">
+                                    <div class="l">${value}${langReplace(localLang.demoModule.text13)}</div>
+                                    <div class="r">${key}</div>
+                            </div>
+                      `
+                    }
+                }
+                $('.exp_pub .exp_pub_in .box').append(str)
+                console.log(sortedKeys1);
+                $(`.listBox .expBox .my .user .lineBox .content b`).text(`（${me.score}/${sortedKeys1[me.level]}）`)
+                $('.listBox .expBox .my .user .lineBox .line').css('width', `${(me.score / sortedKeys1[me.level] * 100) > 100 ? 100 : me.score / sortedKeys1[me.level] * 100}%`)
+                if (me.level >= 50) {
+                    $(`.listBox .expBox .my .user .lineBox .content b`).text(me.score);
+                    $('.listBox .expBox .my .user .lineBox .line').css('width', `${100}%`)
+                }
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 打开EXP疑问弹窗
+$('.listBox h3 img').click(function () {
+    $('.exp_pub').show();
+    bodyScroolFun(true);
+})
+// 关闭EXP疑问弹窗
+$('.exp_pub').click(function () {
+    $('.exp_pub').hide();
+    bodyScroolFun(false);
+})
+// 榜单接口
+function getRank() {
+    showLoading()
+    networkRequest({
+        type: 'get',
+        url: urlPrefix + '/act/expBattle/getRank',
+        success(res) {
+            if (res.code === 200) {
+                var my = res.data.meRank;
+                var listTo3 = res.data.rankList.slice(0, 3);
+                var notListTo3 = res.data.rankList.slice(3);
+                if (listTo3.length < 3) {
+                    let arr = new Array(3 - listTo3.length).fill({
+                        avatar: './images/logo.png',
+                        nick: langReplace(localLang.demoModule.text36),
+                        score: 0
+                    })
+                    listTo3.push(...arr)
+                }
+                // 处理前三
+                listTo3.forEach((res, i) => {
+                    $(`.listBox2 .top${i + 1} .tx`).attr('src', res.avatar);
+                    $(`.listBox2 .top${i + 1} .nick`).text(res.nick);
+                    $(`.listBox2 .top${i + 1} .score b`).text(unitProcessingAr(res.score, 1));
+                })
+                // 非前三
+                $('.listBox2 ul li').remove();
+                var str = '';
+                notListTo3.forEach(res => {
+                    str += `
+                        <li>
+                            <div class="num">TOP${res.ranking}</div>
+                            <img src="${res.avatar}" alt="" class="tx">
+                            <div class="nick">${res.nick}</div>
+                            <div class="right">
+                                <p>${langReplace(localLang.demoModule.text37)}</p>
+                                <span class="score">${unitProcessingAr(res.score, 1)}</span>
+                            </div>
+                        </li>
+                    `
+                })
+                $('.listBox2 ul').append(str);
+                // 处理自己
+                if (my.ranking == 0) {
+                    if (res.data.rankList.length == 0) {
+                        $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text38)}0EXP`);
+                    } else {
+                        $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text39)}${unitProcessingAr(res.data.rankList[res.data.rankList.length - 1].score - my.score)}EXP`);
+                    }
+                } else {
+                    if (my.ranking == 1) {
+                        $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text40)}${unitProcessingAr(my.score - res.data.rankList[1].score, 1)}EXP`);
+                    } else {
+                        $('.listBox2 .my .rank').text(`${langReplace(localLang.demoModule.text41)}${unitProcessingAr(res.data.rankList[my.ranking - 2].score - my.score)}EXP`);
+                    }
+
+                }
+                $('.listBox2 .my .num').text(my.ranking == 0 ? langReplace(localLang.demoModule.text42) : `TOP${my.ranking}`)
+                $('.listBox2 .my .tx').attr('src', my.avatar);
+                $('.listBox2 .my .nick').text(my.nick)
+                $('.listBox2 .my .score').text(unitProcessingAr(my.score, 1))
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 切换等级和榜单
+$('.listBox .tab div,.listBox2 .tab div').click(function () {
+    var i = $(this).index() + 1;
+    $('.listBox2,.listBox1').hide()
+    $(`.listBox${i}`).show();
+    if (i == 2) {
+        getRank();
+    }
+})
+// 领取奖励按钮
+$('.listBox .expBox .bottom .r .but').click(function () {
+    var status = $(this).attr('status');
+    var leve = $(this).attr('leve');
+    if (status == 1) {
+        getReward(leve);
+    }
+})
+// 领取接口
+function getReward(level) {
+    showLoading()
+    networkRequest({
+        type: 'post',
+        url: urlPrefix + '/act/expBattle/getReward',
+        data: { level },
+        success(res) {
+            if (res.code === 200) {
+                getConfig();
+                toastMsg(langReplace(localLang.demoModule.text43));
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg(langReplace(localLang.demoModule.layerIndex3))
+        }
+    })
+}
+// 打开活动规则
+$('.header .ruleIcon').click(function () {
+    $('.rule .rule_in .tab div').removeClass('act1').removeClass('act2');
+    $('.rule .rule_in .tab .stab1 ').addClass(`act1`);
+    $(`.rule .rule_in .box .img1`).show().siblings().hide();
+    $('.rule').show();
+    bodyScroolFun(true);
+})
+// 打开榜单规则
+$('.listBox2 .topReward .listRule').click(function () {
+    $('.rule .rule_in .tab div').removeClass('act1').removeClass('act2');
+    $('.rule .rule_in .tab .stab2 ').addClass(`act2`);
+    $(`.rule .rule_in .box .img2`).show().siblings().hide();
+    $('.rule').show();
+    bodyScroolFun(true);
+})
+// 关闭活动规则
+$('.rule').click(function () {
+    $('.rule').hide();
+    bodyScroolFun(false);
+    return false
+})
+// 切换规则
+$('.rule .rule_in .tab div').click(function () {
+    var i = $(this).index() + 1;
+    $('.rule .rule_in .tab div').removeClass('act1').removeClass('act2');
+    $(this).addClass(`act${i}`);
+    $(`.rule .rule_in .box .img${i}`).show().siblings().hide();
+    return false
+})
--- a/view/molistar/activity/exp/local/ar.js
+++ b/view/molistar/activity/exp/local/ar.js
@@ -0,0 +1,86 @@
+// 阿拉伯
+langAr = {
+    // 模块
+    demoModule: {
+        layerIndex1: `جار التحميل...`,
+        layerIndex2: `تم العملية بنجاح`,
+        layerIndex3: `خطأ في الشبكة`,
+        img1: `background: url(./images/header_ar.png) no-repeat;background-size: 100% 100%;`,
+        img2: `background: url(./images/giftBg_ar.png) no-repeat;background-size: 100% 100%;`,
+        img5: `background: url(./images/topReward_ar.png) no-repeat;background-size: 100% 100%;`,
+        img3: `./images/rule1_ar.png`,
+        img4: `./images/rule2_ar.png`,
+        newIMg1:`./images/giftList1_ar.png`,
+        newIMg2:`./images/giftList2_ar.png`,
+        newIMg3:`./images/giftList3_ar.png`,
+        newIMg4:`./images/giftList4_ar.png`,
+        text1: `تحدى زيادة المستوى`,
+        text2: `قاعدة`,
+        text3: `توقيت الحدث :2024.08.22-2024.08.13`,
+        text4: `ارسال هديا ،لزيادة المستوى`,
+        text5: `مستخدم vip:يمكنه ارسال هديا الحدث والحصول على اعلي نقاط`,
+        text6: `509564EXP!`,
+        text7: `خاتم القمر`,
+        text8: `نجوم الفضاء `,
+        text9: `الفضائى`,
+        text10: `ملك الفضاء`,
+        text11: `مستوى`,
+        text12: `مكافئات`,
+        text13: `مستوى`,
+        text14: `اطارات`,
+        text15: `فقاعة محادثة`,
+        text16: `دخولية`,
+        text17: `وسام`,
+        text18: `فقاعة محادثة`,
+        text19: `مكافئة الحدث`,
+        text20: `ترتيب `,
+        text21: `(الوصول للمستوايات التالية يمكنك الحصول علي مكافئة)`,
+        text22: `سماء`,
+        // text23: `باقى على المستوى القادم`,
+        text23: ` `,
+        text24: `الحالي:LV.`,
+        text25: `قراءة المزيد`,
+        text26: `تبعا لهدايا الحدث المرسلة هيكون هناك ترتيب للحدث`,
+        text27: `(اول 50 مستخدم في قائمة الحدث يمكنهم الحصول علي جوائز)`,
+        text28: `نقاط المستوى `,
+        text29: `(ارسال هدايا وازداد فى نقاط المستوى)`,
+        text30: `جميع النقاط`,
+        text31: `قواعد الحدث`,
+        text32: `مكافئات الترتيب`,
+        text33: `انتهاء الحدث`,
+        text34: `احصل على `,
+        text35: `تم الحصول `,
+        text36: ` `,
+        text37: `قيمة الخبرة`,
+        text38: `باقى على الظهور في الترتيب :`,
+        text39: `باقى على الظهور في الترتيب :`,
+        text40: `لازالت تحتاج الى : لتظهر بقائمة الترتيب`,
+        text41: `باقى على الظهور في الترتيب :`,
+        text42: `غير مدرج`,
+        text43: `لقد حصلت علي المكافئة بنجاح`,
+        text44: `30`,
+        text45: `150`,
+        text46: `1200`,
+        text47: `13999`,
+        text48: `300 EXP`,
+        text49: `2250 EXP`,
+        text50: `26400 EXP`,
+        text51: `391972 EXP`,
+        newtext1:`7`,
+        newtexts1:`7`,
+        newtext2:`7`,
+        newtext3:`14`,
+        newtext4:`14`,
+        newtext5:`30`,
+        newtext6:`30`,
+        newtext7:`30`,
+        newtext8:`30`,
+        newText11:`*50`,
+        newText22:`*100`,
+        newText33:`*300`,
+        newText44:`*500`,
+        newText55:`*1000`,
+        newText66:`*1500`,
+        newText77:`*2000`,
+    }
+}
--- a/view/molistar/activity/exp/local/en.js
+++ b/view/molistar/activity/exp/local/en.js
@@ -0,0 +1,84 @@
+langEn = {
+    demoModule: {
+        layerIndex1: `Loading...`,
+        layerIndex2: `Success`,
+        layerIndex3: `Network error`,
+        img1: `background: url(./images/header_en.png) no-repeat;background-size: 100% 100%;`,
+        img2: `background: url(./images/giftBg_en.png) no-repeat;background-size: 100% 100%;`,
+        img5: `background: url(./images/topReward_en.png) no-repeat;background-size: 100% 100%;`,
+        img3: `./images/rule1_en.png`,
+        img4: `./images/rule2_en.png`,
+        newIMg1:`./images/giftList1_en.png`,
+        newIMg2:`./images/giftList2_en.png`,
+        newIMg3:`./images/giftList3_en.png`,
+        newIMg4:`./images/giftList4_en.png`,
+        text1: `level event`,
+        text2: `rule`,
+        text3: `the time of event :2024.08.13-2024.08.22`,
+        text4: `send gifts and increase ur level`,
+        text5: `vip users can get more exp ,when they send gifts`,
+        text6: `1001000EXP!`,
+        text7: `Moon ring`,
+        text8: `Holy Demon Staff`,
+        text9: `Interstellar`,
+        text10: `Interstellar Overlord`,
+        text11: `level`,
+        text12: `reward`,
+        text13: `Level`,
+        text14: `Headwear`,
+        text15: `Chat bubble`,
+        text16: `Entry`,
+        text17: `Medal`,
+        text18: `Chat bubble`,
+        text19: `Level's rewards`,
+        text20: `Ranking`,
+        text21: `(When u reach these levels ,u can get these gifts)`,
+        text22: `days`,
+        // text23: `u still need ....exp to reach the next level`,
+        text23: ` `,
+        text24: `Current:LV.`,
+        text25: `more detalis`,
+        text26: `Ranked according to the EXP increased by sending event gifts, EXP The higher the rank, the higher the rank`,
+        text27: `(The top 50 users with the most EXP will receive event awards)`,
+        text28: `EXP Points`,
+        text29: `(Send gifts and increase ur level ,and get rewards)`,
+        text30: `The all expx points`,
+        text31: `The event rules`,
+        text32: `Leaderboard rewards`,
+        text33: `End of event`,
+        text34: `get it`,
+        text35: `Received`,
+        text36: ` `,
+        text37: `EXP value`,
+        text38: `u still need points to surpass the next user:`,
+        text39: `u still need points to surpass the next user:`,
+        text40: `u are Ahead of second place by points `,
+        text41: `u still need points to be in the ranking list:`,
+        text42: `not ranked`,
+        text43: `You've successfully claimed your reward!`,
+        text44: `1333`,
+        text45: `5000`,
+        text46: `12000`,
+        text47: `27500`,
+        text48: `13330 EXP`,
+        text49: `75000 EXP`,
+        text50: `264000 EXP`,
+        text51: `770000 EXP`,
+        newtext1:`7`,
+        newtexts1:`7`,
+        newtext2:`7`,
+        newtext3:`14`,
+        newtext4:`14`,
+        newtext5:`30`,
+        newtext6:`30`,
+        newtext7:`30`,
+        newtext8:`30`,
+        newText11:`*50`,
+        newText22:`*100`,
+        newText33:`*300`,
+        newText44:`*500`,
+        newText55:`*1000`,
+        newText66:`*1500`,
+        newText77:`*2000`,
+    }
+}
--- a/view/molistar/activity/exp/local/zh.js
+++ b/view/molistar/activity/exp/local/zh.js
@@ -0,0 +1,86 @@
+// 中文
+langZh = {
+    // 模塊
+    demoModule: {
+        layerIndex1: `加載中...`,
+        layerIndex2: `操作成功`,
+        layerIndex3: `網絡錯誤`,
+        img1: `background: url(./images/header.png) no-repeat;background-size: 100% 100%;`,
+        img2: `background: url(./images/giftBg.png) no-repeat;background-size: 100% 100%;`,
+        img5: `background: url(./images/topReward.png) no-repeat;background-size: 100% 100%;`,
+        img3: `./images/rule1.png`,
+        img4: `./images/rule2.png`,
+        newIMg1: `./images/giftList1.png`,
+        newIMg2: `./images/giftList2.png`,
+        newIMg3: `./images/giftList3.png`,
+        newIMg4: `./images/giftList4.png`,
+        text1: `加速之戰`,
+        text2: `規則`,
+        text3: `活動時間:2024.08.13-08.22`,
+        text4: `送禮物,增加EXP`,
+        text5: `VIP用戶送出活動禮物最高可獲得`,
+        text6: `1892800EXP!`,
+        text7: `星芒石`,
+        text8: `聖魔權杖`,
+        text9: `浩瀚星河`,
+        text10: `星辰之力`,
+        text11: `等級`,
+        text12: `獎勵`,
+        text13: `級`,
+        text14: `頭飾`,
+        text15: `氣泡`,
+        text16: `座駕`,
+        text17: `勳章`,
+        text18: `氣泡`,
+        text19: `等級獎勵`,
+        text20: `榜單`,
+        text21: `(達到以下等級即可領取獎勵)`,
+        text22: `天`,
+        // text23: `距離下一等級還差`,
+        text23: ` `,
+        text24: `當前:LV.`,
+        text25: `查看更多`,
+        text26: `根據送出活動禮物增加的EXP進行排名，EXP越高排序越靠前`,
+        text27: `(EXP最多的前TOP50名用戶將會獲得活動獎勵)`,
+        text28: `EXP等級`,
+        text29: `(送禮物增加EXP，達到等級領取獎勵)`,
+        text30: `需要的EXP`,
+        text31: `活動規則`,
+        text32: `榜單獎勵`,
+        text33: `活動結束`,
+        text34: `領取`,
+        text35: `已領取`,
+        text36: `虛位以待`,
+        text37: `EXP值`,
+        text38: `距離上榜還差:`,
+        text39: `距離上榜還差:`,
+        text40: `領先第二名:`,
+        text41: `距上一名還差:`,
+        text42: `未上榜`,
+        text43: `您已成功領取獎勵`,
+        text44: `990`,
+        text45: `5200`,
+        text46: `13140`,
+        text47: `52000`,
+        text48: `9900 EXP`,
+        text49: `78000 EXP`,
+        text50: `289080 EXP`,
+        text51: `1456000 EXP`,
+        newtext1: `7`,
+        newtexts1: `7`,
+        newtext2: `7`,
+        newtext3: `14`,
+        newtext4: `14`,
+        newtext5: `30`,
+        newtext6: `30`,
+        newtext7: `30`,
+        newtext8: `30`,
+        newText11: `*100`,
+        newText22: `*500`,
+        newText33: `*1000`,
+        newText44: `*5000`,
+        newText55: `*10000`,
+        newText66: `*15000`,
+        newText77: `*20000`,
+    },
+}
--- a/view/molistar/common/js/common2.js
+++ b/view/molistar/common/js/common2.js
@@ -826,9 +826,9 @@ function fuzzyMatchUpdateQueryStringParameterFun() {
    }
 }
 function langCodeFun(langCode) {
-    if (window.location.href.match(/guildAr/)) {
-        return
-    }
+    // if (window.location.href.match(/guildAr/)) {
+    //     return
+    // }
    var body = document.body;
    body.style.display = 'none';
    setTimeout(function () {
@@ -841,9 +841,9 @@ function langCodeFun(langCode) {
    } else if (langCode == "en") {
        document.body.classList.add('english');
    }
-    if (window.location.href.match(/guildAr/)) {
-        document.documentElement.setAttribute("dir", "ltr");
-    }
+    // if (window.location.href.match(/guildAr/)) {
+    //     document.documentElement.setAttribute("dir", "ltr");
+    // }
 }
 // 获取整条url
 function updateQueryStringParameter(uri, key, value) {
--- a/view/molistar/home/js/index.js
+++ b/view/molistar/home/js/index.js
@@ -62,7 +62,7 @@ $(function () {
    ];
    setTimeout(function () {
        function getUserLanguage() {
-            console.log(navigator.language, navigator.userLanguage);
+            console.log('ssss',navigator,navigator.language, navigator.userLanguage);
            return navigator.language || navigator.userLanguage; // 兼容不同浏览器的方式
        }
        // var langCode = getLanguageCode(getUserLanguage());
--- a/view/molistar/modules/guildAr/adminSet.html
+++ b/view/molistar/modules/guildAr/adminSet.html
@@ -41,8 +41,8 @@
        <div class="pub_in">
            <p class="text4"></p>
            <div class="butBox">
-                <div class="close"></div>
-                <div class="ok"></div>
+                <div class="close texts1"></div>
+                <div class="ok texts2"></div>
            </div>
        </div>
    </div>
--- a/view/molistar/modules/guildAr/css/guild.css
+++ b/view/molistar/modules/guildAr/css/guild.css
@@ -240,3 +240,35 @@ ul li:nth-child(3) .ts {
  background: linear-gradient(90deg, #53C7D4, #7C5EFD);
  color: #fff;
 }
+
+.arabic ul li .num,
+.arabic ul li .user {
+  float: right;
+}
+
+.arabic ul li .user {
+  margin-left: 0;
+  margin-right: 1.8rem;
+}
+
+.arabic ul li .but {
+  float: left;
+}
+
+.arabic ul li .ts {
+  left: 0;
+  right: 1.05333rem;
+}
+
+.arabic ul li .tx {
+  left: 0;
+  right: 1.28rem;
+}
+
+.arabic .top .left {
+  float: right;
+}
+
+.arabic .top img {
+  float: left;
+}
--- a/view/molistar/modules/guildAr/css/guild.scss
+++ b/view/molistar/modules/guildAr/css/guild.scss
@@ -251,4 +251,39 @@ ul {
            }
        }
    }
+}
+
+.arabic {
+
+    ul li .num,
+    ul li .user {
+        float: right;
+    }
+
+    ul li .user {
+        margin-left: 0;
+        margin-right: 1.8rem;
+    }
+
+    ul li .but {
+        float: left;
+    }
+
+    ul li .ts {
+        left: 0;
+        right: 1.05333rem;
+    }
+
+    ul li .tx {
+        left: 0;
+        right: 1.28rem;
+    }
+
+    .top .left {
+        float: right;
+    }
+
+    .top img {
+        float: left;
+    }
 }
--- a/view/molistar/modules/guildAr/css/guildInfoSet.css
+++ b/view/molistar/modules/guildAr/css/guildInfoSet.css
@@ -4,7 +4,7 @@ body {
  height: 17.78667rem;
  background: #F5F7F9;
  box-sizing: border-box;
-  padding: 0 0.42667rem;
+  padding: 1.73333rem 0rem 0 0;
 }

 .back {
@@ -30,91 +30,152 @@ body {
  top: 54%;
 }

-.nick {
-  margin-top: 2.93333rem;
+input {
+  background: none;
+  outline: none;
+  bottom: none;
+}
+
+h3 {
  color: #333333;
  font-size: 0.42667rem;
-  font-weight: 800;
+  margin-bottom: 0.57333rem;
+  font-weight: 500;
+  margin-left: 0.42667rem;
+  text-align: left;
 }

-.nick input {
-  border: none;
-  outline: none;
-  background: #F5F7F9;
-  width: 5.4rem;
-  height: 0.66667rem;
-  border-radius: 0.66667rem;
-  box-sizing: border-box;
-  color: #333;
-  font-size: 0.42667rem;
-  box-sizing: border-box;
-  padding-left: 0.13333rem;
-  margin-bottom: 0.74667rem;
-}
-
-.nick input::placeholder {
-  color: #515665;
-}
-
-.bg {
-  width: 100%;
-  height: 2.26667rem;
+.name {
+  width: 9.01333rem;
+  height: 1.01333rem;
+  line-height: 1.01333rem;
  position: relative;
+  margin: 0 auto 0.85333rem;
+  background: #fff;
+  border-radius: 0.09333rem;
 }

-.bg span {
+.name input {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 80%;
+  height: 100%;
+  color: #3C3C3C;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  box-sizing: border-box;
+  padding-left: 0.37333rem;
+}
+
+.name span {
+  position: absolute;
+  right: 0.50667rem;
+  top: 0;
+  height: 100%;
+  color: #E13B3F;
+  font-size: 0.37333rem;
+  font-weight: 400;
+}
+
+.name .act {
+  color: #67D2A6;
+}
+
+.background {
+  position: relative;
+  width: 6.66667rem;
+  height: 4rem;
+  margin-bottom: 0.89333rem;
+}
+
+.background img {
  display: inline-block;
-  color: #333;
-  font-size: 0.42667rem;
-  line-height: 2.26667rem;
-  font-weight: 800;
+  margin-left: 0.42667rem;
+  margin-right: 0.22667rem;
+  width: 4rem;
+  height: 4rem;
+  border-radius: 0.06667rem;
 }

-.bg img {
-  width: 2.26667rem;
-  height: 2.26667rem;
+.background span {
+  color: #E13B3F;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  margin-top: 3.65333rem;
+  display: inline-block;
+}
+
+.background input {
  position: absolute;
-  top: 0;
-  left: 2.53333rem;
-  z-index: 1;
-  border-radius: 0.13333rem;
+  right: 1.2rem;
+  bottom: -0.2rem;
+  width: 0.93333rem;
+  height: 0.8rem;
 }

-.bg .upload {
-  width: 2.26667rem;
-  height: 2.26667rem;
+.background .act {
+  color: #67D2A6;
+}
+
+.account {
+  width: 9.01333rem;
+  height: 1.01333rem;
+  line-height: 1.01333rem;
+  position: relative;
+  margin: 0 auto 0.85333rem;
+  background: #fff;
+  border-radius: 0.09333rem;
+}
+
+.account i {
+  font-style: normal;
+  color: #3C3C3C;
+  font-weight: 400;
+  font-size: 0.37333rem;
+  height: 100%;
  position: absolute;
+  left: 0.26667rem;
+}
+
+.account input {
+  position: absolute;
+  left: 2.13333rem;
  top: 0;
-  left: 2.53333rem;
-  z-index: 2;
+  height: 100%;
+  color: #000;
+  font-size: 0.37333rem;
+  font-weight: 500;
+  box-sizing: border-box;
+  padding-left: 0.46667rem;
+  width: 60%;
 }

-.boxBut {
-  width: 7.06667rem;
-  height: 0.93333rem;
-  margin: 1.73333rem auto 0;
-  display: flex;
-  justify-content: space-between;
+.account span {
+  position: absolute;
+  right: 0.50667rem;
+  top: 0;
+  height: 100%;
+  color: #E13B3F;
+  font-size: 0.37333rem;
+  font-weight: 400;
 }

-.boxBut .close {
-  width: 2.88rem;
-  height: 0.93333rem;
-  line-height: 0.93333rem;
-  border-radius: 0.93333rem;
-  text-align: center;
-  color: #fff;
-  font-size: 0.42667rem;
-  background: #CCCBCE;
+.account .act {
+  color: #67D2A6;
 }

-.boxBut .ok {
-  width: 2.88rem;
-  height: 0.93333rem;
-  line-height: 0.93333rem;
-  border-radius: 0.93333rem;
-  text-align: center;
-  color: #fff;
-  font-size: 0.42667rem;
-  background: linear-gradient(90deg, #867FFF, #66E3FF);
+.arabic .account span {
+  right: auto;
+  left: 0.50667rem;
+}
+
+.arabic .account i {
+  left: auto;
+  right: 0.26667rem;
+}
+
+.arabic .account input {
+  left: auto;
+  right: 2.5rem;
 }
--- a/view/molistar/modules/guildAr/css/guildInfoSet.scss
+++ b/view/molistar/modules/guildAr/css/guildInfoSet.scss
@@ -8,7 +8,7 @@ body {
    height: px2rem(1334);
    background: #F5F7F9;
    box-sizing: border-box;
-    padding: 0 px2rem(32);
+    padding: px2rem(130) px2rem(0) 0 0;
 }

 .back {
@@ -34,91 +34,155 @@ body {
    }
 }

-.nick {
-    margin-top: px2rem(220);
+input {
+    background: none;
+    outline: none;
+    bottom: none;
+}
+
+h3 {
    color: #333333;
    font-size: px2rem(32);
-    font-weight: 800;
+    margin-bottom: px2rem(43);
+    font-weight: 500;
+    margin-left: px2rem(32);
+    text-align: left;
+}
+
+.name {
+    width: px2rem(676);
+    height: px2rem(76);
+    line-height: px2rem(76);
+    position: relative;
+    margin: 0 auto px2rem(64);
+    background: #fff;
+    border-radius: px2rem(7);

    input {
-        border: none;
-        outline: none;
-        background: #F5F7F9;
-        width: 5.4rem;
-        height: px2rem(50);
-        border-radius: px2rem(50);
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 80%;
+        height: 100%;
+        color: #3C3C3C;
+        font-size: px2rem(28);
+        font-weight: 400;
        box-sizing: border-box;
-        color: #333;
-        font-size: px2rem(32);
-        box-sizing: border-box;
-        padding-left: px2rem(10);
-        margin-bottom: px2rem(56);
-
-        &::placeholder {
-            color: #515665;
-        }
+        padding-left: px2rem(28);
    }
-}
-
-.bg {
-    width: 100%;
-    height: px2rem(170);
-    position: relative;

    span {
-        display: inline-block;
-        color: #333;
-        font-size: px2rem(32);
-        line-height: px2rem(170);
-        font-weight: 800;
+        position: absolute;
+        right: px2rem(38);
+        top: 0;
+        height: 100%;
+        color: #E13B3F;
+        font-size: px2rem(28);
+        font-weight: 400;
    }

-    img {
-        width: px2rem(170);
-        height: px2rem(170);
-        position: absolute;
-        top: 0;
-        left: px2rem(190);
-        z-index: 1;
-        border-radius: px2rem(10);
-    }
-
-    .upload {
-        width: px2rem(170);
-        height: px2rem(170);
-        position: absolute;
-        top: 0;
-        left: px2rem(190);
-        z-index: 2;
+    .act {
+        color: #67D2A6;
    }
 }

-.boxBut {
-    width: px2rem(530);
-    height: px2rem(70);
-    margin: px2rem(130) auto 0;
-    display: flex;
-    justify-content: space-between;
+.background {
+    position: relative;
+    width: px2rem(500);
+    height: px2rem(300);
+    margin-bottom: px2rem(67);

-    .close {
-        width: px2rem(216);
-        height: px2rem(70);
-        line-height: px2rem(70);
-        border-radius: px2rem(70);
-        text-align: center;
-        color: #fff;
-        font-size: px2rem(32);
-        background: #CCCBCE;
+    img {
+        display: inline-block;
+        margin-left: px2rem(32);
+        margin-right: px2rem(17);
+        width: px2rem(300);
+        height: px2rem(300);
+        border-radius: px2rem(5);
    }

-    .ok {
-        width: px2rem(216);
-        height: px2rem(70);
-        line-height: px2rem(70);
-        border-radius: px2rem(70);
-        text-align: center;
-        color: #fff;
-        font-size: px2rem(32);
-        background: linear-gradient(90deg, #867FFF, #66E3FF);
+    span {
+        color: #E13B3F;
+        font-size: px2rem(28);
+        font-weight: 400;
+        margin-top: px2rem(274);
+        display: inline-block;
+
+    }
+
+    input {
+        position: absolute;
+        right: 1.2rem;
+        bottom: -0.2rem;
+        width: px2rem(70);
+        height: px2rem(60);
+    }
+
+    .act {
+        color: #67D2A6;
+    }
+}
+
+.account {
+    width: px2rem(676);
+    height: px2rem(76);
+    line-height: px2rem(76);
+    position: relative;
+    margin: 0 auto px2rem(64);
+    background: #fff;
+    border-radius: px2rem(7);
+
+    i {
+        font-style: normal;
+        color: #3C3C3C;
+        font-weight: 400;
+        font-size: px2rem(28);
+        height: 100%;
+        position: absolute;
+        left: px2rem(20);
+    }
+
+    input {
+        position: absolute;
+        left: px2rem(160);
+        top: 0;
+        height: 100%;
+        color: #000;
+        font-size: px2rem(28);
+        font-weight: 500;
+        box-sizing: border-box;
+        padding-left: px2rem(35);
+        width: 60%;
+    }
+
+    span {
+        position: absolute;
+        right: px2rem(38);
+        top: 0;
+        height: 100%;
+        color: #E13B3F;
+        font-size: px2rem(28);
+        font-weight: 400;
+    }
+
+    .act {
+        color: #67D2A6;
+    }
+}
+
+.arabic {
+
+    .account span {
+        right: auto;
+        left: 0.50667rem;
+    }
+
+    .account i {
+        left: auto;
+        right: 0.26667rem;
+    }
+    .account input{
+        left: auto;
+        right: 2.5rem;
    }
 }
--- a/view/molistar/modules/guildAr/css/index.css
+++ b/view/molistar/modules/guildAr/css/index.css
@@ -94,86 +94,6 @@ body {
  top: 5.64rem;
 }

-.header .adminSet {
-  padding: 0rem 0.21333rem;
-  box-sizing: border-box;
-  height: 0.58667rem;
-  line-height: 0.58667rem;
-  color: #fff;
-  font-size: 0.42667rem;
-  font-weight: 400;
-  background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
-  border-radius: 0.58667rem 0px 0px 0.58667rem;
-  position: absolute;
-  right: 0;
-  top: 2.45333rem;
-  display: none;
-}
-
-.header .guildInfoSet {
-  padding: 0rem 0.21333rem;
-  box-sizing: border-box;
-  height: 0.58667rem;
-  line-height: 0.58667rem;
-  color: #fff;
-  font-size: 0.42667rem;
-  font-weight: 400;
-  background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
-  border-radius: 0.58667rem 0px 0px 0.58667rem;
-  position: absolute;
-  right: 0;
-  top: 3.18667rem;
-  display: none;
-}
-
-.header .memberFlow {
-  width: 2.77333rem;
-  height: 0.74667rem;
-  line-height: 0.74667rem;
-  text-align: center;
-  color: #fff;
-  font-size: 0.42667rem;
-  font-weight: 400;
-  background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
-  border-radius: 0.18667rem;
-  position: absolute;
-  left: 2.08rem;
-  top: 6.21333rem;
-  display: none;
-}
-
-.header .memberFlowMy {
-  width: 2.77333rem;
-  height: 0.74667rem;
-  line-height: 0.74667rem;
-  text-align: center;
-  color: #fff;
-  font-size: 0.42667rem;
-  font-weight: 400;
-  background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
-  border-radius: 0.18667rem 0 0 0.18667rem;
-  position: absolute;
-  right: 0rem;
-  top: 2.90667rem;
-  display: none;
-}
-
-.header .inveMember {
-  width: 2.77333rem;
-  height: 0.74667rem;
-  line-height: 0.74667rem;
-  text-align: center;
-  color: #fff;
-  font-size: 0.42667rem;
-  font-weight: 400;
-  background: linear-gradient(90deg, rgba(128, 146, 255, 0.6) 0%, rgba(108, 208, 255, 0.6) 100%);
-  border-radius: 0.18667rem;
-  position: absolute;
-  right: 2.08rem;
-  top: 6.21333rem;
-  display: none;
-}
-
 .header .guildNick {
  width: 100%;
  position: absolute;
@@ -186,11 +106,50 @@ body {
  display: none;
 }

+.header .headerBox {
+  width: 8.86667rem;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  position: absolute;
+  top: 6.37333rem;
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.header .headerBox div {
+  width: 3.62667rem;
+  height: 0.74667rem;
+  line-height: 0.74667rem;
+  color: #fff;
+  font-size: 0.34667rem;
+  text-align: center;
+  background: linear-gradient(90deg, rgba(128, 146, 255, 0.8) 0%, rgba(108, 208, 255, 0.8) 100%);
+  border-radius: 0.18667rem;
+  margin-bottom: 0.33333rem;
+  overflow: hidden;
+  white-space: nowrap;
+  margin: 0 auto 0.33333rem;
+}
+
+.header .headerBox div img {
+  width: 0.42667rem;
+  height: 0.42667rem;
+  margin-right: 0.17333rem;
+  float: left;
+  margin-top: 0.16rem;
+  margin-left: 0.38667rem;
+}
+
+.header .headerBox div span {
+  float: left;
+}
+
 .guildList {
  width: 9.25333rem;
-  height: 13.33333rem;
+  height: 11rem;
  border-radius: 0.26667rem;
-  margin: -1.66667rem auto 0rem;
+  margin: -0.3rem auto 0rem;
  position: relative;
  background: #fff;
  overflow: hidden;
@@ -260,7 +219,7 @@ body {

 .guildList ul {
  width: 100%;
-  height: 11.8rem;
+  height: 11rem;
  margin: 0.52rem auto 0;
  overflow-y: scroll;
 }
@@ -334,7 +293,7 @@ body {
 .guildList ul li .but {
  width: 1.17333rem;
  height: 0.56rem;
-  background: #7F95FF;
+  background: #62D0A8;
  border-radius: 0.56rem;
  position: absolute;
  right: 0.34667rem;
@@ -342,7 +301,7 @@ body {
  text-align: center;
  color: #fff;
  line-height: 0.56rem;
-  font-size: 0.34667rem;
+  font-size: 0.29333rem;
  font-weight: 400;
 }

@@ -434,3 +393,92 @@ body {
  background: linear-gradient(90deg, #53C7D4, #7C5EFD);
  color: #fff;
 }
+
+.inveMember {
+  width: 4.08rem;
+  height: 1.28rem;
+  border-radius: 1.28rem;
+  line-height: 1.22667rem;
+  text-align: center;
+  background: linear-gradient(90deg, #7CDD9B, #62D0A8);
+  color: #fff;
+  font-size: 0.45333rem;
+  position: fixed;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 5;
+  bottom: 1.06667rem;
+}
+
+.inveMember img {
+  display: inline-block;
+  width: 0.50667rem;
+  height: 0.56rem;
+  vertical-align: middle;
+  margin-top: -0.1rem;
+}
+
+.inveMember span {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.arabic .guildList .top img {
+  right: 0.4rem;
+}
+
+.arabic .guildList .top input {
+  padding-right: 0.5rem;
+}
+
+.arabic .guildList ul li .but {
+  left: 0.34667rem;
+  right: auto;
+}
+
+.arabic .guildList ul li .chairman,
+.arabic .guildList ul li .administrator {
+  right: 0.1rem;
+  left: auto;
+}
+
+.arabic .guildList ul li .tx,
+.arabic .guildList ul li .user {
+  float: right;
+}
+
+.arabic .guildList ul li .user {
+  padding-right: 0.2rem;
+}
+
+.arabic .header .headerBox div img {
+  float: right;
+}
+
+.arabic .header .headerBox div span {
+  float: right;
+}
+
+.english .header .headerBox {
+  width: 8rem;
+}
+
+.english .header .headerBox div {
+  width: 3.9rem;
+}
+
+.english .header .headerBox div span {
+  font-size: 0.21333rem;
+}
+
+.arabic .header .headerBox {
+  width: 8rem;
+}
+
+.arabic .header .headerBox div {
+  width: 3.9rem;
+}
+
+.arabic .header .headerBox div span {
+  font-size: 0.29333rem;
+}
--- a/view/molistar/modules/guildAr/css/index.scss
+++ b/view/molistar/modules/guildAr/css/index.scss
@@ -98,85 +98,85 @@ body {
        top: px2rem(423);
    }

-    .adminSet {
-        padding: px2rem(0) px2rem(16);
-        box-sizing: border-box;
-        height: px2rem(44);
-        line-height: px2rem(44);
-        color: #fff;
-        font-size: px2rem(32);
-        font-weight: 400;
-        background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
-        border-radius: px2rem(44) 0px 0px px2rem(44);
-        position: absolute;
-        right: 0;
-        top: px2rem(184);
-        display: none;
-    }
+    // .adminSet {
+    //     padding: px2rem(0) px2rem(16);
+    //     box-sizing: border-box;
+    //     height: px2rem(44);
+    //     line-height: px2rem(44);
+    //     color: #fff;
+    //     font-size: px2rem(32);
+    //     font-weight: 400;
+    //     background: linear-gradient(90deg, rgba(82, 59, 85, 0.98), rgba(21, 5, 16, 0.98));
+    //     border-radius: px2rem(44) 0px 0px px2rem(44);
+    //     position: absolute;
+    //     right: 0;
+    //     top: px2rem(184);
+    //     display: none;
+    // }

-    .guildInfoSet {
-        padding: px2rem(0) px2rem(16);
-        box-sizing: border-box;
-        height: px2rem(44);
-        line-height: px2rem(44);
-        color: #fff;
-        font-size: px2rem(32);
-        font-weight: 400;
-        background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
-        border-radius: px2rem(44) 0px 0px px2rem(44);
-        position: absolute;
-        right: 0;
-        top: px2rem(239);
-        display: none;
-    }
+    // .guildInfoSet {
+    //     padding: px2rem(0) px2rem(16);
+    //     box-sizing: border-box;
+    //     height: px2rem(44);
+    //     line-height: px2rem(44);
+    //     color: #fff;
+    //     font-size: px2rem(32);
+    //     font-weight: 400;
+    //     background: linear-gradient(90deg, rgba(82, 59, 85, 0.7), rgba(21, 5, 16, 0.7));
+    //     border-radius: px2rem(44) 0px 0px px2rem(44);
+    //     position: absolute;
+    //     right: 0;
+    //     top: px2rem(239);
+    //     display: none;
+    // }

-    .memberFlow {
-        width: px2rem(208);
-        height: px2rem(56);
-        line-height: px2rem(56);
-        text-align: center;
-        color: #fff;
-        font-size: px2rem(32);
-        font-weight: 400;
-        background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
-        border-radius: px2rem(14);
-        position: absolute;
-        left: px2rem(156);
-        top: px2rem(466);
-        display: none;
-    }
+    // .memberFlow {
+    //     width: px2rem(208);
+    //     height: px2rem(56);
+    //     line-height: px2rem(56);
+    //     text-align: center;
+    //     color: #fff;
+    //     font-size: px2rem(32);
+    //     font-weight: 400;
+    //     background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+    //     border-radius: px2rem(14);
+    //     position: absolute;
+    //     left: px2rem(156);
+    //     top: px2rem(466);
+    //     display: none;
+    // }

-    .memberFlowMy {
-        width: px2rem(208);
-        height: px2rem(56);
-        line-height: px2rem(56);
-        text-align: center;
-        color: #fff;
-        font-size: px2rem(32);
-        font-weight: 400;
-        background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
-        border-radius: px2rem(14) 0 0 px2rem(14);
-        position: absolute;
-        right: px2rem(0);
-        top: px2rem(218);
-        display: none;
-    }
+    // .memberFlowMy {
+    //     width: px2rem(208);
+    //     height: px2rem(56);
+    //     line-height: px2rem(56);
+    //     text-align: center;
+    //     color: #fff;
+    //     font-size: px2rem(32);
+    //     font-weight: 400;
+    //     background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+    //     border-radius: px2rem(14) 0 0 px2rem(14);
+    //     position: absolute;
+    //     right: px2rem(0);
+    //     top: px2rem(218);
+    //     display: none;
+    // }

-    .inveMember {
-        width: px2rem(208);
-        height: px2rem(56);
-        line-height: px2rem(56);
-        text-align: center;
-        color: #fff;
-        font-size: px2rem(32);
-        font-weight: 400;
-        background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
-        border-radius: px2rem(14);
-        position: absolute;
-        right: px2rem(156);
-        top: px2rem(466);
-        display: none;
-    }
+    // .inveMember {
+    //     width: px2rem(208);
+    //     height: px2rem(56);
+    //     line-height: px2rem(56);
+    //     text-align: center;
+    //     color: #fff;
+    //     font-size: px2rem(32);
+    //     font-weight: 400;
+    //     background: linear-gradient(90deg, rgba(128, 146, 255, .6) 0%, rgba(108, 208, 255, .6) 100%);
+    //     border-radius: px2rem(14);
+    //     position: absolute;
+    //     right: px2rem(156);
+    //     top: px2rem(466);
+    //     display: none;
+    // }

    .guildNick {
        width: 100%;
@@ -189,13 +189,53 @@ body {
        text-align: center;
        display: none;
    }
+
+    .headerBox {
+        width: px2rem(665);
+        display: flex;
+        justify-content: center;
+        flex-wrap: wrap;
+        position: absolute;
+        top: px2rem(478);
+        // left: px2rem(93);
+        left: 50%;
+        transform: translateX(-50%);
+
+        div {
+            width: px2rem(272);
+            height: px2rem(56);
+            line-height: px2rem(56);
+            color: #fff;
+            font-size: px2rem(26);
+            text-align: center;
+            background: linear-gradient(90deg, rgba(128, 146, 255, .8) 0%, rgba(108, 208, 255, .8) 100%);
+            border-radius: px2rem(14);
+            margin-bottom: px2rem(25);
+            overflow: hidden;
+            white-space: nowrap;
+            margin: 0 auto px2rem(25);
+
+            img {
+                width: px2rem(32);
+                height: px2rem(32);
+                margin-right: px2rem(13);
+                float: left;
+                margin-top: px2rem(12);
+                margin-left: px2rem(29);
+            }
+
+            span {
+                float: left;
+            }
+        }
+    }
 }

 .guildList {
    width: px2rem(694);
-    height: px2rem(1000);
+    height: 11rem;
    border-radius: px2rem(20);
-    margin: px2rem(-125) auto px2rem(0);
+    margin: -0.3rem auto px2rem(0);
    position: relative;
    background: #fff;
    overflow: hidden;
@@ -265,7 +305,7 @@ body {

    ul {
        width: 100%;
-        height: 11.8rem;
+        height: 11rem;
        margin: px2rem(39) auto 0;
        overflow-y: scroll;

@@ -337,7 +377,7 @@ body {
            .but {
                width: px2rem(88);
                height: px2rem(42);
-                background: #7F95FF;
+                background: #62D0A8;
                border-radius: px2rem(42);
                position: absolute;
                right: px2rem(26);
@@ -345,7 +385,7 @@ body {
                text-align: center;
                color: #fff;
                line-height: px2rem(42);
-                font-size: px2rem(26);
+                font-size: px2rem(22);
                font-weight: 400;
            }

@@ -439,4 +479,100 @@ body {
            }
        }
    }
+}
+
+.inveMember {
+    width: px2rem(306);
+    height: px2rem(96);
+    border-radius: px2rem(96);
+    line-height: px2rem(92);
+    text-align: center;
+    background: linear-gradient(90deg, #7CDD9B, #62D0A8);
+    color: #fff;
+    font-size: px2rem(34);
+    position: fixed;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 5;
+    bottom: px2rem(80);
+
+    img {
+        display: inline-block;
+        width: px2rem(38);
+        height: px2rem(42);
+        vertical-align: middle;
+        margin-top: -0.1rem;
+    }
+
+    span {
+        display: inline-block;
+        vertical-align: middle;
+    }
+}
+
+.arabic {
+    .guildList .top img {
+        right: px2rem(30);
+    }
+
+    .guildList .top input {
+        padding-right: 0.5rem;
+    }
+
+    .guildList ul li .but {
+        left: 0.34667rem;
+        right: auto;
+    }
+
+    .guildList ul li .chairman,
+    .guildList ul li .administrator {
+        right: 0.1rem;
+        left: auto;
+    }
+
+    .guildList ul li .tx,
+    .guildList ul li .user {
+        float: right;
+    }
+
+    .guildList ul li .user {
+        padding-right: 0.2rem;
+    }
+
+    .header .headerBox div img {
+        float: right;
+    }
+
+    .header .headerBox div span {
+        float: right;
+    }
+
+}
+
+.english {
+    .header .headerBox {
+        width: 8rem;
+
+        div {
+            width: 3.9rem;
+
+            span {
+                font-size: px2rem(16);
+            }
+        }
+    }
+}
+
+.arabic {
+    .header .headerBox {
+        width: 8rem;
+
+        div {
+            width: 3.9rem;
+
+            span {
+                font-size: px2rem(22);
+            }
+        }
+    }
 }
--- a/view/molistar/modules/guildAr/css/lay-picker.min.css
+++ b/view/molistar/modules/guildAr/css/lay-picker.min.css
@@ -0,0 +1,9 @@
+/**
+ *
+ * 移动端底部抽屉选择器
+ * @author yyq
+ * @CSDN 慕云枫
+ * @date 2023-12-07
+ * @version 1.5
+ */
+ul,li{margin:0;padding:0}.lay-picker{position:fixed;left:0;top:0;width:100%;height:100%;z-index:99999999999999;display:none;overflow:hidden}.lay-picker-shade{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:9}.lay-picker-container{position:absolute;left:0;bottom:0;z-index:99;width:100%;background:#fff;color:#333;font-size:17px;-webkit-transition:transform .25s;-webkit-transform:translate3d(0,100%,0);transition:transform .25s;transform:translate3d(0,100%,0)}.lay-picker-header{height:50px;line-height:50px;border-bottom:1px solid #f3f3f3;margin-bottom:1px;margin:0 15px}.lay-picker-title{text-align:center;position:absolute;top:0;left:0;z-index:9;width:100%;color:#333}.lay-picker-search{margin:0 15px;text-align:center;padding:5px 0}.lay-picker-search input{text-align:center;height:40px;line-height:40px;border:0;border-bottom:1px solid #f3f3f3;transition:all .2s;-webkit-transition:all .2s;box-shadow:none !important;font-size:14px}.lay-picker-search input:hover,.lay-picker-search input:focus{border:none !important;border-bottom:1px solid #e5e5e5 !important}.lay-picker-btn{position:relative;z-index:99}.lay-picker-cancel{color:#333}.lay-picker-confirm{float:right;color:#228fff}.lay-picker-shadowup,.lay-picker-shadowdown{height:120px;width:100%;position:absolute;left:0;z-index:50}.lay-picker-shadowup{height:115px;top:-1px;background:-webkit-linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));background:linear-gradient(to bottom,#FFF,rgba(255,255,255,.6));pointer-events:none;border-bottom:1px solid #efefef}.lay-picker-shadowdown{height:130px;bottom:0;background:-webkit-linear-gradient(to top,#FFF,rgba(255,255,255,.6));background:linear-gradient(to top,#FFF,rgba(255,255,255,.6));pointer-events:none;border-top:1px solid #efefef}.lay-picker-content{position:relative;height:300px;margin:15px;overflow:hidden}.lay-picker-box{overflow:hidden}.lay-picker-box:after{display:table;height:0;clear:both;content:''}.lay-picker-list-wrap{float:left;height:300px;overflow:hidden;-webkit-transition:width .2s;transition:width .2s}.lay-picker-list-wrap ul{position:relative;padding:100px 0;margin-top:17px;-webkit-transition:transform .1s ease-out;transition:transform .1s ease-out}.lay-picker-list-wrap ul:after{position:absolute;top:0;left:0;right:0;bottom:0;z-index:55;content:''}.lay-picker-list-wrap li{line-height:50px;height:50px;text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.lay-picker-bottom{text-align:center;margin-top:10px;margin-bottom:30px;font-size:16px}.lay-picker-bottom-btn{border-radius:6px;display:inline-block;width:30%;height:40px;line-height:40px}.lay-picker-bottom-btn-cancel{color:#333;background:#efefef;margin-right:3%}.lay-picker-bottom-btn-confirm{color:#fff;background:#33c119}
--- a/view/molistar/modules/guildAr/css/memberFlow.css
+++ b/view/molistar/modules/guildAr/css/memberFlow.css
@@ -38,6 +38,8 @@ body {
  color: #333333;
  font-size: 0.45333rem;
  font-weight: bold;
+  width: 100%;
+  text-align: center;
 }

 .back .text {
@@ -50,207 +52,292 @@ body {
  font-size: 0.4rem;
 }

-.timeBox {
+.header {
  width: 9.46667rem;
-  height: 2.54667rem;
+  height: 4.18667rem;
  background: #fff;
  border-radius: 0.4rem;
-  margin: 2.53333rem auto 0.25333rem;
-  position: relative;
-}
-
-.timeBox .line {
-  width: 0.02667rem;
-  height: 1.90667rem;
-  background: #D7DCE6;
-  position: absolute;
-  left: 2.92rem;
-  top: 50%;
-  transform: translateY(-50%);
-  border-radius: 0.02667rem;
-}
-
-.timeBox .year {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 0.33333rem;
-  color: #A4ABB2;
-  font-size: 0.32rem;
-  font-weight: bold;
-  text-align: center;
-  text-indent: -0.8rem;
-}
-
-.timeBox .startTime {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 0.96rem;
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-}
-
-.timeBox .startTime b {
-  margin-right: 0.1rem;
-  text-indent: 0.45rem;
-  display: inline-block;
-}
-
-.timeBox .startTime img {
-  width: 0.32rem;
-  height: 0.21333rem;
-  display: inline-block;
-  margin-top: 0.1rem;
-}
-
-.timeBox .endTime {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 1.62667rem;
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-}
-
-.timeBox .endTime b {
-  margin-right: 0.1rem;
-  text-indent: 0.45rem;
-  display: inline-block;
-}
-
-.timeBox .endTime img {
-  width: 0.32rem;
-  height: 0.21333rem;
-  display: inline-block;
-  margin-top: 0.1rem;
-}
-
-.timeBox .right {
-  width: 5.5rem;
-  height: 2.54667rem;
-  position: absolute;
-  right: 0.55rem;
-  top: 0;
-  display: flex;
-  justify-content: space-between;
-}
-
-.timeBox .right div {
-  width: 50%;
-  text-align: center;
+  margin: 2.8rem auto 0.34667rem;
  overflow: hidden;
 }

-.timeBox .right div p {
-  color: #A4ABB2;
-  font-size: 0.32rem;
-  font-weight: bold;
-  margin-top: 0.53333rem;
-  margin-bottom: 0.33333rem;
-  line-height: 0.34rem;
-}
-
-.timeBox .right div b {
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-}
-
-.list {
-  width: 9.46667rem;
-  height: 12.8rem;
-  background: #fff;
-  border-radius: 0.4rem;
-  margin: 0.25333rem auto 0.13333rem;
-  overflow-y: scroll;
-  position: relative;
-  padding-top: 1.45rem;
-  box-sizing: border-box;
-}
-
-.list::-webkit-scrollbar {
-  display: none;
-}
-
-.list .top {
-  height: 1.5rem;
-  width: 9.46667rem;
-  box-sizing: border-box;
-  padding: 0.53333rem 0.26667rem 0;
+.header .time {
+  width: 100%;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
  display: flex;
  justify-content: space-between;
-  line-height: 0.4rem;
+  box-sizing: border-box;
+  margin: 0.38667rem auto 0.76rem;
+  text-align: center;
+  padding: 0 0.53333rem;
+  color: #848D9C;
+  font-size: 0.4rem;
+  font-weight: 500;
+}
+
+.header .time div {
+  width: 3.06667rem;
+}
+
+.header .time div b {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.header .time div img {
+  width: 0.32rem;
+  height: 0.21333rem;
+  display: inline-block;
+  vertical-align: middle;
+  margin-left: 0.13333rem;
+}
+
+.header .time span {
+  display: block;
+  width: 0.53333rem;
+  height: 0.05333rem;
+  background: #848D9C;
+  margin-top: 0.25rem;
+}
+
+.header h3 {
+  width: 100%;
+  box-sizing: border-box;
+  padding-left: 0.65333rem;
+  color: #141515;
+  font-size: 0.45333rem;
+  font-weight: 500;
+  margin-bottom: 0.72rem;
+}
+
+.header p {
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  width: 100%;
+  text-align: center;
+  color: #232424;
+  font-size: 0.69333rem;
+  font-weight: 500;
+}
+
+.header p img {
+  display: inline-block;
+  width: 0.53333rem;
+  height: 0.53333rem;
+}
+
+.box {
+  width: 9.46667rem;
+  min-height: 10.66667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+  color: #141515;
+  font-size: 0.45333rem;
+  font-weight: 600;
+  margin: 0;
+  margin-left: 0.26667rem;
+  margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+  display: inline-block;
+  width: 0.06667rem;
+  height: 0.37333rem;
+  margin-left: -0.17333rem;
+  background: #62D0A8;
+  margin-right: 0.13333rem;
+}
+
+.box .box_in {
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
+
+.box .box_in .fistBox {
+  width: 2.4rem;
+  float: left;
+}
+
+.box .box_in .fistBox .fist {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+  white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist .user {
+  position: relative;
+}
+
+.box .box_in .fistBox .fist .ts {
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0rem;
-  background: #fff;
-  border-radius: 0.4rem 0.4rem 0 0;
+  z-index: 2;
+  display: none;
 }

-.list .top div {
-  width: 25%;
+.box .box_in .fistBox .fist .ts i {
+  width: 100%;
+  border-radius: 0.16rem;
+  height: 0.16rem;
+  line-height: 0.16rem;
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
  text-align: center;
-  color: #5D95FF;
-  font-size: 0.29333rem;
-  font-weight: 600;
+  background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+  color: #333333;
+  font-size: 0.16rem;
+  font-weight: 400;
+  font-style: normal;
 }

-.list .other {
-  width: 8.76rem;
-  height: 2.01333rem;
-  margin: 0 auto 0;
-  border-bottom: 0.02667rem solid #D7DCE6;
-  display: flex;
-  justify-content: space-between;
-}
-
-.list .other:last-child {
-  border: none;
-}
-
-.list .other div {
-  width: 25%;
-  text-align: center;
-  height: 100%;
-  line-height: 2.01333rem;
-  color: #848D9C;
-  font-size: 0.32rem;
-  font-weight: 500;
-  white-space: nowrap;
-}
-
-.list .other div img {
+.box .box_in .fistBox .fist .i {
+  display: block;
+}
+
+.box .box_in .fistBox .fist img {
  display: block;
-  margin: 0.45333rem auto 0.06667rem;
  width: 0.42667rem;
  height: 0.42667rem;
  border-radius: 50%;
+  margin: 0 auto 0.06667rem;
 }

-.list .other div p {
-  width: 98%;
-  height: 0.33333rem;
-  line-height: 0.32rem;
+.box .box_in .fistBox .fist p {
+  width: 100%;
+  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+  margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+  color: #A4ABB2;
+  font-size: 0.24rem;
+  font-weight: 500;
+  text-align: center;
+  display: block;
+  width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+  height: 100%;
+  overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 8rem;
+  height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  float: left;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+  white-space: nowrap;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+  width: 100%;
  text-align: center;
  color: #848D9C;
  font-size: 0.32rem;
-  margin-bottom: 0.12rem;
+  font-weight: 500;
+  line-height: 1.2rem;
+  white-space: nowrap;
 }

-.list .other div .id {
-  width: 100%;
-  text-align: center;
-  color: #A4ABB2;
-  font-size: 0.24rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+  color: #4EA686;
 }

-.list .other .div11 {
-  line-height: 0rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+  color: #DC865D;
+}
+
+.box .box_in .fistBox .fistAct .title {
+  opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+  opacity: 0;
+  margin-bottom: -0.26667rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 11.6rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 3.2rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+  font-size: 0.30667rem;
+}
+
+.arabic .box .box_in .fistBox .fist {
+  margin-right: 0;
+  margin-left: 0.4rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 10rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 2.8rem;
+}
+
+.arabic .header h3 {
+  margin-right: 0.3rem;
+}
+
+.arabic .box h3 span {
+  margin-right: 0.3rem;
+  margin-left: 0;
+}
+
+.arabic .box h3 b {
+  margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  float: right;
 }
--- a/view/molistar/modules/guildAr/css/memberFlow.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow.scss
@@ -41,6 +41,8 @@ body {
        color: #333333;
        font-size: px2rem(34);
        font-weight: bold;
+        width: 100%;
+        text-align: center;
    }

    .text {
@@ -54,211 +56,310 @@ body {
    }
 }

-.timeBox {
+.header {
    width: px2rem(710);
-    height: px2rem(191);
+    height: px2rem(314);
    background: #fff;
    border-radius: px2rem(30);
-    margin: px2rem(190) auto px2rem(19);
-    position: relative;
+    margin: px2rem(210) auto px2rem(26);
+    overflow: hidden;

-    .line {
-        width: px2rem(2);
-        height: px2rem(143);
-        background: #D7DCE6;
-        position: absolute;
-        left: px2rem(219);
-        top: 50%;
-        transform: translateY(-50%);
-        border-radius: px2rem(2);
-    }
-
-    .year {
-        width: px2rem(219);
-        position: absolute;
-        left: 0;
-        top: px2rem(25);
-        color: #A4ABB2;
-        font-size: px2rem(24);
-        font-weight: bold;
-        text-align: center;
-        text-indent: -0.8rem;
-    }
-
-    .startTime {
-        width: px2rem(219);
-        position: absolute;
-        left: 0;
-        top: px2rem(72);
-        color: #848D9C;
-        font-size: px2rem(28);
-        font-weight: bold;
-        // text-align: center;
-
-        b {
-            margin-right: 0.1rem;
-            text-indent: 0.45rem;
-            display: inline-block;
-        }
-
-        img {
-            width: px2rem(24);
-            height: px2rem(16);
-            display: inline-block;
-            margin-top: 0.1rem;
-        }
-    }
-
-    .endTime {
-        width: px2rem(219);
-        position: absolute;
-        left: 0;
-        top: px2rem(122);
-        color: #848D9C;
-        font-size: px2rem(28);
-        font-weight: bold;
-        // text-align: center;
-
-        b {
-            margin-right: 0.1rem;
-            text-indent: 0.45rem;
-            display: inline-block;
-        }
-
-        img {
-            width: px2rem(24);
-            height: px2rem(16);
-            display: inline-block;
-            margin-top: 0.1rem;
-        }
-    }
-
-    .right {
-        width: 5.5rem;
-        height: px2rem(191);
-        position: absolute;
-        right: 0.55rem;
-        top: 0;
+    .time {
+        width: 100%;
+        height: px2rem(40);
+        line-height: px2rem(40);
        display: flex;
        justify-content: space-between;
+        box-sizing: border-box;
+        margin: px2rem(29) auto px2rem(57);
+        text-align: center;
+        padding: 0 px2rem(40);
+        color: #848D9C;
+        font-size: px2rem(30);
+        font-weight: 500;

        div {
-            width: 50%;
-            text-align: center;
-            overflow: hidden;
-
-            p {
-                color: #A4ABB2;
-                font-size: px2rem(24);
-                font-weight: bold;
-                margin-top: px2rem(40);
-                margin-bottom: px2rem(25);
-                line-height: 0.34rem;
-            }
+            width: px2rem(230);

            b {
-                color: #848D9C;
-                font-size: px2rem(28);
-                font-weight: bold;
+                display: inline-block;
+                vertical-align: middle;
+            }
+
+            img {
+                width: px2rem(24);
+                height: px2rem(16);
+                display: inline-block;
+                vertical-align: middle;
+                margin-left: px2rem(10);
+            }
+        }
+
+        span {
+            display: block;
+            width: px2rem(40);
+            height: px2rem(4);
+            background: #848D9C;
+            margin-top: 0.25rem;
+        }
+    }
+
+    h3 {
+        width: 100%;
+        box-sizing: border-box;
+        padding-left: px2rem(49);
+        color: #141515;
+        font-size: px2rem(34);
+        font-weight: 500;
+        margin-bottom: px2rem(54);
+    }
+
+    p {
+        height: px2rem(40);
+        line-height: px2rem(40);
+        width: 100%;
+        text-align: center;
+        color: #232424;
+        font-size: px2rem(52);
+        font-weight: 500;
+
+        img {
+            display: inline-block;
+            width: px2rem(40);
+            height: px2rem(40);
+        }
+    }
+}
+
+.box {
+    width: px2rem(710);
+    min-height: px2rem(800);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: 0 auto px2rem(30);
+    box-sizing: border-box;
+    padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+    h3 {
+        color: #141515;
+        font-size: px2rem(34);
+        font-weight: 600;
+        margin: 0;
+        margin-left: px2rem(20);
+        margin-bottom: px2rem(38);
+
+        span {
+            display: inline-block;
+            width: px2rem(5);
+            height: px2rem(28);
+            margin-left: px2rem(-13);
+            background: #62D0A8;
+            margin-right: px2rem(10);
+        }
+    }
+
+    .box_in {
+        width: 100%;
+        height: 100%;
+        display: flex;
+
+        .fistBox {
+            width: px2rem(180);
+            float: left;
+
+            .fist {
+                width: px2rem(170);
+                height: px2rem(151);
+                margin-right: px2rem(30);
+
+                .title {
+                    color: #666666;
+                    width: 100%;
+                    text-align: center;
+                    font-size: px2rem(28);
+                    margin-bottom: px2rem(23);
+                    white-space: nowrap;
+                }
+
+                .user {
+                    position: relative;
+                }
+
+                .ts {
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    top: px2rem(0);
+                    z-index: 2;
+                    display: none;
+
+                    i {
+                        width: 100%;
+                        border-radius: px2rem(12);
+                        height: px2rem(12);
+                        line-height: px2rem(12);
+                        position: absolute;
+                        bottom: 0;
+                        left: 50%;
+                        transform: translateX(-50%);
+                        text-align: center;
+                        background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+                        color: #333333;
+                        font-size: px2rem(12);
+                        font-weight: 400;
+                        font-style: normal;
+                    }
+                }
+
+                .i {
+                    display: block;
+                }
+
+                img {
+                    display: block;
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    margin: 0 auto px2rem(5);
+                }
+
+                p {
+                    width: 100%;
+                    text-align: center;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    color: #848D9C;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    margin-bottom: px2rem(5);
+                }
+
+                b {
+                    color: #A4ABB2;
+                    font-size: px2rem(18);
+                    font-weight: 500;
+                    text-align: center;
+                    display: block;
+                    width: 100%;
+                }
+            }
+        }
+
+        .ordinaryBox {
+            height: 100%;
+            overflow-x: scroll;
+
+            &::-webkit-scrollbar {
+                // display: none;
+            }
+
+            .ordinaryBox_in {
+                width: 8rem;
+                height: 100%;
+
+                .ordinary {
+                    width: px2rem(170);
+                    height: px2rem(151);
+                    float: left;
+                    margin-right: px2rem(30);
+
+                    .title {
+                        color: #666666;
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(28);
+                        margin-bottom: px2rem(23);
+                        white-space: nowrap;
+                    }
+
+                    p {
+                        width: 100%;
+                        text-align: center;
+                        color: #848D9C;
+                        font-size: px2rem(24);
+                        font-weight: 500;
+                        line-height: px2rem(90);
+                        white-space: nowrap;
+                    }
+
+                    .true {
+                        color: #4EA686;
+                    }
+
+                    .false {
+                        color: #DC865D;
+                    }
+                }
+            }
+        }
+
+        .fistBox .fistAct {
+            .title {
+                opacity: 0;
+            }
+        }
+
+        .ordinaryBox_inAct .ordinary {
+            .title {
+                opacity: 0;
+                margin-bottom: px2rem(-20);
            }
        }
    }
 }

-.list {
-    width: px2rem(710);
-    height: px2rem(960);
-    background: #fff;
-    border-radius: px2rem(30);
-    margin: px2rem(19) auto px2rem(10);
-    overflow-y: scroll;
-    position: relative;
-    padding-top: 1.45rem;
-    box-sizing: border-box;
+.english {
+    .box .box_in .ordinaryBox .ordinaryBox_in {
+        width: 11.6rem;

-    &::-webkit-scrollbar {
-        display: none;
+        .ordinary {
+            width: 3.2rem;
+
+            .title {
+                font-size: px2rem(23);
+            }
+        }
+    }
+}
+
+.arabic {
+    .box .box_in .fistBox .fist {
+        margin-right: 0;
+        margin-left: 0.4rem;
    }

-    .top {
-        height: 1.5rem;
-        width: px2rem(710);
-        box-sizing: border-box;
-        padding: px2rem(40) px2rem(20) 0;
-        display: flex;
-        justify-content: space-between;
-        line-height: 0.4rem;
-        position: absolute;
-        left: 50%;
-        transform: translateX(-50%);
-        // top: 5.3rem;
-        top: 0rem;
-        background: #fff;
-        border-radius: px2rem(30) px2rem(30) 0 0;
+    .box .box_in .ordinaryBox {
+        .ordinaryBox_in {
+            width: 10rem;

-        div {
-            width: 25%;
-            text-align: center;
-            color: #5D95FF;
-            font-size: px2rem(22);
-            font-weight: 600;
+            .ordinary {
+                width: 2.8rem;
+
+                .title {
+                    // font-size: px2rem(28);
+                }
+            }
        }
    }

-    .other {
-        width: px2rem(657);
-        height: px2rem(151);
-        margin: 0 auto 0;
-        border-bottom: px2rem(2) solid #D7DCE6;
-        display: flex;
-        justify-content: space-between;
-        // background: pink;
+    .header h3 {
+        margin-right: 0.3rem;
+    }

-        &:last-child {
-            border: none;
-        }
+    .box h3 span {
+        margin-right: 0.3rem;
+        margin-left: 0;
+    }

-        div {
-            width: 25%;
-            text-align: center;
-            height: 100%;
-            line-height: px2rem(151);
-            color: #848D9C;
-            font-size: px2rem(24);
-            font-weight: 500;
-            white-space: nowrap;
+    .box h3 b {
+        margin-right: 0.3rem;
+    }

-            img {
-                display: block;
-                margin: px2rem(34) auto px2rem(5);
-                width: px2rem(32);
-                height: px2rem(32);
-                border-radius: 50%;
-            }
-
-            p {
-                width: 98%;
-                height: px2rem(25);
-                line-height: 0.32rem;
-                overflow: hidden;
-                white-space: nowrap;
-                text-overflow: ellipsis;
-                text-align: center;
-                color: #848D9C;
-                font-size: px2rem(24);
-                margin-bottom: px2rem(9);
-            }
-
-            .id {
-                width: 100%;
-                text-align: center;
-                color: #A4ABB2;
-                font-size: px2rem(18);
-            }
-        }
-
-        .div11 {
-            line-height: 0rem;
-        }
+    .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+        float: right;
    }
 }
--- a/view/molistar/modules/guildAr/css/memberFlow2.css
+++ b/view/molistar/modules/guildAr/css/memberFlow2.css
@@ -38,6 +38,7 @@ body {
  color: #333333;
  font-size: 0.45333rem;
  font-weight: bold;
+  width: 100%;
 }

 .back .text {
@@ -50,220 +51,492 @@ body {
  font-size: 0.4rem;
 }

-.timeBox {
+.header {
  width: 9.46667rem;
-  height: 2.54667rem;
+  height: 6.34667rem;
  background: #fff;
  border-radius: 0.4rem;
-  margin: 2.53333rem auto 0.25333rem;
-  position: relative;
-}
-
-.timeBox .line {
-  width: 0.02667rem;
-  height: 1.90667rem;
-  background: #D7DCE6;
-  position: absolute;
-  left: 2.92rem;
-  top: 50%;
-  transform: translateY(-50%);
-  border-radius: 0.02667rem;
-}
-
-.timeBox .year {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 0.33333rem;
-  color: #A4ABB2;
-  font-size: 0.32rem;
-  font-weight: bold;
-  text-align: center;
-  text-indent: -0.8rem;
-}
-
-.timeBox .startTime {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 0.96rem;
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-}
-
-.timeBox .startTime b {
-  margin-right: 0.1rem;
-  text-indent: 0.45rem;
-  display: inline-block;
-}
-
-.timeBox .startTime img {
-  width: 0.32rem;
-  height: 0.21333rem;
-  display: inline-block;
-  margin-top: 0.1rem;
-}
-
-.timeBox .endTime {
-  width: 2.92rem;
-  position: absolute;
-  left: 0;
-  top: 1.62667rem;
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-}
-
-.timeBox .endTime b {
-  margin-right: 0.1rem;
-  text-indent: 0.45rem;
-  display: inline-block;
-}
-
-.timeBox .endTime img {
-  width: 0.32rem;
-  height: 0.21333rem;
-  display: inline-block;
-  margin-top: 0.1rem;
-}
-
-.timeBox .right {
-  width: 5.5rem;
-  height: 2.54667rem;
-  position: absolute;
-  right: 0.55rem;
-  top: 0;
-  display: flex;
-  justify-content: space-between;
-}
-
-.timeBox .right div {
-  width: 50%;
-  text-align: center;
+  margin: 2.8rem auto 0.34667rem;
  overflow: hidden;
  position: relative;
 }

-.timeBox .right div p {
-  color: #A4ABB2;
-  font-size: 0.32rem;
-  font-weight: bold;
-  margin-top: 0.53333rem;
-  margin-bottom: 0.33333rem;
-  line-height: 0.34rem;
-}
-
-.timeBox .right div b {
-  color: #848D9C;
-  font-size: 0.37333rem;
-  font-weight: bold;
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  bottom: 0.6rem;
-}
-
-.timeBox .right .goToExchangeGold {
-  position: absolute;
-  top: 2.06667rem;
-  right: 0rem;
-  color: #D25555;
-  font-size: 0.26667rem;
-}
-
-.list {
-  width: 9.46667rem;
-  height: 12.8rem;
-  background: #fff;
-  border-radius: 0.4rem;
-  margin: 0.25333rem auto 0.13333rem;
-  overflow-y: scroll;
-  position: relative;
-  padding-top: 1.45rem;
-  box-sizing: border-box;
-}
-
-.list::-webkit-scrollbar {
-  display: none;
-}
-
-.list .top {
-  height: 1.5rem;
-  width: 9.46667rem;
-  box-sizing: border-box;
-  padding: 0.53333rem 0.26667rem 0;
+.header .time {
+  width: 100%;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
  display: flex;
  justify-content: space-between;
-  line-height: 0.4rem;
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  top: 0;
-  background: #fff;
-  border-radius: 0.4rem 0.4rem 0 0;
-}
-
-.list .top div {
-  width: 25%;
+  box-sizing: border-box;
+  margin: 0.38667rem auto 0.76rem;
  text-align: center;
-  color: #5D95FF;
-  font-size: 0.29333rem;
-  font-weight: 600;
-}
-
-.list .other {
-  width: 8.76rem;
-  height: 2.01333rem;
-  margin: 0 auto 0;
-  border-bottom: 0.02667rem solid #D7DCE6;
-  display: flex;
-  justify-content: space-between;
-}
-
-.list .other:last-child {
-  border: none;
-}
-
-.list .other div {
-  width: 25%;
-  text-align: center;
-  height: 100%;
-  line-height: 2.01333rem;
+  padding: 0 0.26667rem;
  color: #848D9C;
-  font-size: 0.32rem;
+  font-size: 0.4rem;
  font-weight: 500;
+}
+
+.header .time div {
+  color: #5D636E;
+  width: 4rem;
+}
+
+.header .time div b {
+  display: inline-block;
+  vertical-align: middle;
  white-space: nowrap;
 }

-.list .other div img {
-  display: block;
-  margin: 0.45333rem auto 0.06667rem;
-  width: 0.42667rem;
-  height: 0.42667rem;
-  border-radius: 50%;
+.header .time div img {
+  width: 0.32rem;
+  height: 0.21333rem;
+  display: inline-block;
+  vertical-align: middle;
+  margin-left: 0.13333rem;
 }

-.list .other div p {
-  width: 98%;
-  height: 0.33333rem;
-  line-height: 0.32rem;
+.header .time span {
+  display: block;
+  width: 3rem;
+}
+
+.header h3 {
+  width: 100%;
+  box-sizing: border-box;
+  padding-left: 0.53333rem;
+  color: #141515;
+  font-size: 0.45333rem;
+  margin-bottom: 0.72rem;
+}
+
+.header p {
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  width: 100%;
+  text-align: center;
+  color: #232424;
+  font-size: 0.69333rem;
+  font-weight: 500;
+}
+
+.header p img {
+  display: inline-block;
+  width: 0.28rem;
+  height: 0.61333rem;
+  margin-top: -0.05rem;
+}
+
+.header .user {
+  width: 1.70667rem;
+  height: 1.14667rem;
+  position: absolute;
+  left: 0.88rem;
+  top: 1.4rem;
+  text-align: center;
+}
+
+.header .user img {
+  display: block;
+  width: 1.14667rem;
+  height: 1.14667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
+  color: #333333;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+  color: #A4ABB2;
+  font-size: 0.29333rem;
+}
+
+.header .line {
+  width: 8.76rem;
+  height: 0.01333rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 3.88rem;
+}
+
+.header .line1 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 2.94667rem;
+  top: 4.65333rem;
+}
+
+.header .line2 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 6.37333rem;
+  top: 4.65333rem;
+}
+
+.header .datas {
+  width: 8.76rem;
+  height: 1.24rem;
+  margin: 1.24rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+
+.header .datas div {
+  width: 2.54667rem;
+  text-align: center;
+}
+
+.header .datas div p {
+  color: #232424;
+  font-size: 0.48rem;
+  font-weight: 500;
+  margin-bottom: 0.30667rem;
+  width: 100%;
+}
+
+.header .datas div p img {
+  display: inline-block;
+  width: 0.4rem;
+  height: 0.4rem;
+  vertical-align: middle;
+}
+
+.header .datas div p .dor {
+  width: 0.25333rem;
+  height: 0.56rem;
+  margin-top: -0.05rem;
+}
+
+.header .datas div p b {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.header .datas div span {
+  color: #666666;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  white-space: nowrap;
+}
+
+.datasAct .line1 {
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.datasAct .line2 {
+  display: none;
+}
+
+.datasAct .datas {
+  width: 7rem;
+}
+
+.datasAct .datas .datas3 {
+  display: none;
+}
+
+.box {
+  width: 9.46667rem;
+  min-height: 10.66667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+  color: #141515;
+  font-size: 0.45333rem;
+  font-weight: 600;
+  margin: 0;
+  margin-left: 0.26667rem;
+  margin-bottom: 0.24rem;
+}
+
+.box h3 span {
+  display: inline-block;
+  width: 0.06667rem;
+  height: 0.37333rem;
+  margin-left: -0.17333rem;
+  background: #62D0A8;
+  margin-right: 0.13333rem;
+}
+
+.box .h3 {
+  width: 100%;
+  padding-left: 0.3rem;
+  margin-bottom: 0.50667rem;
+  color: #666666;
+  font-size: 0.37333rem;
+  box-sizing: border-box;
+}
+
+.box .h3 b {
+  text-decoration: underline;
+  font-weight: bold;
+  color: #dc143c;
+}
+
+.box .box_in {
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
+
+.box .box_in .fistBox {
+  width: 2.4rem;
+  float: left;
+}
+
+.box .box_in .fistBox .fist {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+  white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist .user {
+  position: relative;
+}
+
+.box .box_in .fistBox .fist .ts {
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0rem;
+  z-index: 2;
+  display: none;
+}
+
+.box .box_in .fistBox .fist .ts i {
+  width: 100%;
+  border-radius: 0.16rem;
+  height: 0.16rem;
+  line-height: 0.16rem;
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  text-align: center;
+  background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+  color: #333333;
+  font-size: 0.16rem;
+  font-weight: 400;
+  font-style: normal;
+}
+
+.box .box_in .fistBox .fist .i {
+  display: block;
+}
+
+.box .box_in .fistBox .fist img {
+  display: block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+  width: 100%;
+  text-align: center;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+  margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+  color: #A4ABB2;
+  font-size: 0.24rem;
+  font-weight: 500;
+  text-align: center;
+  display: block;
+  width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+  height: 100%;
+  overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 16.5rem;
+  height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  float: left;
+  margin-right: 0.4rem;
+  white-space: nowrap;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+  width: 100%;
  text-align: center;
  color: #848D9C;
  font-size: 0.32rem;
-  margin-bottom: 0.12rem;
+  font-weight: 500;
+  line-height: 1.2rem;
 }

-.list .other div .id {
-  width: 100%;
-  text-align: center;
-  color: #A4ABB2;
-  font-size: 0.24rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+  color: #4EA686;
 }

-.list .other .div11 {
-  line-height: 0rem;
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+  color: #DC865D;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
+  color: #269ceb;
+}
+
+.box .box_in .fistBox .fistAct .title {
+  opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+  opacity: 0;
+  margin-bottom: -0.26667rem;
+}
+
+.english .header .time span {
+  font-size: 0.34667rem;
+}
+
+.english .header .datas div span {
+  font-size: 0.32rem;
+}
+
+.english .box h3 {
+  font-size: 0.4rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 20.5rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 2.6rem;
+  margin-right: 0.8rem;
+}
+
+.english .header .time span {
+  width: 2rem;
+  white-space: nowrap;
+  font-size: 0.32rem;
+}
+
+.english .header .time b {
+  white-space: nowrap;
+  font-size: 0.37333rem;
+}
+
+.english .header .time img {
+  margin-right: 0.1rem;
+}
+
+.english .header .time div {
+  width: 5rem;
+}
+
+.arabic .header h3 {
+  margin-right: 0.3rem;
+}
+
+.arabic .box h3 span {
+  margin-right: 0.3rem;
+  margin-left: 0;
+}
+
+.arabic .box h3 b {
+  margin-right: 0.3rem;
+}
+
+.arabic .box h3 strong {
+  margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  float: right;
+}
+
+.arabic .box .box_in .ordinaryBox {
+  margin-right: 0.4rem;
+}
+
+.arabic .header .time span {
+  width: 2rem;
+  white-space: nowrap;
+  font-size: 0.32rem;
+}
+
+.arabic .header .time b {
+  white-space: nowrap;
+  font-size: 0.34667rem;
+}
+
+.arabic .header .time img {
+  margin-right: 0.1rem;
+}
+
+.arabic .header .time div {
+  width: 5rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 3.2rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 22rem;
+}
+
+.arabic .header .datas div span {
+  font-size: 0.21333rem;
+}
+
+.arabic .box .h3 {
+  padding-right: 0.65rem;
 }
--- a/view/molistar/modules/guildAr/css/memberFlow2.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow2.scss
@@ -19,7 +19,7 @@ body {
    color: #FFFFFF;
    font-size: px2rem(38);
    font-weight: bold;
-    z-index: 10;    
+    z-index: 10;
    background: #fff;

    .backs {
@@ -31,8 +31,6 @@ body {
        z-index: 2;
    }

-
-
    .title {
        position: absolute;
        left: 50%;
@@ -43,6 +41,7 @@ body {
        color: #333333;
        font-size: px2rem(34);
        font-weight: bold;
+        width: 100%;
    }

    .text {
@@ -56,223 +55,513 @@ body {
    }
 }

-.timeBox {
+.header {
    width: px2rem(710);
-    height: px2rem(191);
+    height: px2rem(476);
    background: #fff;
    border-radius: px2rem(30);
-    margin: px2rem(190) auto px2rem(19);
+    margin: px2rem(210) auto px2rem(26);
+    overflow: hidden;
    position: relative;

-    .line {
-        width: px2rem(2);
-        height: px2rem(143);
-        background: #D7DCE6;
-        position: absolute;
-        left: px2rem(219);
-        top: 50%;
-        transform: translateY(-50%);
-        border-radius: px2rem(2);
-    }
-
-    .year {
-        width: px2rem(219);
-        position: absolute;
-        left: 0;
-        top: px2rem(25);
-        color: #A4ABB2;
-        font-size: px2rem(24);
-        font-weight: bold;
+    .time {
+        width: 100%;
+        height: px2rem(40);
+        line-height: px2rem(40);
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        margin: px2rem(29) auto px2rem(57);
        text-align: center;
-        text-indent: -0.8rem;
+        padding: 0 px2rem(20);
+        color: #848D9C;
+        font-size: px2rem(30);
+        font-weight: 500;
+
+        div {
+            color: #5D636E;
+            width: 4rem;
+
+            b {
+                display: inline-block;
+                vertical-align: middle;
+                white-space: nowrap;
+            }
+
+            img {
+                width: px2rem(24);
+                height: px2rem(16);
+                display: inline-block;
+                vertical-align: middle;
+                margin-left: px2rem(10);
+            }
+        }
+
+        span {
+            display: block;
+            width: 3rem;
+        }
    }

-    .startTime {
-        width: px2rem(219);
-        position: absolute;
-        left: 0;
-        top: px2rem(72);
-        color: #848D9C;
-        font-size: px2rem(28);
-        font-weight: bold;
+    h3 {
+        width: 100%;
+        box-sizing: border-box;
+        padding-left: px2rem(40);
+        color: #141515;
+        font-size: px2rem(34);
+        // font-weight: 600;
+        margin-bottom: px2rem(54);
        // text-align: center;
+    }

-        b {
-            margin-right: 0.1rem;
-            text-indent: 0.45rem;
-            display: inline-block;
-        }
+    p {
+        height: px2rem(40);
+        line-height: px2rem(40);
+        width: 100%;
+        text-align: center;
+        color: #232424;
+        font-size: px2rem(52);
+        font-weight: 500;

        img {
-            width: px2rem(24);
-            height: px2rem(16);
            display: inline-block;
-            margin-top: 0.1rem;
+            width: px2rem(21);
+            height: px2rem(46);
+            margin-top: -0.05rem;
        }
    }

-    .endTime {
-        width: px2rem(219);
+    .user {
+        width: px2rem(128);
+        height: px2rem(86);
        position: absolute;
-        left: 0;
-        top: px2rem(122);
-        color: #848D9C;
-        font-size: px2rem(28);
-        font-weight: bold;
-        // text-align: center;
-
-        b {
-            margin-right: 0.1rem;
-            text-indent: 0.45rem;
-            display: inline-block;
-        }
+        left: px2rem(66);
+        top: px2rem(105);
+        text-align: center;

        img {
-            width: px2rem(24);
-            height: px2rem(16);
-            display: inline-block;
-            margin-top: 0.1rem;
+            display: block;
+            width: px2rem(86);
+            height: px2rem(86);
+            border-radius: 50%;
+            margin: 0 auto px2rem(4);
+        }
+
+        p {
+            width: 100%;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            color: #333333;
+            font-size: px2rem(26);
+            font-weight: 400;
+            margin-bottom: px2rem(2);
+        }
+
+        b {
+            color: #A4ABB2;
+            font-size: px2rem(22);
        }
    }

-    .right {
-        width: 5.5rem;
-        height: px2rem(191);
+    .line {
+        width: px2rem(657);
+        height: px2rem(1);
+        background: #B0BACD;
        position: absolute;
-        right: 0.55rem;
-        top: 0;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(291);
+    }
+
+    .line1 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(221);
+        top: px2rem(349);
+    }
+
+    .line2 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(478);
+        top: px2rem(349);
+    }
+
+    .datas {
+        width: px2rem(657);
+        height: px2rem(93);
+        margin: px2rem(93) auto 0;
        display: flex;
        justify-content: space-between;

        div {
-            width: 50%;
+            width: px2rem(191);
            text-align: center;
-            overflow: hidden;
-            position: relative;

            p {
-                color: #A4ABB2;
-                font-size: px2rem(24);
-                font-weight: bold;
-                margin-top: px2rem(40);
-                margin-bottom: px2rem(25);
-                line-height: 0.34rem;
+                color: #232424;
+                font-size: px2rem(36);
+                font-weight: 500;
+                margin-bottom: px2rem(23);
+                width: 100%;
+
+                img {
+                    display: inline-block;
+                    width: px2rem(30);
+                    height: px2rem(30);
+                    vertical-align: middle;
+                }
+
+                .dor {
+                    width: px2rem(19);
+                    height: px2rem(42);
+                    margin-top: -0.05rem;
+                }
+
+                b {
+                    display: inline-block;
+                    vertical-align: middle;
+                }
            }

-            b {
-                color: #848D9C;
+            span {
+                color: #666666;
                font-size: px2rem(28);
-                font-weight: bold;
-                position: absolute;
-                left: 50%;
-                transform: translateX(-50%);
-                bottom: px2rem(45);
+                font-weight: 400;
+                white-space: nowrap;
            }
        }
-
-        .goToExchangeGold {
-            position: absolute;
-            top: px2rem(155);
-            right: px2rem(0);
-            color: #D25555;
-            font-size: px2rem(20);
-        }
    }
 }

-.list {
-    width: px2rem(710);
-    height: px2rem(960);
-    background: #fff;
-    border-radius: px2rem(30);
-    margin: px2rem(19) auto px2rem(10);
-    overflow-y: scroll;
-    position: relative;
-    padding-top: 1.45rem;
-    box-sizing: border-box;
+.datasAct {
+    .line1 {
+        left: 50%;
+        transform: translateX(-50%);
+    }

-    &::-webkit-scrollbar {
+    .line2 {
        display: none;
    }

-    .top {
-        height: 1.5rem;
-        width: px2rem(710);
-        box-sizing: border-box;
-        padding: px2rem(40) px2rem(20) 0;
-        display: flex;
-        justify-content: space-between;
-        line-height: 0.4rem;
-        position: absolute;
-        left: 50%;
-        transform: translateX(-50%);
-        // top: 5.3rem;
-        top: 0;
-        background: #fff;
-        border-radius: px2rem(30) px2rem(30) 0 0;

-        div {
-            width: 25%;
-            text-align: center;
-            color: #5D95FF;
-            font-size: px2rem(22);
-            font-weight: 600;
+    .datas {
+        width: 7rem;
+
+        .datas3 {
+            display: none;
+        }
+    }
+}
+
+.box {
+    width: px2rem(710);
+    min-height: px2rem(800);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: 0 auto px2rem(30);
+    box-sizing: border-box;
+    padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+    h3 {
+        color: #141515;
+        font-size: px2rem(34);
+        font-weight: 600;
+        margin: 0;
+        margin-left: px2rem(20);
+        margin-bottom: px2rem(18);
+
+        span {
+            display: inline-block;
+            width: px2rem(5);
+            height: px2rem(28);
+            margin-left: px2rem(-13);
+            background: #62D0A8;
+            margin-right: px2rem(10);
        }
    }

-    .other {
-        width: px2rem(657);
-        height: px2rem(151);
-        margin: 0 auto 0;
-        border-bottom: px2rem(2) solid #D7DCE6;
+    .h3 {
+        width: 100%;
+        padding-left: 0.3rem;
+        margin-bottom: px2rem(38);
+        color: #666666;
+        font-size: 0.37333rem;
+        box-sizing: border-box;
+
+        b {
+            text-decoration: underline;
+            font-weight: bold;
+            color: #dc143c;
+        }
+    }
+
+    .box_in {
+        width: 100%;
+        height: 100%;
        display: flex;
-        justify-content: space-between;

-        &:last-child {
-            border: none;
+        .fistBox {
+            width: px2rem(180);
+            float: left;
+
+            .fist {
+                width: px2rem(170);
+                height: px2rem(151);
+                margin-right: px2rem(30);
+
+                .title {
+                    color: #666666;
+                    width: 100%;
+                    text-align: center;
+                    font-size: px2rem(28);
+                    margin-bottom: px2rem(23);
+                    white-space: nowrap;
+                }
+
+                .user {
+                    position: relative;
+                }
+
+                .ts {
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    position: absolute;
+                    left: 50%;
+                    transform: translateX(-50%);
+                    top: px2rem(0);
+                    z-index: 2;
+                    display: none;
+
+                    i {
+                        width: 100%;
+                        border-radius: px2rem(12);
+                        height: px2rem(12);
+                        line-height: px2rem(12);
+                        position: absolute;
+                        bottom: 0;
+                        left: 50%;
+                        transform: translateX(-50%);
+                        text-align: center;
+                        background: linear-gradient(90deg, #FFEB67, #FFFCE7);
+                        color: #333333;
+                        font-size: px2rem(12);
+                        font-weight: 400;
+                        font-style: normal;
+                    }
+                }
+
+                .i {
+                    display: block;
+                }
+
+                img {
+                    display: block;
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    margin: 0 auto px2rem(5);
+                }
+
+                p {
+                    width: 100%;
+                    text-align: center;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    color: #848D9C;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    margin-bottom: px2rem(5);
+                }
+
+                b {
+                    color: #A4ABB2;
+                    font-size: px2rem(18);
+                    font-weight: 500;
+                    text-align: center;
+                    display: block;
+                    width: 100%;
+                }
+            }
        }

-        div {
-            width: 25%;
-            text-align: center;
+        .ordinaryBox {
            height: 100%;
-            line-height: px2rem(151);
-            color: #848D9C;
-            font-size: px2rem(24);
-            font-weight: 500;
-            white-space: nowrap;
+            overflow-x: scroll;

-            img {
-                display: block;
-                margin: px2rem(34) auto px2rem(5);
-                width: px2rem(32);
-                height: px2rem(32);
-                border-radius: 50%;
+            &::-webkit-scrollbar {
+                // display: none;
            }

-            p {
-                width: 98%;
-                height: px2rem(25);
-                line-height: 0.32rem;
-                overflow: hidden;
-                white-space: nowrap;
-                text-overflow: ellipsis;
-                text-align: center;
-                color: #848D9C;
-                font-size: px2rem(24);
-                margin-bottom: px2rem(9);
-            }
+            .ordinaryBox_in {
+                width: 16.5rem;
+                height: 100%;

-            .id {
-                width: 100%;
-                text-align: center;
-                color: #A4ABB2;
-                font-size: px2rem(18);
+                .ordinary {
+                    width: px2rem(170);
+                    height: px2rem(151);
+                    float: left;
+                    margin-right: px2rem(30);
+                    white-space: nowrap;
+
+                    .title {
+                        color: #666666;
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(28);
+                        margin-bottom: px2rem(23);
+                    }
+
+                    p {
+                        width: 100%;
+                        text-align: center;
+                        color: #848D9C;
+                        font-size: px2rem(24);
+                        font-weight: 500;
+                        line-height: px2rem(90);
+                    }
+
+                    .true {
+                        color: #4EA686;
+                    }
+
+                    .false {
+                        color: #DC865D;
+                    }
+
+                    .details {
+                        color: rgb(38, 156, 235);
+                    }
+                }
            }
        }

-        .div11 {
-            line-height: 0rem;
+        .fistBox .fistAct {
+            .title {
+                opacity: 0;
+            }
        }
+
+        .ordinaryBox_inAct .ordinary {
+            .title {
+                opacity: 0;
+                margin-bottom: px2rem(-20);
+            }
+        }
+    }
+}
+
+.english {
+    .header .time span {
+        font-size: px2rem(26);
+    }
+
+    .header .datas div span {
+        font-size: px2rem(24);
+    }
+
+    .box h3 {
+        font-size: px2rem(30);
+    }
+
+    .box .box_in .fistBox .fist {
+        // width: 4rem;
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in {
+        width: 20.5rem;
+
+        .ordinary {
+            width: 2.6rem;
+            margin-right: 0.8rem;
+        }
+    }
+
+    .header .time span {
+        width: 2rem;
+        white-space: nowrap;
+        font-size: px2rem(24);
+    }
+
+    .header .time b {
+        white-space: nowrap;
+        font-size: px2rem(28);
+    }
+
+    .header .time img {
+        margin-right: 0.1rem;
+    }
+
+    .header .time div {
+        width: 5rem;
+    }
+}
+
+.arabic {
+    .header h3 {
+        margin-right: 0.3rem;
+    }
+
+    .box h3 span {
+        margin-right: 0.3rem;
+        margin-left: 0;
+    }
+
+    .box h3 b {
+        margin-right: 0.3rem;
+    }
+
+    .box h3 strong {
+        margin-right: 0.3rem;
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+        float: right;
+    }
+
+    .box .box_in .ordinaryBox {
+        margin-right: 0.4rem;
+    }
+
+    .header .time span {
+        width: 2rem;
+        white-space: nowrap;
+        font-size: px2rem(24);
+    }
+
+    .header .time b {
+        white-space: nowrap;
+        font-size: px2rem(26);
+    }
+
+    .header .time img {
+        margin-right: 0.1rem;
+    }
+
+    .header .time div {
+        width: 5rem;
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+        width: 3.2rem;
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in {
+        width: 22rem;
+    }
+
+    .header .datas div span {
+        font-size: px2rem(16);
+    }
+
+    .box .h3 {
+        padding-right: 0.65rem;
    }
 }
--- a/view/molistar/modules/guildAr/css/memberFlow22.css
+++ b/view/molistar/modules/guildAr/css/memberFlow22.css
@@ -0,0 +1,488 @@
+html,
+body {
+  width: 100%;
+  height: 17.78667rem;
+  background: #F5F7F9;
+}
+
+.back {
+  width: 100%;
+  height: 2.4rem;
+  position: fixed;
+  left: 0;
+  top: 0rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.50667rem;
+  font-weight: bold;
+  z-index: 10;
+  background: #fff;
+}
+
+.back .backs {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 58%;
+  z-index: 2;
+}
+
+.back .title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  height: 100%;
+  top: 0;
+  line-height: 3.46667rem;
+  color: #333333;
+  font-size: 0.45333rem;
+  font-weight: bold;
+  white-space: nowrap;
+}
+
+.back .text {
+  position: absolute;
+  right: 0.62667rem;
+  height: 100%;
+  top: 0;
+  line-height: 3.46667rem;
+  color: #333333;
+  font-size: 0.4rem;
+}
+
+.header {
+  width: 9.46667rem;
+  height: 6.34667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 2.8rem auto 0.34667rem;
+  overflow: hidden;
+  position: relative;
+}
+
+.header .time {
+  width: 100%;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  margin: 0.38667rem auto 0.76rem;
+  text-align: center;
+  padding: 0 0.26667rem;
+  color: #848D9C;
+  font-size: 0.4rem;
+  font-weight: 500;
+}
+
+.header .time div {
+  color: #5D636E;
+  width: 4rem;
+}
+
+.header .time div b {
+  display: inline-block;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+
+.header .time div img {
+  width: 0.32rem;
+  height: 0.21333rem;
+  display: inline-block;
+  vertical-align: middle;
+  margin-left: 0.13333rem;
+}
+
+.header .time span {
+  display: block;
+  width: 3rem;
+}
+
+.header h3 {
+  width: 78%;
+  box-sizing: border-box;
+  padding-left: 0.65333rem;
+  color: #232424;
+  font-size: 0.37333rem;
+  font-weight: bold;
+  margin-bottom: 0.72rem;
+  text-align: center;
+  float: right;
+}
+
+.header p {
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  width: 70%;
+  text-align: center;
+  color: #232424;
+  font-size: 0.69333rem;
+  font-weight: 500;
+  float: right;
+}
+
+.header p img {
+  display: inline-block;
+  width: 0.28rem;
+  height: 0.61333rem;
+  margin-top: -0.05rem;
+}
+
+.header .user {
+  width: 1.70667rem;
+  height: 1.14667rem;
+  position: absolute;
+  left: 0.88rem;
+  top: 1.4rem;
+  text-align: center;
+}
+
+.header .user img {
+  display: block;
+  width: 1.14667rem;
+  height: 1.14667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #333333;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+  color: #A4ABB2;
+  font-size: 0.29333rem;
+}
+
+.header .line {
+  width: 8.76rem;
+  height: 0.01333rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 3.88rem;
+}
+
+.header .line1 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 2.94667rem;
+  top: 4.65333rem;
+}
+
+.header .line2 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 6.37333rem;
+  top: 4.65333rem;
+}
+
+.header .datas {
+  width: 8.76rem;
+  height: 1.24rem;
+  margin: 3.5rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+
+.header .datas div {
+  width: 2.54667rem;
+  text-align: center;
+}
+
+.header .datas div p {
+  color: #232424;
+  font-size: 0.48rem;
+  font-weight: 500;
+  margin-bottom: 0.30667rem;
+  width: 100%;
+}
+
+.header .datas div p img {
+  display: inline-block;
+  width: 0.4rem;
+  height: 0.4rem;
+  vertical-align: middle;
+}
+
+.header .datas div p .dor {
+  width: 0.25333rem;
+  height: 0.56rem;
+  margin-top: -0.05rem;
+}
+
+.header .datas div p b {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.header .datas div span {
+  color: #666666;
+  font-size: 0.37333rem;
+  font-weight: 400;
+  white-space: nowrap;
+}
+
+.datasAct .line1 {
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+.datasAct .line2 {
+  display: none;
+}
+
+.datasAct .datas {
+  width: 7rem;
+}
+
+.datasAct .datas .datas3 {
+  display: none;
+}
+
+.box {
+  width: 9.46667rem;
+  min-height: 10.66667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+  color: #141515;
+  font-size: 0.45333rem;
+  font-weight: 600;
+  margin: 0;
+  margin-left: 0.26667rem;
+  margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+  display: inline-block;
+  width: 0.06667rem;
+  height: 0.37333rem;
+  margin-left: -0.17333rem;
+  background: #62D0A8;
+  margin-right: 0.13333rem;
+}
+
+.box .box_in {
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
+
+.box .box_in .fistBox {
+  width: 2.4rem;
+  float: left;
+}
+
+.box .box_in .fistBox .fist {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+  white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist img {
+  display: block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+  width: 100%;
+  text-align: center;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+  margin-bottom: 0.06667rem;
+}
+
+.box .box_in .fistBox .fist b {
+  color: #A4ABB2;
+  font-size: 0.24rem;
+  font-weight: 500;
+  text-align: center;
+  display: block;
+  width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+  height: 100%;
+  overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 14.5rem;
+  height: 100%;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  min-width: 2.4rem;
+  height: 2.01333rem;
+  float: left;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+  width: 100%;
+  text-align: center;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+  line-height: 1.2rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+  color: #4EA686;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+  color: #DC865D;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .details {
+  color: #269ceb;
+}
+
+.box .box_in .fistBox .fistAct .title {
+  opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+  opacity: 0;
+  margin-bottom: -0.26667rem;
+}
+
+.english .back .title {
+  font-size: 0.42667rem;
+}
+
+.english .header .datas div span {
+  font-size: 0.29333rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 15rem;
+}
+
+.english .box .box_in .ordinaryBox .ordinaryBox_in .title {
+  font-size: 0.34667rem;
+}
+
+.english .header .time span {
+  width: 2rem;
+  white-space: nowrap;
+  font-size: 0.32rem;
+}
+
+.english .header .time b {
+  white-space: nowrap;
+  font-size: 0.37333rem;
+}
+
+.english .header .time img {
+  margin-right: 0.1rem;
+}
+
+.english .header .time div {
+  width: 5rem;
+}
+
+.arabic .back .title {
+  font-size: 0.42667rem;
+}
+
+.arabic .header .datas div span {
+  font-size: 0.21333rem;
+}
+
+.arabic .box h3 {
+  margin-right: 0.26667rem;
+}
+
+.arabic .box span {
+  margin-left: 0;
+  margin-right: 0;
+}
+
+.arabic .box h3 b {
+  margin-right: 0.3rem;
+}
+
+.arabic .box h3 strong {
+  margin-right: 0.3rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 20rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .title {
+  font-size: 0.33333rem;
+}
+
+.arabic .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  float: right;
+}
+
+.arabic .box .box_in .ordinaryBox {
+  margin-right: 0.4rem;
+}
+
+.arabic .header .time span {
+  width: 2rem;
+  white-space: nowrap;
+  font-size: 0.32rem;
+}
+
+.arabic .header .time b {
+  white-space: nowrap;
+  font-size: 0.34667rem;
+}
+
+.arabic .header .time img {
+  margin-right: 0.1rem;
+}
+
+.arabic .header .time div {
+  width: 5rem;
+}
--- a/view/molistar/modules/guildAr/css/memberFlow22.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow22.scss
@@ -0,0 +1,508 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: px2rem(1334);
+    background: #F5F7F9;
+}
+
+.back {
+    width: 100%;
+    height: px2rem(180);
+    position: fixed;
+    left: 0;
+    top: px2rem(0);
+    text-align: center;
+    color: #FFFFFF;
+    font-size: px2rem(38);
+    font-weight: bold;
+    z-index: 10;
+    background: #fff;
+
+    .backs {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: 58%;
+        z-index: 2;
+    }
+
+    .title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        height: 100%;
+        top: 0;
+        line-height: px2rem(260);
+        color: #333333;
+        font-size: px2rem(34);
+        font-weight: bold;
+        white-space: nowrap;
+    }
+
+    .text {
+        position: absolute;
+        right: px2rem(47);
+        height: 100%;
+        top: 0;
+        line-height: px2rem(260);
+        color: #333333;
+        font-size: px2rem(30);
+    }
+}
+
+.header {
+    width: px2rem(710);
+    height: px2rem(476);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: px2rem(210) auto px2rem(26);
+    overflow: hidden;
+    position: relative;
+
+    .time {
+        width: 100%;
+        height: px2rem(40);
+        line-height: px2rem(40);
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        margin: px2rem(29) auto px2rem(57);
+        text-align: center;
+        padding: 0 px2rem(20);
+        color: #848D9C;
+        font-size: px2rem(30);
+        font-weight: 500;
+
+        div {
+            color: #5D636E;
+            width: 4rem;
+
+            b {
+                display: inline-block;
+                vertical-align: middle;
+                white-space: nowrap;
+            }
+
+            img {
+                width: px2rem(24);
+                height: px2rem(16);
+                display: inline-block;
+                vertical-align: middle;
+                margin-left: px2rem(10);
+            }
+        }
+
+        span {
+            display: block;
+            width: 3rem;
+        }
+    }
+
+    h3 {
+        width: 78%;
+        box-sizing: border-box;
+        padding-left: px2rem(49);
+        color: #232424;
+        font-size: px2rem(28);
+        font-weight: bold;
+        margin-bottom: px2rem(54);
+        text-align: center;
+        float: right;
+    }
+
+    p {
+        height: px2rem(40);
+        line-height: px2rem(40);
+        width: 70%;
+        text-align: center;
+        color: #232424;
+        font-size: px2rem(52);
+        font-weight: 500;
+        float: right;
+
+        img {
+            display: inline-block;
+            width: px2rem(21);
+            height: px2rem(46);
+            margin-top: -0.05rem;
+        }
+    }
+
+    .user {
+        width: px2rem(128);
+        height: px2rem(86);
+        position: absolute;
+        left: px2rem(66);
+        top: px2rem(105);
+        text-align: center;
+
+        img {
+            display: block;
+            width: px2rem(86);
+            height: px2rem(86);
+            border-radius: 50%;
+            margin: 0 auto px2rem(4);
+        }
+
+        p {
+            width: 100%;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            color: #333333;
+            font-size: px2rem(26);
+            font-weight: 400;
+            margin-bottom: px2rem(2);
+        }
+
+        b {
+            color: #A4ABB2;
+            font-size: px2rem(22);
+        }
+    }
+
+    .line {
+        width: px2rem(657);
+        height: px2rem(1);
+        background: #B0BACD;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(291);
+    }
+
+    .line1 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(221);
+        top: px2rem(349);
+    }
+
+    .line2 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(478);
+        top: px2rem(349);
+    }
+
+    .datas {
+        width: px2rem(657);
+        height: px2rem(93);
+        margin: 3.5rem auto 0;
+        display: flex;
+        justify-content: space-between;
+
+        div {
+            width: px2rem(191);
+            text-align: center;
+
+            p {
+                color: #232424;
+                font-size: px2rem(36);
+                font-weight: 500;
+                margin-bottom: px2rem(23);
+                width: 100%;
+
+                img {
+                    display: inline-block;
+                    width: px2rem(30);
+                    height: px2rem(30);
+                    vertical-align: middle;
+                }
+
+                .dor {
+                    width: px2rem(19);
+                    height: px2rem(42);
+                    margin-top: -0.05rem;
+                }
+
+                b {
+                    display: inline-block;
+                    vertical-align: middle;
+                }
+            }
+
+            span {
+                color: #666666;
+                font-size: px2rem(28);
+                font-weight: 400;
+                white-space: nowrap;
+            }
+        }
+    }
+}
+
+.datasAct {
+    .line1 {
+        left: 50%;
+        transform: translateX(-50%);
+    }
+
+    .line2 {
+        display: none;
+    }
+
+
+    .datas {
+        width: 7rem;
+
+        .datas3 {
+            display: none;
+        }
+    }
+}
+
+.box {
+    width: px2rem(710);
+    min-height: px2rem(800);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: 0 auto px2rem(30);
+    box-sizing: border-box;
+    padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+    h3 {
+        color: #141515;
+        font-size: px2rem(34);
+        font-weight: 600;
+        margin: 0;
+        margin-left: px2rem(20);
+        margin-bottom: px2rem(38);
+
+        span {
+            display: inline-block;
+            width: px2rem(5);
+            height: px2rem(28);
+            margin-left: px2rem(-13);
+            background: #62D0A8;
+            margin-right: px2rem(10);
+        }
+    }
+
+    .box_in {
+        width: 100%;
+        height: 100%;
+        display: flex;
+
+        .fistBox {
+            width: px2rem(180);
+            float: left;
+
+            .fist {
+                width: px2rem(170);
+                height: px2rem(151);
+                margin-right: px2rem(30);
+
+                .title {
+                    color: #666666;
+                    width: 100%;
+                    text-align: center;
+                    font-size: px2rem(28);
+                    margin-bottom: px2rem(23);
+                    white-space: nowrap;
+                }
+
+                img {
+                    display: block;
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    margin: 0 auto px2rem(5);
+                }
+
+                p {
+                    width: 100%;
+                    text-align: center;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    color: #848D9C;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                    margin-bottom: px2rem(5);
+                }
+
+                b {
+                    color: #A4ABB2;
+                    font-size: px2rem(18);
+                    font-weight: 500;
+                    text-align: center;
+                    display: block;
+                    width: 100%;
+                }
+            }
+        }
+
+        .ordinaryBox {
+            height: 100%;
+            overflow-x: scroll;
+
+            &::-webkit-scrollbar {
+                // display: none;
+            }
+
+            .ordinaryBox_in {
+                width: 14.5rem;
+                height: 100%;
+
+                .ordinary {
+                    min-width: px2rem(180);
+                    height: px2rem(151);
+                    float: left;
+                    margin-right: px2rem(30);
+
+                    .title {
+                        color: #666666;
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(28);
+                        margin-bottom: px2rem(23);
+                    }
+
+                    p {
+                        width: 100%;
+                        text-align: center;
+                        color: #848D9C;
+                        font-size: px2rem(24);
+                        font-weight: 500;
+                        line-height: px2rem(90);
+                    }
+
+                    .true {
+                        color: #4EA686;
+                    }
+
+                    .false {
+                        color: #DC865D;
+                    }
+
+                    .details {
+                        color: rgb(38, 156, 235);
+                    }
+                }
+            }
+        }
+
+        .fistBox .fistAct {
+            .title {
+                opacity: 0;
+            }
+        }
+
+        .ordinaryBox_inAct .ordinary {
+            .title {
+                opacity: 0;
+                margin-bottom: px2rem(-20);
+            }
+        }
+    }
+}
+
+.english {
+    .back .title {
+        font-size: px2rem(32);
+    }
+
+    .header .datas div span {
+        font-size: px2rem(22);
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in {
+        width: 15rem;
+
+        .title {
+            font-size: px2rem(26);
+        }
+    }
+
+    .header .time span {
+        width: 2rem;
+        white-space: nowrap;
+        font-size: px2rem(24);
+    }
+
+    .header .time b {
+        white-space: nowrap;
+        font-size: px2rem(28);
+    }
+
+    .header .time img {
+        margin-right: 0.1rem;
+    }
+
+    .header .time div {
+        width: 5rem;
+    }
+}
+
+.arabic {
+    .back .title {
+        font-size: px2rem(32);
+    }
+
+    .header .datas div span {
+        font-size: px2rem(16);
+    }
+
+    .box h3 {
+        margin-right: px2rem(20);
+    }
+
+    .box span {
+        // margin-right: px2rem();
+        margin-left: 0;
+        margin-right: 0;
+    }
+
+    .box h3 b {
+        margin-right: 0.3rem;
+    }
+
+    .box h3 strong {
+        margin-right: 0.3rem;
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in {
+        width: 20rem;
+
+        .title {
+            font-size: px2rem(25);
+        }
+    }
+
+    .box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+        float: right;
+    }
+
+    .box .box_in .ordinaryBox {
+        margin-right: 0.4rem;
+    }
+
+    .header .time span {
+        width: 2rem;
+        white-space: nowrap;
+        font-size: px2rem(24);
+    }
+
+    .header .time b {
+        white-space: nowrap;
+        font-size: px2rem(26);
+    }
+
+    .header .time img {
+        margin-right: 0.1rem;
+    }
+
+    .header .time div {
+        width: 5rem;
+    }
+}
--- a/view/molistar/modules/guildAr/css/memberFlow3.css
+++ b/view/molistar/modules/guildAr/css/memberFlow3.css
@@ -0,0 +1,344 @@
+html,
+body {
+  width: 100%;
+  height: 17.78667rem;
+  background: #F5F7F9;
+}
+
+.back {
+  width: 100%;
+  height: 2.4rem;
+  position: fixed;
+  left: 0;
+  top: 0rem;
+  text-align: center;
+  color: #FFFFFF;
+  font-size: 0.50667rem;
+  font-weight: bold;
+  z-index: 10;
+  background: #fff;
+}
+
+.back .backs {
+  width: 0.58667rem;
+  height: 0.58667rem;
+  position: absolute;
+  left: 0.24rem;
+  top: 58%;
+  z-index: 2;
+}
+
+.back .title {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  height: 100%;
+  top: 0;
+  line-height: 3.46667rem;
+  color: #333333;
+  font-size: 0.45333rem;
+  font-weight: bold;
+}
+
+.back .text {
+  position: absolute;
+  right: 0.62667rem;
+  height: 100%;
+  top: 0;
+  line-height: 3.46667rem;
+  color: #333333;
+  font-size: 0.4rem;
+}
+
+.header {
+  width: 9.46667rem;
+  height: 6.34667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 2.8rem auto 0.34667rem;
+  overflow: hidden;
+  position: relative;
+}
+
+.header .time {
+  width: 100%;
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  display: flex;
+  justify-content: space-between;
+  box-sizing: border-box;
+  margin: 0.38667rem auto 0.76rem;
+  text-align: center;
+  padding: 0 0.26667rem;
+  color: #848D9C;
+  font-size: 0.4rem;
+  font-weight: 500;
+}
+
+.header .time div {
+  color: #5D636E;
+  width: 3rem;
+}
+
+.header .time span {
+  display: block;
+  width: 3rem;
+}
+
+.header h3 {
+  width: 100%;
+  box-sizing: border-box;
+  padding-left: 0.65333rem;
+  color: #141515;
+  font-size: 0.42667rem;
+  font-weight: 500;
+  margin-bottom: 0.72rem;
+}
+
+.header p {
+  height: 0.53333rem;
+  line-height: 0.53333rem;
+  width: 100%;
+  text-align: center;
+  color: #232424;
+  font-size: 0.69333rem;
+  font-weight: 500;
+}
+
+.header p img {
+  display: inline-block;
+  width: 0.53333rem;
+  height: 0.53333rem;
+}
+
+.header .user {
+  width: 1.70667rem;
+  height: 1.14667rem;
+  position: absolute;
+  left: 0.88rem;
+  top: 1.4rem;
+  text-align: center;
+}
+
+.header .user img {
+  display: block;
+  width: 1.14667rem;
+  height: 1.14667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.05333rem;
+}
+
+.header .user p {
+  width: 100%;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #333333;
+  font-size: 0.34667rem;
+  font-weight: 400;
+  margin-bottom: 0.02667rem;
+}
+
+.header .user b {
+  color: #A4ABB2;
+  font-size: 0.29333rem;
+}
+
+.header .line {
+  width: 8.76rem;
+  height: 0.01333rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 3.88rem;
+}
+
+.header .line1 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 2.94667rem;
+  top: 4.65333rem;
+}
+
+.header .line2 {
+  width: 0.01333rem;
+  height: 1.02667rem;
+  background: #B0BACD;
+  position: absolute;
+  left: 6.37333rem;
+  top: 4.65333rem;
+}
+
+.header .datas {
+  width: 8.76rem;
+  height: 1.24rem;
+  margin: 1.24rem auto 0;
+  display: flex;
+  justify-content: space-between;
+}
+
+.header .datas div {
+  width: 2.54667rem;
+  text-align: center;
+}
+
+.header .datas div p {
+  color: #232424;
+  font-size: 0.48rem;
+  font-weight: 500;
+  margin-bottom: 0.30667rem;
+  width: 100%;
+}
+
+.header .datas div p img {
+  display: inline-block;
+  width: 0.4rem;
+  height: 0.4rem;
+  vertical-align: middle;
+}
+
+.header .datas div p b {
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.header .datas div span {
+  color: #666666;
+  font-size: 0.37333rem;
+  font-weight: 400;
+}
+
+.box {
+  width: 9.46667rem;
+  min-height: 10.66667rem;
+  background: #fff;
+  border-radius: 0.4rem;
+  margin: 0 auto 0.4rem;
+  box-sizing: border-box;
+  padding: 0.49333rem 0rem 0 0.30667rem;
+}
+
+.box h3 {
+  color: #141515;
+  font-size: 0.45333rem;
+  font-weight: 600;
+  margin: 0;
+  margin-left: 0.26667rem;
+  margin-bottom: 0.50667rem;
+}
+
+.box h3 span {
+  display: inline-block;
+  width: 0.06667rem;
+  height: 0.37333rem;
+  margin-left: -0.17333rem;
+  background: #62D0A8;
+  margin-right: 0.13333rem;
+}
+
+.box .box_in {
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
+
+.box .box_in .fistBox {
+  width: 2.4rem;
+  float: left;
+}
+
+.box .box_in .fistBox .fist {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .fistBox .fist .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+  white-space: nowrap;
+}
+
+.box .box_in .fistBox .fist img {
+  display: block;
+  width: 0.42667rem;
+  height: 0.42667rem;
+  border-radius: 50%;
+  margin: 0 auto 0.06667rem;
+}
+
+.box .box_in .fistBox .fist p {
+  width: 100%;
+  text-align: center;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+}
+
+.box .box_in .fistBox .fist b {
+  color: #A4ABB2;
+  font-size: 0.24rem;
+  font-weight: 500;
+  text-align: center;
+  display: block;
+  width: 100%;
+}
+
+.box .box_in .ordinaryBox {
+  height: 100%;
+  overflow-x: scroll;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in {
+  width: 15rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary {
+  width: 2.26667rem;
+  height: 2.01333rem;
+  float: left;
+  margin-right: 0.4rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .title {
+  color: #666666;
+  width: 100%;
+  text-align: center;
+  font-size: 0.37333rem;
+  margin-bottom: 0.30667rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary p {
+  width: 100%;
+  text-align: center;
+  color: #848D9C;
+  font-size: 0.32rem;
+  font-weight: 500;
+  line-height: 1.2rem;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .true {
+  color: #4EA686;
+}
+
+.box .box_in .ordinaryBox .ordinaryBox_in .ordinary .false {
+  color: #DC865D;
+}
+
+.box .box_in .fistBox .fistAct .title {
+  opacity: 0;
+}
+
+.box .box_in .ordinaryBox_inAct .ordinary .title {
+  opacity: 0;
+  margin-bottom: -0.26667rem;
+}
--- a/view/molistar/modules/guildAr/css/memberFlow3.scss
+++ b/view/molistar/modules/guildAr/css/memberFlow3.scss
@@ -0,0 +1,355 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    height: px2rem(1334);
+    background: #F5F7F9;
+}
+
+.back {
+    width: 100%;
+    height: px2rem(180);
+    position: fixed;
+    left: 0;
+    top: px2rem(0);
+    text-align: center;
+    color: #FFFFFF;
+    font-size: px2rem(38);
+    font-weight: bold;
+    z-index: 10;
+    background: #fff;
+
+    .backs {
+        width: px2rem(44);
+        height: px2rem(44);
+        position: absolute;
+        left: px2rem(18);
+        top: 58%;
+        z-index: 2;
+    }
+
+    .title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        height: 100%;
+        top: 0;
+        line-height: px2rem(260);
+        color: #333333;
+        font-size: px2rem(34);
+        font-weight: bold;
+    }
+
+    .text {
+        position: absolute;
+        right: px2rem(47);
+        height: 100%;
+        top: 0;
+        line-height: px2rem(260);
+        color: #333333;
+        font-size: px2rem(30);
+    }
+}
+
+.header {
+    width: px2rem(710);
+    height: px2rem(476);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: px2rem(210) auto px2rem(26);
+    overflow: hidden;
+    position: relative;
+
+    .time {
+        width: 100%;
+        height: px2rem(40);
+        line-height: px2rem(40);
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        margin: px2rem(29) auto px2rem(57);
+        text-align: center;
+        padding: 0 px2rem(20);
+        color: #848D9C;
+        font-size: px2rem(30);
+        font-weight: 500;
+
+        div {
+            color: #5D636E;
+            width: 3rem;
+        }
+
+        span {
+            display: block;
+            width: 3rem;
+        }
+    }
+
+    h3 {
+        width: 100%;
+        box-sizing: border-box;
+        padding-left: px2rem(49);
+        color: #141515;
+        font-size: px2rem(32);
+        font-weight: 500;
+        margin-bottom: px2rem(54);
+    }
+
+    p {
+        height: px2rem(40);
+        line-height: px2rem(40);
+        width: 100%;
+        text-align: center;
+        color: #232424;
+        font-size: px2rem(52);
+        font-weight: 500;
+
+        img {
+            display: inline-block;
+            width: px2rem(40);
+            height: px2rem(40);
+        }
+    }
+
+    .user {
+        width: px2rem(128);
+        height: px2rem(86);
+        position: absolute;
+        left: px2rem(66);
+        top: px2rem(105);
+        text-align: center;
+
+        img {
+            display: block;
+            width: px2rem(86);
+            height: px2rem(86);
+            border-radius: 50%;
+            margin: 0 auto px2rem(4);
+        }
+
+        p {
+            width: 100%;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            color: #333333;
+            font-size: px2rem(26);
+            font-weight: 400;
+            margin-bottom: px2rem(2);
+        }
+
+        b {
+            color: #A4ABB2;
+            font-size: px2rem(22);
+        }
+    }
+
+    .line {
+        width: px2rem(657);
+        height: px2rem(1);
+        background: #B0BACD;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(291);
+    }
+
+    .line1 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(221);
+        top: px2rem(349);
+    }
+
+    .line2 {
+        width: px2rem(1);
+        height: px2rem(77);
+        background: #B0BACD;
+        position: absolute;
+        left: px2rem(478);
+        top: px2rem(349);
+    }
+
+    .datas {
+        width: px2rem(657);
+        height: px2rem(93);
+        margin: px2rem(93) auto 0;
+        display: flex;
+        justify-content: space-between;
+
+        div {
+            width: px2rem(191);
+            text-align: center;
+
+            p {
+                color: #232424;
+                font-size: px2rem(36);
+                font-weight: 500;
+                margin-bottom: px2rem(23);
+                width: 100%;
+
+                img {
+                    display: inline-block;
+                    width: px2rem(30);
+                    height: px2rem(30);
+                    vertical-align: middle;
+                }
+                b{
+                    display: inline-block;
+                    vertical-align: middle;
+                }
+            }
+
+            span {
+                color: #666666;
+                font-size: px2rem(28);
+                font-weight: 400;
+            }
+        }
+    }
+}
+
+.box {
+    width: px2rem(710);
+    min-height: px2rem(800);
+    background: #fff;
+    border-radius: px2rem(30);
+    margin: 0 auto px2rem(30);
+    box-sizing: border-box;
+    padding: px2rem(37) px2rem(0) 0 px2rem(23);
+
+    h3 {
+        color: #141515;
+        font-size: px2rem(34);
+        font-weight: 600;
+        margin: 0;
+        margin-left: px2rem(20);
+        margin-bottom: px2rem(38);
+
+        span {
+            display: inline-block;
+            width: px2rem(5);
+            height: px2rem(28);
+            margin-left: px2rem(-13);
+            background: #62D0A8;
+            margin-right: px2rem(10);
+        }
+    }
+
+    .box_in {
+        width: 100%;
+        height: 100%;
+        display: flex;
+
+        .fistBox {
+            width: px2rem(180);
+            float: left;
+
+            .fist {
+                width: px2rem(170);
+                height: px2rem(151);
+                margin-right: px2rem(30);
+
+                .title {
+                    color: #666666;
+                    width: 100%;
+                    text-align: center;
+                    font-size: px2rem(28);
+                    margin-bottom: px2rem(23);
+                    white-space: nowrap;
+                }
+
+                img {
+                    display: block;
+                    width: px2rem(32);
+                    height: px2rem(32);
+                    border-radius: 50%;
+                    margin: 0 auto px2rem(5);
+                }
+
+                p {
+                    width: 100%;
+                    text-align: center;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    color: #848D9C;
+                    font-size: px2rem(24);
+                    font-weight: 500;
+                }
+
+                b {
+                    color: #A4ABB2;
+                    font-size: px2rem(18);
+                    font-weight: 500;
+                    text-align: center;
+                    display: block;
+                    width: 100%;
+                }
+            }
+        }
+
+        .ordinaryBox {
+            height: 100%;
+            overflow-x: scroll;
+
+            &::-webkit-scrollbar {
+                // display: none;
+            }
+
+            .ordinaryBox_in {
+                width: 15rem;
+
+                .ordinary {
+                    width: px2rem(170);
+                    height: px2rem(151);
+                    float: left;
+                    margin-right: px2rem(30);
+
+                    .title {
+                        color: #666666;
+                        width: 100%;
+                        text-align: center;
+                        font-size: px2rem(28);
+                        margin-bottom: px2rem(23);
+                    }
+
+                    p {
+                        width: 100%;
+                        text-align: center;
+                        color: #848D9C;
+                        font-size: px2rem(24);
+                        font-weight: 500;
+                        line-height: px2rem(90);
+                    }
+
+                    .true {
+                        color: #4EA686;
+                    }
+
+                    .false {
+                        color: #DC865D;
+                    }
+                }
+            }
+        }
+
+        .fistBox .fistAct {
+            .title {
+                opacity: 0;
+            }
+        }
+
+        .ordinaryBox_inAct .ordinary {
+            .title {
+                opacity: 0;
+                margin-bottom: px2rem(-20);
+            }
+        }
+    }
+}
--- a/view/molistar/modules/guildAr/guildInfoSet.html
+++ b/view/molistar/modules/guildAr/guildInfoSet.html
@@ -17,19 +17,35 @@
        <b class="text2"></b>
    </div>
    <!-- 公会昵称 -->
-    <div class="nick"><span class="text3"></span><input class="text4" type="text" placeholder=""></div>
-    <!-- 公会背景 -->
-    <div class="bg">
-        <span class="text5"></span>
-        <img src="./images/upDate.png" alt="">
+    <h3 class="text3"></h3>
+    <div class="name">
+        <input disabled="true" type="text" placeholder="">
+        <span class="textConte2">修改</span>
+    </div>
+    <!-- 公会背景图 -->
+    <h3 class="text5">公会背景图</h3>
+    <div class="background">
+        <img src="./images/logo.png" alt="" class="">
+        <span class="textConte2">修改</span>
        <input type="file" id="backImageUpload" accept="image/*" onchange="fileChangeF(event)" class="upload"
            style="opacity: 0;">
    </div>
-    <div class="boxBut">
-        <!-- 取消按钮 -->
-        <div class="close text6"></div>
-        <!-- 保存按钮 -->
-        <div class="ok text7"></div>
+    <!-- 收款帐户 -->
+    <h3 class="textConte4 text5">收款帐户</h3>
+    <div class="account payoneer">
+        <i>payoneer:</i>
+        <input type="text" placeholder="">
+        <span class="textConte1 act">添加</span>
+    </div>
+    <div class="account usdt">
+        <i>USDT-trc20:</i>
+        <input type="text" placeholder="">
+        <span class="textConte1 act">添加</span>
+    </div>
+    <div class="account paypal">
+        <i>paypal:</i>
+        <input type="text" placeholder="">
+        <span class="textConte1 act">添加</span>
    </div>
 </body>

@@ -44,5 +60,5 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
-<script src="./js/guildInfoSet.js?v=1.0"></script>
+<script src="./js/guildInfoSet.js?v=1.3"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guildAr/images/dor.png
+++ b/view/molistar/modules/guildAr/images/dor.png
--- a/view/molistar/modules/guildAr/images/dos.png
+++ b/view/molistar/modules/guildAr/images/dos.png
--- a/view/molistar/modules/guildAr/images/gold2.png
+++ b/view/molistar/modules/guildAr/images/gold2.png
--- a/view/molistar/modules/guildAr/images/goldIcon.png
+++ b/view/molistar/modules/guildAr/images/goldIcon.png
--- a/view/molistar/modules/guildAr/images/header.png
+++ b/view/molistar/modules/guildAr/images/header.png
--- a/view/molistar/modules/guildAr/images/icon1.png
+++ b/view/molistar/modules/guildAr/images/icon1.png
--- a/view/molistar/modules/guildAr/images/icon2.png
+++ b/view/molistar/modules/guildAr/images/icon2.png
--- a/view/molistar/modules/guildAr/images/icon3.png
+++ b/view/molistar/modules/guildAr/images/icon3.png
--- a/view/molistar/modules/guildAr/images/icon4.png
+++ b/view/molistar/modules/guildAr/images/icon4.png
--- a/view/molistar/modules/guildAr/images/inveMemberIcon.png
+++ b/view/molistar/modules/guildAr/images/inveMemberIcon.png
--- a/view/molistar/modules/guildAr/index.html
+++ b/view/molistar/modules/guildAr/index.html
@@ -23,19 +23,43 @@
        <!-- 工会长昵称 -->
        <div class="nick"></div>
        <div class="id"></div>
-        <!-- 管理员设置 -->
-        <div class="adminSet text3"></div>
-        <!-- 公会信息设置 -->
-        <div class="guildInfoSet text4"></div>
-        <!-- 查看成员流水 -->
-        <div class="memberFlow text5"></div>
-        <!-- 邀请成员 -->
-        <div class="inveMember text6"></div>
-        <!-- 查看成员流水 -->
-        <div class="memberFlowMy text7"></div>
        <!-- 工会昵称 -->
        <!-- 公会:公会昵称 -->
-        <div class="guildNick"></div>
+        <!-- <div class="guildNick"></div> -->
+
+        <!-- 管理员设置 -->
+        <!-- <div class="adminSet text3"></div> -->
+        <!-- 公会信息设置 -->
+        <!-- <div class="guildInfoSet text4"></div> -->
+        <!-- 查看成员流水 -->
+        <!-- <div class="memberFlow text5"></div> -->
+        <!-- 查看成员流水 -->
+        <!-- <div class="memberFlowMy text7"></div> -->
+        <!-- 邀请成员 -->
+        <!-- <div class="inveMember text6"></div> -->
+
+        <div class="headerBox">
+            <div class="memberFlow">
+                <img src="./images/icon1.png" alt="">
+                <span class="texts1"></span>
+            </div>
+            <div class="memberFlow2">
+                <img src="./images/icon2.png" alt="">
+                <span class="texts2"></span>
+            </div>
+            <div class="guildInfoSet">
+                <img src="./images/icon3.png" alt="">
+                <span class="texts3"></span>
+            </div>
+            <div class="adminSet">
+                <img src="./images/icon4.png" alt="">
+                <span class="texts4"></span>
+            </div>
+            <div class="myWages">
+                <img src="./images/icon2.png" alt="">
+                <span class="texts5"></span>
+            </div>
+        </div>
    </div>
    <!-- 公会成员列表 -->
    <div class="guildList">
@@ -71,6 +95,11 @@
            </div>
        </div>
    </div>
+    <!-- 邀请成员 -->
+    <div class="inveMember">
+        <img src="./images/inveMemberIcon.png" alt="">
+        <span class="text6">邀请成员</span>
+    </div>
 </body>

 </html>
@@ -83,5 +112,5 @@
 <script src="./local/en.js"></script>
 <script src="./local/zh.js"></script>
 <script src="./local/ar.js"></script>
-<script src="./js/index.js?v=1.1"></script>
+<script src="./js/index.js?v=1.3"></script>
 <script src="../../common/local/langHandler.js"></script>
--- a/view/molistar/modules/guildAr/js/adminSet.js
+++ b/view/molistar/modules/guildAr/js/adminSet.js
@@ -62,6 +62,8 @@ function translateFun() {
    $('.text5').text(langReplace(localLang.adminSet.text5));
    $('.text6').text(langReplace(localLang.adminSet.text6));
    $('.text16').attr('placeholder', langReplace(localLang.demoModule.text16));
+    $('.texts1').text(langReplace(localLang.adminSet2.text6));
+    $('.texts2').text(langReplace(localLang.adminSet2.text7));
 }
 // 搜索接口
 function searchUser(erbanNo) {
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
dragon	e2ded0a1a8	新增exp活动	2024-08-12 19:38:36 +08:00
dragon	7e49789a75	清理缓存	2024-08-07 14:54:38 +08:00
dragon	e4c8469c41	清理缓存	2024-08-07 14:53:30 +08:00
dragon	e2cfb33723	清除缓存	2024-08-07 14:18:37 +08:00
dragon	292cc23bc4	修复英语区能看到自己工资问题	2024-08-07 14:02:54 +08:00
dragon	29474eb377	关闭点单页面loading	2024-08-06 10:36:14 +08:00
dragon	aaa0607f3a	工会设置修复翻译异常，以及镜像问题	2024-08-05 18:12:38 +08:00
dragon	0cb1e4d2bc	镜像未加入公会榜单	2024-08-02 17:24:29 +08:00
dragon	86fb0de56f	修改阿语翻译-公会	2024-08-02 15:03:29 +08:00
dragon	261f25446c	修改金币总和字段-公会	2024-08-01 20:18:03 +08:00
dragon	5725eaa780	新增代理工资项	2024-08-01 19:05:54 +08:00
dragon	59834dc1e8	修复设置管理员信息异常问题	2024-08-01 16:15:27 +08:00
dragon	db9c260edc	优化h5公会	2024-08-01 14:56:41 +08:00
dragon	b1a29e48f7	首页榜单-清缓存	2024-07-31 18:59:55 +08:00
dragon	410d83865b	修改榜单-第一名展示数值	2024-07-31 18:25:59 +08:00
dragon	c6f3a7bfa0	新增第二第三数值公会榜单	2024-07-27 00:18:01 +08:00
dragon	ab7774e7aa	新增公会榜单数值	2024-07-26 23:45:05 +08:00